Formátovač HTML

Jak formátovat HTML

1. Vlož své HTML, nebo klikni na Otevřít soubor a načti soubor .html či .htm (do 10 MB).
2. Zvol Odsazení (2 mezery, 4 mezery nebo tabulátor) a to, zda se mají řádky Zalamovat na 80 nebo 120 znaků.
3. Zaškrtni Odsadit a , pokud je chceš odsadit uvnitř <html>, a Odstranit komentáře, abys zahodil komentáře <!-- … -->.
4. Kliknutím na Formátovat (zpřehlednit) získáš čitelný kód, kliknutím na Minifikovat nejmenší bezpečnou verzi.
5. Výsledek zkopíruj nebo stáhni. Stavový řádek ukazuje velikost před a po.

Výsledek se v poli výstupu zobrazuje jako prostý text. Tvoje HTML se na této stránce nikdy nevykresluje ani nespouští, takže skripty v kódu, který vložíš, nemohou nic udělat.

Zpřehlednění: čitelné a jednotně odsazené HTML

Formátovat (zpřehlednit) používá js-beautify, formátovač, který stojí za mnoha editory kódu:

• blokové prvky jdou na samostatné řádky odsazené podle hloubky vnoření, zatímco řádkové prvky jako <a>, <b> nebo <span> zůstávají v textu;
• obsah <script> a <style> se formátuje jako JavaScript a CSS;
• <pre> a <textarea> zůstávají přesně tak, jak jsou napsány, protože jejich mezery jsou vidět;
• po sobě jdoucí prázdné řádky se zredukují na jeden;
• při zadané šířce zalamování se zalamují dlouhé řádky textu i dlouhé seznamy atributů.

Zpřehlednění nespraví rozbité značky: neuzavřený <div> zůstane neuzavřený a následné odsazení ukáže, kde je problém.

Minifikace: menší HTML beze změny stránky

Minifikovat používá záměrně konzervativní přístup:

• posloupnosti mezer, tabulátorů a konců řádků v textu se změní na jedinou mezeru, stejně jako je zobrazuje prohlížeč;
• mezery vedle blokových prvků a prvků hlavičky (<div>, <p>, <li>, <td>, <meta>, <br>…) se odstraní, protože se nikdy nevykreslují;
• jedna mezera mezi řádkovými prvky se zachová, takže <b>velký</b> <i>svět</i> se nezmění na „velkýsvět“;
• komentáře se odstraní při zaškrtnuté volbě Odstranit komentáře, kromě podmíněných komentářů (<!--[if IE]>) a komentářů začínajících <!--!;
• obsah <script>, <style>, <pre> a <textarea> se nikdy nemění a hodnoty atributů se zachovají přesně, včetně uvozovek.

Neodstraňuje volitelné závěrečné značky, nepřepisuje atributy a nekomprimuje vložený JavaScript ani CSS: tyto optimalizace ušetří o něco víc, ale mohou stránky rozbít. U většiny stránek ušetří mnohem víc kompresní HTTP (gzip nebo Brotli) než jakýkoli minifikátor, takže minifikace je nejužitečnější pro HTML vložené do e-mailů, šablon nebo řetězců v JavaScriptu.