Оптимизация скорости сайта: от 0 до 100 за 10 быстрых шагов

  1. 1. Используйте кеширование браузера эффективно
  2. 2. Заставьте страницы работать с меньшим количеством элементов
  3. 3. Сжатие файлов вашего сайта
  4. 4. Оптимизируйте код страниц
  5. 5. Оптимизируйте свои изображения
  6. 6. Разместите свой сайт на быстром сервере.
  7. 7. Размещайте большие файлы на внешних платформах
  8. 8. Плечо ленивой загрузки
  9. 9. Секретный фактор: пользовательское оборудование
  10. 10. Проверяйте скорость своего сайта регулярно

Все любят быстро загружаемый сайт

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

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

  • Google рекомендует максимум 3 секунды . Данные показывают, что большинство сайтов все еще очень далеки от этого, хотя продолжают улучшаться.
  • Поскольку время загрузки страницы увеличивается с 1 до 5 секунд , вероятность отказов увеличивается на 90% . Естественно, это еще выше для более длительного времени загрузки.
  • В настоящее время большинство мобильных целевых страниц загружают весь свой контент в среднем за 7 секунд .

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

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

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

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

Ваш файл будет выглядеть примерно так:

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

  • Сделайте ваши перенаправления кэшируемыми. Перенаправления плохо влияют на скорость загрузки, но иногда они являются неизбежным злом. Когда избавиться от них не вариант, убедитесь, что они, по крайней мере, могут быть добавлены в кеш.
  • Используйте тот же URL для ресурса, который часто используется. Когда вы ссылаетесь на один и тот же ресурс несколько раз - будь то на одной или нескольких страницах - лучше использовать один и тот же URL-адрес. Это относится к гиперссылкам, перенаправлениям и ссылкам для загрузки объектов на страницу, таких как изображения. Почему один URL лучше, чем несколько разных? Потому что кеш не может сказать, указывают ли разные URL на одно и то же; все они будут кэшироваться отдельно. Если вы будете последовательны, ресурсов будет меньше в кеш, и браузеры смогут загружать их быстрее.
  • Избегайте использования строк запроса в статических URL. Ссылки с «?» В них не могут быть кэшированы. Сохраняйте запросы для динамических URL.

2. Заставьте страницы работать с меньшим количеством элементов

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

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

3. Сжатие файлов вашего сайта

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

Включите Gzip, чтобы оптимизировать скорость работы сайта и сократить время отклика сервера на 70%. Так просто, и все же он творит чудеса для производительности сайта.

4. Оптимизируйте код страниц

Чтобы отобразить веб-страницу, ваш браузер должен сначала проанализировать свой код. Очевидно, что страница с большим количеством кода требует больше времени для загрузки. Также верно и обратное: если вы удалите весь избыточный код и максимально упростите его, вы можете сократить время загрузки страницы. Хорошим примером такой практики являются ускоренные мобильные страницы (AMP): из-за минимизации кода HTML и CSS и полного отсутствия Javascript страницы, оптимизированные таким образом, загружаются практически мгновенно.

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

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

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

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

С изображениями можно ускорить загрузку веб-сайта: укажите их высоту и ширину в теге <img>. Таким образом, браузер выделит место для изображений до их загрузки. Если вы не укажете размеры, браузер потратит некоторое время на перемещение элементов, чтобы освободить место для изображений после загрузки остальной части страницы, что заставит пользователей выглядеть так, как будто страница еще не готова.

6. Разместите свой сайт на быстром сервере.

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

Еще один отличный способ ускорить веб-сайт - разместить его в сети доставки контента (или CDN). Один сервер может предложить только такую ​​высокую скорость; объедините несколько из них в сеть, и вместе они намного более эффективны в предоставлении контента без задержек.

7. Размещайте большие файлы на внешних платформах

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

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

8. Плечо ленивой загрузки

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

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

9. Секретный фактор: пользовательское оборудование

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

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

10. Проверяйте скорость своего сайта регулярно

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

Проверьте свои целевые страницы в WebCEO Page Speed ​​Insights чтобы увидеть плоды оптимизации вашего сайта. Инструмент оценит скорость страниц по шкале от 0 до 100, а также даст полезные советы по дальнейшему сокращению времени их загрузки. Если оценка будет низкой или внезапно упадет после нескольких проверок, это будет вашим сигналом к ​​действию.

Если оценка будет низкой или внезапно упадет после нескольких проверок, это будет вашим сигналом к ​​действию

[Всего: 0 Среднее: 0/5]

Что такое хорошее время загрузки?
Как вы можете извлечь максимальную пользу из кэширования браузера?
Почему один URL лучше, чем несколько разных?
Ссылки с «?
Как вы узнаете скорость загрузки вашего сайта без ее измерения?