17 советов по ускорению вашего сайта в 2023 году

17 советов по ускорению вашего сайта в 2023 году

20 минут чтения

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

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

Итак, как вы это делаете? Начните с запуска теста Google PageSpeed, чтобы увидеть, какое место занимает ваш сайт (там вы также получите несколько предложений по ускорению своего сайта). Затем начните вносить эти изменения, чтобы сделать ваш сайт молниеносно быстрым в этом году.

1. Проводите регулярные тесты скорости

speedtest

Тест скорости — это не только то, с чего нужно начать, чтобы убедиться, что ваш сайт работает быстро; это должно быть частью вашего регулярного обслуживания сайта.

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

Бонус здесь в том, что ваш сайт будет работать быстро, а также есть преимущество в поисковых системах. (Скорость имеет значение, когда речь идет о создании отличного пользовательского интерфейса)

2. Оптимизируйте контент для скорости

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

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

Сначала попробуйте эти вещи:

  • Используйте выдержки или теги «Читать больше» (WordPress), чтобы каналы блога включали короткие фрагменты сообщений со ссылкой на полный текст.
  • Разделите длинные статьи или посты на несколько страниц (Часть 1, Часть 2 и т. д.)
  • Удалите комментарии из содержимого страницы, чтобы они находились на своих местах.
  • Используйте ссылки, чтобы разбить контент, такой как фотогалереи, загружаемые файлы и т. д., чтобы на одной странице не было нескольких тяжелых элементов.

3. Не делайте хотлинков

Вы делаете хотлинк? Немедленно остановитесь.

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

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

  • Используйте CDN (подробнее об этом ниже)
  • Отключить щелчок правой кнопкой мыши на изображениях
  • Измените файл htaccess, чтобы отключить хотлинкинг.

4. Не усложняйте вещи

простая работа

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

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

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

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

5. Используйте сжатие

gzip

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

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

С сайта gzip.org: «gzip — это утилита сжатия данных без потерь для одного файла/потока, в которой результирующий сжатый файл обычно имеет суффикс .gz. gzip также относится к соответствующему формату сжатых данных, используемому утилитой».

Gzip включается путем добавления небольшого кода в ваш файл htaccess. (Вы также можете скачать плагин, но это не обязательно.)

6. Рассмотрим CDN (сеть доставки контента)

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

CDN размещает файлы в сети серверов, а не в одном месте. Таким образом, когда кто-то посещает ваш веб-сайт, данные загружаются с ближайшего к ним сервера, что снижает нагрузку на сервер, а также защищает ваш веб-сайт от скачков трафика или DDoS-атак. (Это беспроигрышный вариант.)

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

7. Очистите свою базу данных

чистая база данных

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

Очистите это.

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

Меньшая и легкая база данных будет возвращать файлы быстрее. (Это также облегчает и упрощает управление резервными копиями.)

8. Минимизируйте TTFB (время до первого байта)

Чем быстрее контент отображается для пользователя, тем быстрее загружается сайт, верно? Ну… вроде.

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

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

9. Начните кэшировать сейчас

страница отчета

Google ставит кэширование на первое место в списке рекомендаций:

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

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

Хотя кеширование мало что дает новым посетителям, оно отлично экономит скорость для вернувшихся посетителей (или людей, просматривающих несколько страниц вашего сайта).

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

compressor

Вы сохраняете изображения для Интернета, верно?

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

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

Вы можете сделать все это, оптимизировав себя в программном обеспечении, таком как Adobe Photoshop, или попробовать бесплатный онлайн-инструмент, такой как Compressor.

11. Встраивайте большие файлы (например, видео)

embed video

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

YouTube предназначен для размещения и доставки видеоконтента на высоких скоростях.

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

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

12. Будьте осторожны с JavaScript

js-code

Большинство интересных вещей, которые происходят на вашем веб-сайте, вероятно, являются продуктом JavaScript. И он может стать тяжелым. Но это нормально, если вы позаботитесь о том, как вы обрабатываете запросы и загрузки JS.

  • Используйте асинхронную загрузку для файлов JavaScript: это ускоряет страницы, поскольку файлы загружаются одновременно, а не сверху вниз. Изящный трюк с асинхронной загрузкой заключается в том, что если один файл застревает или останавливается, он не тормозит остальные; эти сценарии будут продолжать загружаться и функционировать.
  • Отложите загрузку некоторых JS-файлов: сообщите некоторым JS-файлам, особенно большим файлам, которые не влияют на непосредственную функциональность, загрузку после того, как все остальные элементы будут завершены. Вы можете научиться делать это здесь.
  • Оптимизируйте и минимизируйте: Это имеет смысл — файлы меньшего размера будут загружаться быстрее. Не забудьте минифицировать этот JS.
  • Поместите JavaScript в конец файлов: другие элементы и JS плохо загружаются вместе. Решите эту проблему, разрешив загрузку HTML-содержимого перед JavaScript.

13. Удалите ненужные редиректы

redirect-map

Вы все еще перенаправляете страницы с двух редизайнов назад? Останови это. Это убивает время загрузки.

Хотя некоторые редиректы являются необходимым злом, сведите их к минимуму.

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

14. Выберите правильный хостинг

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

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

Не знаете, с чего начать с хостинга? Вот разбивка семи вариантов хостинга, созданных для скорости.

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

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

Лучшее решение — использовать комбинированные файлы, чтобы уменьшить количество запросов. Это означает размещение всего CSS в одной таблице стилей или комбинирование скриптов, где это возможно.

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

16. Удалите ненужные плагины

no-plugins

Ничто так не утяжеляет сайт, как куча постоянно работающих плагинов. (Вам нужен плагин Google Analytics?)

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

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

17. Включить ленивую загрузку

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

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

По сути, это модный вариант кэширования.

Заключение

Что вы делаете, чтобы убедиться, что ваш сайт создан для скорости?

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

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

0 0 голоса
Рейтинг статьи