Терпение конечно полезное качество, но не каждый им обладает. Особенно это касается посетителей вебсайтов, которые долго грузятся. Для пользователей важна скорость загрузки сайта и когда сайт тормозит с ответом, пользователь вряд ли вернется назад.
Улучшение скорости вашего веб-сайта важно не только для конечного пользователя, но также и для ранга поисковой оптимизации (search engine rankings). В прошлом апреле Google объявил, что они включают скорость сайта в алгоритм расчета поискового ранга (search ranking algorithms). Хотя данное новшество менее весомо по отношению к другим показателям ранга, тем не менее, не стоит забывать о нем, планируя SEO для веб-сайта.

Вот несколько советов по увеличению скорости загрузки веб-сайта.

1. Проверьте текущую скорость веб-сайта

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

  • Pingdom предлагает простое в использовании тестирование скорости имитируя то, как страница загружается браузером.
  • Page Speed бесплатный Firefox add-on, который помогает оценивать быстродействие. А также предлагает дельные советы по ускорению загрузки.
  • Web Page Test другой великолепный инструмент, который показывает скорость , а также то, как вебсайт отображается в других браузерах.

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

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

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

Вот несколько ресурсов по оптимизации изображений:

3. Не масштабируете изображение

Не изменяйте размер изображения при помощи атрибутов width и height тега <img>. Если у вам необходимо изображение 100x100px, а у вас есть 700x700px, то используйте программы типа Photoshop или онлайн инструменты, чтобы получить изображение необходимого размера. Меньший размер файла требует меньше времени на загрузку.

4. Сжимайте и оптимизируйте ваш контент

Сжатие контента вашего сайта может существенно уменьшить скорость загрузки. При использовании HTTP сжатия, данные всей страницы посылаются в виде одного небольшого файла, вместо запроса всех файлов по отдельности. Для подробной информации можете ознакомится со статьей на википедии HTTP Compression. Вы также можете оптимизировать и сжать файлы JavaScript и CSS путем объединения и минимизации источника кода.

5. Помещайте обращение к таблицам стилей в <head>

Записывая ваши таблицы стилей в <head> секцию <html> документа, вы помогаете странице грузится быстрее т.к. это позволяет подгружать стили прогрессивно, постепенно. Кроме этого, подобное оформление соответствует W3C стандартам.

6. Помещайте обращение к скриптам внизу.

Браузеры могут загрузить только два компонента на один hostname за один раз. Если вы добавите ваши скрипты вверху <html> документа, то это заблокирует загрузку всего, что находится ниже пока не подгрузятся скрипты. Чтобы избежать данной ситуации, помещайте обращение к скриптам к конце <html> документа, прямо перед закрывающим тегом </body>. Таким образом создается впечатление, что страница грузится быстрее (посетитель изучает контент сайта пока скрипты себе грузятся).

7. Помещайте  JavaScript и CSS во внешние файлы.

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

8. Минимизируйте  HTTP запросы.

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

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

Если у вас есть несколько таблиц стилей и JavaScript библиотек,  их можно объединить в один файл.

Часто дополнительные таблицы возникают в связи с написанием дополнительных стилей для IE6,7, 8. В данной статье приведенны способы как избежать создание лишних CSS файлов.

9. Кешируйте вашу веб-страницу.

Если вы используете систему управления сайтом (content management system) которая динамически генерирует вашу веб-страницу, вам  следует статично кешировать вашу веб-страницу и запросы к базам данных, так как это снизит как запросы так и скорость обработки. Кешируя страницу, вы сохраняете её статичную версию для показа её пользователю, вместо того, чтобы каждый раз эта страница загружалась с нуля.

Для WordPress, проверьте WP Super Cache и W3 Total Cache (также ознакомтесь с WordPress кодексом, посвященному оптимизации/кешированию WordPress). У Drupal core присутствует естественное кеширование.

10. Уменьшайте 301 редирект

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

Вывод

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

Источник