Blogging Tips: Faktor Desain
Ribuan situs dan blog telah saya lewati, termasuk produk lokal dan luar negeri. Ternyata ada sedikit hikmah yang bisa dipelajari. Ungkapan Content is King sudah sering kita dengar, tapi menurutku Delivery is Queen. Unsur penyajian, atau delivery, bisa meliputi penampilan, tataan, dan alur penggunaan.
Dalam kesempatan kali ini, kita akan membahas unsur desain dan penerapannya di sebuah situs, tetapi bukan dilihat dari unsur seni. Karena seni itu relatif dan tergantung selera masing2 orang, maka kita lebih menekankan ke arah usability, agar keseluruhan situs lebih enak untuk dinikmati.
Sebelum kita melanjutkan, perlu diingat bahwa saya bukan seorang desainer dan tidak punya pendidikan tentang (web) design. Artikel di bawah merupakan ringkasan2 dari artikel2 yang pernah saya baca, dan ditulis dari sudut pandang seorang pengguna.
Tujuan Desain
Tiap halaman tentunya mempunyai suatu inti yang perlu ditonjolkan. Kita ambil contoh saja sebuah blog artikel yang anda baca ini, tentunya konsentrasi utama adalah artikel yang anda baca. Tapi masih banyak elemen2 lain seperti navigasi dan modul2 di sisi kanan yang perlu ditampilkan. Salah satu tujuan desain adalah menyajikan artikel utama sebagai unsur yang paling dominan, makanya artikel ini lebih lebar daripada sidebar di kanan.
Pemilihan Layout
Layout atau tataan utama, merupakan suatu kerangka dasar yang akan sering diulang di halaman2 selanjutnya. Pemilihan tataan dalam suatu situs mempermudah pengguna menjelajahi tiap halaman. Oleh karena itu diperlukan konsistensi antara tataan halaman pertama, dan halaman lainnya. Macam2 layout bisa dipilih, seperti fluid width atau fixed width (berat kiri atau berat kanan). Sedikit tips bagi desainer yang memulai dari awal, yaitu penggunaan Grid 960.
Warna & Kontras
Pemilihan warna dan aturan konstras adalah unsur yang paling parah dari situs2 amatir yang pernah saya jumpai. Pengunaan warna sangat penting untuk membuat suatu elemen lebih menonjol dari yang lain, termasuk membuat teks lebih gampang dibaca. Saran saya adalah stay natural, atau mengikuti warna2 alam, dan jangan sekali2 menggunakan warna2 neon untuk latar belakang. Gampangnya, mulailah dengan dengan warna hitam putih dengan gradasi, dilanjutkan dengan aplikasi warna. Untuk inspirasi urusan warna, silahkan coba ColourLovers.
Pengaturan Text
Perbandingan besar tulisan antara judul dan teks juga memudahkan pembaca untuk memilah2 isi bacaan. Pilihlah ukuran font normal (10-11 pt) untuk teks dan perhatikan line spacing agar tidak terlalu rapat. Salah satu tip yang biasa saya pakai adalah blok satu paragraf dengan Firefox browser (default setting). Perhatikan jarak antara baris seperti di foto di bawah, bila anda melihat ada ruang, berarti line spacing tidak terlalu rapat.

White Space
Trik lainnya adalah penggunaan white space, yaitu pengaturan ruang kosong di antara elemen2 halaman. Seperti jarak antara blok2 paragraf, dan elemen2 lainnya seperti modul dan navigasi. Untuk jelasnya, saya sarankan simak link berikut.
Masih banyak unsur2 desain yang bisa dipakai sebagai acuan, dan bukan berarti penerapan yang benar. Bila anda memulai suatu situs dari awal, dan tidak mempunyai latar belakan seni, sebaiknya cari yang profesional.
Bila anda juga seorang desainer, dan ada tips2 lain, silahkan berbagi. Pendapat pembaca juga sangat dihargai koq
Catatan: Artikel ini merupakan bagian dari kampanye One-Post-Per-Day. Silahkan simak artikel2 lainnya.
Jangan lewatkan artikel berikutnya, silahkan berlangganan lewat RSS feed!
Posted in Blogging Tips, User Experience at August 12th, 2008.
Trackback URI: trackback
Tags: Blog Design, Blogging Tips, Design, OPPD
August 12th, 2008 at 10:26 pm # BARRY
Saya mau redesign blog tapi masih belum ada yang sreg nih.
August 12th, 2008 at 10:40 pm # raminator
Presentation/Design/Usability is queen. Setuju dengan assessment nya. Simple, well laid out, clear and no clutter is the best. A List Apart is a great example. Termasuk juga manggoaddict
August 12th, 2008 at 10:45 pm # Nigel Sielegar
Sebagai designer … ini versi tips saya tentang topik2 diatas.
Tujuan Desain: guru saya Milton Glaser selalu bilang :” design is all about intention”. Sudah ada luar biasa banyak contoh design dan product gagal dikarenakan “intention” tidak terkonsentrasi. Contoh paling gampang website lama dari barnes and noble. mungkin masih bisa didapat articlenya di web.
Pemilihan Layout: didalam masalah blogging. kebanyakan blog isinya text heavy. Jadinya kunci utama untuk layout dan warna hanya satu, Information Hierarchy. Information hierarchy yang tidak terjaga membuat alur informasi yang dibaca menjadi tidak teratur juga.
Warna rada tricky. tapi, ada cara curang yang bisa dipakai. Color combination adalah bagian design yang bisa ditiru tanpa perlu memakai ijin. website diatas boleh dipakai, cuman benarnya itu bukan yang terbaik. dikarenakan semua elemen design itu context dependent.
Pengaturan Text: sama seperti layout , text ikut dalam aturan hierarchy. Untungnya website hanya memperbolehkan certain font. sehingga kemungkinan kombinasi font yang tidak sesuai sudah kecil (diluar masih banyak yang jelek sih). dan sama dengan white space, ajaran dari Bauhaus movement di jerman dulu adalah: “kita membaca white space diseputaran komposisi dan huruf, kita bukan membaca objectnya sendiri” oleh karena itu semakin inventive white spacenya semakin menarik bentuknya.
and that’s it …. sekian sedikit tips dari saya. Cheers!
August 12th, 2008 at 10:46 pm # Akhmad Fathonih
Tips-tips yang menarik. Saya harus mulai mengikuti tips di atas supaya blog saya rada rapian dikit :d.
Saya mo menyumbang satu link yang baru saja saya baca kemarin: http://feeds.feedburner.com/~r/Blogsessive/~3/359356284/
Di sana ada beberapa tips tentang desain yang beberapa telah sempat disinggung dalam post di atas.
Oh ya, untuk typography, I fell in love to this site: http://anima.dudut.com/
August 12th, 2008 at 11:05 pm # kohaci
UseIT , itu situs yang bagus untuk membahas masalah desain dan konten sebuah situs, ada si Jakob Nielsen pakar web usebility
August 13th, 2008 at 2:35 am # Mahendra
kalau soal warna, saya lebih suka cari ide dari http://www.colorschemer.com
August 13th, 2008 at 5:05 am # Akhmad Fathonih
Jacob Nielsen? Banyak orang yang tak setuju dengan Jacob Nielsen recently. Soalnya banyak yang menganggap patokan yang dipakai Jacob Nielsen does not applies to web. Salah satu kritik yang kuingat dari Jacob Nielsen adalah: why blogger write a successive URL using “this”, “here”, and “this one” link.
I am no designer, so I don’t know what’s the “correct” one. However “this”, “here” and “this one” is still make sense for me :p
@Nigel
great tips!
August 13th, 2008 at 9:31 am # Ivan Sielegar
@Barry - Pake Wordpress aja, banyak theme yang bagus2 koq.
@Raminator - Terima kasih
@Nigel - Guest Post ?
@Akhmad - Thanks for sharing!
@Kohaci - UseIT is one of the reason why I am writing this article. It’s like 1980’s sites. So, I go away as soon as I can
@Mahendra - Nice site!
August 13th, 2008 at 10:46 am # Paman Gober
Pemilihan theme menjadi sangat krusial bagi saya, blog saya ajah udah ganti puluhan theme, ga tau berapa lama theme yang baru ini akan bertahan
August 13th, 2008 at 1:30 pm # garing
Biasanya pemilihian theme disesuaikan dengan suasan hati juga.
August 13th, 2008 at 4:30 pm # tetetzet
ganti2 terus sambil bereksperimen tentunya..
August 13th, 2008 at 9:56 pm # zee
Memilih desain dan warna memang pekerjaan yg ga mudah, even mereka yg kerja di bagian layout aja bs pusing soal padu padan. Makanya saran ni buat yg hobi buat free theme, dibuatlah yg macam2 biar ada pilihan …
August 13th, 2008 at 10:25 pm # bowbee
Wah, masalah warna itu yang saya kurang bisa. Saya menyerahkannya kepada theme wordpress yang ada (saya rasa warna2 disana sudah bagus)
August 15th, 2008 at 8:24 pm # jimmy
nyerah deh kalo soal design, kalo saya mending jadi programmer daripada designer
August 20th, 2008 at 5:33 pm # hakimtea
kang Jimmy ini, padahal kan ga jauh2 amat dari programer ke designer…. tinggal loncat dikit kang
Btw, bener mas… sama ni pembahasannya… siiip
August 20th, 2008 at 6:02 pm # Ivan Sielegar
@Paman Gober - Jangan ganti melulu, yang berkunjung yang bingung.
@Garing - Ini dia .. satu lagi
@Tetetzet - Tambah satu lagi
@Zee - Betul tuh, mungkin juga isa buat penghasilan tambahan.
@Bowbee - Warna emang gampang2 susah koq. Banyak belajar di colourlover tuh
@Jimmy - Hehehe typical dilema otak kanan dan otak kiri
@Hakimtea - Makasih dah mampir. Sering2 yah
August 24th, 2008 at 8:00 pm # Is Content Really The King - Geek Building The Bridge Part 2
[...] the court’s jester would be an endless promotion. Either via (social) networking, or SEO. MangoAddict said content is the king, and delivery is the queen. Delivery is how you crown the content so it [...]
August 24th, 2008 at 10:17 pm # Bayu Aditya
saya malah ga kepikiran white space pas ngetik
August 29th, 2008 at 4:33 am # Blog Strategi + Manajemen
Desain techcrunch sebelum edisi terkini, saya suka sekali. Mereka baru ganti desain semiggu lalu, dan agaknya yang sebelumnya lebih bagus.
Desain Gigaom juga oke.
Kalau media manstream, saya suka dengan desain New York Times.
September 4th, 2008 at 10:36 pm # Shugoshin
Wah ada triknya jg toh, kalo saya ga ngerti ngdesign, tp tipsnya bs dicoba, thanks.
September 7th, 2008 at 6:31 pm # Iwan
saya mau sih redesign blog. kepengennya sih di wrodpress. tapi kalo mau redesign sesuai dengan selera kita, harus bayar ya? makanya saya pake blogspot aja.