sitweb.ru - оптимизация сайтов

Специалисты интернет маркетинга компании "Сайтвэб" (sitweb.ru), которые оказывают услуги SEO продвижения сайта, подразделяют оптимизацию веб-сайта на внутреннюю и внешнюю.

В этой статье рассматривается вопрос, что такое внутренняя оптимизация сайта.

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

Итак, вы создали ценный контент и разместили тексты на сайте. При этом вы подобрали основные ключевые слова и включили их в статьи, понимая, что ваш сайт читается не только пользователями, но и поисковыми системами, то есть роботами Яндекса, Google.

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

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

Важно понимать также язык разработчиков, потому что вам может понадобиться выполнить определенные рекомендации по оптимизации.

Программисты вряд ли уделят вашим запросам приоритетное внимание, если не смогут понять ваш запрос или увидеть его важность.

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

Рекомендация: SEO оптимизаторы достигают наилучшей эффективности при совместной работе со всеми, кто работает над сайтом

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

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

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

С этой целью мы разделили эту статью на три раздела:

1) как работают веб-сайты;
2) как сайты читаются поисковой системой;
3) как пользователи взаимодействуют с веб-сайтами.

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

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

1. Как работают веб-сайты

Если поисковая оптимизация – это процесс оптимизации веб-сайта для поиска, то специалисты SEO должны хотя бы минимум понимать то, что они оптимизируют!

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

Важным элементом доступа к веб-сайту является рендеринг – основной или критический путь визуализации (отрисовки или отображения), который представляет собой процесс превращения кода веб-сайта в страницу просмотра.

Страница просмотра сайта в браузерах на экранах различных устройств (настольные компьютеры, ноутбуки, планшеты, мобильные телефоны) – текст с картинками и мультимедиа контентом (видео, аудио).

Учитывая эту сторону работы веб-сайтов, важно, чтобы SEO специалисты понимали следующие аспекты:

  • шаги на этом этапе процесса рендеринга веб-страницы могут повлиять на время загрузки страницы. Скорость загрузки важна не только для удержания пользователей на вашем сайте, но также является одним из факторов ранжирования Google и Яндекса в поиске.
  • Google сканирует все ресурсы вашего сайта в том числе, такие как JavaScript, только при «втором проходе». Поисковый робот Google сначала просматривает страницу без JavaScript. Затем через несколько дней или недель сайт индексируется вместе с JavaScript.

Это означает, что в индекс попадает далеко не всё. Ключевые SEO элементы, которые прописаны на странице и которые используют технологии JavaScript, могут быть проигнорированы поисковой системой.

Представьте себе, что процесс загрузки веб-сайта – это то, как вы добираетесь на работу.

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

Можно, конечно, и так: отправиться на работу с одной перчаткой, выбрать самый длительный маршрут до работы и, добравшись до офиса, немедленно вернуться домой, чтобы взять вторую перчатку и обратно ехать на работу, – нерационально, верно? Так работают неэффективные сайты.

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

Для того, чтобы веб-сайт был доступен онлайн, его необходимо настроить!

1) Сначала нужно купить доменное имя.

Доменные имена, такие как sitweb.ru, приобретаются у регистратора доменных имен, таких как Ру-центр, GoDaddy или HostGator. Эти регистраторы – это просто организации, которые управляют резервированием доменных имен.

2) Доменное имя связать с IP-адресом.

Привычные нам адреса сайтов, например, такие, как «sitweb.ru», интернет не понимает без помощи серверов доменных имен (DNS). Для распознавания сайтов интернет использует набор чисел, называемых IP-адресом (например, 127.0.0.1). Но удобнее всего использовать такие имена, как sitweb.ru, потому что они легче запоминаются пользователями.

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

Как сайт загружается с сервера в браузер

Document Object Model и настройка сайта
Нажмите здесь, чтобы открыть изображение высокой четкости в новом окне.

1. Пользователь запрашивает домен.

В адресной строке браузера пользователь набирает текст «sitweb.ru». Поскольку имя связано с IP-адресом через DNS, люди могут запрашивать веб-сайт, набрав доменное имя непосредственно в своём браузере или щелкнув по ссылке на веб-сайт.

2. Теперь запросы делает браузер.

Сделанный запрос на веб-страницу запускает в браузере функцию поиска сервера DNS для преобразования имени домена в его IP-адрес. Затем браузер запрашивает веб-сервер (компьютер, где хранятся файлы вашего сайта) для получения кода веб-страницы, состоящей из файлов, например, HTML, CSS и JavaScript.

3. Веб-сервер отправляет запрошенные ресурсы.

Как только сервер получает запрос на веб-сайт, он сразу отправляет файлы веб-сайта в браузер пользователя.

4. Браузер собирает веб-страницу.

Получив ресурсы от веб-сервера, браузер начинает конструировать страницу для отображения в браузере пользователя. Браузер анализирует и организует все ресурсы веб-страницы для того, чтобы создать объектную модель документа (DOM).

DOM – это то, что вы видите, когда щелкаете правой кнопкой мыши на веб-странице в браузерах Chrome, Safari или Mozilla, далее в появившемся контекстном меню выбираете «проверить элемент».

5. Браузер выполняет окончательные запросы.

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

6. Веб-сайт загрузился в браузер.

Осуществлен рендеринг или процесс визуализации – сайт преобразован из кода в то, что вы видите в своем браузере.

Рекомендация: Поговорите со своими разработчиками об атрибуте «async»!

Поставьте вашим разработчикам задачу – сокращение основного маршрута рендеринга, используя «async» в скриптах JavaScript.

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

«Async» сообщает DOM, что можно продолжать конструировать страницу, в то время как браузер продолжает загружать скрипты, необходимые для отображения вашей веб-страницы.

Как правило, DOM приостанавливает конструирование страницы каждый раз, когда браузер загружает какой-либо скрипт (так называемые «скрипты, блокирующие процесс визуализации»), это может существенно замедлить загрузку вашей страницы.

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

Вы также можете использовать другие способы оптимизации, которые разработчики могут реализовать, чтобы сократить критический путь рендеринга.

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

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

Существуют три наиболее распространенных языка программирования:

  • HTML – что говорит сайт (теги «title», содержание контента и так далее).
  • CSS – как выглядит веб-сайт (цвет, шрифты и так далее).
  • JavaScript – как ведет себя сайт (интерактивный, динамический и так далее).

HTML: что говорит сайт

Компьютерный язык программирования «HTML» обозначает язык гипертекстовой разметки, и он служит основой для разработки веб-сайта. Такие элементы, как заголовки, абзацы, списки и контент, определяются в HTML.

Вот так выглядит пример веб-страницы и соответствующий ей HTML-код:

HTML и страница просмотра
Нажмите здесь, чтобы открыть изображение высокой четкости в новом окне.

Для специалистов SEO важно знать HTML, чтобы разбираться в том, что находится «под капотом» любой страницы, которую они создают или над которой они работают.

На странице системы управления сайтом (CMS), вероятно, не требуется, чтобы вы набирали код веб-страницы на языке HTML.

В CMS вы можете просто использовать кнопки на панели инструментов, когда что-то корректируете на веб-странице: добавляете новый контент, редактируете анкорный текст внутренних ссылок и так далее. Например, кликнув на кнопку «вставить гиперссылку», вы можете создать ссылку, не набирая <a href ="" >.

Google сканирует эти элементы HTML, чтобы определить, насколько релевантен ваш документ для конкретного запроса. Другими словами, то, что в вашем коде, написанном на HTML, играет огромную роль в том, какое место займет ваша веб-страница в органическом поиске Google!

CSS: как выглядит веб-сайт

Язык программирования «CSS» означает каскадные таблицы стилей. Именно данный язык запускает на ваших веб-страницах определенные шрифты, цвета и макеты.

HTML был создан для описания контента, а не для его стилизации, поэтому, когда CSS появился на сцене, то ситуация полностью поменялась. С помощью CSS стало возможным быстро создавать единый стиль для всего сайта. Теперь можно было «украшать» одновременно все веб-страницы сайта, без необходимости ручной разработки стилей на HTML для каждой страницы – громоздкий процесс, особенно для крупных сайтов.

Только в 2014 году система индексирования Google начала отображать веб-страницы почти так же, как и в обычном браузере, в отличие от текстового браузера.

До этого относительно успешно функционировала черная SEO-оптимизация, которая получала выгоду от прежней системы индексирования Google, скрывая текст и ссылки через CSS для манипуляции ранжированием в поисковой системе.

Теперь данная практика «скрытого текста и ссылок» стала нарушением принципов качества Google.

SEO специалисты, которые оптимизируют компоненты CSS, в частности, должны думать о следующих направлениях работы:

  • поскольку директивы стиля могут быть заданы не в коде HTML вашей страницы, а в отдельных внешних файлах таблиц стилей (файлы с расширением CSS), благодаря чему код вашей страницы может стать менее громоздким, уменьшится размер файлов для передачи и сократится время загрузки;
  • браузеру по-прежнему приходится загружать такие ресурсы, как ваш CSS-файл, поэтому его сжатие может ускорить загрузку ваших веб-страниц, а скорость страницы – это фактор ранжирования;
  • если ваши страницы будут более содержательными по смыслу и по объему, чем кодовая разметка, это может привести к лучшей индексации контента вашего сайта;
  • использование CSS для скрытия ссылок и контента может привести к тому, что ваш сайт будет вручную оштрафован и удален из индекса Google.

JavaScript: как ведет себя сайт

На заре интернета веб-страницы создавались только с помощью HTML. Когда появился CSS, контенту веб-страницы можно было придать какой-то стиль. Когда стал использоваться язык программирования JavaScript, то помимо структуры и стиля веб-сайты обрели динамичность.

JavaScript открыл множество возможностей для создания нестатических веб-страниц.

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

Вы определенно когда-то видели JavaScript в действии – но, возможно, вы этого не знали! Это потому, что JavaScript может делать на странице почти всё что угодно. Например, он может создавать всплывающие окна, или загружать сторонние ресурсы, такие как рекламные объявления, для показа на вашей веб-странице.

Но JavaScript может создавать некоторые проблемы для SEO, так как поисковые системы воспринимают JavaScript не так, как обычные пользователи, посетители сайта.

Рендеринг может быть на стороне клиента или на стороне сервера.

Большинство JavaScript выполняется в браузере клиента.

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

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

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

Это означает, что робот Google должен видеть те же вещи, что и пользователь видит в своем браузере. Однако в ходе «второй волны индексации», при которой выполнение JavaScript идет на стороне клиента, Google может пропустить некоторые элементы, которые доступны только после выполнения JavaScript.

Рассмотрим ещё некоторые ситуации, при которых могут появляться ошибки во время визуализации ваших веб-страниц гуглботом, а также изучим то, что может помешать Гуглу понять, что содержится в вашем JavaScript:

  • вы заблокировали робота Googlebot в одном из ресурсов JavaScript (например, с помощью файла robots.txt);
  • ваш сервер не может обрабатывать все запросы для сканирования вашего контента;
  • JavaScript слишком сложен или устарел для Googlebot, чтобы корректно понять код;
  • JavaScript не выполняет «ленивую загрузку» контента на сайт при посещении страницы поисковым роботом, а также при его движении по странице.

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

К счастью, есть способ проверить, видит ли Google то же, что и ваши посетители. Для того, чтобы увидеть страницу, как просматривает Googlebot вашу страницу, используйте инструмент в Google Search Console. На панели инструментов Search Console, в левом меню навигации выберите «Сканирование», затем «Просмотреть как Googlebot».

google search console и seo оптимизация
Нажмите здесь, чтобы открыть изображение высокой четкости в новом окне.

На странице «Просмотреть как Googlebot» введите URL-адрес, который вы хотите проверить (или оставьте поле ввода пустым, если хотите проверить свою домашнюю страницу) и нажмите кнопку «Получить и отобразить». При этом вам предоставляется возможность протестировать настольную (ПК) или мобильную версию сайта (Mobile: Smartphone).

google search console и seo оптимизация
Нажмите здесь, чтобы открыть изображение высокой четкости в новом окне.

В свою очередь, вы получите сравнительное представление о том, как Googlebot увидел вашу страницу по сравнению с тем, как посетитель вашего сайта видит страницу. Также ниже на странице консоли инструментов поиска Google предоставляется список ресурсов, которые были недоступны для введенного вами URL.

Понимание того, как работает веб-сайт, дает отличную основу тому, о чем мы поговорим далее: как осуществить внутреннюю оптимизацию, чтобы помочь Google лучше просканировать страницы на вашем сайте.

2. Как сайты читаются поисковой системой

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

В этом разделе описываются способы улучшения представления контента для поисковых систем.

Адаптируйте ваш контент к принципам качества поисковых систем, структурируя веб-страницу с помощью микроразметки Schema

Представьте, что вы – поисковый робот, который сканирует статью объемом 1000 слов о том, как редактировать фотографии. Как вы определите автора текста, программы для обработки изображений, функции программ или шаги, необходимые для редактирования текста на фото?

Здесь вам поможет микроразметка (Schema.org). Она позволяет значительно облегчить поисковым системам

  • поиск конкретных слов для классификации текстов,
  • идентификацию информации, которая представлена на вашей странице.

Микроразметка Schema – это способ маркировки или организации вашего контента для того, чтобы поисковые системы лучше понимали, какие элементы содержатся на ваших веб-страницах.

С помощью этого кода создается структура ваших данных, поэтому микроразметка часто упоминается как «структурированные данные».

Процесс структурирования данных часто называют «разметкой», поскольку вы размечаете свой контент с помощью организационного кода.

Семантическая разметка JSON-LD, созданная в мае 2016 года, рекомендована Google, поддерживается также поисковыми системами Яндекс и Bing.

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

После внедрения структурированных данных, наиболее подходящих вашим веб-страницам, вы можете протестировать созданную разметку с помощью инструмента Google для проверки структурированных данных.

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

Эти специальные функции называются «расширенные сниппеты», и вы, вероятно, видели их в действии. Вот примеры:

  • карусель «Главные новости»,
  • карточки с отзывами критиков,
  • блоки с поиском ссылок,
  • рецепты.

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

Другие типы расширенных сниппетов, вероятно, будут добавлены в будущем, так как использование разметки Schema увеличивается.

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

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

Расскажите поисковым системам о ваших предпочтительных страницах с каноническим параметром rel = canonical

Когда Google сканирует один и тот же контент на разных веб-страницах, он иногда не знает, какую страницу индексировать в результатах поиска. Вот почему был изобретен тег «rel = canonical»: чтобы поисковые системы лучше индексировали предпочтительную версию контента, а не все его дубликаты.

Тег «rel = canonical» позволяет вам сообщать поисковым системам, где расположена оригинальная, основная версия контента. Вы, по сути, говорите: «Поисковая система! Не нужно сканировать здесь, вместо этого нужно проиндексировать эту исходную страницу».

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

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

Для того, чтобы поисковые системы не индексировали несколько версий одной и той же страницы, Google рекомендует использовать автореферентный канонический тег на каждой странице вашего сайта. Без канонического тега, сообщающего Google, какая версия вашей веб-страницы является предпочтительной, страница http://www.site.ru может индексироваться отдельно от страницы http://site.ru, создавая дубликаты.

«Рекомендуется избегать дублирования контента» – это общеизвестное утверждение в интернете, и не зря! Google продвигает сайты с уникальным, ценным контентом, а не с копированными текстами, которые берутся из других источников и повторяются на нескольких страницах.

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

Рекомендация: Отличие между фильтрацией контента и ограничениями контента

В интернете не существует такого понятия, как санкции за дублированный контент. Тем не менее, вам следует стараться использовать тег «rel = canonical», чтобы дубликаты страниц не приводили к проблемам с индексацией. Если существуют дубликаты страницы, Google выберет канонический вариант и отфильтрует остальные из результатов поиска. Это не значит, что сайт попал под фильтр. Это просто означает, что Google хочет показывать только одну версию вашего контента.

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

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

Например, это может функция сортировки, которая создает страницу для определенной категории товаров с ценовым параметром – от самой низкой до самой высокой цены. При этом создается URL-адрес, который выглядит примерно так: internet-shop.com/tovar1?sort=top.

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

3. Как пользователи взаимодействуют с веб-сайтами

Как известно, SEO (англ. «search engine optimization») – поисковая оптимизация сайта. Но при решении вопросов в области SEO оптимизаторы думают как о поисковых системах, так и о пользователях.

Это потому, что поисковые системы существуют, чтобы служить тем, кто осуществляет поиск, то есть людям.

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

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

Обеспечение положительного пользовательского опыта для мобильных посетителей сайта

На сегодняшний день более половины всего интернет трафика дают мобильные устройства.

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

В апреле 2015 года Google обновил поисковый алгоритм, который стал ранжировать сайты, удобные для мобильных пользователей, выше сайтов, которые не удобны для мобильных телефонов.

Как сделать, чтобы ваш сайт стал удобным для мобильных пользователей?

Хотя и существует три основных способа настройки вашего сайта для мобильных устройств, Google рекомендует создать мобильный адаптивный дизайн.

Адаптивный дизайн

Адаптивные веб-сайты отлично отображаются на экранах любого типа устройства, которое используют посетители вашего сайта. Для того, чтобы веб-страница «отвечала» размерам устройства, рекомендуется использовать CSS. Это идеальный вариант, потому что позволяет экономить время пользователей: для просмотра контента на ваших страницах посетителям уже не нужно будет дважды касаться или нажимать на экран смартфона, чтобы масштабировать текст и картинки.

Желаете проверить, насколько удобны ваши веб-страницы для мобильных устройств? Тогда воспользуйтесь сайтом Google для проверки мобильной версии сайта!

AMP

AMP означает Accelerated Mobile Pages или «ускоренные мобильные страницы».

Данная технология используется для доставки контента мобильным пользователям со скоростью, намного превышающей скорость доставки без AMP. AMP способен так быстро доставлять контент, так как контент передается с кеш-серверов (а не с веб-сервера сайта) и здесь используется специальная версия HTML и JavaScript для AMP. Вы можете узнать больше об AMP, если посетите сайт разработчиков Google.

Приоритетное индексирование мобильных версий сайтов

С 2018 года Google начал осуществлять индексацию, учитывая наличие мобильной версии сайта.

Это изменение вызвало некоторую путаницу между понятиями «мобильный приоритет» (mobile-first) и «мобильный сайт» (mobile website), поэтому полезно внести ясность в этот вопрос.

«Mobile-first» или «мобильный приоритет» – новый критерий в алгоритме поискового ранжирования Гугл.

Google использует критерий приоритетности «mobile-first» при сканировании и индексации мобильной версии ваших веб-страниц.

«Мобильный сайт» – сайт с адаптивным дизайном для обеспечения совместимости сайта с мобильными экранами, что полезно для пользователей и вашей эффективности в поиске.

Но индексирование с использованием «мобильного приоритета» происходит независимо от наличия мобильной версии сайта.

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

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

Разделение длинного контента для более легкого восприятия

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

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

Но для того, чтобы помочь Google понять взаимосвязь между вашими страницами с разбивкой по страницам, нужно предпринять несколько шагов. На подобных страницах следует проставить в ссылках разметку «rel = next» и «rel = prev».

Более подробно о разбиении на страницы вы можете узнать в официальной документации Google, но основные рекомендация таковы:

  • первая страница в последовательности должна иметь только разметку «rel = next».
  • последняя страница в последовательности должна иметь только разметку «rel = prev».
  • страницы, которые имеют как предыдущую, так и следующую страницу, должны иметь разметку как «rel = next», так и «rel = prev».
  • поскольку каждая страница в последовательности уникальна, не ставьте канонический тег с указанием на первую страницу в последовательности. Если на сайте имеется страница без пагинации, то на разделенных страницах следует использовать только один канонический тег с указанием страницы, где представлен контент без разбивки.
  • когда Google видит последовательность с разбивкой на страницы, поисковик обычно объединяет свойства перелинковки страниц и отправляет пользователя поисковой системы на первую страницу.
Рекомендация: разметка «rel = next/ prev» должна содержать анкорный текст и находится в пределах тега ссылки <a href>.

Это помогает Google правильно сканировать «rel = next/ prev».

Улучшение скорости страницы для повышения лояльности посетителей

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

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

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

Картинки являются одной из главных причин медленных страниц!

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

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

Основные способы улучшения доставки изображений заключаются в следующем:

1) «SRCSET» позволяет обеспечить оптимальный размер картинки для каждого устройства

Атрибут «srcset» позволяет использовать несколько версий одной картинки, указывая, в какой ситуации какая версия должна использоваться. Этот фрагмент кода добавляется в тег «img» (в HTML там, где должна появляться картинка), чтобы можно было использовать уникальные картинки для устройств определенного размера.

Это похоже на концепцию адаптивного дизайна, о котором мы говорили ранее. Только тогда мы не обсуждали, как оптимизировать картинки!

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

Рекомендация: существует более трех версий изображений!

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

2) Для увеличения скорости отображения картинок сайта рекомендуется использовать ленивую загрузку

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

Как происходит ленивая загрузка: первоначально загружается версия с низким разрешением, а затем полная версия с высоким разрешением.

Это также помогает оптимизировать критический путь рендеринга! Поэтому, пока загружаются остальные файлы страницы, вы показываете привлекательное изображение с низким разрешением, которое сообщает пользователям, что движение идет и контент загружается. Для получения дополнительной информации о том, как следует использовать ленивую загрузку картинок, можно узнать, прочитав «Руководство Google по ленивым загрузкам».

Можно оптимизировать скорость за счет сжатия и объединения файлов

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

«Объединение» – еще одно общее понятие, которое можно услышать в связи с улучшением скорости страницы. Процесс объединения заключается в том, что множество файлов одного и того же языка программирования помещаются в один файл. Например, файлы JavaScript могут быть помещены в один большой файл, чтобы уменьшить для браузера количество файлов JavaScript.

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

Привлечение международного трафика

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

Существует два основных способа привлечения посетителей из других стран:

Язык

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

Страна

Сайты, ориентированные на аудиторию в разных странах, называются межрегиональными веб-сайтами, и им следует выбрать структуру URL, которая позволяет легко ориентировать свой домен или страницы на определенные страны. Это может включать использование домена верхнего уровня кода страны, например, для РФ – «.ru», или общего домена верхнего уровня со специфичной для конкретной страны подпапкой, например, для России – «example.site/ru».

Вы узнали, как правильно проводить внутреннюю SEO оптимизацию.

Источник: Поисковая оптимизация сайтов