От 3 до 4 секунд – столько готов ждать среднестатистический посетитель загрузки страницы сайта. Если ресурс за это время не успевает загрузиться, с вероятностью 70% он теряет из-за этого трафик. Существует несколько способов ускорить отображение даже для страниц с тяжелыми программными или графическими элементами. Сжатие кода HTML – один из самых простых в их списке. Потому с него всегда удобнее начать.

Кроме юзабилити

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

Согласно майскому отчету Google (в лице Джона Мюллера, ведущего аналитика компании), поисковый сервис может занижать позиции сайта за медленную загрузку, и часто это делает. Плюс, не стоит забывать о массовом увлечении мобильными версиями и кодами, дружественными мобильным версиям сайта. Для формата mobile большой код – это серьезная проблема.

Как уменьшить HTML и вес страницы

Хорошая новость в том, что уменьшить HTML можно и самостоятельно, имея минимальные навыки веб-мастера. Работа предстоит рутинная, но не слишком долгая. Первые 8 шагов:

  • «чистка» – удаление всех данных, которые не используются или не должны отображаться, но увеличивают общий вес страницы;
  • оптимизация рекламных блоков;
  • удаление/замена нефункциональных анимационных компонентов (проверить, что из загруженного на страницу, может не поддерживаться другими браузерами, и найти им менее тяжелую замену или отказаться от них);
  • убрать переадресацию с целевой страницы вида site.ru – www.site.ru или site.ru – m.site.ru (для мобильных);
  • сжать все графические изображения до минимума (на первом этапе будет много работы, остальную графику и инфографику при добавлении уже можно заранее оптимизировать, чтобы впоследствии не тратить массу времени на «похудение»);
  • оформить элементы кода в CSS (проще будет работать с дублями);
  • кэшировать данные;
  • сжать текстовые файлы.

Для небольшого ресурса, который публикует актуальную информацию с релевантными ссылками и пользуется качественными кодерами для сжатия, этого достаточно. По завершении работы остается только проверить вес кода и убедиться, что меньше сделать его уже нельзя. Новые материалы следует сжимать заранее – ежегодно сайт растет на 20–30%, это нужно учитывать.

Дополнительные инструменты для уменьшения HTML кода

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

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

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