Desain Weblog CSS, Tableless, Semantik, tidak Divitis
Posted: February 28, 2009 at 17:26:43 by Dani Iswara. Words count: 304.
Last updated: March 19, 2009 at 22:59:52.
<body>,<html>,<div id="header">,<title>,<div class="search">,<ul id="menu">,<div id="nav">,<div id="content">,<div class="post-content">,<div id="comment">,<div id="sidebar">,<div id="footer">,- headings (
<h1>-<h6>), - paragraf (
<p>), - listings (
<ul>,<ol>,<li>),
div (division; divisi) menggantikan fungsi tag table. Masihkah bisa disebut situs web yang tableless?
Akankah menjadi div mania (Dani Iswara .Net)? Bagaimana cara menyembuhkan divitis ini? Ya, beberapa desainer web semantik menyebut penggunaan div yang berlebihan ini layaknya penyakit infeksi (div + itis; -itis= (bahasa Inggris) kata akhiran yang menyertai suatu penyakit infeksi). Sehingga muncul pula istilah class-itis dan span-itis. :)
Evaluasi bisa dilakukan menggunakan ekstraktor semantik W3C.
Pada beberapa kondisi, penggunaan divisi sangat dibutuhkan untuk mengatur posisi yang kompleks. Misalnya desain web lebih dari 2 kolom, untuk kepentingan pewarnaan tiap bagian yang berbeda, penempatan logo/gambar dengan tampilan tertentu, dll.
Ya, blog Dani Iswara .Net memang belum bisa mendekati pemenuhan unsur semantik tersebut. :D
Konsep penulisan kode X/HTML yang bersih, didukung efisiensi CSS, terbukti akan memudahkan pengunjung -- mesin dan manusia -- mengakses halaman web dan blog yang lebih ringkas. :)
Dani Iswara, mail me: [myfirstnamelastname]@gmail.com.
Comment by MoronCoder on March 5, 2009 at 04:08:19
using Opera Mini 4.2.13337 on J2ME/MIDP Device
Table hanya untuk tabel,bukan untuk layout
Comment by Dani Iswara on March 5, 2009 at 05:37:07
using Firefox 3.0.6 on Gentoo
MoronCoder,
tapi bli, kadang (atau masih sering?) demi kepuasan konsumen, table utk layout ya hajar aja, yg penting fixed-width, visual dibuat semenarik mungkin..ato yg tipe old skool mengatakan, susah pindah ke lain table :)
Comment by MoronCoder on March 5, 2009 at 05:51:34
using Firefox 3.0.5 on Windows Vista
bener sekali bli, terkadang juga saya kalo lagi ada tugas kuliahyang terkejar deadline langsung deh table jadiin layout :D
Comment by dani on March 5, 2009 at 12:46:43
using Firefox 3.0.6 on Gentoo
MoronCoder,
atau buat yg single solumn aja plus plain html :)
Comment by jenggo on March 11, 2009 at 05:44:05
using Firefox 3.0.4 on GNU/Linux
Betul tuh mas Dani..
Penyakit yang satu ini (divitis) terkadang susah dihindari..
Btw, baru tau ada juga classitis.. hahaha..
Wah, pengguna Jquery pemula nih (kaya saya) yang biasanya terserang classitis akut..
Lengkap deh, divitis dan classitis.. hehehe..
Comment by Dani Iswara on March 11, 2009 at 06:19:13
using Opera 10.00 on GNU/Linux
jenggo,
iya ya..di jquery jg make class.. :) standar web dan semantik yg saya tulis memang blm memasukkan unsur-2 tersebut terkait javascript, baru x/html ama css aja :)
Comment by kaqfa on March 11, 2009 at 07:34:15
using Firefox 3.0.1 on Windows Vista
meski udah banyak diperingatkan dan juga udah sering baca artikel tentang tableless, tapi sampe sekarang masih susah untuk meninggalkan kebiasaan lama. lagian sampe sekarang juga belum ketemu masalah yang mengharuskan aku membuat tableless, kecuali untuk view web via HP.
Bagaimanapun juga lebih mudah desain menggunakan logika tabel daripada harus menghapal kompleksitas CSS 2.0 apalagi CSS 3.0, belum lagi nanti kalo ketemu masalah yang menjengkelkan dengan IE.
Anyway, nice posting....
Comment by Dani Iswara on March 14, 2009 at 09:12:13
using Opera 10.00 on GNU/Linux
kaqfa,
bagaimana dgn alasan:
ukuran berkas yg lbh ringkas, semantik, lbh search engine friendly, memudahkan pemeliharaan :)
Comment by riesurya on March 15, 2009 at 19:51:41
using Firefox 3.0.7 on Windows XP
divitis, istilahnya serjug (seru juga) :)
penggunaan div dalam me-layout memang lebih banyak membantu dlm pemeliharaan, dan tentunya dibayar dengan penulisan css yang (kadang tapi banyak seringnya :) ) ribet juga.
jadi ada harga (nulis css) ada barang (pemeliharaan) ya mas.
Comment by Dani Iswara on March 16, 2009 at 04:35:33
using Firefox 3.0.7 on Gentoo
riesurya,
istilahnya dah dipake beliau-2 para guru semantik itu.. :) saya ngikut aja
"CSS ala IE" yg plg ribet :)
kl plain -- ngga pake CSS, berarti ngga ada barang -- ngga perlu ribet pemeliharaan? :)
pak Rie senengnya maenan analogi... :D
Comment by widik on March 21, 2009 at 09:55:02
using Firefox 3.0 on Windows XP
Penggunaan div ternyata lebih nyaman dibanding menggunakan table. Hanya saja perlu diperlukan pengetahuan yang lebih tentang css dan kompatibilitasnya dengan browser, terutama ie6.
Comment by dani on March 21, 2009 at 13:07:25
using Firefox 3.0.7 on Gentoo
widik,
yg tdk mengenal table utk layout (mis. yg lahir jaman skrg-2 ini dan tdk terbiasa mendesain dgn editor WYSIWYG) mungkin berkata lain :)
IE6 memang buah simalakama :D
Comment by Agung Cahyadi on March 22, 2009 at 14:31:14
using Google Chrome 1.0.154.48 on Windows XP
yah...
kadang kita terlalu mengharamkan penggunaan table.
mungkin karena terlalu terlena dengan tampilan web 2.0 yang banyak ada di internet..
good post.
trims.
Comment by Dani Iswara on March 22, 2009 at 16:36:31
using Firefox 3.0.7 on Gentoo
Agung Cahyadi,
tp bagi pengguna volume-based bin lambat, table layout mjd mahal diongkos, kan :)
Mas Agung, hubungannya dgn web 2.0 apa ya, saya ngga ngerti je.. :)
layout table bs dibuat ala web 2.0+ jg kan cmiiw