Utils365

Форматирование и минификация HTML

Превратите HTML в аккуратную разметку с отступами или сожмите его для рабочего сайта.

Вставьте HTML, откройте файл .html или перетащите его сюда

Далее: Форматтер и минификатор CSS · Форматтер и минификатор JavaScript

Сообщить о проблеме с этим инструментом

Как использовать Форматтер HTML

  1. Вставьте HTML

    Вставьте страницу или фрагмент либо откройте или перетащите файл .html. Форматирование идёт прямо во время ввода.

  2. Отформатируйте или минифицируйте

    Форматирование добавляет каждому тегу отступ в 2 или 4 пробела или табуляцию. Минификация удаляет комментарии и невидимые пробелы.

  3. Скопируйте или скачайте

    Скопируйте результат или скачайте его как файл .html. При минификации видно, сколько байт вы сэкономили.

Почему стоит использовать Utils365

  • Безопасная минификация

    Содержимое <pre>, <textarea>, <script> и <style> никогда не меняется, а между строчными тегами остаётся один пробел, поэтому страница выглядит так же.

  • Читаемая разметка

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

  • Видно экономию

    Размер до и после и процент экономии появляются сразу после минификации.

  • Конфиденциально по умолчанию

    HTML форматируется в вашем браузере и никуда не загружается, поэтому неопубликованные страницы и шаблоны остаются у вас.

Часто задаваемые вопросы

Что удаляет минификатор HTML?

Комментарии, переносы строк и отступы, а также пробелы между тегами, которые браузер не показывает. Условные комментарии старого Internet Explorer сохраняются, потому что они всё ещё работают.

Изменится ли вид страницы после минификации?

Не должен. Пробелы рядом с блочными элементами вроде <div> и <p> никогда не видны, поэтому они удаляются. Между строчными элементами, такими как ссылки и кнопки, остаётся один пробел, потому что там он виден.

Меняются ли мои скрипты и стили?

Нет. Содержимое <script> и <style> остаётся точно таким, как написано. Чтобы уменьшить и их, воспользуйтесь форматтерами JavaScript и CSS.

Почему <pre> не трогается?

Внутри <pre> и <textarea> каждый пробел и перенос строки виден на странице, поэтому удаление любого из них изменит то, что видят посетители.

Исправляет ли форматтер сломанный HTML?

Нет. Он меняет только оформление, а не теги. Пропущенный закрывающий тег так и останется пропущенным, поэтому проверьте отступы: незакрытый тег сдвигает всё, что идёт после него, на уровень вглубь.

Связанные инструменты

Форматтер и минификатор CSSПриведите в порядок или сожмите стилиФорматтер и минификатор JavaScriptФорматирование и минификация JS через TerserСравнение текстовСравните два текста и посмотрите, что изменилосьКодирование / декодирование URLПроцентное кодирование и декодирование URL