Поиск по сайту Поиск

Основа продающего сайта: что такое информационная архитектура и как ее создать

В начале октября в России отмечают день архитектора. Но мы уверены, что это еще и праздник всех веб-мастеров, SEO-специалистов и дизайнеров, которые вместе работают над архитектурой домов сайтов. Да-да! Качественная архитектура сайта помогает создать удобный пользовательский интерфейс и улучшить ранжирование в поисковиках. А как ее создать — читайте в статье.

Зачем нужна информационная архитектура

Весь контент, который находится на сайте, должен логично разбиваться по разделам и блокам, чтобы найти нужный продукт/статью можно было интуитивно. Как в библиотеке — разыскать книгу было бы невозможно без продуманной системы навигации. Поэтому архитектура необходима для: 

улучшения пользовательского опыта — клиентам будет проще искать информацию на сайте, удобно передвигаться по страницам и находить ответ на свой вопрос за 1-2 минуты;

повышения рейтинга сайта в поисковых системах — для поисковиков важны уровень вложенности страниц и структура URL, поэтому сайт с понятной и продуманной архитектурой лучше индексируется и получает больше трафика. 

Составляющие информационной архитектуры

Архитектура сайта — структура страниц и их взаимосвязь, которая помогает пользователям ориентироваться на странице. Термин относится не только к сайтам, но и к приложениям. Архитектура включает: 

  • навигацию,
  • URL-адреса,
  • перелинковку,
  • страницы разделов и категорий,
  • хлебные крошки,
  • файл Sitemap.

Авторы книги «Информационная архитектура» Луис Розенфельд и Питер Морвиль определили три круга ИА:

1) контекст — это цели бизнеса, ресурсы и ограничения;
2) содержание — типы документов, объем, имеющаяся структура;
3) пользователи — аудитория, ее задачи и потребности, действия при поиске информации. 

Три круга информационной архитектуры

Идея в том, что у пользователей, которые пришли на сайт, множество вопросов. Они могут не задумываться об этом, но подсознательно искать ответы на каждый из них. Вопросы могут быть такими: 

  • Где я нахожусь? Что есть на этом сайте?
  • Я знаю, что мне нужно, но как это найти? Есть ли здесь это?
  • Насколько профессионально сделан сайт? 
  • Здесь есть то, что мне нужно. Но есть ли что-то, что тоже может мне пригодиться?

Задача сайта — ответить на все эти вопросы, предоставить искомое и возможность найти что-то еще (например, похожие товары). 

Как сделать структуру сайта

Разрабатывать архитектуру сайта лучше на уровне проектирования. Когда сайт готов, менять структуру достаточно сложно и трудозатратно, но в перспективе это поможет сделать ресурс более удобным. Сам процесс напоминает начало строительства дома — на этом этапе важны не детали, а общее понимание: сколько комнат будет, как они будут располагаться. 

Вот 3 шага, которые помогут собрать правильную структуру для любого проекта.

Шаг 1. Сформируйте семантическое ядро

Семантическое ядро — совокупность ключевых запросов, по которым ваш сайт будет показываться пользователям в поисковике. 

Семантическое ядро интернет-магазина вязаных вещей
В семантическом ядре интернет-магазина вязаных вещей могут быть подобные ключевики

Нужно найти целевые запросы, по которым будет продвигаться сайт. Сделать это можно разными способами: 

  • самостоятельно придумать запросы пользователей, которым был бы полезен сайт — подумать, как бы вы искали представленные товары;
  • подобрать запросы с помощью сервисов подбора ключевых слов;
  • проанализировать семантику конкурентов, например, с помощью сервисов SpyWords или PR-CY.

В блоге есть пошаговая инструкция о том, как собирать семантику и писать SEO-тексты для сайта.

Если вы планируете многостраничный сайт, учтите, что на каждой из страниц должны быть свои ключевые слова. Если целевые запросы будут дублироваться, может произойти каннибализация ключевых слов — страницы начнут конкурировать друг с другом за одни и те же фразы.

Шаг 2. Продумайте структуру сайта

Розенфельд и Морвиль выделили 3 структуры сайта:

Иерархическая система

Она позволяет выделить важные части и разделить весь контент на более узкие категории. По мере продвижения вглубь пользователь будет погружаться в тему. Если вам нужен сайт-визитка или портфолио с небольшим числом страниц, такая система подойдет. Также эту систему часто реализуют в приложениях, например, для заказа еды. Для крупных проектов эффективнее будет выбрать один из следующих вариантов.

Иерархическая архитектура сайта

Последовательная система

В этой структуре лучше всего отслеживаются сценарии пользователя — она позволяет избежать большого количества выбора, чтобы не перегружать потенциальных клиентов. При этом весь контент логично разделен на смысловые блоки.

Последовательная архитектура сайта

Матричная система

Эта система через продуманную структуру ссылок позволяет пользователю передвигаться хаотично — то есть он сам выбирает предпочтительный путь.

Матричная архитектура сайта

Позже Брюс Клей выделил еще одну систему — Silo. Она напоминает последовательную, но дополнена некоторыми правилами. 

Silo-структура

Основная идея метода в том, что главную страницу с любой другой соединяет минимальное количество кликов. Все страницы на сайте делятся на разделы по смыслу и семантике, далее — на тематические подразделы. Чем меньше кликов до цели, тем легче пользователям добраться до сути, а поисковым роботам — просканировать контент. 

Такая структура подходит почти всем сайтам — она удобна и помогает улучшить пользовательский опыт.

SILO-архитектура сайта

После того как вы определились со структурой ресурса: 

  • обозначьте главные разделы — для интернет-магазина одежды это могут быть «Каталог», «Мужчинам», «Женщинам», «Детям», «Новинки», «О компании», «Доставка»;
  • продумайте структуру подразделов — например, для раздела с женскими вещами это могут быть «Верхняя одежда», «Деним», «Платья и юбки», «Для офиса»;
  • обращайте внимание на детали — в разделе с новинками сразу могут располагаться карточки товаров, подраздел в данном случае не понадобится, а вот в «Доставке» нужно указать условия или разместить калькулятор для подсчета;
  • продумайте структуру URL.

Яндекс советует создавать информативные URL. Это поможет сформировать логичную иерархическую структуру адресов. Она показывает путь пользователя по сайту. Например, URL для этой статьи— https://www.reg.ru/blog/chto-takoe-informacionnaya-arhitektura-dlya-seo-i-kak-ee-sozdat/. По адресу видно, что человек находится на сайте Рег.ру, а именно — в блоге на странице конкретной статьи. Простые и понятные URL хорошо воспринимаются пользователями, а поисковые роботы смогут лучше понять тему страницы. 

Обязательно визуализируйте архитектуру сайта. Это можно сделать с помощью специальных сервисов и интеллект-карт: Octopus.do, Xmind, MindMup, Miro.

Пример архитектуры
Пример структуры в Miro

Шаг 3. Проработайте навигацию

Когда общая структура готова, можно переходить к отдельным ее частям. Например, навигации. Вот несколько составляющих грамотной навигации: 

Хлебные крошки

Хлебные крошки — это цепочка страниц от главной до той, на которой в данный момент находится пользователь. С крошками легче и комфортнее ориентироваться по сайту: посетитель знает, куда зашел и как вернуться на шаг назад. Кроме того, крошки содержат внутренние ссылки, что положительно отражается на индексации.

Хлебные крошки
Хлебные крошки в Базе знаний Рег.ру

Поиск по сайту

Для крупных многостраничных проектов и интернет-магазинов с большим количеством товаров поиск по сайту необходим. Не обязательно включать в поиск все страницы сайта, достаточно сделать его только для товарных категорий и услуг — клиенты вряд ли станут искать информацию о компании или часы работы. Если у вас обширная база знаний, то отдельно стоит предусмотреть поиск и по статьям.

Реализация поиска в Рег.ру
В Рег.ру есть общая система поиска по сайту — все найденные материалы по запросу делятся на категории для удобства

Хедер и футер

Хедер — шапка сайта, меню вверху страницы, где обычно располагаются ссылки на важные разделы. На сайте ветеринарной клиники, например, это адреса медцентров, информация об услугах, медперсонале, акциях и кнопка записи на прием — всё, что может понадобиться пользователю в моменте.

Хедер на сайте клиники

Главная цель информации в хедере — помочь клиенту сориентироваться и показать, где быстро найти необходимую информацию. 

Футер — нижняя часть сайта, ее еще называют подвалом. Здесь вы уже можете разместить все разделы сайта по категориям: информацию о компании, политику конфиденциальности, новости, блог, отзывы, форму подписки на рассылку. 

Если пользователь пролистал вниз страницы, вероятно, он заинтересовался компанией, но не смог найти интересующую информацию или хочет узнать о фирме больше — и такую возможность надо предоставить. 

Фильтры для товаров

Представьте, что вы выбираете мебель для дома и точно знаете ее габариты и цвет, который подойдет под интерьер. Прокручивать страницу в поиске подходящих дивана и стола можно бесконечно — проще ввести параметры и выбирать уже из релевантной выдачи. Для этого как раз и нужны фильтры — они помогают пользователю быстрее найти желаемое.

Фильтр для товаров
Система фильтров на сайте магазина мебели Hoff

Карта сайта

Sitemap — практически путеводитель по сайту, список ссылок на все страницы ресурса с соблюдением иерархии. Он необходим для поисковых роботов, которые сканируют все страницы ресурса — карта показывает, какой контент есть на сайте и где его искать. Без файла Sitemap роботу понадобится немало времени, чтобы обойти весь ресурс, особенно если он содержит десятки и сотни страниц. 

Сгенерировать карту можно с помощью специальных ресурсов, например, MySiteMapGenerator. Для этого нужно ввести в строку адрес сайта и нажать кнопку «Перейти к созданию». Генератор работает бесплатно с ресурсами до 500 страниц. На выходе вы получаете xml-файл, который добавляется в корень сайта. Остается только сообщить поисковикам, что вы создали карту, — вставьте ссылку на нее в Яндекс Вебмастере и Google Search Console в специальное поле для sitemap.

Сделайте перелинковку

Перелинковка — это связь одних страниц с другими с помощью ссылок. Перелинковку можно делать между страницами одной или разной иерархии, связать с ее помощью подразделы и статьи с товарами. Но эффективнее будет, если связанные страницы похожи по смыслу. 

Кроме того, на более важных страницах нужно регулярно размещать ссылки на новые, недавно опубликованные. А в статьях, если вы ведете блог на сайте, ссылаться в новых материалах на старые. 

О том, как правильно реализовать перелинковку, читайте в нашей статье про внутреннюю перелинковку и ссылочный вес (кстати, это тоже пример перелинковки 😉)

Подберите надежный хостинг

Даже продуманная архитектура не поможет органически продвинуть сайт, расположенный на ненадежном сервере — пользователи не вернуться, если страницы долго загружаются, а сам ресурс подвержен сбоям. Кроме того, если сервер часто «падает», не защищен от DDoS-атак, а у сайта отсутствует SSL-сертификат, он никогда не попадет в топ поисковой выдачи и не получит стабильный трафик. Новые страницы не смогут индексироваться, а старые перестанут отображаться в поиске. 

В нашей Базе знаний есть материал, который поможет подобрать хостинг для любого проекта. 

⌘⌘⌘

Невозможно создать удобный сайт без предварительной подготовки и базового понимания иерархии страниц. Понятная архитектура поможет сделать ресурс удобным для пользователей и поисковых роботов. А выбрать надежный хостинг для сайта можно в Рег.ру.

Как запустить сеть придорожных кафе с АЗС на Севере

Запускать бизнес в регионе — значит столкнуться со слабым сервисом у поставщиков и подрядчиков, бороться за каждого квалифицированного сотрудника. Заниматься...
Read More

Собственный магазин или маркетплейс: где выгоднее продавать?

58% всех интернет-заказов в 2023 году совершили на маркетплейсах.  Популярность маркетплейсов активно растет. При этом рост количества продавцов снижается: в...
Read More

SEO для бизнеса: поисковики — тоже реклама

Что такое SEO-оптимизация, как она приносит выгоду собственному бизнесу и как ее настроить — в блоге Рег.ру
Read More

Какие показатели нужно отслеживать новому бизнесу? 10 главных метрик

Полный список финансовых показателей, которые нужно учитывать при запуске и развитии бизнеса. С формулами, комментариями и понятными примерами расчета. (далее…)
Read More

Драма Microsoft и Apple: от вражды до сотрудничества

Техногиганты всё время своего существования судились, обменивались колкостями и пытались обогнать друг друга по уровню новаторства в разработках. Наши коллеги...
Read More

Как компании меняли свой бренд из-за испорченной репутации: три кейса

В бизнесе нет страховки от ошибок — любой промах отражается на репутации. И иногда исправить ситуацию может только ребрендинг и...
Read More

Запускаем email-рассылку: как не попасть в спам при отправке писем

В статье рассказываем, почему рассылки попадают в спам, и делимся советами, как сделать так, чтобы письма всегда доставлялись до адресатов....
Read More

Ключ к успешному продвижению: что такое SMM-стратегия и как ее составить

Разберем, что такое SMM-стратегия, зачем она нужна и как эффективно использовать социальные сети для решения бизнес-задач. (далее…)
Read More

Новогодний маркетинг: лучшие приемы праздничной рекламы

Для бизнеса Новый год и Рождество — время всплеска продаж и увеличения прибыли. А способствуют этому всем знакомые персонажи: от...
Read More

Россияне предпочитают .ru вместо .com, а Дональд Трамп проиграл доменный спор за mar-a-lago.com

Рассказываем самые интересные новости доменного мира. (далее…)
Read More