Konvertera HTML till PNG

Q: Kan PNG-bilden få transparent bakgrund i stället för vit?

Ja. Aktivera **Transparent bakgrund**. Den syns bara där sidan själv inte anger någon bakgrundsfärg, så en webbplats med vit bakgrundsfärg på body blir fortfarande vit. Det fungerar bäst för en enskild komponent eller en bricka som är byggd som en egen HTML-fil.

Q: Hur gör jag en bild av bara den övre delen av en lång sida?

Ställ in **Bilder** på en per sida och **Sidor** på Första sidan. Då får du den första sidstora delen i stället för hela längden. Vill du sedan beskära bilden till en exakt ram kan du använda verktyget [beskär bild](/crop-image).

Gör en sparad webbsida, en dashboardexport eller en komponentskiss till en PNG där varje bokstav och tunn linje ser ut exakt som webbläsaren ritade den. Välj fönsterbredd, så anpassas layouten efter den.

eller släpp DOC, DOCX, DOCM …-filer här ·

Max 95 MB per fil· Upp till 20 filer· Raderas efter 30 minuter

Utdata

Konvertera till

Upplösning

Bilder

Filerna bearbetas på våra servrar och raderas efter 30 minuter.

Så använder du verktyget

1
Lägg till HTML-filen
Ladda upp .html-, .htm- eller .mhtml-filer, upp till 20 per omgång och 95 MB var. En sida som sparats som en enda MHTML-fil har sina bilder och stilar inbäddade i filen.
2
Ställ in fönsterbredden
HTML-sidans bredd börjar på 1280 px. Använd 390 px för en mobillayout eller 1920 px för en bred instrumentpanel. Konvertera till är redan PNG och Bilder är en enda lång bild.
3
Konvertera till PNG
Tryck på Konvertera till PNG. Aktivera Transparent bakgrund under Avancerade inställningar om sidan inte har någon egen bakgrundsfärg och bilden ska läggas över annan grafik.

Svar

Hur konverterar jag HTML till PNG?

Ladda upp .html- eller .mhtml-filen, ställ in HTML-sidans bredd på den skärm du vill efterlikna och tryck på Konvertera till PNG. Hela den renderade sidan kommer tillbaka som en enda förlustfri bild.

Konvertera HTML till PNG när text och linjer måste vara skarpa

PNG har varit en W3C-rekommendation sedan 1996 och använder förlustfri komprimering, så de kantutjämnade kanterna på brödtext i 14 px, tabellkanter på en pixel och syntaxfärgad kod bevaras orörda. Därför bifogar utvecklare PNG-bilder i buggrapporter och designers delar dem i granskningar: ingen behöver fundera på om en suddig kant beror på CSS eller på komprimering.

Priset är storleken. En sida med text och jämna färger komprimeras bra, men en sida full av foton gör det inte. Om bilden ska in i en chatt eller ett mejl där storleken väger tyngre än skarpa detaljer blir JPG en mindre fil. För dokumentation, versionsanteckningar, instrumentpaneler och stilguider är PNG det säkrare standardvalet.

Bredden avgör layouten. HTML har ingen fast sida: samma fil visar en desktopdesign med tre kolumner vid 1280 px och en enda staplad kolumn vid 390 px. Konverteraren lägger ut sidan med den HTML-sidans bredd du anger, från 320 till 3840 px, och fångar den sedan från första raden till sidfoten.

Bredder för HTML till PNG på vanliga skärmar

195:422

390 × 844 px

Mobil

CSS-visningsområdet hos många nyare iPhone-modeller, visar mobillayouten

41:59

820 × 1180 px

Surfplatta

iPad Air i stående läge, många webbplatser byter brytpunkt i närheten av detta

8:5

1280 × 800 px

Bärbar dator

Standardbredden i den här konverteraren

16:9

1920 × 1080 px

Full HD-skärm

Breda instrumentpaneler och adminpaneler

HTML

HyperText Markup Language

HTML är webbens märkspråk, som Tim Berners-Lee först beskrev i början av 1990-talet och som numera underhålls av WHATWG som en levande standard. En HTML-fil beskriver rubriker, stycken, länkar, tabeller, bilder och formulär, medan utseendet oftast kommer från CSS. Alla webbläsare visar det, och det används också för e-postmallar och sparade webbsidor. En enskild HTML-fil är ofta beroende av externa bilder och stilmallar, så den kan se trasig ut när den flyttas ensam.

Komprimering: –
Transparens: –
Animation: –
Introducerades: 1993 · Tim Berners-Lee; maintained by WHATWG

HTML-omvandlare

PNG

Portable Network Graphics

PNG är ett förlustfritt rasterformat som publicerades 1996 av PNG Development Group och senare standardiserades av W3C och ISO. Det behåller varje pixel exakt, stöder full alfatransparens och hanterar text, skarpa kanter och släta färgytor utan artefakter. Den precisionen gör det idealiskt för skärmdumpar, logotyper, ikoner och gränssnittsgrafik. Nackdelen är storleken: foton som sparas som PNG är ofta flera gånger större än samma foto som JPEG eller WebP. Alla webbläsare, operativsystem och redigeringsprogram öppnar PNG-filer.

Komprimering: Förlustfri
Transparens: Ja
Animation: Nej
Introducerades: 1996 · PNG Development Group

PNG-omvandlare

Man väljer PNG när sidan mest består av text, kod, tabeller eller gränssnittsdelar: förlustfria pixlar håller tunna linjer och liten text skarpa i dokumentation, buggrapporter och designgranskningar där JPG-artefakter skulle synas.

Konvertera HTML till PNG utan att förlora stilar eller typsnitt

En vanlig .html-fil är ofta beroende av sådant som ligger någon annanstans: en stilmall i en css-mapp, bilder på den ursprungliga servern, typsnitt från en typsnittstjänst. När de saknas faller sidan tillbaka på ostilad text i ett standardtypsnitt. Om du sparar sidan i Chrome eller Edge som Webbsida, en enda fil får du en .mhtml-fil som håller ihop stilar och bilder, och det är det mest pålitliga att ladda upp.

Webbtypsnitt följer samma regel. Ett typsnitt som deklarerats med @font-face laddas bara om filen går att nå, och ett typsnitt som bara finns på din egen dator ersätts av ett liknande. Om exakt typografi är viktig kan du bädda in typsnittet eller kontrollera resultatet innan du skickar det vidare.

En fast bredd gör också att veckovisa bilder av en rapport går att jämföra sida vid sida. När resultatet ska vara markerbar text för utskrift är HTML till PDF formatet att använda i stället.

Frågor om HTML till PNG

Är HTML till PNG bättre än en skärmbild från min egen webbläsare?

En skärmdump i webbläsaren fångar bara det som ryms på skärmen, om du inte använder ett verktyg för helsidesbilder, och bredden blir den som ditt fönster råkar ha. Här är bredden ett tal som du själv anger, så två bilder som tagits med veckors mellanrum stämmer exakt överens, och hela sidan ingår från första raden till sidfoten.

Varför är PNG-filen flera gånger större än samma sida som JPG?

PNG lagrar varje pixel utan förlust. Text och jämna färgytor komprimeras bra på det sättet, men foton, toningar och videoomslag gör det inte, så en målsida full av foton kan ge en stor PNG-fil. För sådana sidor är HTML till JPG ett lättare val. För kodexempel, diagram och gränssnitt är den oskärpan oftast inte värd det.

Kan PNG-bilden få transparent bakgrund i stället för vit?

Ja. Aktivera Transparent bakgrund. Den syns bara där sidan själv inte anger någon bakgrundsfärg, så en webbplats med vit bakgrundsfärg på body blir fortfarande vit. Det fungerar bäst för en enskild komponent eller en bricka som är byggd som en egen HTML-fil.

Kör konverteraren JavaScript på sidan?

Innehåll som ett skript bygger när sidan öppnas kan komma med, men sådant som väntar på ett klick, en scrollning eller en inloggning gör det inte. Om ett diagram eller en tabell bara finns efter interaktion kan du öppna sidan i webbläsaren, låta den laddas klart och spara den som en enda fil innan du laddar upp.

Hur gör jag en bild av bara den övre delen av en lång sida?

Ställ in Bilder på en per sida och Sidor på Första sidan. Då får du den första sidstora delen i stället för hela längden. Vill du sedan beskära bilden till en exakt ram kan du använda verktyget beskär bild.