Online konvertor HTML do PNG zdarma

Zdrojový formát: HTML

HTML (HyperText Markup Language) je standardní značkovací jazyk používaný pro tvorbu webových stránek a webových dokumentů. Definuje strukturu, jako jsou nadpisy, odstavce, odkazy, obrázky, tabulky a formuláře, zatímco CSS a JavaScript řídí vzhled a chování. HTML je editovatelné a interaktivní, což ho činí velmi odlišným od statického obrazového formátu.

Cílový formát: PNG

PNG (Portable Network Graphics) je rastrový obrazový formát, který používá bezztrátovou kompresi. Běžně se používá pro snímky obrazovky, webovou grafiku, diagramy a obrázky, které potřebují ostré hrany nebo průhlednost. Na rozdíl od HTML je PNG plochý vizuální soubor, takže nedokáže zachovat odkazy, výběr textu ani interaktivitu stránky.

Jak funguje převod html na png

Převod HTML na PNG znamená vykreslení HTML stránky v enginu prohlížeče a zachycení výsledku jako obrázku. V závislosti na nástroji můžete získat pouze viditelnou oblast, vybraný prvek nebo celou stránku. Konečná kvalita závisí na vykreslovacím enginu, písmech, CSS, provádění JavaScriptu a rozlišení výstupu.

Převést html na png online

Nejjednodušší možností je vestavěný převodník na 101convert.com. Umožňuje vám zdarma převést .html na .png bez instalace softwaru.

1. Otevřete převodník HTML na PNG na 101convert.com.
2. Nahrajte nebo vyberte svůj .html soubor.
3. Spusťte převod a stáhněte výsledný .png soubor.

To je dobrá volba pro rychlé jednorázové převody.

Použijte prohlížeč nebo nástroj pro automatizaci

Pro opakovatelné výsledky je často nejspolehlivější workflow založené na vykreslování v prohlížeči. Nástroje jako Google Chrome, Microsoft Edge, Playwright a Puppeteer umí vykreslit HTML a exportovat ho jako obrázek.

1. Otevřete soubor HTML v prohlížeči a ověřte, že se zobrazuje správně.
2. Pokud potřebujete jen to, co je viditelné na obrazovce, použijte funkci snímku obrazovky v prohlížeči.
3. Pokud potřebujete celou stránku, použijte nástroj pro automatizaci prohlížeče, který umí zachytit celý vykreslený dokument.

Příklad příkazu:

node render-html-to-png.js

V skriptu Chromium načte soubor HTML, vykreslí ho a uloží stránku jako PNG. To se hodí pro dávkové úlohy, konzistentní výstup a stránky, které závisí na JavaScriptu.

Převést html na png přes pdf

Pokud potřebujete řízenější workflow dokumentu, můžete nejprve vykreslit HTML do PDF a poté převést PDF na PNG. To může být užitečné, když chcete předvídatelné rozvržení stránky nebo potřebujete zpracovat obsah na více stránkách.

Běžné nástroje pro první krok zahrnují LibreOffice, WeasyPrint nebo workflow tisku v prohlížeči. Pro druhý krok můžete použít ImageMagick nebo pdftoppm.

Typický workflow:

1. Otevřete soubor HTML v prohlížeči nebo v nástroji pro dokumenty.
2. Vygenerujte nebo vytiskněte do PDF pomocí File → Print nebo File → Export as PDF.
3. Převeďte stránky PDF na PNG obrázky.

Příklad příkazu:

magick -density 200 input.pdf output.png

Zvyšte hustotu (density), abyste získali ostřejší PNG.

Použití desktopového softwaru

Pokud dáváte přednost desktopovým nástrojům, můžete také vykreslit HTML v prohlížeči, pořídit snímek obrazovky a uložit nebo upravit obrázek v softwaru jako Adobe Photoshop. To je praktické pro ruční úpravy, ale není to nejefektivnější metoda pro přesné nebo automatizované vykreslování HTML.

Vezměte na vědomí, že wkhtmltoimage je nástroj příkazové řádky pro převod HTML na obrázek; není to stejné jako wkhtmltopdf, který je primárně určený pro převod HTML na PDF. Pokud použijete wkhtmltoimage, základní příkaz je:

wkhtmltoimage input.html output.png

Poznámky k kvalitě a kompatibilitě

HTML na PNG je vizuální převod, ne strukturální. Výstup je statický obrázek, takže se ztratí odkazy, data pro přístupnost a editovatelný text. Dlouhé stránky mohou být zachyceny jako velmi vysoký obrázek nebo jen jako viditelný viewport, v závislosti na nástroji.

Vykreslování se může lišit, protože HTML závisí na písmech, CSS, JavaScriptu a externích zdrojích. Pro nejlepší výsledky se ujistěte, že jsou všechny assety dostupné lokálně nebo vložené přímo v stránce. Pokud stránka používá skripty, zvolte nástroj, který před zachycením plně spustí JavaScript.

PNG je bezztrátové, ale výsledný obrázek může i tak vypadat rozmazaně, pokud je rozlišení zachycení příliš nízké. V případě potřeby zvyšujte měřítko (scale), DPI nebo velikost viewportu. Pokud na průhlednosti záleží, ověřte, že převodník zachovává alfa kanál a že pozadí stránky je průhledné.

Pro rychlý převod použijte online převodník na 101convert.com. Pro automatizaci, zachycení celé stránky nebo konzistentní výstup napříč mnoha soubory je workflow založené na vykreslování v prohlížeči obvykle nejlepší volbou.