Оптимизация кода сайта для SEO

Оптимизация кода сайта для SEO

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

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

Несмотря на то, что Google постоянно работает над тем, чтобы лучше понять истинное значение страницы и облегчить использование ключевых слов , тег

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

Тег title часто путают с заголовком страницы, но это не одно и то же. Заголовок, видимый на странице, обычно помечен как H1. Мы вернемся к этому через мгновение (маркеры H1-H4 описаны далее в руководстве). Тег title можно увидеть в трех местах:

  1. В списке результатов поиска
    Оптимизация кода сайта для SEO
  2. Во вкладках веб-браузера
    Оптимизация кода сайта для SEO
  3. В социальных сетях (при публикации ссылки)

Оптимизация кода сайта для SEO
Длина тега заголовка, отображаемого Google, не одинакова в каждом случае, поскольку она основана на пикселях, а не на количестве символов. Однако рекомендуется использовать 55-60 символов . При построении тега title стоит обратить внимание на расположение ключевых слов. Чем ближе к началу тега title, тем большее влияние они окажут на ранжирование в поиске.

Кроме того, согласно исследованиям пользовательского опыта, пользователи Интернета сосредотачиваются только на первых двух словах заголовка. Поэтому стоит создавать теги заголовков таким образом, чтобы самая важная информация (например, название товара или услуги) была в начале.

МЕТА ОПИСАНИЕ

Мета-описание/meta description — еще один элемент, который не виден на странице, но его стоит обновить в коде сайта, поскольку он, как и тег title, влияет на отображение страницы в результатах поиска.

Однако, в отличие от тега title, метаописание больше нигде не появляется. Это правда, что Google не принимает во внимание содержание метаописаний для интернет-рейтинга. Однако наличие ключевых слов в мета-описании может эффективно привлекать трафик из поисковой системы, поскольку привлекает внимание пользователей. Длина метаописания не должна превышать 160 символов, чтобы такое описание полностью отображалось в поисковой выдаче.

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

Мета-описание, отображаемое в результатах поиска, может выглядеть так:

Оптимизация кода сайта для SEO
ОПТИМИЗАЦИЯ ЗАГОЛОВКА

Времена, когда SEO фокусировалось в основном на технических аспектах и ссылках, прошли. Сегодня важен контент. Вы должны позаботиться о пользовательском опыте и создавать заголовки, максимально соответствующие поисковым запросам пользователей Интернета. Нет сомнений в том, что наиболее важным из заголовков на веб-сайте является H1, который предназначен для информирования как получателей, так и поисковых систем о том, какой контент они найдут на данном веб-сайте.

Тег заголовка H1 выглядит следующим образом:

Оптимизация кода сайта для SEO

Некоторые компании копируют содержимое тега title в H1, что не оказывает негативного влияния на продвижение страницы, но стоит пойти дальше и построить отдельный заголовок H1. Это приведет к лучшему пользовательскому опыту. При построении заголовка H1 стоит:

  • Используйте только один заголовок для каждой страницы — большее количество заголовков H1 на подстранице может сбить с толку поисковые системы и, таким образом, снизить эффективность одного заголовка с релевантными ключевыми словами.
  • Используйте правильную длину заголовка — слишком короткий заголовок не позволяет использовать его потенциал, а слишком длинный может ослабить его силу. Средняя длина заголовка H1 должна составлять от 20 до 70 символов.
  • Правильно выделяйте H1 на странице — H1 должен быть самым важным визуальным элементом страницы. Обнадеживающий и заметный заголовок вызовет у пользователей желание прочитать его содержание.

ВНУТРЕННИЕ ЛИНИИ И АНКЕРЫ

Внутренняя перелинковка — это размещение на веб-сайте ссылок, ведущих на другую подстраницу или другое место на данном веб-сайте. Одна ссылка (также называемая гиперссылкой) состоит из якоря и адреса, который помещается как значение атрибута href в HTML-теге . Якорь — это текст, который пользователь щелкает, чтобы перейти из одного места в другое; он буквально связывает два разных места вместе. Полный код гиперссылки может выглядеть так:

Оптимизация кода сайта для SEO

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

ССЫЛКИ С АТРИБУТОМ NOFOLLOW

Ссылки с атрибутом nofollow имеют дополнительный тег rel=»nofollow». В приведенном выше примере ссылка nofollow будет выглядеть так:

Оптимизация кода сайта для SEO

Nofollow говорит Google не учитывать обратную ссылку при определении ценности SEO для любой страницы. С 1 марта 2020 года Google использует nofollow в качестве ориентира при определении позиции сайта в поисковой выдаче. Используя атрибут nofollow, вы сообщаете поисковой системе, какой контент на странице важнее, а на каком ей не следует фокусироваться.

Однако стоит избегать чрезмерного использования тега nofollow. В одном из видеороликов, опубликованных на YouTube-канале Google WebMasters , Джон Мюллер признал, что Google выше ранжирует сайты с разнообразным профилем исходящих ссылок, поэтому пометка слишком большого количества внешних ссылок как nofollow может навредить продвижению сайта.

АТРИБУТЫ АЛЬТЕРНАТИВ

Атрибут alt — это элемент HTML, который позволяет вам предоставить альтернативную информацию об изображении, если пользователь не может его просмотреть. В то же время тег «image alt» определяет, как роботы Google узнают, что представляет собой изображение, и является еще одним элементом, который помогает поисковым системам понять, какой контент присутствует на сайте. Атрибут alt может выглядеть так:

Оптимизация кода сайта для SEO

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

СТРУКТУРА URL

Структура URL вашего сайта важна по двум причинам:

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

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

КАНОНИЧЕСКИЕ URL-адреса

Каноническая ссылка (rel = canonical ) — это элемент HTML, который эффективно помогает предотвратить дублирование контента на странице, что негативно влияет на SEO. Указание данного URL-адреса как канонического также определяет его как предпочтительный контент. При наличии на сайте нескольких версий одного и того же контента, указав одну из них как каноническую, мы добиваемся того, чтобы поисковые системы ориентировались на нее. Каноническое обозначение адреса может выглядеть так:

Оптимизация кода сайта для SEO

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

Core Web Vitals в SEO с мая 2021 г.

SEO — это отрасль, которая динамично меняется, поскольку Google регулярно вносит изменения в свои алгоритмы, чтобы улучшить представленные результаты поиска и улучшить взаимодействие с пользователем. В мае 2021 года нас ждет еще одно большое изменение, вызванное введением показателей качества сайта — Core Web Vitals в факторы, влияющие на позиции в Google. Как указали в Google, новые показатели будут ориентированы на удобство пользователей при использовании того или иного веб-сайта, а значит, окажут существенное влияние на его позиции в результатах поиска. Таким образом, интернет-магнат хочет ценить веб-сайты, которые предлагают лучший пользовательский опыт.

На общий рейтинг вашего сайта Core Web Vitals влияют три элемента:

  • LCP (Largest Contentful Paint) — скорость загрузки страницы (которая не должна превышать 2,5 секунды);
  • FID (First Input Delay) – задержка загрузки страницы, т.е. время, по истечении которого пользователь может совершить первое взаимодействие с сайтом (задержка не должна превышать 100 миллисекунд);
  • CLS (Cumulative Layout Shift) — индекс нестабильности контента, т.е. частота смещений видимых элементов на странице (данный параметр не должен быть выше 0,1).

Google предоставил владельцам веб-сайтов и разработчикам инструменты, которые помогут им подготовить и адаптировать веб-сайты к новому алгоритму. У нас есть шесть различных инструментов для измерения Core Web Vitals:

  • Консоль поиска,
  • Статистика скорости страницы,
  • маяк,
  • Chrome DevTools,
  • Отчет об удобстве использования Chrome,
  • Расширение Web Vitals.

Резюме: оптимизированный для SEO код

Если вам интересно, почему ваш веб-сайт не может занимать более высокие позиции в результатах поиска, возможно, стоит подумать об его оптимизации для HTML. У нас нет контроля над тем, как Google ранжирует ваш сайт, но, следуя приведенным выше рекомендациям, вы можете повлиять на свою позицию в результатах поиска. Безусловно, время, потраченное на создание правильных тегов и оптимизацию кода, вознаградит вас увеличением посещаемости веб-сайта и более высокой позицией в списке поисковой выдачи. Однако помните, что SEO — сложная и постоянно развивающаяся тема. Конечной целью любой кампании должно быть максимальное обслуживание посетителей вашего сайта путем создания качественного контента и правильной организации вашего сайта.