Как работает сжатый HTML и зачем он вам может понадобиться
Если вы запускаете веб-сайт, вы уже должны знать, как использовать правильные форматы изображений и оптимизировать изображения для Интернета. Тем не менее, в то время как сжатие изображений является хорошо известной практикой, сжатие HTML, как правило, упускается из виду, и это позор, потому что преимущества того стоят.
В этой статье мы рассмотрим два основных метода сжатия HTML-файлов, почему HTML-файлы следует сжимать и как это сделать.
Сжатие и минимизация
Что касается оптимизации HTML-файлов, существует два основных метода: сжатие и минификация . На первый взгляд они звучат похоже, но на самом деле это две разные техники, так что не путайте их.
Минификация
Минификацию можно рассматривать как удаление ненужных символов и строк в исходном коде. Подумайте об отступах, комментариях, пустых строках и т. д. Ничего из этого не требуется в HTML — они существуют для облегчения чтения файла.
Обрезка этих деталей может уменьшить размер файла, ничего не затрагивая.
Пример HTML-страницы:
Ваш заголовок
Это заголовок
Отправьте мне письмо по адресу [email protected].< /p>
Это новый абзац!
Это новый абзац, выделенный жирным шрифтом и курсивом.
Пример HTML-страницы, уменьшенный:
Здесь ваш заголовок Это заголовок
Отправьте мне письмо по адресу [email protected].
Это новый абзац!
< strong>Это новый абзац, выделенный жирным шрифтом и курсивом.
Исходный размер: 354. Уменьшенный размер: 272.
Экономия: 82 (23,16%).
Многие веб-разработчики и владельцы сайтов резервируют минимизацию только для файлов JS и CSS, но эта устаревшая практика является ошибкой. Минимизация HTML также важна.
Еще в 2000-х инструменты для минификации были редкостью. Вам приходилось вручную минимизировать файлы каждый раз, когда что-то менялось. Поскольку файлы HTML изменяются чаще, чем файлы JS и CSS, в то время было слишком утомительно каждый раз минимизировать их. В наше время это спорный вопрос.
Сжатие
Когда пользователи посещают ваш веб-сайт, они используют протокол HTTP. Браузер отправляет запрос на ваш веб-сервер для определенной страницы, ваш веб-сервер находит страницу, а затем отправляет содержимое этой страницы обратно в браузер посетителя.
Но поскольку протокол HTTP поддерживает сжатие, ваш веб-сервер может сжать страницу перед ее отправкой посетителю (при условии, что сжатие включено в настройках вашего сервера), а затем браузер посетителя может распаковать страницу обратно в исходное состояние.
Наиболее распространенной схемой сжатия является GZIP , который представляет собой формат файла, использующий алгоритм сжатия без потерь, называемый DEFLATE.
Алгоритм ищет повторяющиеся вхождения текста в HTML-файле, затем заменяет эти повторяющиеся вхождения ссылками на предыдущее вхождение. Каждая ссылка — это просто два числа: как далеко назад находится ссылка и на сколько символов мы ссылаемся.
Рассмотрим такую строку текста (пример взят с веб-сайта GZIP):
Бла-бла-бла-бла-бла.
Алгоритм распознает следующее повторение:
Б{лах б} {лах б} {лах б} {лах б}лах. Первое вхождение — это наша ссылка, так что оставьте его таким:
Бла-б{ла-бла} {ла-б} {ла-бла}. Второе вхождение ссылается на первое вхождение, которое отстает на пять символов и имеет длину в пять символов:
Бла б[5,5]{лах б}{лах б}лах. Но в этом случае алгоритм распознает, что следующее вхождение представляет собой ту же последовательность символов, поэтому он увеличивает длину ссылки еще на пять:
Бла б[5,10]{лах б}лах.
И еще:
Бла б[5,15]лах.
И алгоритм достаточно умен, чтобы понять, что следующие три символа являются первыми тремя символами в ссылке, поэтому он расширяется на три:
Бла b[5,18].
Теперь подумайте о типичном файле HTML и о том, сколько в нем повторений. Почти каждый тег, например
, имеет соответствующий закрывающий тег, например
. Кроме того, многие теги повторяются повсюду, например
,
,
![]()
,
и т.д. Атрибуты тоже часто повторяются, включая
класс,
hrefи
src. Легко понять, почему сжатие GZIP так эффективно с HTML.
Единственным недостатком является то, что веб-серверу требуется немного больше процессора для выполнения сжатия каждый раз, когда запрашивается страница. Но поскольку ЦП в настоящее время не имеет большого значения, почти всегда лучше включить GZIP, чем обойтись без него, даже если у вас веб-хостинг начального уровня.
Зачем нужно сжимать и уменьшать
Есть два основных преимущества, оба из которых имеют решающее значение в сегодняшнем мобильном веб-ландшафте.
Более быстрая загрузка страниц
В среднем минимизатор HTML может уменьшить размер файла примерно на 3 процента при базовых настройках. С дополнительными расширенными настройками размер HTML-файла можно уменьшить еще на 3–7 процентов, а потенциальное сокращение может составить до 10 процентов. Это напрямую приводит к ускорению загрузки страниц.
Меньше пропускной способности
Допустим, у вас есть 10 файлов, размер каждого из которых уменьшен с 50 КБ до 45 КБ, что дает общее сокращение на 50 КБ. Допустим, ваш веб-сайт ежедневно посещают в среднем 1000 посетителей, при этом каждое посещение в среднем составляет десять страниц. Одна только минимизация HTML снижает использование полосы пропускания на 50 МБ в день (1,5 ГБ в месяц).
Сжатие + Минификация
Как видите, минимизация HTML полезна сама по себе, особенно когда ваш сайт становится больше, файлы становятся больше, а трафик увеличивается.
Но что хорошо в оптимизации HTML, так это то, что вам не нужно выбирать ни минимизацию, ни сжатие. Вы можете сделать и то, и другое! На самом деле, вы должны делать и то, и другое.
В среднем можно ожидать, что сжатие GZIP уменьшит размер HTML-файла на 70–90 процентов. Используя приведенный выше пример с консервативной оценкой сжатия, уменьшенные файлы HTML увеличатся с 45 КБ до 13,5 КБ каждый, а общее сжатие составит 365 КБ. По сравнению с неминифицированным/несжатым, пропускная способность вашего сайта теперь уменьшается на 365 МБ в день (11 ГБ в месяц).
Помимо экономии пропускной способности, каждая страница загружается значительно быстрее, поскольку браузеру конечного пользователя требуется загрузить всего 13,5 КБ вместо 50 КБ на страницу.
Как сжимать и минимизировать HTML
К счастью, ни то, ни другое в наши дни не очень сложно, и вам не нужно много технических ноу-хау для их настройки.
Плагины WordPress
Если вы используете сайт WordPress, все, что вам нужно сделать, это установить один плагин, и вы сможете воспользоваться преимуществами как сжатия, так и минимизации.
Большинство подключаемых модулей кэширования делают больше, чем просто кэшируют страницы. Например, WP Fastest Cache и W3 Total Cache имеют настройки одним щелчком мыши, которые позволяют включать минимизацию HTML и сжатие GZIP, а также другие функции, которые еще больше ускоряют загрузку страниц и снижают использование полосы пропускания.
Если вам нужна только минимизация , мы рекомендуем плагин Minify HTML. Это просто, поддерживает HTML/CSS/JS и позволяет немного настроить метод минимизации (например, удалить ли
http:и
https:из URL).
Минимизаторы статического HTML
Если ваши файлы HTML являются статическими (т. е. не создаются динамически CMS или веб-платформой), вы можете поддерживать два набора файлов HTML: «исходный» набор, который не минимизирован для удобного редактирования, и «уменьшенный» набор, который вы создаете каждый раз, когда вносите изменения в исходный файл.
Для минимизации используйте один из следующих инструментов:
- HTMLCompressor
- HTML Minifier
- HTML Minifier (отличный от приведенного выше)
Это жизнеспособный метод, если вы отошли от CMS, таких как WordPress, и теперь используете генераторы статических сайтов.
Включить сжатие GZIP
Действия по включению сжатия GZIP могут различаться в зависимости от того, какое программное обеспечение веб-сервера вы используете. Поскольку Apache является наиболее популярным вариантом, мы расскажем, как включить его с помощью .htaccess.
Подключитесь к вашему веб-серверу с помощью FTP, затем создайте файл с именем 9Content-Encoding:.*gzip.*
SetOutputFilter DEFLATE
Не уверен работает ли сжатие на вашем сайте? Проверьте это с помощью этого инструмента.
Для максимальной эффективности вы также должны узнать, как проверять, очищать и оптимизировать CSS.
Сжимайте и оптимизируйте HTML-файл на 100% бесплатно онлайн без потери качества.
Легко и быстро сжимайте и оптимизируйте файлы HTML.
Работает на aspose.com и aspose.cloud Перетащите или загрузите свои файлы Загружая свои файлы или используя наш сервис, вы соглашаетесь с нашими Условиями обслуживания и Политикой конфиденциальности.Пожалуйста, подождите, ваши файлы находятся в обработке
Вы хотите сообщить об этой ошибке на форум Aspose, чтобы мы могли изучить и решить проблему? Вы получите уведомление по электронной почте, когда ошибка будет исправлена. Форма отчета
Ваша ошибка была успешно опубликована.
Начать зановоВаши файлы успешно обработаны
ЗАГРУЗИТЬОтправить результат по адресу:
Поделиться файлом:
Начать сначалаОБЗОР
Сжатие файла HTML для уменьшения размера документов за счет оптимизации содержимого
Наш HTML-компрессор позволяет бесплатно сжимать несколько HTML-файлов онлайн.
Сжимайте многоформатные файлы
Сжимайте многоформатные документы, включая DOC, PDF, DOCX, PNG, JPG, HTML, TXT и многие другие.
Сохранение в желаемом формате
Сохранение сжатых документов с тем же качеством, но с меньшим размером файла.
Бесплатная онлайн-операция быстрого сжатия
Молниеносное сжатие выбранных вами документов.
Сжатие файлов изображений
Возможность легко сжимать различные популярные форматы файлов изображений.
Изменить порядок сжатых файлов
Расположить и изменить порядок сжатых файлов по мере необходимости.
КАК
Как сжать файлы HTML
- Загрузите HTML-файлы, чтобы сжать их онлайн бесплатно.
- Укажите параметры и нажмите кнопку «СЖАТИЕ», чтобы сжать HTML.
- Загрузите сжатый HTML-файл для мгновенного просмотра или отправьте ссылку по электронной почте.
Подробнее
Часто задаваемые вопросы
Как сжать Word и другие файлы?
Просто используйте наш онлайн-компресс. Это быстро, просто в использовании и совершенно бесплатно. Он предназначен для быстрого сжатия документов и изображений в Интернете.
Мы поддерживаем различные форматы файлов документов и изображений, включая PDF, DOC, DOCX, RTF, ODT, HTML, Markdown, PNG, JPG, TIFF, BMP, MOBI, CHM, WPS, TXT и многие другие.
Вы можете сжимать до 10 файлов одновременно
Размер каждого файла не должен превышать 10 МБ.
В конце процесса сжатия вы получите ссылку для скачивания. Вы можете скачать результат сразу или отправить ссылку на вашу электронную почту.
Обратите внимание, что руководство Google PageSpeed рекомендует минимизировать HTML, поэтому, если вы настроены скептически, пусть это убедит вас в обратном.
Сжимайте HTML или любые другие поддерживаемые форматы файлов. Установка стороннего программного обеспечения не требуется. Веб-приложение быстрое, надежное, простое в использовании и абсолютно бесплатное.
