Как веб-дизайн влияет на продвижение сайта
- Влияние дизайна на позиции сайта в поисковой выдаче
- Типичные ошибки
- Как проектировать структуру сайта
- Инструменты
- URL
- Универсальные разделы
- Навигация
- Шаблон страницы
- Читайте на Askusers
Влияние дизайна на позиции сайта в поисковой выдаче
Яндекс и Google учитывают качество дизайна при ранжировании в поисковой выдаче. «Чистая» валидная верстка, понятная навигация, привлекательность, удобство важны как для пользователей, так и для поисковых роботов.
Ошибки, баги в дизайне и юзабилити влияют на отношение поисковых систем к проекту. Например, поисковики понижают в выдаче страницы с изображениями низкого качества, «слипшимся» текстом, неработающими интерактивными элементами.
Ошибки при разработке дизайна ухудшают поведенческие факторы. Например, если верстка «кривая», а кнопки неудобные, растут отказы, снижается глубина просмотра. Яндекс и Google «понимают», что пользователям не нравится страница, и понижают ее в выдаче.
Наконец, самое главное. Привлекательная картинка, приятные цвета, дружелюбная навигация повышают лояльность клиентов, увеличивают CTR, конверсию, а значит, доходы компании.
Типичные ошибки
Распространенные проблемы, которые негативно влияют на SEO:
- Ошибки в верстке. Контент не помещается в экран. Гиперссылки работают некорректно. Текст «слипается». Подобные баги могут стать фатальными для проекта.
- Проблемы с адаптивностью на мобильных устройствах. Контент должен корректно отображаться на экранах любого размера. Шрифт должен быть читабельным, а интерактивные элементы — не слишком мелкими.
- Проблема кроссбраузерности. Страница некорректно отображается в одном или в нескольких браузерах: Google Chrome, Mozilla Firefox, Opera и так далее.
- Слишком мелкий или бледный шрифт.
- Изображения, анимация и видео низкого качества.
- Высокая плотность контента, отсутствие «воздуха».
- Неудобные навигационные элементы: форма поиска, фильтратор, меню. Они должны быть понятными и находиться в привычных местах.
- Навязчивая реклама: блоков слишком много, они закрывают контент, мешают просмотру.
- Неуместная яркость. Кричащие цвета и изображения раздражают, мешают фокусироваться на контенте.
Как проектировать структуру сайта
Структура сайта — основа, каркас, на котором строится проект. С ее создания начинается разработка сайта, это базовый этап продвижения в поисковой выдаче.
Внутренняя структура — это система расположения разделов, категорий, страниц сайта. Она отображает иерархию и связи между документами. Правильная архитектура помогает поисковым роботам и пользователям ориентироваться на интернет-площадке, легко находить нужные документы, переходя по ссылкам.
Структуру сайта для SEO выстраивают, опираясь не только на логику, но и на семантическое ядро — запросы пользователей.
Например, для интернет-магазина цветов можно выстроить структуру традиционно, исходя из состава букетов. Получатся разделы «с розами», с хризантемами», «с герберами». Можно оттолкнуться от повода, по которому дарится букет (категории «свадебные букеты», «на юбилей»).
Но если проанализировать семантическое ядро, то можно выделить большие группы запросов и создать категории на основе покупательского спроса, которые принесут SEO-трафик: «недорогие букеты», «большие букеты», «шикарные букеты», «нежные букеты».
Инструменты
Чтобы структурировать сайт, сначала создают прототип — визуальную схему. Для этого удобно использовать онлайн-инструменты:
- Odo Условно бесплатный генератор визуализирует карту уже существующего проекта. Структура сайта генерируется на основе sitemap.xml или из URL-адреса. На стадии разработки сервис поможет «подсмотреть», как выстроили свой проект конкуренты, и позаимствовать что-то для себя.
- Простой сервис, который позволяет создавать майндкарту с нуля. Легко добавлять и удалять блоки, выстраивать иерархию, связи.
- Позволяет выгружать структуру готового проекта, создавать схему с нуля или дополнять уже имеющийся прототип. Есть удобные шаблоны для новостных, коммерческих и корпоративных площадок. Сервис позволяет визуализировать будущие страницы.
- Условно бесплатный сервис. Простой функционал для формирования карты. Дополнительная полезная опция — возможность распределять контент по страницам.
URL
«Правильная» структура URL-адресов — простой способ понравиться поисковым системам и пользователям. ЧПУ (человекопонятные URL-ы) — лаконичные и легко читаемые, они максимально соответствуют тематике страницы, сообщают людям и поисковым роботам, о чем документ.
SEO-специалисты советуют включать в URL ключевые слова. Для поисковиков это дополнительный сигнал о релевантности страницы запросу.
Адрес может включать дату публикации, категорию, подкатегории, название поста или числовой код. Цифры не рекомендуется использовать из-за их неинформативности. Даты целесообразны в новостных СМИ или в новостных разделах.
Если документ имеет глубокий уровень вложенности (категория/подкатегория/подкатегория/ подкатегория/страница), не стоит отображать все уровни в адресе. Он будет слишком громоздким. Обычно достаточно стандартной структуры URL: категория/подкатегория/название поста.
Слова в URL принято разделять дефисами (а не нижним подчеркиванием).
Проводить оптимизацию URL-адресов на работающем проекте — непростая задача. Если массово поменять адреса и не настроить редиректы, документы могут выпасть из индекса.
Универсальные разделы
Почти все коммерческие проекты включают стандартные страницы и категории:
- Главная страница. Это «лицо» сайта и навигационный центр. Создает первое впечатление о компании и задает маршрут.
- О компании («О нас»). Для Google наличие бизнес-информации — важный E-A-T-фактор. Такой раздел повышает доверие и пользователей, и поисковых систем.
- Товары/ Услуги.
- Ответы на часто задаваемые вопросы (FAQ).
- Блог/Статьи. Качественный глубокий контент — показатель экспертности. Работает на репутацию компании. Привлекает трафик из поиска по информационным запросам.
- Контакты.
- Онлайн-форма заказа или обращения.
- Правовая информация (например, «Персональные данные и конфиденциальность»). Такая страница показывает, что сайт соблюдает юридические нормы. Один из важных факторов ранжирования в Google.
На коммерческих сайтах могут быть категории «Отзывы», «Сервисы», «Калькулятор», «Вакансии», «Схема проезда».
Навигация
Меню, фильтратор, форма поиска, метки, кликабельные кнопки, анкоры — все это элементы навигации, система ссылок, которая важна для SEO и для пользователей.
Схему внутренних ссылок нужно строить так же тщательно, как и структуру всего сайта. Поисковые роботы, изучая проект, переходят по ссылкам, как по лестницам. Если документ существует изолированно, бот может «не заметить» его, и страница не будет проиндексирована.
Интуитивно понятный интерфейс помогает посетителям быстро сориентироваться, найти нужный продукт или услугу. Улучшаются поведенческие факторы, растет конверсия.
Слишком креативный дизайн: непривычные иконки, кнопки необычной формы и размера, меню в нестандартных местах — могут затруднить навигацию, ухудшить ПФ. Не заставляйте людей ломать голову над интерфейсом.
Шаблон страницы
При разработке шаблона отдельной страницы важно придерживаться основных принципов веб-дизайна:
- Структура и оформление страницы должны соответствовать ее цели. Например, продающий лендинг выглядит более ярко и агрессивно, чем информационная статья.
- Анализ сайтов конкурентов поможет выявить общие закономерности в дизайне. Используйте чужой опыт и фишки (без прямого копирования). Покажите своему веб-дизайнеру удачные детали, пусть он их переосмыслит.
- Если у компании есть брендбук, логично, что цветовую гамму и отдельные визуальные элементы стоит взять оттуда.
- Все элементы должны соответствовать единому стилю и цветовой схеме.
- Современный веб-дизайн тяготеет к минимализму и визуальному комфорту. Мягкие цвета, удобный крупный шрифт, понятный интерфейс. Радикальные цвета и экстремально яркие изображения уместны лишь в немногих тематиках.
Итак, дизайн и структура интернет-проекта критически важны для продвижения. Внешний вид, функциональность и удобство влияют на позиции в поиске.
Читайте на Askusers
Рассказываем, как выстроить веб-навигацию, чтобы надолго погрузить пользователя в контент. Основные принципы и полезные фишки.
Оптимизация главной страницы: особенности семантики, юзабилити, внутренние и внешние факторы, распространенные ошибки.
Услуги, которые будут вам интересны
А также поделитесь статьей с друзьями в соцсетях.