CSS Asyik - Belajar Bikin Web Makin Asyik dengan CSS

Tutorial Menggunakan Blueprint CSS Framework

Membedah File Print.css

Isi File Print.css

Isi File Print.css

Seperti yang saya jelaskan sebelumnya, file ini berfungsi untuk menentukan style ketika pengunjung situs menekan menggunakan fungsi “Print”. Tentunya pada saat anda mencetak sebuah website, satu pikiran yang patut ditanamkan adalah: “Bagaimana tampilan website ini layak untuk dibaca diatas kertas?”.

Oleh karena itu floating element tidak disarankan karena lebar kertas yang bervariasi tidak mencukupi untuk mencetak halaman web. Warna-warna diperjelas dan dibikin monoton hitam untuk mengatasi masalah printer tidak berwarna. Untuk membedakan link, diterapkan text-decoration:underline. Elemen-elemen background berwarna ataupun dari image ditiadakan juga dengan alasan yang sama. Simple dan mudah dibaca, itu intinya :)

Membedah File IE.css

Isi File IE.CSS

Isi File IE.CSS

Jika mendesain website diibaratkan sebagai padang pasir, maka file ini adalah oasisnya. Waktu yang dihabiskan oleh website designer kebanyakan hanya untuk debugging di browser Internet Explorer, utamanya versi 8 ke bawah. Saya tidak perlu menjelaskan apa yang ada di dalam ini satu per satu. Intinya adalah, jangan mengganti satu pun yang ada di dalam file ini, semua kode ini sudah dicoba di berbagai versi IE. Nah, kalau mau cari selamat, mending jangan diganti :D

Kesimpulan

Pergunakan dan ubahlah kode-kode CSS di dalam ketiga file ini seperlunya saja karena tidak semuanya dibutuhkan di dalam desain website anda. Hal ini berlaku juga untuk CSS Framework yang lain. Semoga artikel ini dapat membantu anda. Dan doakan semoga dalam waktu dekat saya bisa mengerti dan mengimplementasikan script-script Ruby yang terdapat di dalam framework ini. :D

PS: ada beberapa plugin di dalam bundle Blueprint CSS ini yang mungkin berguna untuk anda. Contohnya Plugin RTL (Right to Left) untuk pengaturan CSS dengan konten yang dibaca dari kanan, berguna untuk penulisan bahasa Arab atau Hebrew.

 
Post a comment or leave a trackback: Trackback URL.

17 comments for “Tutorial Menggunakan Blueprint CSS Framework”

Leave comments









 
Fully Powered By:
WordPress Firewalker Copyright © 2010 Firewalker Design