teksten & publiciteit

KNOWHOW-CENTRUM

Bezoekers komen graag terug naar printervriendelijke website

door ing. Jan Everink

Om verschillende redenen kan een bezoeker van uw website besluiten een pagina af te drukken. Hij kan bijvoorbeeld de tekst zo belangrijk vinden dat hij deze later nog eens opnieuw vanaf papier wil doorlezen. Een andere reden kan zijn dat hij de informatie in geprinte vorm aan iemand anders wil doorgeven.
Het printervriendelijk maken van een website kan op twee manieren: met responsive design of door afzonderlijke scherm- en printpagina’s te creëren.


Responsive design

Webpagina’s zijn veelal niet zonder meer geschikt om afgedrukt te worden. Dat komt onder meer omdat vaak abolute positionering wordt toegepast. Daarbij kan de ontwerper precies bepalen waar de tekstblokken en afbeeldingen verschijnen, maar de op deze manier opgemaakte pagina's zijn vaak te breed voor de printer.

Responsive design is een techniek om webpagina's zo te ontwerpen dat ze wél goed afgedrukt worden. Daarbij worden de pagina's zodanig flexibel gemaakt dat ze zich aanpassen aan het medium, bijvoorbeeld de printer. Een belangrijk voordeel van deze aanpak is onder meer dat op het scherm in principe de hele breedte gebruikt kan worden. Responsive design is een doeltreffende manier om webpagina’s voor weergave op verschillende media te creëren.

Door het in principe niet toepassen van absolute positionering wordt gezorgd dat een pagina flexibel is en zich in de breedte kan aanpassen. Ook andere methodes om pagina-onderdelen exact op hun plaats te fixeren worden vermeden. Zo worden voor tabel- en cel-afmetingen geen pixelwaarden maar percentages ingegeven. De tabel blijft dan flexibel en kan zich bij het printen instellen overeenkomstig de van toepassing zijnde printbreedte.


Gebruik maken van media-type

Responsive design omvat nog uiteenlopende andere technieken om webpagina's op verschillende media goed te laten verschijnen. Onder meer kan worden gezorgd dat navigatie-buttons op de afdruk wegblijven. Daartoe wordt gebruik gemaakt van een CSS-stylesheet met media-type print, waarmee elementen op de afdruk onderdrukt kunnen worden.

Op vergelijkbare wijze kan worden geregeld dat op de afdruk de afbeeldingen niet te groot zijn. Als de pagina grote afbeeldingen bevat moeten deze op de printer verkleind worden weergegeven. Voor dat doel  worden twee CSS-stylesheets gemaakt, één met media-type print en één met media-type screen.De afbeelding wordt tweemaal in de pagina opgenomen, waarbij met behulp van de genoemde stylesheets wordt gezorgd dat de ene afbeelding uitsluitend op het scherm en de andere uitsluitend op de printer wordt getoond. Bovendien wordt bepaald dat de print-afbeelding verkleind wordt weergegeven.

Verder kan de afdruk van een pagina natuurlijk géén bewegende beelden bevatten. Als wordt geprobeerd om bewegende content, zoals GIF-animaties, Flash-animaties en video's, af te drukken is het resultaat onvoorspelbaar. Ook het niet laten verschijnen van pagina-onderdelen die beweging bevatten kan met CSS worden geregeld.

Met behulp van een stylesheet met media-type print kan eventueel op de afdruk ook extra informatie worden weergegeven, zoals bijvoorbeeld contactgegevens. Dat kan zinvol zijn omdat vanaf een gedrukte pagina immers niet, zoals vanaf een schermpagina, naar een speciale contact-pagina genavigeerd kan worden.


Opmaak speciale printversie

Naast responsive design bestaat natuurlijk ook nog de oplossing om een tweede versie van de pagina te maken die uitsluitend bedoeld is om afgedrukt te worden. Op de schermpagina wordt dan een link geplaatst naar deze printervriendelijke versie.

Een extra printversie maakt het mogelijk om bij het ontwerp van de schermpagina wél absolute positionering toe te passen, zodat de lay-out exact bepaald kan worden. De printversie kan met responsive design flexibel worden gemaakt of met absolute positionering worden beperkt tot een breedte van bijvoorbeeld 600 pixels.

De printervriendelijke versie laat men veelal verschijnen in een nieuw venster, dat kleiner is dan de schermpagina, zodat ook de schermpagina zichtbaar blijft. Voor de extra printversie gelden dezelfde eisen als genoemd bij het printervriendelijk maken door middel van responsive design. Onder meer worden op de afdruk in principe geen navigatieknoppen geplaatst, terwijl bewegende content wordt vervangen door foto’s of weggelaten.

Als een pagina van uw website indruk op de bezoeker heeft gemaakt dan wil deze bezoeker mogelijk een afdruk maken. Dan moet dat probleemloos kunnen. Waarschijnlijk kan uw site door het verbeteren van de printervriendelijkheid een stuk aantrekkelijker voor bezoekers en daardoor promotioneel effectiever worden.