Tidak pernah berhenti membuat saya takjub bahwa orang harus mencari link atau tombol yang bertuliskan "Cetak" di halaman web, terutama mengingat ada teknologi ajaib yang membuat langkah itu tidak perlu. Sayangnya hampir tidak ada yang menggunakannya, meskipun itu… 10 tahun.
Tidak hanya konyol untuk meminta langkah ekstra untuk mencetak, tetapi menggunakan lembar gaya cetak akan menghemat beberapa tinta untuk siapa pun yang tidak menggunakan tautan yang dapat dicetak. Dan tentu saja, ada banyak orang yang menggunakan print-to-PDF untuk menyimpan artikel nanti tanpa membuang kertas.
Apa Itu Print Stylesheets?
Sebagian besar situs web menerapkan fungsi cetaknya dengan mengarahkan Anda ke laman lain, yang diformat berbeda untuk printer - tetapi ini sebenarnya tidak perlu. Setiap browser menerapkan teknologi CSS sederhana yang dikenal sebagai Cetak Stylesheet , yang tidak lebih dari sebuah file yang menentukan elemen yang akan disembunyikan ketika browser Anda mencetak halaman.
Bagi mereka yang tidak terbiasa, CSS berarti Cascading Style Sheets, dan begitulah cara browser Anda mengetahui cara memformat kode sumber HTML untuk halaman web menjadi apa yang sebenarnya Anda lihat di layar. Semuanya mulai dari font, warna, batas, dan bahkan gambar latar belakang dapat ditentukan di lembar gaya.
Menambahkan print stylesheet semudah memasukkan satu baris ini ke HTML halaman Anda — bagian media = print dari kode memberi tahu browser untuk hanya menggunakan style sheet ini saat mencetak.
<link rel = ”stylesheet” href = ”print.css” type = ”text / css” media = ”print”>
File ini biasanya terlihat seperti ini:
#sidebar, #footer, #navigation, #sharinglinks, #topad, #comments { display:none }
Ya, sesederhana itu. Jadi bagaimana cara kerjanya? Berikut adalah contoh halaman web biasa di sebelah kiri, dengan semua navigasi, logo, dan iklan terlihat jelas dengan ID yang terkait - dan di sebelah kanan, halaman yang sama dengan lembar gaya cetak yang diterapkan, menyembunyikan semua elemen tersebut.
Jelas Anda lebih suka mencetak salah satu dari ini daripada yang lain, bukan?
Contoh Kegagalan Print Stylesheet
Sayangnya, ada banyak situs web besar yang tidak mau repot-repot menerapkannya sama sekali. Lihat apa yang terjadi ketika Anda mencoba mencetak dari New York Times:
Beberapa situs, seperti situs jaringan Gawker, bahkan lebih buruk. Tidak hanya mereka tidak memiliki tampilan yang dapat dicetak, ketika Anda mencoba dan mencetak, itu menyerupai sup tinta. Sejauh yang kami tahu, tidak ada cara untuk mencetak dari situs Gawker tanpa menggunakan layanan terpisah seperti Keterbacaan, atau menyorot konten pada laman secara manual, yang hampir tidak mungkin dilakukan pada desain baru mereka.
Sungguh menyedihkan. Banyak situs terbesar benar-benar gagal untuk repot-repot menerapkan fitur ini.
Untungnya, Beberapa Situs Menggunakannya
Berikut adalah contoh tampilan yang dapat dicetak dengan format yang benar - tanpa harus repot mencari tautan cetak. Situs BBC News memformat artikel dengan rapi untuk dicetak, lengkap dengan tajuk khusus. Mereka memang menyertakan komentar dalam tampilan cetak, tapi itu masih pekerjaan yang dilakukan dengan baik.
Ada beberapa situs lain yang melakukan hal yang sama, seperti ArsTechnica dan… situs kami, tetapi akan konyol untuk menampilkan tangkapan layar dari semuanya. Dalam penelitian kami, situs yang menerapkannya dengan benar sangat sedikit dan jarang.
Jadi sebagai penutup… harap luangkan waktu 5 menit yang diperlukan untuk menerapkan lembar gaya cetak untuk situs Anda!
