HTML-минификатор
Вставьте HTML, чтобы удалить комментарии и лишние пробелы и минифицировать встроенные CSS и JavaScript. Содержимое <pre> и <textarea> остаётся точно таким, как написано.
Работает в браузереБез регистрацииНичего не загружается
Как пользоваться: HTML-минификатор
- Вставьте HTML-документ или фрагмент либо откройте файл
.html. - Выберите, что удалять: комментарии, пробелы, и нужно ли минифицировать встроенные блоки
<style>и<script>. - Проверьте строку предупреждений: встроенный скрипт с синтаксической ошибкой остаётся без изменений, чтобы не сломать страницу.
- Скопируйте минифицированный HTML или скачайте его.
Что удаляется?
- Комментарии:
<!-- … -->удаляются, кроме условных комментариев Internet Explorer и комментариев, начинающихся с<!--!. - Пробелы между блочными элементами: переводы строк и отступы между тегами вроде
<div>,<li>или<head>никогда не отображаются, поэтому удаляются полностью. - Серии пробелов в тексте: сжимаются до одного пробела — именно так их всё равно отображает браузер.
- Пробелы внутри тегов:
<p class = "a">становится<p class="a">.
Что сохраняется?
В некоторых местах пробелы значимы, и минификатор это учитывает. Содержимое <pre> и <textarea> сохраняется байт в байт. Одиночный пробел между строчными элементами, например <b>bold</b> text, сохраняется, потому что без него слова слились бы. Значения атрибутов и кавычки никогда не меняются.
Встроенные CSS и JavaScript
Встроенные блоки <style> оптимизируются CSSO, а встроенные <script> — Terser, теми же движками, что и на страницах CSS-минификатора и JavaScript-минификатора. JSON-LD и другие JSON-скрипты сжимаются, а скрипты неизвестных типов (например, шаблоны) не трогаются.
Стоит ли минифицировать HTML?
Для страниц с серверным рендерингом и статических сайтов HTML-документ — первое, что загружает браузер, поэтому каждый сэкономленный байт ускоряет первую отрисовку. Экономия 10–25% до сжатия — обычное дело, а для шаблонов с большими отступами и страниц с крупными встроенными скриптами — ещё больше.
Часто задаваемые вопросы
Изменит ли минификация HTML внешний вид страницы?
<pre>/<textarea> не трогается. Если вы стилизуете элементы через white-space: pre в CSS, выключите Сжимать пробелы.