Online konvertor HTM do PNG zdarma

Co je formát HTM

HTM je přípona souboru HTML používaná pro webové stránky a místní webové dokumenty. Soubor .htm obsahuje značky pro text, odkazy, tabulky, formuláře a odkazy na média; CSS řídí vzhled a JavaScript může stránku po načtení měnit. Přípony .htm a .html označují stejný formát HTML, ačkoli .htm byla užitečná v systémech, které vyžadovaly přípony o třech znacích.

Prohlížeče jako Chrome, Firefox, Edge a Safari otevírají soubory HTM. Mohou je vytvářet webové editory, systémy pro správu obsahu, generátory statických webů a starší aplikace Windows. Soubor HTM může záviset na souvisejících souborech CSS, JavaScriptu, obrázků, písem a médií, takže zkopírování pouze souboru HTML může vést k neúplnému vykreslení.

Co je formát PNG

PNG (Portable Network Graphics) je rastrový obrazový formát, který ukládá vykreslený obrázek jako pixely. Podporuje bezztrátovou kompresi, průhlednost a plnobarevné obrázky, takže je vhodný pro snímky obrazovky, návrhy rozhraní, diagramy, loga a grafiku s ostrým textem nebo plochami jednotných barev.

PNG nezachovává odkazy HTML, sémantickou strukturu, pravidla CSS, skripty, volitelný text, responzivní chování ani interaktivitu. Použijte jej, když je vyžadována pevná vizuální reprezentace, nikoli upravitelná nebo interaktivní webová stránka.

Jak převést HTM na PNG

Pomocí webového prohlížeče

1. Ponechte soubor HTM spolu s odkazovanými složkami, například css, images a fonts. Pro načtení těchto zdrojů jsou vyžadovány správné relativní cesty.
2. Otevřete soubor v prohlížeči Chrome, Edge, Firefox nebo jiném aktuálním prohlížeči dvojitým kliknutím nebo výběrem možnosti Open with.
3. Nastavte požadovanou šířku viewportu změnou velikosti okna prohlížeče nebo pomocí nástrojů pro emulaci zařízení v prohlížeči. Responzivní stránky mohou mít při každé šířce jiné rozložení.
4. Zachyťte vykreslenou stránku pomocí funkce pro pořizování snímků obrazovky v prohlížeči, nástroje operačního systému pro snímání obrazovky nebo vývojářských nástrojů.
5. Uložte obrázek jako .png a zkontrolujte, zda neobsahuje oříznutý obsah, chybějící písma, nenačtené obrázky nebo nesprávné responzivní rozložení.

V prohlížeči Chrome nebo Edge otevřete vývojářské nástroje pomocí Ctrl + Shift + I v systému Windows nebo Linux, případně Cmd + Option + I v systému macOS. Otevřete nabídku příkazů, spusťte Capture full size screenshot a uložte výsledný soubor PNG. Pokud je nutné stránku zachytit v konkrétních rozměrech, nejprve použijte panel zařízení. Snímek v plné velikosti zahrnuje celý dokument, kterým lze posouvat; běžný snímek zachytí pouze viditelný viewport.

Pomocí 101convert

Soubor můžete zdarma převést na webu 101convert.com bez instalace softwaru. Nahrajte soubor HTM, vyberte PNG, pokud je zobrazena volba výstupního formátu, spusťte převod a stáhněte obrázek. Pokud stránka používá samostatné soubory CSS, obrázky, písma nebo skripty, poskytněte související soubory, pokud převaděč podporuje nahrání archivu nebo zdrojů; v opačném případě se tyto zdroje ve výsledku nemusí zobrazit.

Pomocí Playwright pro opakovatelná zachycení

Playwright je vhodný pro automatizované nebo dávkové pořizování snímků obrazovky, protože používá engine prohlížeče a umožňuje nastavit pevný viewport. Po instalaci Playwright a jeho prohlížeče Chromium může skript Node.js používat:

const { chromium } = require("playwright");
(async () => {
  const browser = await chromium.launch();
  const page = await browser.newPage({ viewport: { width: 1440, height: 900 } });
  await page.goto("file:///absolute/path/page.htm", { waitUntil: "networkidle" });
  await page.screenshot({ path: "page.png", fullPage: true });
  await browser.close();
})();

URL souboru nahraďte absolutní cestou k souboru HTM. Nastavte fullPage na false, pokud je vyžadován pouze viewport. U stránek, které načítají obsah po ukončení síťové aktivity, před pořízením snímku počkejte na příslušný selektor nebo přidejte krátkou prodlevu.

Omezení kvality a kompatibility

Rozměry PNG závisí na viewportu prohlížeče a poměru pixelů zařízení. Pokud musí malý text zůstat čitelný, zvětšete viewport nebo měřítko zařízení, počítejte však s větší velikostí souboru. Snímek obrazovky není převodem do tiskového rozložení: prvky s pevnou pozicí, animace, obrázky načítané líně a stavy při najetí ukazatele mohou v závislosti na okamžiku zachycení vést k odlišným výsledkům.

Místní bezpečnostní pravidla prohlížeče mohou blokovat skripty, písma nebo zdroje načítané z jiných umístění. Udržujte požadované zdroje dostupné lokálně, používejte platné relativní cesty a počkejte, až se načtou webová písma a obrázky. PNG zachovává zachycené pixely bez ztrát způsobených kompresí typu JPEG, obvykle je však u fotografického obsahu větší než JPEG a nedokáže zachovat text, odkazy ani chování původní stránky.