HTML naar PDF

Zo zet u HTML om naar PDF

Stap 1: voeg uw markup toe. Plak de code in het vak of gebruik Bestanden toevoegen en zet een opgeslagen .html-bestand hier neer via slepen en neerzetten. Deze tool is gratis, veilig, zonder installatie en zonder registratie. Alles wordt in uw browser verwerkt, niets wordt geüpload. Zet bestanden hier neer en start direct.

Stap 2: controleer de weergave. Uw markup staat in een eigen frame, afgeschermd van deze pagina. De browser rendert alles en html2canvas fotografeert het resultaat. Elke pagina van de PDF is een PNG-afbeelding daarvan, met Flexbox, CSS-grid, verlopen en inline SVG exact op hun plaats.

Stap 3: klikken om te downloaden. Er wordt gerenderd op tweemaal het formaat, ongeveer 144 dpi, scherp op scherm en kantoorprinter maar zichtbaar gepixeld bij drukwerk. Tekst is niet selecteerbaar, Ctrl+F vindt niets. Wilt u doorzoekbare tekst, gebruik Afdrukken naar PDF of OCR achteraf.

Wanneer een afbeelding het juiste antwoord is

Rasteren is een slecht idee voor een contract dat iemand moet doorzoeken. Het werkt goed wanneer het uiterlijk van de pagina het doel is.

Markup plakken is niet hetzelfde als een bestand openen

De importknop voor .html leest alleen de tekst van dat ene bestand. Een stylesheet ernaast, een logo in ./images of een webfont in ./fonts volgen niet mee, omdat een browser geen toegang geeft tot de rest van uw schijf. Alleen zelfstandige inhoud reist mee.

Relatieve paden falen stil. Uw markup rendert hier, niet waar het is opgeslagen, dus src=“logo.png” lost op tegen oxygenpdf.com in plaats van de eigen map en vindt niets. Absolute https://-URL’s laden alleen met CORS-headers van de server; zonder headers worden ze overgeslagen.

Scripts worden nooit uitgevoerd. Markup die zo wordt toegevoegd voert geen scripttags uit, dus een opgeslagen single-page app blijft vrijwel leeg. U bewaarde de schil, niet de weergave. Kopieer de live DOM uit uw element-inspecteur en plak die.

Hoe het zich verhoudt

Drie manieren om HTML in een PDF te krijgen. Deze wint niet elke rij, en de rijen die verloren gaan zijn het lezen waard.

Wat behouden blijft en waar pagina’s breken

Kleuren, verlopen, randen, afgeronde hoeken, schaduwen, dekking, transformaties, tabellen, lijsten en inline SVG blijven behouden. De renderer tekent elk vak zelf; zonder equivalent verdwijnen filter met blur(), mix-blend-mode, backdrop-filter, clip-path en maskers zonder waarschuwing.

Uw markup krijgt een viewport van ongeveer 515 pixels breed, de A4-inhoudsbreedte in CSS-pixels. Responsieve pagina’s tonen dus het smalle breekpunt en een @media (min-width: 768px)-regel activeert nooit. Ziet uw layout er alleen boven 768 pixels goed uit, dan faalt deze hier.

Het resultaat is één hoge afbeelding, gesneden in stroken op vaste intervallen. De snede is rekenkundig en ontziet geen tabelrij of kop, die half op twee pagina’s kan belanden. CSS-regels voor pagina-einden helpen niet; duw het element met marge of een spacer verder. Per pagina passen ongeveer 762 punten.

Uw HTML verlaat dit tabblad nooit

Elke serverconverter eist uw markup op zijn machine. U plakt het in een formulier en het wordt geüpload, of u geeft een URL en de crawler haalt de pagina op, waarvoor achter een login ook inloggegevens nodig zijn. Geen prettige ruil voor klantnamen of een niet-uitgebrachte testomgeving.

Alles gebeurt in het tabblad dat u open hebt: html2canvas tekent uw markup, pdf-lib bouwt de pagina’s en de download komt direct uit het geheugen. Alles wordt in uw browser verwerkt, niets wordt geüpload. Sluit het tabblad en alles is verdwenen.