Восстановление читаемости HTML
Готовый вариант «Форматировщик HTML»
Превратите минифицированный или плохо отформатированный HTML обратно в читаемый вид. Вставьте одну сжатую строку и получите правильно вложенную разметку с единообразными отступами — включая любой CSS и JavaScript, встроенные в страницу.
- Файлы никогда не покидают ваше устройство
- Бесплатно, без регистрации
- Без водяных знаков
- Работает офлайн после загрузки
Как пользоваться: форматировщик html
- 1
Вставьте свой HTML
Минифицированный, с плохими отступами или написанный вручную — подойдёт любой.
- 2
Выберите отступы
2 пробела, 4 пробела или табуляция.
- 3
Скопируйте результат
Или скачайте его как файл .html.
Чтение минифицированной разметки, выпущенной кем-то другим
Минифицированный HTML — сжатый в одну или несколько длинных строк сборочным инструментом — оптимизирован исключительно под размер передачи, а не под чтение человеком, и это становится настоящей проблемой, как только нужно изучить структуру страницы конкурента, отладить проблему в продакшене через просмотр исходного кода или разобраться, как на самом деле устроен сторонний виджет. Приведение его в читаемый вид восстанавливает вложенность, которую человеку нужно проследить: каждый элемент на своей строке, с отступом, отражающим глубину вложенности относительно родителей, — именно такое представление реально воспринимает человек, в отличие от единственной плотной строки, оптимизированной сборочным инструментом для передачи машинам.
Восстановление структуры страницы, которую вы не писали
Изучение страницы, созданной кем-то другим, — лендинга конкурента, разметки встраиваемого виджета, старого проекта без доступного исходного кода, — одна из самых распространённых причин обратиться именно к инструменту приведения в читаемый вид: инструменты разработчика в браузере показывают живой отрендеренный DOM, что полезно для одной цели, а приведение исходного HTML-кода в читаемый вид показывает реальную структуру документа, отправленную сервером, с восстановленными отступами, — это другой и часто более полезный взгляд, когда нужно понять, как страница была на самом деле построена, а не как она в итоге отрендерилась.
Часто задаваемые вопросы
Форматирует ли инструмент CSS и JavaScript внутри страницы?
Да. Содержимое внутри `<style>` и `<script>` передаётся парсерам CSS и JavaScript, поэтому вся страница в одном файле форматируется корректно целиком, а не оставляет эти блоки нетронутыми.
Изменит ли форматирование то, как отображается страница?
Почти никогда, но не совсем никогда: HTML считает пробелы значимыми внутри `<pre>`, `<textarea>` и элементов с `white-space: pre`. Они остаются в точности как есть. Инлайновые элементы в редких случаях могут сместиться на один пробел, поэтому форматировщик действует вокруг них осторожно.
Почему инструмент отклоняет мой HTML?
Обычно причина — действительно несбалансированные теги или синтаксис шаблонизатора вроде Handlebars, Jinja или Blade, который не является валидным HTML. Браузеры незаметно исправляют сломанную разметку; форматировщику же нужно понимать структуру, поэтому он так делать не может.
Моя разметка куда-то загружается?
Нет. Парсер работает прямо в браузере, поэтому неопубликованные страницы и работа для клиентов остаются на вашем компьютере.
Вам также может понадобиться
Форматировщик CSS
Форматирование и минификация таблиц стилей
Форматировщик JavaScript
Форматирование JS и TypeScript настоящим парсером
Форматтер JSON
Мгновенное форматирование, валидация и минификация JSON
Кодировщик и декодировщик Base64
Кодирование и декодирование Base64 и Base64URL
Минификатор CSS
Сжимайте таблицы стилей настоящим минификатором, понимающим CSS
Генератор хешей
MD5, SHA-1, SHA-256, SHA-384 и SHA-512
Минификатор JS
Сжимайте JavaScript настоящей минификацией, а не регулярными выражениями
Декодер JWT
Декодирование и анализ JSON Web Token