HTML naar PDF omzetten

Minder dan mensen denken. Een HTML-document is de structuur en de woorden: koppen, alinea’s, tabellen, en verwijzingen naar al het andere. Het stijlblad dat het ergens op laat lijken is meestal een apart bestand, aangeduid met een adres. Dat geldt ook voor de lettertypen, de afbeeldingen en de scripts.

Open je zo’n bestand in een browser, dan haalt die alles op en bouwt de pagina voor je ogen in elkaar — daardoor ziet het er compleet uit en voelt het bestand alsof er een webpagina in zit. Dat is niet zo. Geef hetzelfde bestand aan iets wat niets kan ophalen, en wat overblijft is de tekst, in het standaardlettertype, in één kolom.

Technisch zou het kunnen: die verwijzingen volgen en het stijlblad, de lettertypen en de afbeeldingen downloaden. We doen het niet, en de reden is het ronduit zeggen waard. Een omzetter die adressen ophaalt die hij in bestanden van gebruikers vindt, is een machine die iedereen die doorheeft dat ze ophaalt met plezier op een intern adres richt.

De omzetserver hier heeft helemaal geen route naar het internet. Dat is dezelfde eigenschap die garandeert dat jouw document nergens heen kan, en ze betekent noodzakelijkerwijs dat een gekoppeld stijlblad een verwijzing naar niets is. Het zijn twee kanten van dezelfde beslissing.

Zelfstandig is de hele eis. Zet de CSS in een `<style>`-blok in het document in plaats van ernaar te verwijzen. Neem afbeeldingen op als data-URI — base64 binnen het `src`-attribuut — en wijs niet naar losse bestanden. Gebruik lettertypen die op een gewoon systeem bestaan, want een webfont van een lettertypedienst komt niet aan.

Heel veel gegenereerde documenten werken al zo: facturen uit boekhoudsoftware, rapporten uit analysepakketten, uitvoer uit notitie-apps en de meeste HTML-mailsjablonen zijn juist zelfstandig gebouwd zodat ze het overleven om verplaatst te worden. Die komen er met hun opmaak intact uit. Een pagina die je met «Pagina opslaan als…» bewaarde bijna nooit, want dat levert een HTML-bestand plus een map met bijlagen ernaast op.

Wil je een kopie bewaren van een pagina die je op dit moment bekijkt — een artikel, een bon, een boekingsbevestiging, een pagina die zomaar kan verdwijnen — sluit dan dit tabblad en druk op Ctrl+P, of Cmd+P op een Mac, en kies daar «Opslaan als pdf».

De browser heeft het zware werk al gedaan. Elk stijlblad is geladen, elk lettertype gevonden, elke afbeelding opgehaald, elk script uitgevoerd. Hij maakt een PDF van de afgemaakte pagina in plaats van van een bestand dat er een beschrijft, en geen enkele externe omzetter kan dat evenaren, want geen enkele externe omzetter heeft die opgebouwde pagina. Deze pagina is er voor de HTML-bestanden die je in handen hebt; voor de pagina’s die je bekijkt staat het betere gereedschap al open.

Het document wordt op standaardpagina’s gezet met de standaardtypografie van de omzetter, tenzij het bestand eigen stijlen meebrengt. Er is geen venster om je naar te voegen, dus een opmaak die voor een scherm bedacht is krijgt een vraag voorgelegd waar ze niet voor ontworpen was.

Alles wat printstijlen in zijn CSS heeft gebruikt die ook, en dat is het mechanisme dat een goed gebouwd document hier al voor heeft. Alles wat op JavaScript leunt om zichzelf te ordenen niet, want er draait niets.

Verwijzingen in de tekst blijven verwijzingen in de PDF, dus een webadres in het document blijft aanklikbaar. Interne ankers die naar een ander deel van hetzelfde document wijzen werken eveneens.

Verwijzingen naar bestanden die naast de HTML stonden wijzen naar adressen die niets meer opleveren. Dat is geen fout in de omzetting; dat gebeurt er als een document dat op zijn buren steunde in zijn eentje wordt verplaatst.

Een scherm schuift opzij en een pagina niet, dus met een brede tabel moet iets gebeuren. Kolommen worden samengeperst, en voorbij een zekere breedte wordt de tekst te klein om te lezen terwijl de tabel technisch gezien compleet blijft.

Bestaat het document vooral uit een brede tabel, beslis dan vooraf en niet achteraf: minder kolommen, of een liggend paginaformaat in de CSS, waar de omzetting zich aan houdt.

Dit zijn de bestanden die het best omgezet worden, en dat is geen toeval. Facturen uit boekhoudsoftware, rapportages uit analysepakketten, uitvoer uit notitie-apps en de meeste HTML-mailsjablonen zijn zelfstandig gebouwd zodat ze doorsturen overleven.

Alles wat ze nodig hebben zit in dat ene bestand, en dat is precies de eigenschap die deze omzetting verlangt. Komt jouw HTML uit die hoek, reken er dan op dat het er goed uitziet.

Er wordt niets in het bestand uitgevoerd. Een pagina die haar inhoud met JavaScript opbouwt wordt omgezet naar wat de opmaakcode zegt vóórdat het script gedraaid zou hebben, en dat is dikwijls bitter weinig.

Dat is een veiligheidseigenschap en geen beperking om omheen te werken: code uitvoeren die in iemands geüploade bestand staat is niets om een opmaak mee te redden. Bestaat de inhoud pas nadat een script gedraaid heeft, print dan uit je browser.