Это не вопрос с подвохом, но достаточно ли быстр ваш сайт? Время загрузки страницы может повлиять на все — от того, как долго пользователи остаются на вашем сайте (или видят ли они контент), до рейтинга в поиске и конверсий в целом.
Скорость имеет значение на двух фронтах – для настольных компьютеров и мобильных устройств, причем мобильная скорость важна как никогда. Ваш сайт должен загружаться не просто быстро, он должен загружаться быстро на всех возможных устройствах.
Но как этого добиться? Начните с запуска теста Google PageSpeed, чтобы иметь представление на каком уровне загрузка вашего сайта (там вы также получите несколько предложений по ускорению страниц). Затем приступайте к внесению изменений, чтобы сделать ваш сайт молниеносным.
Итак, вот несколько советов, которые помогут вам справиться с данной задачей.
1. Регулярно проводите тесты скорости
Проверка скорости — это не просто первый пункт в списке, с которого нужно начать, чтобы убедиться, что ваш сайт работает быстро. Это должно быть частью обслуживания вашего сайта на регулярной основе.
Скорость может меняться со временем в зависимости от того, что вы добавили или изменили на веб-сайте, из-за ухудшения технологии или даже устаревших тем и плагинов. Вот почему важно регулярно проводить тестирование и вносить необходимые коррективы.
Дополнительный бонус заключается в том, что ваш сайт будет работать не только быстро, но и получит преимущества в поисковых системах: скорость имеет значение, когда дело касается пользовательского опыта.
2. Оптимизируйте контент для повышения скорости
То, как вы структурируете контент — это одна из мелочей, которая может помочь повысить скорость работы сайта, а также читабельность.
Данный пункт может быть особенно полезен для блоггеров или веб-сайтов с длинным контентом.
Попробуйте для начала следующее:
- Используйте выдержки или теги «Подробнее» (WordPress), чтобы в лентах блогов были короткие фрагменты постов со ссылкой на полный текст.
- Разделите длинные статьи или посты на несколько страниц (Часть 1, Часть 2 и т. д.)
- Удаляйте комментарии из содержимого страницы, чтобы они находились в своем собственном месте.
- Используйте ссылки для разделения контента, такого как фотогалереи, загружаемые материалы и т.д., чтобы на одной странице не было нескольких тяжелых элементов одновременно.
3. Откажитесь от хотлинков
Балуетесь хотлинками? Остановись прямо сейчас.
Хотлинкинг или копирование источника изображения с одного веб-сайта на другой снижает скорость. И это не просто вредно для скорости, во многих случаях это неэтично и может быть связано с юридическими или авторскими правами. Так что просто не делайте этого.
Вам необходимо, чтобы изображения загружались с вашего хостинга и сервера. Более того, вы можете предпринять дополнительные шаги, чтобы другие пользователи не могли создавать хотлинки с вашими изображениями, тем самым снижая скорость. Вот как это сделать:
- Используйте CDN (подробнее об этом читайте ниже)
- Отключить клик правой кнопкой мыши по изображениям
- Измените файл htaccess, чтобы отключить хотлинкинг.
4. Не усложняйте
Один из лучших способов сохранить ваш сайт живым и удобным — сделать его простым. Тот же принцип, который применим к дизайну веб-сайта, применим и к функциональности.
Одной из ловушек дизайна веб-сайта может стать добавление слишком большого количества эффектов и функций, которые значительно увеличивают время загрузки. Вам так сильно нужны причудливые анимации? А слайдер с видео на главной странице? Как насчет трех плагинов для выполнения чего-то, что можно было бы сделать с помощью небольшой пользовательской разработки?
Все это может замедлить работу вашего сайта. Удаление ненужных элементов и функций способно оказать огромное влияние на скорость и, следовательно, на удобство использования.
Если вы не знаете, с чего начать, аналитика может предоставить свежие данные, которые помогут вам сделать выбор. Начните со слайдера. Кто-нибудь нажимает на него? Если нет, то это может быть показателем того, что статическое изображение отлично подойдет. Ищите маленькие подсказки во всем дизайне вашего сайта, чтобы упростить и ускорить его.
5. Сожмите все, что можно
Сжимайте файлы веб-сайта, чтобы сэкономить еще больше пропускной способности и сократить время загрузки. Сжатие веб-сайта использует формат 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. Оптимизируйте изображения
Вы сохраняете изображения для Интернета, верно?
Трудно поверить, что многие владельцы веб-сайтов до сих пор загружают на свои страницы полноразмерные изображения. Этих убийц скорости.
Обрезайте изображения до нужной формы и размера перед их загрузкой. Максимально сжимайте размеры файлов без ущерба для визуальных элементов. Сохраняйте в небольших форматах файлов — JPG неизменно сохраняются меньше, чем PNG, поэтому используйте первый формат файла, если вам не нужна прозрачность последнего.
Вы можете сделать все это в программном обеспечении, таком как Adobe Photoshop, или попробовать бесплатный онлайн-инструмент, такой как Compressor.
11. Встраивайте большие файлы (например, видео)
Огромные файлы могут высосать пропускную способность из вашего сайта. К тому же, ими может быть трудно управлять и сжимать.
Удалите эти файлы со своего веб-сайта и используйте медиа-вставки для извлечения этой информации с внешних платформ хостинга.
Подумайте об этом так: YouTube создан для размещения и доставки видеоконтента на высокой скорости. Вы не можете сделать это лучше, чем этот монстр. Итак, используйте его в своих интересах и храните видеофайлы на YouTube (Vimeo или другой видеоплатформе по вашему выбору) и встраивайте контент в свой дизайн. Пользователи не заметят разницы… но они заметят, насколько быстрее загружается ваш сайт.
12. Будьте осторожны с JavaScript
Большинство интересных вещей, которые происходят на вашем веб-сайте, вероятно, являются продуктом JavaScript. И он может стать тяжелым. Но это нормально, если вы позаботитесь о том, как вы обрабатываете запросы и загрузки JS.
- Используйте асинхронную загрузку для файлов JavaScript: это ускоряет страницы, поскольку файлы загружаются одновременно, а не сверху вниз. Изящный трюк с асинхронной загрузкой заключается в том, что, если один файл застревает или останавливается, он не тормозит остальные; эти сценарии будут продолжать загружаться и функционировать.
- Отложите загрузку некоторых JS-файлов: укажите некоторым JS-файлам, особенно большим, которые не влияют на непосредственную функциональность, загрузку после того, как все остальные элементы будут завершены.
- Оптимизируйте и минимизируйте: это имеет смысл — файлы меньшего размера будут загружаться быстрее. Не забудьте минифицировать и JS.
- Поместите JavaScript в конец файлов: другие элементы и JS плохо загружаются вместе. Решите эту проблему, разрешив загрузку HTML-содержимого перед JavaScript.
13. Устраните ненужные редиректы
Вы все еще делаете редиректы на страницы, созданные два года назад? Прекратите. Это убивает время загрузки.
Хотя некоторые перенаправления являются необходимым злом, сведите их к минимуму.
Используйте такой инструмент, как Redirect Mapper, чтобы выяснить, какие перенаправления активны на вашем сайте, и устраните те, о которых вы не знали. Двигаясь вперед, подумайте об обновлении устаревших страниц, а не о добавлении новых страниц с аналогичным контентом. Это намного лучше для поисковой оптимизации, и все эти ссылки будут продолжать работать!
14. Выберите правильный хостинг
Правильная учетная запись хостинга может повысить или снизить скорость. Если вы перепробовали многие другие исправления из данного списка и все еще испытываете проблемы со скоростью, возможно, виноват ваш хост.
При таком большом выборе может быть сложно найти лучший план хостинга за ваши деньги. Когда дело доходит до хостинга, построенного на скорости, ищите вариант выделенного сервера. Предпочтительным выбором для большинства владельцев веб-сайтов является хостинг VPS, который обеспечивает более быстрое время загрузки, но вам не нужно управлять хостингом самостоятельно.
15. Сведите к минимуму HTTP-запросы
Количество элементов страницы, которые необходимо загружать каждый раз, когда пользователь заходит на ваш сайт, значительно влияет на время загрузки. Это включает в себя все, от изображений до таблиц стилей и сценариев, при этом до 80% времени загрузки может быть учтено с помощью этих интерфейсных компонентов.
Лучшим решением является использование объединенных файлов для уменьшения количества запросов. Это означает размещение всего CSS в одной таблице стилей или объединение сценариев, где это возможно.
Все сводится к облегченному коду и лучшим практикам. Чем больше каждый браузер должен прочитать, тем больше времени требуется для загрузки.
16. Удалите ненужные плагины
Ничто так не отягощает веб-сайт, как куча постоянно работающих плагинов. Вам действительно нужен плагин Google Analytics?
По возможности избавьтесь от избыточности плагинов. Удалите плагины, которые не обновляются регулярно и не работают с текущими версиями среды вашего веб-сайта.
И для вещей, которые вы можете сделать вручную … прекратите использовать плагины. Они просто замедляют работу вашего сайта.
17. Включите ленивую загрузку
Что, если элементы над прокруткой будут загружаться немного быстрее, чем все остальное? Это один из тех «трюков», которые могут сработать для более тяжелых и сложных страниц.
Ленивая загрузка может стать идеальной для страниц с длинной прокруткой. Она загружает контент сверху вниз и отлично работает, если на вашей странице есть тонна изображений под прокруткой (даже если это противоречит некоторым другим советам, изложенным здесь). Хорошо, когда есть варианты, верно?
По сути, это необычный вариант кэширования.
В заключение
Соблюдение рекомендаций по скорости работы для настольных компьютеров и мобильных устройств влияет не только на то, как быстро пользователи смогут просматривать ваш веб-сайт. Это также влияет на рейтинг сайта, поисковую оптимизацию и показатели конверсии. Как пользователь должен покупать товар, если страница не загружается?
Возьмите за правило регулярно проводить чистку кода и оптимизацию сайта, и даже если вы будете делать только одно из этих действий в месяц, вы начнете видеть результаты. Удачи!
Всем успешной работы и творчества!
0 комментариев