10Aug
Il ne cesse de m'étonner que les gens doivent rechercher un lien ou un bouton qui dit «Imprimer» sur une page Web, surtout en considérant qu'il existe une technologie miracle qui rend cette étape inutile. Malheureusement, presque personne ne l'utilise, même si c'est. .. 10 ans.
Non seulement il est ridicule d'exiger une étape supplémentaire pour l'impression, mais l'utilisation de feuilles de style d'impression permettrait d'économiser de l'encre pour quiconque n'utilise pas le lien imprimable. Et bien sûr, il y a beaucoup de gens qui utilisent l'impression au format PDF pour sauvegarder des articles plus tard sans gaspiller de papier.
Que sont les feuilles de style d'impression?
La plupart des sites Web implémentent leur fonction d'impression en vous redirigeant vers une autre page formatée différemment pour les imprimantes, mais ce n'est pas vraiment nécessaire. Chaque navigateur implémente une technologie CSS simple appelée feuilles de style d'impression, qui n'est rien de plus qu'un fichier qui spécifie des éléments à cacher lorsque votre navigateur imprime la page.
Pour ceux qui ne sont pas familiers, CSS signifie Cascading Style Sheets( Feuilles de style en cascade), et c'est ainsi que votre navigateur sait comment formater le code source HTML d'une page Web en ce que vous voyez réellement à l'écran. Tout de polices, couleurs, bordures, et même des images d'arrière-plan peuvent être spécifiées dans la feuille de style.
Ajout d'une feuille de style d'impression est aussi simple que de brancher cette seule ligne dans votre page HTML-la partie media = print du code indique au navigateur d'utiliser uniquement cette feuille de style lors de l'impression.
& lt; link rel = "feuille de style" href = "print.css" type = "texte / css" media = "print" & gt;
Ce fichier ressemble généralement à ceci:
# sidebar, #footer, #navigation, #sharinglinks, #topad, #comments{ affichage: aucun}
Oui, c'est vraiment aussi simple que ça. Alors, comment ça marche? Voici un exemple de page Web normale sur la gauche, avec tous les éléments de navigation, logo et annonces clairement visibles avec l'ID associé - et sur la droite, la même page avec la feuille de style imprimée appliquée, cachant tous ces éléments.
De toute évidence, vous préférez imprimer l'un d'entre eux plutôt que l'autre, n'est-ce pas?
Exemples d'échec de la feuille de style d'impression
Malheureusement, il y a juste des tas de sites Web énormes qui n'ont pas pris la peine d'implémenter cela du tout. Jetez un oeil à ce qui se passe lorsque vous essayez d'imprimer à partir du New York Times:
Certains sites, comme le réseau de sites Gawker, sont encore pires. Non seulement ils n'ont pas de vue imprimable, mais quand vous essayez d'imprimer, cela ressemble à de la soupe à l'encre. Autant que nous puissions le dire, il n'y a aucun moyen d'imprimer à partir d'un site Gawker sans utiliser un service distinct comme Readability, ou en mettant en évidence manuellement le contenu de la page, ce qui est presque impossible sur leur nouveau design.
C'est triste, vraiment. Les charges des sites les plus importants ne prennent tout simplement pas la peine d'implémenter cette fonctionnalité.
Heureusement, certains sites les utilisent
Voici un exemple de vue imprimable correctement formatée - sans avoir à chercher un lien d'impression. Le site BBC News met en forme les articles à imprimer, avec un en-tête personnalisé.Ils incluent des commentaires dans la vue d'impression, mais c'est quand même un travail bien fait.
Il y a pas mal d'autres sites qui font la même chose, comme ArsTechnica et. .. notre site, mais il serait stupide de montrer des captures d'écran de chacun d'entre eux. Dans notre recherche, les sites qui les implémentent correctement sont rares.
Alors, pour conclure. .. prenez les 5 minutes nécessaires pour implémenter une feuille de style imprimée pour votre site!