Table and CSS (div)

Share More

Gw mau share pengalaman gw dalam membangun web nih, khususnya sih dalam tahap Layout Design. Di awal perkenalan dengan HTML, yg gw tau untuk design layout web itu menggunakan table. Kita membentuk isi tabel sedemikian rupa, sehingga sesuai dengan visual yang ingin kita tampilkan. Tapi seiring perkembangan html dan pengetahuan gw sendiri, ada makhluk baru yaitu css yang mulai memegang peranan vital pada pembentukan visual web. Tag table yang begitu sering digunakan kini mulai tergantikan oleh tag div.

Seiring pembelajaran tersebut gw bahkan sempat begitu ngototnya menggunakan css, sampai membuat Grid saja menggunakan div. Syukurlah sekarang gw sudah lumayan insaf dan sadar diri (^_^) Memang penggunaan table untuk layout tidak salah, tapi saat ini sudah ada cara yang lebih baik. Dengan menggunakan css, berikut beberapa keuntungan yang akan kita dapatkan:

  1. Download Page lebih cepat

    Dengan memisahkan style dari isi, setiap mengakses halaman yang berbeda dari web yang sama, browser/client tidak perlu membuka style kembali, karena sudah ada cache style yg sudah di load sebelumnya. Memang load page pertama akan jadi lebih berat dari load page berikutnya, tapi lebih baik daripada harus meload seluruh isi dan style saat membuka halaman baru

  2. Render Page lebih baik

    Render dan Download adalah 2 hal yang berbeda, Walau memang keduanya akan menentukan kecepatan menampilkan halaman kita. Render ialah saat dimana Browser memproses style kita untuk ditampilkan. Untuk me-Render table dengan benar browser harus terlebih dulu mendapatkan (mendownload) seluruh isi table tersebut, berbeda dengan css, browser bisa melakukan Render secara bertahap tanpa harus menunggu seluruh style kita terdownload.

  3. Re-Design lebih mudah (dan cepat tentunya)

    Karena pemisahan style dan isi, saat kita ingin melakukan re-design, kita cukup membuat style baru, sehingga kita dapat dengan mudah melompat dari design lama ke design baru hanya dengan merubah style yang akan digunakan

  4. Beberapa Design sekaligus

    YA! dengan adanya CSS, kita bisa memiliki beberapa design sekaligus untuk satu web. Pemanfaatannya bisa banyak, contohnya kita mau web kita memiliki design khusus saat dibuka melalui PDA atau Handphone, yang berbeda dari saat dibuka oleh Browser di PC. Atau seperti personal site gw, bisa ganti-ganti template dengan warna utama sesuai keinginan (ada link warna di atas kanan)

Tapi tidak menggunakan tabel bukanlah suatu keputusan yang tepat (gw udah ngerasain tuh). Yang paling penting ialah tahu kapan harus menggunakannya. Dari pengalaman gw, hal tersulit mengatur css ialah positioning untuk layout. Sejak tahun lalu saya selalu melakukan test terhadap web yang saya bangun dalam 2 browser, yaitu Internet Explorer (IE) dan Firefox (FF). Style layout kita mungkin saja sudah terlihat baik menggunakan IE, tapi belum tentu demikian saat dilihat menggunakan FF. Butuh waktu untuk mengenali karakteristik browser merender style-style tertentu. Tapi (mudah-mudahan saja :p) keduanya akan semakin mendekati standar yang ada.

Kesimpulan gw, table dan css bukanlah hal yang harus diseterukan (makanya judulnya saya pilih menggunakan and, bukan vs), melainkan harus digunakan bersama dengan bijak (cieee). Saat ingin menampilkan tabular data dalam sebuah Grid (ini fungsi tabel yg sesungguhnya), tentu saja kita harus menggunakan tabel. Saat kita sudah utak atik css tapi tampilnya gak beres-beres, saat itu kita punya 2 pilihan, berjuang terus cari solusi, atau kalo deadline sudah ngetok2 di pintu depan, pake tabel aja dulu :p hehehe….

Share this Post More

Comments are closed.