Существуют два направления оптимизации сайта — внутренняя и внешняя. И чтобы продвигать сайт самостоятельно, нужно позаботиться об обоих направлениях. Внутренняя оптимизация направлена на улучшение сайта как с точки зрения SEO, так и с технической стороны. Внешняя же оптимизация позволяет улучшить реноме вашего сайта. Начнём с внутренней оптимизации.
Часть первая. Внутренняя оптимизация
SEO-оптимизация
К сео-оптимизации относится настройка правильных мета-тегов вашего сайта. В первую очередь это теги Title и Description. Первый отвечает за название сайта, второй за описание. А ещё эти два тега формируют поисковый сниппет. С названием понятно, а что писать во втором мета-теге? Мы же хотим, чтобы наш сайт отображался в поисковиках правильно и сразу давал информацию о том, что на нашем сайте предлагается. И тут нам на помощь приходят поисковые запросы. Посмотрите, что ищут люди в вашей сфере, соедините поисковые запросы с вашим предложением, добавьте уникальности, региональность, и… получится что-то вроде этого:
На картинке скрин поискового сниппета, сформированного плагином Yoast SEO. Если ваш сайт на WordPress, советую обратить внимание на этот плагин — он позволяет не только формировать сниппет для поисковиков, но также помогает в написании статей на сайте.
Текстовая оптимизация
Кстати, о статьях. И вообще о текстах на сайте. Недостаточно просто написать текст для сайта или несколько статей. Необходимо в каждом тексте учитывать поисковые запросы. Более того, идеально, если статья пишется под конкретный поисковый запрос. И чем больше таких статей, тем лучше. Но тут главное не переборщить, иначе и текст будет нечитабельным, и поисковики сочтут статью спамом.
И не стоит забывать о правильной расстановке заголовков на странице. Существуют 6 уровней заголовков — он h1 до h6 — в любом редакторе на сайте есть окно выбора уровня заголовка. Обычно используют первые три-четыре, но если статья состоит из множества заголовков и подзаголовков, можно и нужно использовать все шесть.
Чтобы было понятно, представьте статью, у которой есть название (заголовок h1), несколько разделов (с заголовками h2), у разделов есть свои подразделы (с заголовками h3) и тд. И помните, что на каждой странице может быть только один заголовок h1!
Фото и картинки
Конечно же, на каждом сайте есть хотя бы несколько фотографий или картинок. Но не все знают, что у фото и картинок тоже есть свой тег. Выглядит он так: <img src=»ссылка на фото» alt=»описание фото» title=»название фото»>. Иными словами, когда вы вставляете на страницу сайта фото или картинку, появляется этот тег. Но что за alt и title?
Атрибут alt у фото или картинки позволяет задать описание, если по какой-то причине фото или картинка не загрузятся. В таком случае на месте фото будет текстовое описание, чтобы было понятно, что на этом месте должно было быть изображение. А ещё данный атрибут позволяет слабовидящим людям узнать, что на странице есть изображение (об этом им «расскажет» специальная программа для чтения экрана).
С точки зрения сео, атрибут alt можно использовать, заполнив его поисковым запросом или ключевым словом, тем самым придав целостности содержанию страницы сайта.
Что касаемо атрибута title, это просто название изображения. Данный атрибут необязателен, и его можно не указывать, если в этом нет необходимости.
Техническая оптимизация сайта
Техническая оптимизация сайта направлена прежде всего на увеличение скорости загрузки сайта на устройстве посетителя. Вспомните, как часто вы ждали, пока откроется нужная вам страница какого-либо сайта? И как вас нервировал белый экран, пока не показались первые изображения и текст? Сколько вы ждали? 10 секунд? 20? Или даже минуту? А бывало ли такое, что вы просто закрывали вкладку, так и не дождавшись, и переходили к другому сайту, который открывался куда быстрее?
Я не случайно задаю эти вопросы. Скорость загрузки сайта очень влияет на бизнес: посетитель не хочет ждать загрузки, и если сайт не открылся быстро, он уйдёт к вашему конкуренту. А вы даже не узнаете, в чём причина, пока сами не попытаетсь открыть свой сайт на телефоне с плохим интернетом. Так как решить эту проблему?
Прежде всего совет: не используйте слона там, где хватит и мухи. Смотрите, у вас на сайте есть фотографии и графические изображения. Все они показываются на сайте в том размере, какой задается в настройках. И если на сайте фото должно быть 800 пикселей в ширину, то не стоит загружать фотографию более крупного размера. Максимальный размер крупного изображения для любого сайта — 1920 пикселей в ширину. Это тот максимум, который вы можете использовать. И то — это для отображения на компьютере. Для мобильных устройств лучше подменять изображение на меньшее.
Иными словами, всегда редактируйте фото и изображения перед публикацией на сайте. Так они станут оптимальными не только по размеру, но и «весу».
Кстати, о «весе» фотографий. Всегда оптимизируйте изображения для сайта. Есть несколько сервисов, которые позволяют сжать фотографии и удалить из них ненужные данные — место съёмки, выдержка, освещение, модель камеры и тд. Такие данные просто не нужны, если это не фотография для портфолио фотографа, где такие данные необходимы. Во всех других случаях они лишь «утяжеляют» фото.
Подскажу вам один из сервисов, которым пользуюсь сам: TinyPNG позволяет «облегчить» фотографии на 80-90%. На практике это означает, что файл размером в 10 мегабайт на выходе будет весить 1-2 мегабайта, а в качестве потеряет столь мало, что разницы вы не заметите. Зато такое изображение будет загружаться куда быстрее.
Подведём итог по изображениям на сайте: загружайте на сайт изображения нужного размера и всегда оптимизируйте их.
Файлы стилей и скрипты
С фотографиями разобрались, а что делать с другими файлами? Речь пойдёт о файлах стилей и скриптах. Первые делают на вашем сайте оформление, вторые — позволяют взаимодействовать с вашим сайтом посетителям и добавляют необходимый функционал.
Вы сами, не обладая необходимыми знаниями, вряд ли сможете что-то сделать с этими файлами вручную. Но есть несколько дополнений для сайтов, позволяющих оптимизировать данные файлы. Практически, как с фотографиями, их можно и нужно сжимать — тем самым удаляется ненужное. А во-вторых, такие файлы можно перемещать в правильные места на страницах сайта. Я объясню: сайт загружается сверху вниз, а вверху есть подключение файлов стилей и скриптов. И пока они не загрузятся, сайт не откроется. Особенно, если эти файлы загружаются со стороннего ресурса. Но случается так, что скрипт или файл стилей не требуется загружать немедленно, так как элемент, к которому относятся данные файлы, находится внизу страницы. Например, галерея с фото-работами — она вряд ли будет в самом верху сайта, а значит и скрипт для её работы не обязательно должен быть вверху, и его следует перенести вниз. Таким образом, пока посетитель просматривает ваш сайт, браузер постепенно загружает его содержимое, и когда посетитель дойдёт до галереи скрипт уже будет загружен.
Но так поступают не со всеми скриптами. Например, скрипты счётчиков и аналитики лучше размещать как можно выше, чтобы они успели сработать и засчитать посещение.
Ещё один немаловажный момент — инлайновые стили. Мы можем записывать стили оформления в отдельный файл, но часть стилей мы можем записать непосредственно на странице сайта или внести прямо в нужные HTML-элементы. Хорошо это делать с верхними блоками сайта — панелью меню, главной секцией и тд. Дело в том, что браузер изначально загружает HTML, а потом уже стили. И если в HTML стили будут уже прописаны, то загружаемый элемент загрузится уже таким, каким должен быть. Например, у вас на странице есть заголовок, написанный жирным шрифтом. При загрузке посредством отдельного файла, сначала появится заголовок, а потом он уже станет жирным. А при инлайновых стилях заголовок загрузится сразу жирным.
Кстати, о шрифтах. Их тоже можно и нужно загружать ассинхронно. Что это значит? Это значит, что текст на вашем сайте сначала загрузится в том шрифте, какой есть в браузере или в системе посетителя, а затем уже сменится на тот, который вы использовали при создании сайта. Делается это для того, чтобы также ускорить загрузку и показать информацию посетителю, а не заставлять его ждать, пока загрузится ваш шрифт. Даже если вы использовали очень красивый шрифт, подумайте — что важнее? Чтобы посетитель увидел ваш красивый шрифт, но ждал пару лишних секунд или прочёл нужную информацию, а затем увидел ваш шрифт?
Поисковики
В заключении этой части статьи мы поговорим об индексации вашего сайта поисковиками. Проделанные выше действия направлены не только на улучшение взаимодействия с посетителем сайта, но и для улучшения показателей у поисковых систем. Вы, вероятно, уже догадались, о чём я. На ум пришла мысль о рейтинге от Гугла — Page Speed Insight. Но я вас разочарую: полагаться на данный ресурс полностью — неправильно. Да и «выбить» заветные 100 из 100 — задача не всегда решаемая. Тем не менее, если проделать вышеупомянутые действия на сайте, показатели станут значительно лучше. А пока поговорим о другом.
Robots.txt и Sitemap.xml
Эти два файла — обязательно должны быть на каждом сайте. Первый позволяет указать поисковым роботам, какие разделы нужно просматривать, а в какие заходить не надо. Допустим, страницы товаров индексировать и отслеживать изменения на них — обязательно. А вот административную часть сайта (админку или консоль) индексировать не надо — это частная территория владельца сайта. Таким образом, в данном файле прописываются все разделы сайта, которые необходимо индексировать, и все, где индексация не нужна. Делается это с помощью директив Allow и Disallow.
Есть и другие директивы. Например, директива Host — задаёт адрес сайта. Нужна она была для правильной индексации у Яндекса, но сейчас эта директива устарела и не используется. А вот директива Sitemap по-прежнему необходима — она позволяет указать путь к файлу sitemap.xml. Этот файл — карта вашего сайта, но не такая, какую можно встретить в разделе меню на сайте, а служебная. Там хранятся список страниц сайта, список статей, товаров и тд. Данный файл помогает поисковым роботам соориентироваться у вас на сайте.
SSL-сертификат
И в завершении затронем тему безопасности. А именно установки ssl-сертификата. Не буду долго рассказывать о том, как он работает и прочее. Главное, что вы должны знать — если у вас на сайте посетитель может сделать заказ или оставить свои контактные данные, вам просто необходим данный сертификат. Благодаря ему трафик будет зашифрован и данные посетителя нельзя будет похитеть. Так что, если у вас интернет-магазин, где клиенты вводят платёжные данные, или лендинг, где посетители оставляют свой номер телефона, — ставьте ssl-сертификат.
Во-первых, это можно сделать бесплатно. Многие хостинги и регистраторы доменов предлагают бесплатные сертификаты, которые действуют от нескольких месяцев до года. По истечению срока сертификат можно продлить также бесплатно. А во-вторых, это полезно и для поисковиков — так к вашему сайту будет больше доверия.
Что касаемо платных сертификатов, то они должны быть установлены на сайтах банков и тому подобных структур, так как уровень безопасности там требуется более высокий.
В следующей части статьи мы поговорим о том, как сделать ваш сайт более популярным и узнаваемым. В первую очередь — у поисковиков. Следите за обновлениями!
Заходите в гости, и читайте ещё больше полезных статей: https://webmaster-nik.ru
