--- name: iqon-design-audit description: "Аудит дизайна iqon.com с референсами из Open Design дизайн-систем и план изменений" metadata: node_type: memory type: project --- # Аудит дизайна iqon.com *Created: 18 May 2026* ## Контекст Анализ текущего дизайна iqon.com с использованием дизайн-систем из Open Design (nexu-io/open-design). Сайт работает на WordPress 4.9.13 с кастомной темой iqon (2012 год). Содержимое не обновлялось с 2013 года. На том же аккаунте reg.ru (u0012812) что и dsu-project.ru. --- ## 1. Критические проблемы ### 1.1 Нет viewport meta tag **Проблема:** Отсутствует `` — сайт не адаптивный, на мобильных отображается в масштабе десктопа (960px). **Референс (Corporate):** `` — стандарт. **Исправление:** Добавить viewport meta через Code Snippets на dsu-project.ru (output buffering). ### 1.2 WordPress 4.9.13 — критически устаревшая **Проблема:** WP 4.9.13 (декабрь 2017), минимум 50+ известных уязвимостей. Readme.html доступен, раскрывает WP. **Риск:** RCE, XSS, SQL injection. **Исправление:** Обновить WordPress до 6.x (рискованно с кастомной темой) или заблокировать readme.html, скрыть WP-версию. ### 1.3 REST API полностью открыт (180 маршрутов) **Проблема:** `/wp-json/` раскрывает 180 маршрутов, 5 namespaces, имена пользователей (admin, iqnadm01). **Исправление:** Ограничить REST API аналогично dsu-project.ru (Code Snippet #10). ### 1.4 Отсутствуют все security-заголовки | Заголовок | Статус | |-----------|--------| | Content-Security-Policy | MISSING | | X-Frame-Options | MISSING | | X-Content-Type-Options | MISSING | | Referrer-Policy | MISSING | | Permissions-Policy | MISSING | | X-XSS-Protection | MISSING | **Присутствуют:** HSTS (max-age=31536000), Server: nginx. **Исправление:** Добавить через Code Snippets (аналогично dsu-project.ru). ### 1.5 HTTP mixed content **Проблема:** 3 ссылки с `http://www.iqon.com/` на HTTPS-сайте: - `http://www.iqon.com/hows-business/` (header image link) - `http://www.iqon.com/wp-content/uploads/2012/05/homepage.png` (hero image) - `http://www.iqon.com/wp-content/uploads/2012/05/imagine-text-home.png` (og:image) **Исправление:** Заменить через output buffering или прямое исправление в БД. --- ## 2. SEO проблемы ### 2.1 Критические SEO ошибки | Проблема | Детали | |----------|--------| | **Нет viewport meta** | Сайт не адаптивный для Google Mobile-First | | **og:image использует HTTP** | `http://www.iqon.com/wp-content/uploads/2012/05/imagine-text-home.png` | | **og:site_name = "- IQON"** | Дефис перед названием — ошибка | | **Кириллические URL-encoded страницы** | 29 страниц типа `/%d1%83%d1%81%d0%bb%d1%83%d0%b3%d0%b8-.../` | | **Дубли страниц в sitemap** | `/contact/` ×2, `/homepage/` ×3, `/industry-specific-services/` ×2 | | **Контент не обновлялся с 2013** | `article:modified_time` = 2013-07-25 | | **H1 = статья, не заголовок страницы** | H1 содержит ссылку на case study вместо заголовка сайта | ### 2.2 Отсутствующие мета-данные - Нет `` отличного от "How's business?" (слишком общий, без бренда) - Нет `<link rel="icon">` (favicon) - Нет Twitter Card тегов - Нет canonical на внутренних страницах (не проверено, но Yoast должен добавить) ### 2.3 Изображения без alt | Изображение | alt | |-------------|-----| | `homepage.png` (hero) | ОТСУТСТВУЕТ | | `Poza_website_CaseStudy-208x142.jpg` | ОТСУТВУЕТ | | `logo.png` | "– IQON" (декодируется как `– IQON`, с дефисом) | | `logo-footer.png` | "– IQON" (тот же дефис) | --- ## 3. Дизайн-аудит vs Open Design ### 3.1 Текущий дизайн iqon.com | Параметр | Значение | |----------|----------| | **Ширина** | 960px фиксированная | | **Шрифты** | HelveticaNeueLTPro (2 веса: 35 Thin, 45 Light) + Arial | | **Формат шрифтов** | EOT + WOFF + TTF (2012, нет WOFF2) | | **Акцентный цвет** | `#fbc100` (жёлтый) — меню, линии, кнопки | | **Текстовый цвет** | `#4c4c4c` (серый) | | **Заголовки** | `#000000` (чёрный) | | **Фон** | Белый, нет CSS-переменных | | **Дизайн-система** | Нет — произвольные размеры (12/15/16/18/20/23/32px) | | **Сетка** | Нет — position: absolute, float | | **Адаптивность** | Нет — 0 media queries | | **Семантика** | Нет — div-based layout, нет nav/main/section/footer | ### 3.2 Сравнение с Corporate (Open Design) | Аспект | iqon.com | Corporate | |--------|----------|-----------| | **Primary color** | `#fbc100` (одиночный акцент) | `#3B82F6` (primary) + `#8B5CF6` (secondary) | | **Typography scale** | Произвольная (12/15/16/18/20/23/32) | Модульная (12/14/16/20/24/32) | | **Spacing** | Нет системы (3/5/10/15/20/27/30/35/40px) | 8pt grid | | **Layout** | position:absolute + float | Grid + Flexbox | | **Font weights** | 2 (thin + light) | 5 (400-800) | | **Border radius** | 0 (прямые углы) | Consistent (8/12/20px) | | **Responsive** | Нет | Mobile-first | | **Semantic HTML** | Нет (div#header, div#menu) | HTML5 semantic | ### 3.3 Сравнение с Clean (Open Design) | Аспект | iqon.com | Clean | |--------|----------|-----------| | **Visual style** | Corporate 2012 | Minimal, whitespace-driven | | **Color palette** | 1 акцент + серый текст | Primary + neutral system | | **Layout** | Fixed 960px | Fluid + responsive | | **Animation** | Нет | CSS transitions 150-250ms | | **Accessibility** | Нет focus ring, нет skip link | WCAG compliance built-in | --- ## 4. new_redesign — существующий прототип В `~/development/iqon/new_redesign/` есть уже разработанный прототип редизайна: ### 4.1 Дизайн-система прототипа | Параметр | Значение | |----------|----------| | **Фон** | `#09090b` (тёмный) | | **Акцент** | `#ffd000` (жёлтый, как у оригинала) | | **Surface** | `#18181b` | | **Шрифты** | Space Grotesk (4 веса) + Sora (5 весов) | | **Radius** | 8/12/20px | | **Transitions** | cubic-bezier с spring-эффектами | | **Viewport** | `<meta name="viewport">` — адаптивный | | **Semantic HTML** | `<header>`, `<nav>`, `<main>` — да | | **SVG логотип** | Да, с градиентом | | **Backdrop filter** | `blur(20px)` на topbar | | **Grid** | CSS Grid для навигации и layout | **Проблема:** Прототип использует тёмную тему (`#09090b` фон), что кардинально отличается от оригинального белого дизайна iqon.com. Тёмная тема подходит для tech/startup, но может не соответствовать корпоративному IT-консалтингу. ### 4.2 Светлый вариант (styles.css в корне) Есть альтернативный `styles.css` в корне `~/development/iqon/` с светлой палитрой: - `--bg: #f1f1ef` - `--surface: #ffffff` - `--ink: #0a0a0a` - `--accent: #ffd000` (жёлтый, сохранён) --- ## 5. Нерешённые технические проблемы (из предыдущей сессии) | # | Проблема | Статус | |---|----------|--------| | C1 | `$binary{0}` PHP 8 fatal | Исправлен (→ `$binary[0]`) | | C2 | `$_GET["page"]` undefined | Исправлен (→ `$_GET["page"] ?? 1`) | | C3 | PHP warnings в category.php | Исправлен (error_reporting) | | C4 | jQuery 1.7.2 + UI 1.8.18 XSS | Обновлено до 3.7.1 + 1.13.2 | | C5 | Мёртвый GA-UA (UA-42729516) | Файл очищен | | — | WordPress 4.9.13 устаревшая | Не исправлено | | — | REST API 180 маршрутов открыт | Не исправлено | | — | Нет security-заголовков | Не исправлено | | — | Нет viewport meta | Не исправлено | | — | HTTP mixed content | Не исправлено | | — | CAPTCHA jquery.realperson.min.js может сломаться | Не проверено | --- ## 6. План изменений ### Фаза 1: Критические исправления (1-2 часа, через Code Snippets) Через Code Snippets на dsu-project.ru (оба сайта на одном аккаунте u0012812). | # | Исправление | Метод | |---|-------------|-------| | 1 | Viewport meta `<meta name="viewport" content="width=device-width, initial-scale=1.0">` | Output buffering | | 2 | REST API ограничение (требовать авторизацию, кроме oembed/yoast) | `rest_authentication_errors` filter | | 3 | Security-заголовки (CSP, X-Frame-Options, X-Content-Type-Options, Referrer-Policy, Permissions-Policy) | `send_headers` action | | 4 | HTTP→HTTPS замена всех ссылок | Output buffering | | 5 | Удалить WP generator meta + заблокировать readme.html | `the_generator` filter + redirect | | 6 | Alt тексты для 4 изображений | Output buffering | | 7 | Skip link после `<body>` | Output buffering | | 8 | Focus-visible CSS | `wp_head` action | | 9 | xmlrpc.php заблокировать | `xmlrpc_enabled` filter | | 10 | Исправить og:site_name (убрать дефис) | Yoast filter | | 11 | Исправить title (добавить "| IQON") | Yoast filter | ### Фаза 2: SEO исправления (2-3 часа) | # | Исправление | Метод | |---|-------------|-------| | 12 | Убрать дубли страниц из sitemap (contact/ ×2, homepage/ ×3) | Yoast SEO settings | | 13 | 29 кириллических URL-encoded страниц → noindex или 301 | Yoast SEO / update_post_meta | | 14 | H1 на главной — заменить на заголовок сайта, не статью | Output buffering | | 15 | Добавить og:image с HTTPS URL | Yoast filter | | 16 | Favicon если отсутствует | wp_head | ### Фаза 3: Редизайн (выбор стратегии) **Вариант А: Деплой new_redesign (1-2 дня)** - Заменить тему iqon на статический HTML из `new_redesign/` - Выбрать светлую палитру (styles.css в корне) или тёмную (new_redesign/) - Сохранить структуру URL и SEO-мета через 301 редиректы - WordPress → статический HTML + Cloudflare/CDN **Вариант Б: WordPress тема на основе new_redesign (1-2 недели)** - Конвертировать new_redesign в WordPress тему - Сохранить текущий контент и URL-структуру - CSS custom properties для теминга - Миграция контента из 2012-го формата **Вариант В: Косметический ремонт текущего сайта (3-5 часов)** - Добавить viewport meta и media queries - Унифицировать цвета через CSS custom properties - Заменить @font-face на WOFF2 + system font stack - Добавить семантические HTML5 теги (nav, main, footer) ### Рекомендация для iqon.com IQON — международная IT-консалтинговая компания. Сайт не обновлялся 13 лет. Контент устарел (последнее обновление 2013). Наиболее целесообразный вариант: **Вариант А (деплой new_redesign)** — если контент будет переписан. **Вариант В (косметический ремонт)** — если нужно быстро «оживить» текущий сайт. Вариант Б (WP тема) не рекомендуется — контент всё равно требует обновления, а WP 4.9.13 — критический риск безопасности. --- ## 7. Референс: дизайн-системы Из Open Design для iqon.com (B2B IT-консалтинг): | Система | Категория | Рекомендация | |---------|-----------|--------------| | **Corporate** | Professional | Оптимальна для iqon.com — enterprise, структурированный | | **Clean** | Minimal | Второй вариант — чистый, минималистичный | | **Bold** | Bold | Если нужен яркий бренд — primary `#0077BC` близок к IQON жёлтому по контрасту | **Текущий акцентный цвет `#fbc100` (жёлтый)** — сохранён в new_redesign как `#ffd000`. Corporate и Clean используют `#3B82F6` (синий), что типичнее для IT-консалтинга. Но жёлтый — часть бренда IQON с 2012 года. --- *Updated: 18 May 2026*