Аналитика

10 советов как сократить время загрузки сайта

30 апреля 2017, 20:54

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

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

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

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

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

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

1. Проверить текущую скорость загрузки сайта

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

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

Pingdom предлагает простой инструмент для тестовой проверки скорости всего вашего сайта, он имитирует скорость загрузки страницы в веб-браузере. На главной странице в предлагаемое окошко вводите адрес своего сайта и нажимаете на кнопку «Test now». Через несколько секунд ресурс выдает вам информацию по загрузке всех страниц вашего сайта. Результаты разделены по цветам: зеленая — наилучшая загрузка, желтая — обратите внимание, а красный свет — очень медленная загрузка.

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

Как улучшить скорость загрузки страницы

Web Page Test еще один замечательный инструмент, который покажет вам скорость и производительность вашего сайта в различных браузерах. Правда для России он покажет вам в Iexplore8, а для других стран в IE7-9, Chrome. Тестировать можно как простые текстовые страницы, так и захват видео.

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

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

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

3. Как уменьшать изображения

Старайтесь не использовать более крупное изображение, чем нужно, просто потому, что вы можете установить ширину (width) и высоту (height) в атрибутах элементов HTML.

Если вам нужно изображение 100x100px, а у вас есть размер изображения 700x700px, используйте графический редактор для уменьшения изображения, как Photoshop или любые другие веб-редакторы изображений, чтобы изменить размер изображения до нужного. Это уменьшает размер файла изображения, тем самым помогая сократить время загрузки страницы.

4. Сжатие и оптимизация Вашего контента

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

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

5. Разместите стили в шапке страницы

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

6. Разместите ссылки на сценарии внизу страницы

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

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

7. Место JavaScript и CSS во внешних файлах

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

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

8. Минимизация HTTP-запросов

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

Если у вас несколько стилей и JavaScript библиотек, рассмотрите вопрос об объединении, чтобы сократить количество запросов HTTP.

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

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

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

Для WordPress, используйте плагин WP Super Cache и W3 Total Cache(также прочитайте эту запись WordPress Кодекс об оптимизации / кэширование WordPress ).

Ядро Drupal имеет встроенную систему кэширования.

10. Сократите 301 редирект

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

Если возможно, старайтесь не использовать 301 редирект.