Nigdy nie przestaje mnie zadziwiać, że ludzie muszą szukać linku lub przycisku z napisem „Drukuj” na stronie internetowej, zwłaszcza biorąc pod uwagę cudowną technologię, która sprawia, że ten krok jest niepotrzebny. Niestety prawie nikt go nie używa, mimo że ma… 10 lat.
Wymaganie dodatkowego kroku do drukowania jest nie tylko niemądre, ale użycie arkuszy stylów drukowania pozwoliłoby zaoszczędzić trochę atramentu każdemu, kto nie korzysta z linku do druku. Oczywiście jest mnóstwo osób, które korzystają z funkcji drukowania do formatu PDF do zapisywania artykułów na później bez marnowania papieru.
Co to są arkusze stylów drukowania?
Większość witryn internetowych implementuje swoją funkcję drukowania, przenosząc użytkownika na inną stronę, która ma inny format dla drukarek - ale to naprawdę nie jest konieczne. Każda przeglądarka implementuje prostą technologię CSS znaną jako Drukuj arkusze stylów , który jest niczym innym jak plikiem określającym elementy do ukrycia podczas drukowania strony przez przeglądarkę.
Dla nieznanych osób CSS oznacza kaskadowe arkusze stylów i dzięki temu Twoja przeglądarka wie, jak sformatować kod źródłowy HTML strony internetowej na to, co faktycznie widzisz na ekranie. W arkuszu stylów można określić wszystko, od czcionek, kolorów, obramowań, a nawet obrazów tła.
Dodanie arkusza stylów drukowania jest tak proste, jak podłączenie tej pojedynczej linii do kodu HTML strony - część kodu media = print mówi przeglądarce, aby używała tego arkusza stylów tylko podczas drukowania.
<link rel = ”stylesheet” href = ”print.css” type = ”text / css” media = ”print”>
Ten plik ogólnie wygląda mniej więcej tak:
#sidebar, #footer, #navigation, #sharinglinks, #topad, #comments { display:none }
Tak, to naprawdę takie proste. Jak to działa? Oto przykład zwykłej strony internetowej po lewej stronie, na której wszystkie elementy nawigacyjne, logo i reklamy są wyraźnie widoczne wraz z powiązanym identyfikatorem, a po prawej ta sama strona z zastosowanym arkuszem stylów drukowania, która ukrywa wszystkie te elementy.
Oczywiście wolisz wydrukować jeden z nich nad drugim, prawda?
Przykłady błędów drukowania arkusza stylów
Niestety, istnieje mnóstwo ogromnych witryn internetowych, które wcale nie zadały sobie trudu, aby to zaimplementować. Spójrz, co się dzieje, gdy próbujesz drukować z New York Times:
Niektóre witryny, takie jak sieć witryn Gawker, są jeszcze gorsze. Nie tylko nie mają widoku do wydrukowania, ale kiedy próbujesz drukować, przypomina to zupę atramentową. O ile nam wiadomo, nie ma możliwości drukowania z witryny Gawker bez korzystania z oddzielnej usługi, takiej jak Czytelność, lub ręcznego podświetlania treści na stronie, co jest prawie niemożliwe w nowym projekcie.
To naprawdę smutne. Mnóstwo największych witryn po prostu nie zawraca sobie głowy implementacją tej funkcji.
Na szczęście niektóre witryny ich używają
Oto przykład prawidłowo sformatowanego widoku do druku - bez konieczności szukania linku do drukowania. Witryna BBC News starannie formatuje artykuły do druku, wraz z niestandardowym nagłówkiem. Zawierają komentarze w widoku wydruku, ale nadal jest to dobrze wykonana praca.
Jest kilka innych witryn, które robią to samo, na przykład ArsTechnica i… naszą witrynę, ale pokazanie ich wszystkich zrzutów ekranu byłoby głupotą. Z naszych badań wynika, że witryny, które prawidłowo je wdrożyły, są nieliczne.
Podsumowując… poświęć 5 minut na zaimplementowanie arkusza stylów drukowania w swojej witrynie!
