Desain Ulang Area Komentar
Pembenahan tiada henti. Ini adalah perubahan ke sekian kalinya yang saya lakukan pada tampilan area komentar blog ini. Kalau saya bicara area komentar, yang saya maksudkan adalah tampilan deretan komentar yang telah masuk pada posting.
Apa yang saya lakukan pada redesain kali ini?
- Menghilangkan garis tepi kanan-kiri.
- Menyeragamkan warna latar komentar (satu warna saja).
- Menghilangkan efek menjorok ke dalam pada komentar reply.
Alasan dan tujuan di balik perubahan di atas yaitu penyederhanaan tampilan. Terlalu banyak detail berpotensi membuat pusing. Inilah alasan utama saya menghilangkan beberapa detail, seperti 3 poin di atas. Dengan tampilan yang lebih minimalis seperti sekarang, menurut saya terlihat lebih elegan dan nyaman untuk disimak.
Kekurangannya mungkin sedikit menyulitkan bagi yang ingin mengenali/mengikuti alur komentar bersarang (threaded-comment). Ini memang sulit saya hindari ketika menghilangkan 3 detail di atas. Efeknya, alur komentar jadi terlihat flat. Seperti tidak menggunakan fitur berbalas komentar.
Sementara ini saya akan tetap mempertahankan tampilan demikian. Mudah-mudahan menjadi pengalaman baru bagi Anda :-)
Menu Lainnya »» Atas » Depan » Arsip » Kontak » Bawah
Add KafeGue di Facebook
Follow KafeGue di Twitter
Tautan Cepat »» Beri Komentar | Baca Ulang Posting
Baca Komentar | Menuju Posting Terbaru


Firefox 3.6.8 | Windows XP
oza mas tu da alngkah2nya yang spesifik ga? lok ada kasih tahu lebih detail donk biar tak coba..makasih.
Google Chrome 5.0.375.99 | GNU/Linux
@bagyojose, saya agak kesulitan jika harus menulis langkah-langkahnya mas. Soalnya coding setiap theme itu beda untuk area komentarnya. Jadi sulit untuk diseragamkan.
Firefox 3.6.3 | Windows XP
iya, jadi terlihat seperti tidak menggunakan thread comment
Firefox 3.6.8 | Ubuntu 10.04
@Moblox,
Dibedakan dengan warna latarnya ya? Dulu pernah saya lakukan sih. Namun untuk sekarang ini, saya ingin menyeragamkan saja. Biar terlihat lebih simpel. Kalau banyak warna berbeda secara selang-seling, kesannya rada rame gitu.
Opera Mini 528.16 | iPhone
hmm, kalau bisa, khusus komentar dari penulis artikel dibedakan dg komen dr pengunjung…
Firefox 4.0b1 | Windows XP
@Satrya,
Masalahnya saya emang sengaja ngurangin aksen, biar nggak terlalu rame mas. Kalo kombinasi antara font dan latar di post, sepertinya emang udah serasi ya (*muji diri sendiri*) ^-^
@ganda,
Berarti sebelumnya agak gemukan ya bro? Maklum, sekarang hiasan di pinggulnya udah saya copot. Biar nggak terlalu menggoda mata gitu deh. Untuk penelusuran alur komentar bersarangnya, sepertinya mulai harus beradaptasi deh. Gak papa kan kalo saya ngasih User eXperience baru? ^-^
Firefox 3.6.8 | Windows XP
@iskandaria, saya udah ngerti maksud dari Mas Is, kolom komentar terlihat seperti tradisional tapi sebenarnya ada fitur reply… CMIIW.
Safari 5.0.1 | Windows XP
@iskandaria,
Rada sumpek begitu bro. Seperti yang dikatakan mas Jeprie, mending garis sampingnya itu yang dipertahankan. Saya punya style contoh seperti itu yang bisa mas pergunakan. Dulu saya buat untuk keperluan bagan dalam website.
Menurut saya user experiencenya kurang baik bro. Saya termasuk pengguna setia tombol scroll mouse. Rada susah untuk memindainya.
Firefox 3.6.8 | Ubuntu 10.04
@ganda,
maaf bro. Sementara saya tetap nggak mau ngasih garis samping. Biarin aja jadi susah dipindai. Biar yang mau baca komentar lebih tergerak untuk memindai satu per satu komentar reply yang ada :lol:
@Rudy Azhar,
Makasih atas pengertiannya Bang. Saya akhirnya berhasil menghilangkan efek menjorok pada reply. Jadi kayak komentar tradisional kan? (tapi ada reply di dalamnya..hehe)
Safari 5.0.1 | Windows XP
@iskandaria, Yo wes mas. :D Tapi klo suatu saat mas butuh, saya punya kode CSS nya. :D
Aduh, saya tidak punya waktu banyak untuk blogwalking, jadi pastinya saya memindai komentar dengan super full speed. Atau paling2 pakai Ctrl + F. :D Hahahaha..
Google Chrome 6.0.408.1 | Windows XP
@ganda, boleh juga tuh kode CSS-nya bro. Siapa tau cocok dengan selera saya. Gratis kan? haha…(maunya). Boleh deh dikirim ke surel saya di iskandarias [at] gmail.com
Tapi kalo akhirnya tidak saya gunakan, jangan tersungging ya bro. Oya, teknik pindai cepat dengan shortcut emang ampuh banget. Tapi kalau saya baru menggunakannya pada blog yang tidak mengaktifkan avatar. Itu pun jika jumlah komentarnya banyak.
Safari 5.0.1 | Windows XP
@iskandaria, Hari gini masih nyari gratisan? Hahahahaha… Kidding bro. Ntar saya cari di tumpukan coding2 saya. Ntar malam saya kirim bro.
Paling tidak menjadi pembelajaran baik. Apalagi klo bro mau menuliskannya di blog ini. Saya lagi gak niat nulis tips trik CSS di blog saya. Hahahaha.. Nitip boleh lah kan? Hahahaha…
Firefox 4.0b3 | Windows XP
@ganda, makasih banyak kalau begitu bro. Soal nanti mau dituliskan di sini, saya nggak janji deh. Tapi akan saya usahakan bro. Tergantung materi codingnya juga sih. Kalau rada sulit diaplikasikan pada banyak theme kan rada susah juga mau menuliskannya ^-^
Safari 5.0.1 | Windows XP
@iskandaria, Sama sekali gak susah bro. Isi HTML nya hanya berupa list, sedangkan css-nya hanya 2KB. Itupun tidak terkompres. Jadi gampang ngebacanya.
Internet Explorer 8.0 | Windows XP
@iskandaria, email sudah saya kirim bro. :) Selamat menggunakan.
Firefox 4.0b3 | Windows XP
@ganda, makasih berat bro. Semoga ilmu codingnya makin maknyuss deh.
Safari 5.0.1 | Windows XP
@iskandaria, Sama-sama bro.
Firefox 3.6.6 | Windows XP
@iskandaria, ini bisa dijadikan
bukantutorial cara memodifikasi plugin nested comment Mas…he..he..he…Sebelumnya saya kepikiran buat postingan cara memodifikasi plugin tersebut, abis dimana-mana yang menggunakan plugin ini tampilannya sama aja Mas, terlihat kembar & hambar..wkwkwkwkkwkkk….
Safari 5.0 | Windows XP
terasa lebih ramping, tapi untuk penelusuran rada susah.
Firefox 3.6.8 | Windows XP
masukan aja y mas Is, memang agk sedikit kaku, antara parent dan children comment kurang trlihat.
Kemudian krna wrna background post dan koment sama, mngkin bisa di beri sedikit aksen yg membedakan antara post dan koment. :D
Tapi antara background dan font di post bagus mas Is, satrya suka tuh.Sama warna titlenya, Pas banget :mrgreen:
Firefox 3.6.8 | Ubuntu 10.04
@isnuansa, abis siram bensin, bakar-bakar yuk mbak :lol:
@darahbiroe, makasih..makasih..
Firefox 3.6.3 | Windows XP
tapi begini juga cukup bagfus kok hehhehe
:D
Firefox 3.6.8 | Windows XP
Ah, saya masih bisa melihat kok perbedaan antara induk dan anaknya. *siram bensin*
Firefox 3.6.8 | Windows 7
awas mas, blogmu kobong lho,,, enek sing dolanan bensin…..
artinya:
awas mas, blogmu kebakar lho,, ada yang mainan bensin,, wkwkwkwkw *ngelirik mbak nunik*
Firefox 4.0b1 | Windows XP
@yos beda, ngomong opo koe mas? (maklum, saya bukan wong jowo) ^-^
Google Chrome 5.0.375.126 | Windows XP
Kurang konsisten Mas Is,
Pada komentar utama:
Nama+”says:”+”Browser & OS” + 18/08/2010 at 04:08
Pada balasan:
Nama+”membalas:”+’tanpa broser & OS’ + August 18th, 2010 at 04:17
Bilingual?
Firefox 3.6.8 | Ubuntu 10.04
@ArdianZzZ, setelan nama browser memang cuma untuk komentar induk mas. Kalau setelan metadata memang terjadi dualisme..hehe. Yang satu bawaan komentar asli Wp. Satu lagi bawaan plugin. Selamat mas, Anda teliti banget! ^_$
Google Chrome 5.0.375.126 | Windows XP
@iskandaria, Hehe… saya kan penganut aliran pixel perfect :P
Firefox 4.0b1 | Windows XP
@ArdianZzZ, hmm. Pixel perfect? Berarti jika ada kesalahan atau kekurang-harmonisan desain sebesar satu pixel aja bisa tahu ya ^-^
Google Chrome 6.0.472.36 | Windows XP
@iskandaria, Si ArdianZzZ tuh kalo ngitung make kalkulator Mas:D
Google Chrome 5.0.375.126 | Windows XP
@Padly, Wakaka… bener Pad. Saya bukan pengguna 960gs atau bluprin. Kalau butuh grid framework ya mendingan bikin sendiri. Biasanya kalau menggunakan Golden ratio atau Fibonacci ratio gitu… :)
Opera 10.61 | Windows Vista
Mungkin harus dibedakan dulu, apakah konsep yang diusung adalah threaded comment standard atau dengan konsep nested comment standard, sehingga tidak tumpang tindih antara satu dan yang lainnya.
Hmm…, ngomong-ngomong apa ada ya istilah seperti itu?
Google Chrome 5.0.375.126 | Windows XP
@Cahya, Ada Mas, tepatnya bukan istilah, tapi jargon.
Firefox 3.6.8 | Ubuntu 10.04
@Cahya, konsep saya sih sebenarnya ingin menggabungkan antara tampilan tanpa fitur reply dan dengan fitur tersebut. Saya ingin tampilan deretan komentar terkesan flat, namun di dalamnya tetap terdapat komentar bersarang. Yang masih menjadi perdebatan kan sisi kemudahan trekking yang berkurang oleh tampilan flat yang saya usung sekarang ^-^
Firefox 3.6.7 | Windows 7
kalau tidak betul2 mengikuti eksperimen mas Is, apalagi artikelnya tidak dibaca teliti, bisa dianggap tidak ada komentar bersarang, mas. Kurang terlihat.
Tapi seringkali memang begitu. Seperti juga kehidupan, tidak ada pilihan yg sempurna 100%. Kita diminta utk memilih.
Tapi penyempurnaan tiada henti, bukan ?
Google Chrome 5.0.375.99 | GNU/Linux
@suarakelana,
Senada dengan tanggapan saya atas komentar mas Adi Rismaka, bahwa tidak ada pilihan yang 100% sempurna dari segala sisi. Seringkali satu aspek jadi berkurang nilainya ketika kita lebih mengedepankan aspek lainnya. Makasih atas komentar bijaknya Pak.
Firefox 3.6.8 | Windows 7
Bila efek menjorok diminimalisir sampai seakan-akan tidak terlihat mana komentar parent dan mana komentar children, maka usabilitas dari thread comment ini menjadi hilang.
Lebih baik memang dibedakan mana yang komentar parent dan mana komentar children, sehingga pembaca dapat dengan mudah mengikuti alur diskusi dengan baik.
Firefox 3.6.6 | Windows XP
@rismaka, thanks Mas Ris, sedang dalam tahap pembenahan lebih lanjut.he..he..he… (lo, kok malah saya yang ngejawab?)
Google Chrome 5.0.375.99 | GNU/Linux
@Rismaka
Ya, kadang ada sesuatu yang sedikit tidak optimal fungsinya jika sesuatu yang lain lebih dioptimalkan. Tapi secara keseluruhan, menurut saya yang lebih utama adalah kesan pertama ketika melihat deretan komentar. Jika kesan ‘rame’ bisa dikurangi, saya rasa pembaca akan lebih nyaman ketika hendak menyimak deretan isi komentar. Efek selanjutnya ia akan lebih mudah dalam menyerap isi komentar-komentar yang ada.
Biarlah ia mengikuti alur komentar dari hasil menyimak deretan yang sudah masuk. Saya rasa pembaca tetap bisa mengikuti. Sebab antar komentar pasti ada hubungan keterkaitan berupa klausal, tanya-jawab, timbal-balik, dan sebagainya. Jadi masih logis untuk diikuti.
@Rudy Azhar,
Makasih sudah jadi penunggu blog ini di saat saya pergi bang :lol:
Safari 5.0 | Windows 7
ngomongin ngutakatik tema jadi inget kemaren seharian ngoprek tema epsilon biar makin “njablay” hehehehehe
Google Chrome 5.0.375.99 | GNU/Linux
@yos beda,
Lama ngilang nih Yos? Jago utak-atik juga ya ternyata. Kalo saya sebatas modifikasi CSS dan sedikit kode HTML aja.
Firefox 3.6.8 | Windows 7
@iskandaria, yah ngutak-atiknya cuma sebatas itu ajak kok modifikasi CSS dan sedikit kode HTML aja,,,iya lama ngga ngeblog karena kesibukan online lainya yang ngga bisa ditinggalin :D
Firefox 4.0b1 | Windows XP
@yos beda, kesibukan online lainnya? Wah, jangan-jangan sibuk nyari duit online nih..wkwkwk
Firefox 3.6.3 | Windows XP
wah mas Is ini memang jagonya mengutak-ngatik desain blog .. salut, terus berinovasi demi kenyamanan para pembaca blog ini. penataan ulang komentar mutlak dibutuhkan untuk membuat pembaca ‘betah’ di blog ini.
salam
Google Chrome 5.0.375.99 | GNU/Linux
@Padly,
Oh iya, ternyata saya masih kurang teliti pada bagian itu. Ntar saya benahin mas. Thx.
@belajar investasi,
Saya belajar sambil melakukan mas. Jagonya masih amatiran ^_^
Google Chrome 6.0.472.36 | Windows XP
Jadi seperti disqus…
Lebih bagus avatar reply-nya disejajarkan dengan paragraf reply kali ya!
Firefox 3.6.8 | Ubuntu 10.04
Kelihatan lebih rapi dibandingkan sebelumnya.
Firefox 3.6.8 | Ubuntu 10.04
Test perubahannya :D
Firefox 3.6.8 | Ubuntu 10.04
Mas Is,
jika tidak jeli, komentar bersarangnya seperti berdiri sendiri.
Google Chrome 5.0.375.99 | GNU/Linux
Pak Aldy, terkesan kurang menyatu dengan komentar induk/asli ya Pak? Mungkin efek dari penghilangan garis tepi dan juga persen lebar komentar reply-nya.
Firefox 3.6.8 | Ubuntu 10.04
@iskandaria, Iya mas, mungkin lebih bagus jika doberi garis halus pada sisi kiri (IMO)
Firefox 3.6.8 | openSUSE
Mas Is,
Komentar bersarang dengan galur komentarnya tetap saja memiliki kelemahan dan kelebihan tersendiri. Rasanya seperti berusaha menegakkan trapesium, saya sendiri kadang bingung dibuatnya.
Google Chrome 5.0.375.99 | GNU/Linux
Mas Cahya,
Di satu sisi bisa sangat berguna, namun di sisi lain beresiko. Yach, yang penting berusaha untuk akrab atau memahami cara kerjanya saja deh. Seperti saya saat ini, berusaha mengerti dan memahami DISCUS :) Awalnya memang rada kagok (istilah Indonesianya apa ya). Tapi lama-lama saya juga terbiasa dan mulai familiar.
So, jangan terburu-buru memvonis kan? ^_^
Firefox 3.6.8 | Windows 7
Menurut saya tidak masalah mas. Threaded komen masih terlihat koq mas. Ini ditandai dengan posisi tulisan yang agak ke kanan pada komentar balasan. Hasilnya memamng lebih rapi. Sepertinya saya juga mesti melakukan sedikit perbaikan di area komentar saya. Terlihat kurang rapi pada komentar bersarang.
Google Chrome 5.0.375.99 | GNU/Linux
Bli Dani,
Jadi ada dua sisi yang seolah sulit akur di sini ya. Sisi tampilan secara umum dan sisi kemudahan trekking. Yang satu dioptimalkan, yang lain agak berkurang fungsinya. Tidak apalah, yang penting pembaca bisa tetap mengikuti alur interaksi lewat menyimak isi komentar satu per satu. Toh, masih ada sedikit margin menjorok ke dalam sebagai penanda. Ditambah dengan pengantar berupa sapaan/nama tujuan respon pada awal setiap komentar balasan
Mas Dunia Komputer,
Blog dunia komputer kan lebih banyak tutorial isinya. Jadi sepertinya interaksi pada area komentar kurang begitu banyak ya. Tapi tidak mengapa jika ingin membenahi tampilannya.
Opera 10.60 | Windows XP
@iskandaria, Master inovasi terus nih. Sip dah!
Firefox 3.6.8 | Arch Linux
Mas Iskandaria,
Pendapat Mas Jeprie di tulisan sebelumnya benar juga. Pengurangan detail tersebut mengurangi kemampuan ‘tracking’ untuk melihat alur komentar.
Tapi kesannya memang seperti tidak sesak lagi. Kembalikan ke kebanyakan subjektif pengguna saja.