imatge

Mai em deixa d’estranyar que la gent hagi de buscar un enllaç o un botó que digui “Imprimir” en una pàgina web, sobretot tenint en compte que hi ha una tecnologia miraculosa que fa que aquest pas sigui innecessari. Malauradament, gairebé ningú no l'utilitza, tot i que té 10 anys.

No només és una tonteria requerir un pas addicional per a la impressió, sinó que l'ús de fulls d'estils d'impressió estalviarà una mica de tinta per a qualsevol que no utilitzi l'enllaç imprimible. I, per descomptat, hi ha moltes persones que utilitzen impressió a PDF per guardar articles per després, sense malgastar paper.

Què són els fulls d’estil d’impressió?

La majoria dels llocs web implementen la seva funció d’impressió portant-vos a una altra pàgina, que té un format diferent per a impressores, però realment això no és necessari. Tot navegador implementa una tecnologia CSS simple coneguda com a Imprimir fulls d’estil, que no és res més que un fitxer que especifica elements a amagar quan el navegador imprimeix la pàgina.

Per a aquells que no són familiars, CSS vol dir fulls d'estil en cascada i és com el vostre navegador sap com formatar el codi font HTML d'una pàgina web en allò que realment veieu a la pantalla. Al full d'estil es pot especificar tot, tipus de lletra, colors, sanefes i fins i tot imatges de fons.

Afegir un full d’estils d’impressió és tan senzill com connectar aquesta sola línia a la vostra pàgina HTML: la part = imprimir del codi indica al navegador que només faci servir aquest full d’estil quan s’imprimeix.

Generalment aquest fitxer sembla:

#sidebar, #footer, #navigation, #sharinglinks, #topad, #comments {display: none}

Sí, és tan senzill com això. Com funciona? A continuació, es mostra un exemple d’una pàgina web normal a l’esquerra, amb tota la navegació, el logotip i els anuncis clarament visibles amb l’ID associat - i a la dreta, la mateixa pàgina amb el full d’estils d’impressió aplicat, amagant tots aquests elements.

imatge

Evidentment, preferiu imprimir-ne una sobre l’altra, oi?

Exemples de falla del full d’estil d’impressió

Malauradament, hi ha un munt de llocs web enormes que no s’han molestat en implementar-ho en absolut. Mireu què passa quan intenteu imprimir des del New York Times:

imatge

Alguns llocs, com la xarxa de llocs Gawker, són encara pitjors. No només no tenen una vista imprimible, quan proveu d’imprimir, s’assembla a la sopa de tinta. Pel que podem saber, no hi ha manera d’imprimir des d’un lloc de Gawker sense utilitzar un servei separat com Readability, ni ressaltar manualment el contingut de la pàgina, gairebé impossible en el seu nou disseny.

imatge

És trist, de veritat. Les càrregues dels llocs més grans simplement no molesten en implementar aquesta funció.

Per sort, alguns llocs els fan servir

A continuació, es mostra un exemple d'una vista d'impressió correctament formatada, sense haver de molestar en trobar algun enllaç d'impressió. El lloc de notícies de la BBC formata perfectament els articles per imprimir i es completa amb una capçalera personalitzada. Inclouen comentaris a la vista d'impressió, però no deixa de ser un treball ben fet.

imatge

Hi ha molts altres llocs que fan el mateix, com ara ArsTechnica i ... el nostre lloc, però seria una tonteria mostrar captures de pantalla de tots ells. A la nostra investigació, els llocs que els han implementat correctament són pocs i molt distants.

Així, per acabar-ho ..., trieu els 5 minuts necessaris per implementar un full d’estils d’impressió al vostre lloc.