Техническое SEO для автосалонов: Часть 2. Повышаем скорость загрузки сайта

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

Используйте кеширование браузера

Каждый раз, когда браузер загружает веб-страницу, вместе с ней загружаются все веб-файлы (HTML, CSS, JavaScript, изображения и другие элементы, которые редко изменяются). Проблематичность состоит в том, что эти большие файлы требуют больше времени для загрузки, особенно если пользователь подключен к медленному интернет-соединению. Каждый файл делает отдельный запрос на хостинг сервера. Чем больше запросов поступает на сервер одновременно, тем выше нагрузка на него, а это негативно сказывается на скорости страницы.
Решением может стать кеширование браузера: оно сохраняет некоторые объекты локально в браузере пользователя. После первого посещения сайта постоянные элементы страниц сохраняются и при следующих обращениях берутся непосредственно из кеша браузера пользователя. Таким образом, нагрузка на сервер сокращается на 80%.
Технически задачу кеширования можно реализовать несколькими вариантами, в зависимости от типа сервера, сайта и т.д.техническое seo для автосалонов: оптимизация скорости загрузки страницы

Поместите CSS в хедере, а JS — в футере

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

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

Кроме этого, следует вынести таблицу со стилем в отдельный файл (традиционное название style.css), ведь если применять ее в каждом коде страницы, то это повлияет на общий вес кода и на скорость загрузки страницы.

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

Бесплатная консультация по техническому SEO-аудиту для вашего автосалона!

Введите номер телефона

Минимизируйте CSS и JS-файлы

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

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

Например:

Можно

написать

предложение

подобным

образом.


Или сделать это более привычным для нас способом.


Скорее всего, вы потратили больше времени на то, чтобы прочитать первое предложение, чем второе. Аналогично и браузеру потребуется больше времени и усилий для обработки длинного перечня инструкций.
“styles.css” (все, что относится к стилю оформления сайта — цвета, шрифты, размеры, и т. д.) — это тысячи строк с большим количеством пробелов между каждым обозначением стиля. Для браузера обработка такого количества информации —  тоже нагрузка. Одним из недостатков WordPress и других систем управления контентом заключается в том, что при каждой установке новых плагинов добавляются новые JS или CSS-файлы.

Однако, если вы объедините JavaScript- и CSS-файлы и поместите в одну строку, то браузер сможет обрабатывать их гораздо быстрее! Одна строка, вот и все. Это абсолютно не повлияет на их функциональность. Фактически вы уменьшаете время загрузки страницы, тем самым уменьшаете количество запросов на сервер. Посмотрите на скриншот ниже слева — это вид исходника. Справа — сокращенная версия того же кода. На первый взгляд может показаться кучей строк, но если бы на картинке было достаточно места, то все это выстроилось в одну линию.Техническое SEO для автосалонов:

Итак, как минимизировать код? Существует множество инструментов, в которых вы можете просто скопировать и вставить код, нажать кнопку “minify” и получить код, который вмещается в одну строку. Если вы используете WordPress, то WP Minify — отличный плагин, который автоматически сделает все это за вас.

Оптимизируйте изображения

Медиафайлы (изображения, видео) находятся в топе элементов сайта, замедляющих его загрузку, но тем не менее они также являются отличной возможность выделить себя! С помощью оптимизации изображений можно удалить несущественную информацию, которая в них хранится. Это уменьшает размер файла в зависимости от его места размещения на веб-сайте. Часто бывает, что изображения отображаются с меньшим размером, чем они подгружаются из базы данных. Это приводит к дополнительным затратам при загрузке сайта. Подобная ошибка вызвана автоматическим масштабированием больших изображений. Только представьте: исходный размер изображения 1920 х 800, а на сайте оно отображается в меньшем, например, 996 х 415, насколько больше места оно занимает.

Важный момент, о котором не следует забывать ни в коем случае — это прописывание мета-тегов изображений. Самые главные значения, которые следует прописать, — title (название картинки, которое высвечивается при наведении курсора) и alt (краткое описание картинки с добавлением ключевого слова, именно его считывают поисковые системы). Для чего это нужно? Для SEO-продвижения медиафайлов, чтобы они попали в поиск по изображениям.  

SEO-оптимизация изображений может повысить общую скорость загрузки страницы на 80 процентов.

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

техническая seo-оптимизация медиафайлов сайта автосалона

Сжатие изображений

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

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

Без потерь: изображения, сохраненные в формате сжатия без потерь, остаются качественными независимо от того, сколько раз их сжимали и восстанавливали. Сжатие без потерь выдает более высокое качество файлов, чем с потерями, но они все равно остаются “тяжелыми”. RAW, BMP, GIF и PNG — форматы изображений для компрессии без потерь.

Для эффективного продвижения логотипы, иконки стоит оставлять в формате .svg  или .png, а изображения для публикаций и товаров -.jpg.

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

Google рекомендует использовать WebP — формат сжатия изображений, который обеспечивает превосходную компрессию без потерь и с потерями для публикаций в интернете. С его помощью можно получить более качественные изображения даже при минимальном размере файла. Например, по сравнению с PNG формат WebP на 26% лучше сжимает картинки без потерь и на 25-34% с потерями, чем JPEG.техническая seo-оптимизация сайта автосалона

Используйте CDN (сеть доставки контента)

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

Инструменты для проверки скорости

Но как же определить слабые места своего сайта? Сделать это можно с помощью следующих инструментов:

  • Google PageSpeed InsightsЭтот сервис предназначен для оценивания скорости любой веб-страницы как на десктопах, так и на мобильных устройствах (по шкале от 0 до 100). После проведенного теста он укажет вам на ошибки, которые нужно исправить для улучшения скорости загрузки страниц.
  • Pingdom Tools — еще один сервис замера скорости сайта. Вставьте выделенный URL вашего сайта в строку для анализа, и вы получите данные о времени загрузки страницы, документа и количестве запросов для формирования страниц. Выступает в качестве вспомогательного инструмента к Google PageSpeed Insights.
  • WhichLoadFaster. Инструмент для сравнения своего сайта и конкурента, например. Он продемонстрирует какой сайт быстрее и во сколько раз.

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

Итог

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

0 ответы

Ответить

Хотите присоединиться к обсуждению?
Не стесняйтесь вносить свой вклад!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *