Как оптимизировать скорость загрузки сайта

1. Как проверить скорость сайта?
2. Как улучшить скорость загрузки?
3. Следите за заметкой Google Page Speed ​​Insights и следуйте инструкциям
5. Оптимизация изображения - сжатие
6. Использование кеша браузера
7. Удалить JavaScript и CSS, блокирующие рендеринг в контенте выше границы
8. Сжатие Java Script, CSS и HTML
9. Используйте инструмент Pingdom
10. Выбирайте выделенный хостинг и избегайте общего хостинга
11. Используйте функцию AMP для оптимизации загрузки с мобильных устройств.

Представьте себе один прекрасный день, когда вы решите узнать цены на билеты для важной поездки. Вы заходите в Google, вводите ключевое слово «дешевые авиабилеты», и реклама привлекает ваше внимание. При доступе через мобильное устройство проходит 5 секунд и ничего на странице не открывается. Что бы вы сделали?

• Вариант A: возврат в Google результат для получения другого сайта;

• Вариант Б: я бы так нервничал, что прекратил поиск и закрыл браузер;

• Вариант C: выход в час, но повторный доступ к сайту позже;

• Вариант D: будет иметь самое большое терпение в мире и будет ждать загрузки страницы;

Я уверен, что большинство читателей этого текста выберут варианты A и B, в конце концов, это разочаровывает, что сайт загружается долго.

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

Как проверить скорость сайта?

Скорость загрузки сайта является одним из факторов, способствующих ранжированию в поисковых системах. Для проверки скорости вашего сайта в Интернете есть несколько инструментов, таких как Google PageSpeed ​​Insights, Pingdom или GTmetrix.

Как улучшить скорость загрузки?

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

Следите за заметкой Google Page Speed ​​Insights и следуйте инструкциям

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

Доступ к Google Page Speed ​​Insights и введите URL-адрес страницы, которую вы хотите оценить.

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

В качестве примера давайте рассмотрим информацию, касающуюся веб-сайта авиакомпании.

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

Основываясь на истории просмотра браузера Chrome, Google оценивает две категории оптимизации скорости загрузки, ориентированные на взаимодействие с пользователем, FCP и DCL. Давайте поймем, что они имеют в виду?

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

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

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

Получить бесплатный PDF

Оптимизация изображения - сжатие

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

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

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

Мое предложение состоит в том, чтобы использовать инструмент Tinny PNG. Это очень просто

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

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

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

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

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

Подробнее об этом 5 продвинутых стратегий ремаркетинга в Google Ads Posting Lisane Andrade Увеличьте CTR вашего сайта до 80% с помощью структурированного размещения данных Андре Паскоа Сайт Клиники SEO Вебинар записан 25 июля 2018 г. SEO Javascript - Что нужно знать об индексации сайтов Javascript Post Vitoria Maldonado

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

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

На серверах Apache через .htaccess можно определить срок действия кэша для каждого типа файлов сайта.

Для тех, кто работает с Wodpress, существуют плагины, облегчающие этот процесс, такие как WP Total Cache, который, помимо включения кэширования, уже выполняет сжатие CSS и Java Script, например.

Удалить JavaScript и CSS, блокирующие рендеринг в контенте выше границы

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

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

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

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

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

Мой сайт может служить примером о CSS оптимизации Если вы проанализируете его исходный код, сгенерированный Blogger (из Google), вы увидите только два внешних CSS-файла, остальные - встроенные.

Сжатие Java Script, CSS и HTML

Знаете ли вы, что пробелы, пустые строки и комментарии увеличивают размер файлов Java Script, CSS и HTML? Важно сжать или, скорее, устранить ненужный контент в таких файлах. В зависимости от размера и количества файлов, это имеет огромное значение в скорости загрузки.

Используйте инструмент Pingdom

Pingdom - это полезный инструмент для оценки производительности сайта, который генерирует полный отчет о чтении всех файлов и ресурсов сайта, с примечаниями о критических проблемах, медленными файлами (между JS, CSS, изображениями, HTML и т. Д.). сервер, среди других аспектов.

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

Образец результата теста:

Выбирайте выделенный хостинг и избегайте общего хостинга

Могу сказать, что это одна из основных причин, вызывающих задержки при загрузке страниц.

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

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

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

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

Получить бесплатный PDF

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

AMP означает «Ускоренные мобильные страницы», проект, в котором участвуют Google, LinkedIn, Twitter и Pinterest. Цель состоит в том, чтобы создать HTML-страницу по умолчанию, чтобы она быстрее загружалась на мобильных устройствах.

AMP - это набор настроек HTML, которые оптимизируют загрузку страниц на мобильных устройствах. О применении AMP на вашем сайте стоит уникальная статья на эту тему. Для начала рекомендую прочитать статью Топ 10 реализаций AMP, написанных Еленой Терентьевой , опубликовано в SEM Rush 11 октября 2017 года. Как работает AMP прямо на сайте проекта.

В основном, AMP оптимизирует поведение Java Script, CSS, загрузку наиболее важных ресурсов, среди других аспектов.

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

Похожие

Комментарии