Tidak pernah berhenti membuat saya takjub bahwa orang-orang harus mencari tautan atau tombol yang mengatakan "Cetak" pada 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 itu konyol untuk membutuhkan langkah ekstra untuk mencetak, tetapi menggunakan stylesheet cetak akan menghemat tinta bagi siapa saja yang tidak menggunakan tautan yang dapat dicetak. Dan tentu saja, ada banyak orang yang menggunakan cetak-ke-PDF untuk menyimpan artikel untuk kemudian tanpa membuang-buang kertas.
Sebagian besar situs web mengimplementasikan fungsi cetak mereka dengan membawa Anda ke halaman lain, yang diformat berbeda untuk printer - tetapi ini sebenarnya tidak diperlukan. Setiap browser menerapkan teknologi CSS sederhana yang dikenal sebagai Print Stylesheet, yang tidak lebih dari sebuah file yang menetapkan elemen untuk disembunyikan ketika browser Anda mencetak halaman.
Bagi yang belum terbiasa, CSS berarti Cascading Style Sheets, dan bagaimana peramban Anda tahu cara memformat kode sumber HTML untuk laman web ke dalam apa yang sebenarnya Anda lihat di layar. Semuanya dari font, warna, perbatasan, dan bahkan gambar latar belakang dapat ditentukan dalam style sheet.
Menambahkan stylesheet cetak semudah mencolokkan satu baris ini ke halaman Anda HTML-the media = cetak bagian dari kode memberitahu browser untuk hanya menggunakan style sheet ini saat mencetak.
File ini umumnya terlihat seperti ini:
#sidebar, #footer, #navigation, #sharinglinks, #topad, #comments display: none
Ya, itu benar-benar sesederhana itu. Jadi bagaimana cara kerjanya? Berikut ini contoh laman web normal 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 diterapkan, menyembunyikan semua elemen tersebut.
Tentunya Anda lebih memilih untuk mencetak salah satunya di atas yang lain, bukan?
Sayangnya, ada banyak situs web besar yang tidak peduli untuk menerapkan ini sama sekali. Lihatlah apa yang terjadi ketika Anda mencoba mencetak dari New York Times:
Beberapa situs, seperti jaringan situs 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 secara manual menyoroti konten pada halaman, yang hampir tidak mungkin pada desain baru mereka.
Sangat menyedihkan, sungguh. Banyak situs terbesar benar-benar gagal untuk mengimplementasikan fitur ini.
Berikut ini contoh tampilan yang dapat diformat dengan benar - tanpa harus repot-repot mencari beberapa tautan cetak. Situs BBC News dengan rapi memformat artikel untuk dicetak, lengkap dengan tajuk khusus. Mereka memang menyertakan komentar di tampilan cetak, tapi 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 screenshot dari semuanya. Dalam penelitian kami, situs-situs yang menerapkannya dengan baik sangat sedikit dan jarang.
Jadi untuk menyelesaikan ... silakan ambil 5 menit yang diperlukan untuk menerapkan stylesheet cetak untuk situs Anda!