RSS

Design

Tue 2008 at 10:30 am by Yustian M

Selama berkeliling dijagat internet pastinya kita banyak melihat blog ataupun desain web yang menarik baik itu milik pribadi ataupun sebuah perusahaan. Bagaimana kita dapat mendapatkan inpirasi dan ide dari design blog yang kita lihat sehingga memungkinkan untuk menghasilkan desain website yang kuat dari sisi tampilan dan berkualitas yang akan memuaskan para klien.
Pertanyaannya sekarang hal apa saja yang dapat kita ambil dari setiap blog yang kita lihat? Jawabannya kita harus dapat menilai jenis atau kategori dan menentukan point mana yang sangat ditonjolkan didalam website itu yang akan menarik perhatian para pengunjungnya dilihat menurut desain yang dimilikinya. Artikel ini akan menunjukan tipe, jenis dan kategori themes website sesuai desainnya sehingga menjadi pertimbangan dalam proses pembuatan website.

1. Readability

Mudah dibaca merupakan salah satu faktor penting dan merupakan prioritas utama dalam kita membuat website dan blog. Walaupun kita memiliki content yang bagus bila sulit dibaca pastinya akan menyakitkan mata para pembaca. Maka dari itu sebuah desain dengan unsur readability sangatlah penting yang akan menunjang kualitas isi dari website.

Freelance Switch menggunakan padding untuk membuat kemudahan saat membaca.

Bila kamu memilih design ini hal yang harus diperhatikan adalah pada bagian header, navigasi dan sidebar sebisa mungkin menarik perhatian. Ada beberapa cara/strategi yang akan kita gunakan untuk mendesainnya:

  • Padding – Padding atau jarak antara content dengan gambar, garis pinggir themes dll sehingga membantu pada pembaca lebih terfokus pada content.
  • Short Paragraphs – Buat agar setiap paragraf pendek atau paling tidak 3-5 baris. Karena bila kamu membuat paragraf yang panjang akan membuat lelah para pembaca sekaligus memperlambat proses membaca.
  • Lists – Usahakan gunakan bullet untuk setiap list. Sehingga membuat menarik perhatian pembaca.
  • Bold Text – Bila website kamu penuh dengan teks berukuran yang sulit untuk dibaca berisiaplah untuk melihat pengunjung  pergi satu – persatu.
  • Line Spacing – Buat jarak yang sesuai antara teks.
  • Sub Header – Rancang dan pilih style huruf yang indah  untuk  sub judul sebisa mungkin mudah untuk dilihat para pembaca

Mirificam Press Menambahkan sebuah style visual pada sub judul.

2. Useful Sidebars

Sidebar merupakan salah satu hal terpenting dari desain blog karena memainkan peranan penting dalam memberikan kemudahan navigasi bagi pengunjung. Sidebar ini juga memberikan nilai tambah dari sisi desain sehingga kita harus membuatnya semenarik mungkin, memudahkan navigasi dan fitur yang sesuai content yang akan menambah point tinggi dari segi tampilan.

PSDTUTS menambahkan sidebar dengan gambar dari Flickr grup untuk di sharing ke pembaca.

Beberapa unsur yang harus diberikan bila memilih di blog jenis ini:

  • Popular posts
  • Recent posts
  • Advertisements
  • Blogroll/friends lists
  • Archives
  • Link to RSS feed
  • Category links
  • Recent comments
  • Promotion of products/services

Bila telah melihat unsur tersebut, kita juga dapat membuat beberapa sidebars dengan memberikan tag sehingga akan menarik perhatiaan para pengunjung dan membuat sidebar lebih relevan dengan setiap halaman web.

3. Unique

Jutaan blog dan ribuan website yang ada di internet yang memiliki desain cantik dan indah sehingga saat para pengunjung mampir mereka medah mengidentifikasi blog tersebut dan membuat mereka ingat dengannya. . Para desainer blog bertema ini sadar bukan hanya memberikan desain yang mudah dikenal dan diingat pengunjung , tetapi juga harus themes yang digunakan harus sesuai dengan pesan dan tujuan blog tersebut.Ada beberpa pendekatan yang dibuat oleh seorang blog designer untuk jenis ini:

Artistic/Creative

Salah satu cara untuk membuat design blog yang lebih menonjol dari yang lainnya adalah membuat desain yang sangat kreatif ini akan membuat blog kamu mempunyai ciri khas khusus.

Web Designer Wall

Typography-Based

Blog ini lebih menonjolkan style font yang digunakan.

Astheria

I Love Typography

Colorful

Dengan ini blog kamu lebih eye catching di mata pengunjung.

Macalicious

Interesting Headers

Sebaiknya buat header yang akan menarik perhatian pengunjung.

Yustian Blog

Mostly Lisa

Octwelve

Dark

Blog ini akan membuat visitor mudah untuk melihat objek yang ditampilkan.

New Concept

Tentunya ini hanya sebagian kecil keunikan atau pilihan untuk para desainer. Masih banyak kok ide yang unik yang dapat kita ambil namun perlu diingat jangan setiap desain harus berbeda dengan situs lain dan memiliki orisinalitas.

4. Comment Design

Bagian comment merupakan prioritas terakhir untuk desainer web, tetapi alangkah baiknya kalau pada bagian memberikan rasa beda bagi pembaca, terutama bagi pengunjung yang suka berkomentar.

Pro Blog Design memiliki design yang menarik pada comment.

Para designer sebaiknya menonjol pada bagian avatar, style tulisan dan buat dengan gaya yang berbeda sehingga para pembaca akan lebih bernafsu untuk memberikan commentar.

5. Integration of Ads

Kebanyakan blog saat ini menggunakan iklan untuk mendapatkan penghasilan bagi situsnya. Iklan yang dipasang mungkin saja dari AdSense, affiliate ads atau banner ads. Iklan memberikan harapan bagi blog agar dapat tetap bertahan hidup dan eksis, tetapi juga akan mendatangkan efek yang buruk pada desain dan pengunjung jika iklan ini tidak ditata dengan benar.

CSS-Trik menggunakan border pada banner di sidebar yang memilki hover berwarna merah, dan dan banner header diletakan dengan border yang unik dan memiliki hover efek.

Buat dan tempat iklan pada bagian yang diperuntukan hanya untuk iklan. Sehingga iklan akan nampak seperti salah satu bagian atau unsur dari design themes

6. Effective, Usable Navigation

Navigasi adalah salah satu faktor terpenting dalam memberikan pengalaman yang menarik pengunjung pada situs. Jangan melatekan menu navigasi di tempat yang tidak terlihat bagi pera pengunjung jika itu terjadi pengunjung akan segera meninggalkan situs.

Noupe memberikan kemudahan bagi pengunjung untuk menemukan konten yang mereka inginkan.

Mengembangkan dan mempertahankan keefektifan navigasi merupakan tantangan untuk desainer blog, karena konten akan terus ditambahkan ke blog, membuatnya lebih mudah untuk desain navigasi mengikuti haltersebut. Dalam beberapa cara dapat dipilih untuk mempertahankan navigasi , dalam hal ini gunakan internal link dalam posting dan update posting lama dengan link baru.

Namun, ada beberapa langkah dalam perancang website untuk meningkatkan navigasi.

Pertama, harus ada navigasi menu utama yang akan membawa pengunjung ke setiap halaman utama pada situs (seperti halaman About Kontak atau halaman lainnya diwordpress dikenal dengan page), dan sekunder navigasi menu yang sering digunakan untuk categori link.

Kedua, sidebar harus digunakan untuk memudahkan pembaca melihat konten yang paling penting di blog. Pupular post adalah cara untuk melakukan ini.

Ketiga, sidebar juga harus mencakup beberapa elemen navigasi standar blog seperti kategori link atau link ke halaman arsip.

Keempat, daerah bagian bawah pos  dapat digunakan untuk menyertakan link ke posting, atau ini dapat dilakukan secara manual oleh blogger bila dikehendaki pada posting tertentu contohnya menambahkan Related post.

7. Images in Posts

Salah satu cara blogger untuk mendapatkan pembaca adalah menggunakan gambar pada setiap posting blog. Tentu saja, posisi gambar diluar ruang lingkup dari tema blog desainer, tapi perancang design dapat berdampak pada aspek ini.Dengan ini Foto dapat lebih terlihat menarik.

Fuel Your Creativity menggunakan 10 pixel jarak dengan berder abu – abu pada gambar.

Untuk mengubah bagian ini silahkan edit CSS themes kamu. Buat space perbatasan dan padding antara gambar dengan bordernya. Yustian Blog juga akan merevisi bagian ini untuk desainnya.

8. Footer Design

Kebanyakan blog atau website yang baik akan memanfaatkan bagian footer untuk mendapatkan perhatian para pengunjung. Umumnya blog mengisi copyright, link ke homepage dan mungkin juga beberapa link ke setiap halaman website.

Productive Dreams mengisi posts dan comments, seperti Twitter adan Vi.sualize.us.

Ini bertujuan agar pada saat pengunjung melihat bagian bawah situs emreka dapat dengan mudah mengakses link – link yang ada diblog.

Blog.SpoonGraphics menggunakan footer untuk meletakan popular post dengan design yang memukau.

Tetapi lebih baik lagi bila menempatkan Social media integration, seperti Twitter , popular posts, recent comments dan masih banyak lagi yang dapat diisi di bagian ini.

9. Color Scheme

Warna tentu saja merupakan salah satu faktor yang paling penting di segala bentuk desain. Menentukan warna tema untuk sebuah blog adalah sesuatu yang tidak mudah dan akan memakan waktu. Warna ada kalanya akan membuat tampilan website lebih menarik dan kadang juga dapat merusak desain. Tetapi jangan kuwatir banyak sekali tool yang dapat membantu menangani masalah penggunaan warna .

Web Design Ledger memiliki fitur warna yang aktraktif berbeda dengan warna natural seperti orange, biru dan hijau.

Mr. Diggles menggunakan warna yang sangat sederhana , tetapi memiliki unsur dan nilai estetika yang tinggi dalam desainnya.

Beberapa blog menggunakan warna cerah, sedangkan yang lainnya menggunakan warna yang lebih sederhana, atau satu warna saja. Dalam hal ini tidak ada kata benar atau salah, hanya ada pilihan yang berbeda untuk situasi yang berbeda itulah terpenting.

10. Icons

Ikon dapat digunakan untuk memperbaiki tampilan sebuah situs. Kegunaan ikon adalah untuk menyampaikan pesan kepada pengunjung. Misalnya, ikon dari rumah umumnya dipahami untuk link ke halaman homepage situs. Bila digunakan dengan benar ikon memberikan sedikit tambahan point bagi desain situs.

NETTUTS, menggunakan icon untuk setiap judul. Ini juga dapat membantu pemilihan icon untuk website

Para designer blog dapat mendesign ikonnya sendiri atau menggunakan free ikon yang bertebaran di internet.

11. High Content

Karena blog sangat tergantung pada konten, desain blog harus bersahabat dengan konten.solusinya buat judul dengan ukuran yang besar dan kreatif tetapi pada bagian header situs jangan terlalu memakan space pada bagian atas, agar pembaca dengan mudah melihat isi konten blog. Seperti blog ini  tidak membuat ilustrasi pada bagian atas terlalu panjang kebawahDevlounge menggunakan header yang tidak terlalu memakan space yang akan membuat content berada pada bagian atas halaman situs.

12. Subscription Areas

RSS dan email subscribers adalah sumber hidup bagi blog. Untuk alasan ini jelas sangat penting bagi blog untuk dapat mengubah pengunjung menjadi pelanggan. Banyak pengunjung blog akan terbiasa dengan standar konvensi dari blog ke RSS feed dan email subscribers sebagai pilihan berlangganan berita untuk mengetahui berita terupdate situs kita. Biasanya daerah ini terletak di bagian atas sidebars, tetapi kadang-kadang mereka sudah sedikit lebih bawah. Seperti Yustian Blog ini menempatkannya dibagian atas dan bawah serta di posting artikel.ProbBogger mengisi RSS and email subscription pada bagian atas juga kiri sidebar.

You the Designer menggunakan bagian kiri header untuk meletakan subscription links dan iconnya.

Sebisa mungkin letakan link RSS ini pada bagian yang mudah dilihat pengunjung yang akan menjadi pelanggan berita situs kita. Kebanyakan blog juga menyertakan RSS bersama dengan ikon link. Ikon – ikon ini dapat di download di banyak situs

13. Social Media Integration

Banyak blog saat kelahirannya memasukan botton, badge atau link untuk mendorong pembaca agar memberikan suara mereka untuk konten pada situs sosial. Bila kuantitasnya terlalu banyak maka akan membuat desain blog kita menjadi rusak dan kelihat kotor. Metode terbaik adalah susun dengan rapi setiap botton yang muncul dan gunakan Addthis untuk memudahkan pengorganisirannya.Six Revisions meletakan button Digg yang berukuran kecil, disetiap bawah judul artikelnya. dengan ini memudahkan para pengunjung menemukannya.

Bagaimana sekarang apakah kamu sudah menentukan jenis atau kategori design blogmu? Bila sudah, tolong berikan linknya pada comment agar aku dapat memberikan penilaiannya untuk kamu. Kamu juga dapat mereview sendiri blog kamu di bagian comment artikel ini ya.

, , , , , , , , , ,

This post was written by:

- who has written 61 posts on Yustian Blog.

Artikel ini dapat disebar,dimodifikasi,dicopy dan digunakan sebagaimana semestinya. Dengan menyantumkan nama dan referensi asli. Dan bila ingin berlangganan berita dan artikel diblog ini silahkan Subscribe ke RSS Feed Yustian Blog dan Email Subscription Request

Contact the author

45 Comments For This Post





  1. 23 Dec 2008 11:20 pm

    #84
    Septian says:

    niatnya sih bikin blog yg tipe Eye Catching

    tapi kayaknya belum berhasil, soalnya masih bermasalah dalam penggunaan custom field :rose:

    http://animangazine.co.cc/





    • 23 Dec 2008 11:36 pm

      #85
      Yustian M says:

      Setelah liat – liat blog Mas Septian dasarnya cukup bagus tetapi sebagai tambahan sebaiknya pada bagian header tambahkan ilustrasi sesuai topik blognya :) dan pada bagian judul artikel ubah dengan penggunaan 1 warna saja tetapi singkron dengan bagian header atau body themes :)





  2. 24 Dec 2008 6:09 am

    #89
    project says:

    bikin ngiri semua deh tuh template2 yang pada di pajang





    • 24 Dec 2008 6:43 am

      #92
      Yustian M says:

      Haa….. buat saja template seperti yang ada diatas :pff:





  3. 02 Jan 2009 6:09 pm

    #118
    Luluk says:

    Berhubung saya awam di bidang IT dan belajar secara otodidak masih bingung nie mas membedakan blog dan web, dan bagaimana cara membuat web kl saya sudah punya account google dan blog-nya

    Thank you





    • 03 Jan 2009 12:46 am

      #131
      Yustian M says:

      Perbedaan mendasar antara web dan blog adalah dari isinya. Kalau web biasa isinya hanya sebuah profile sebuah perusahaan atau instansi. sedangkan blog memiliki isi yang lebih uptodate mengenai pemikiran atau pendapat seseorang dan dapat ditanggapi oleh para pengunjung blog tersebut. Sekarang ini banyak perusahaan atau instansi yang mengkombinasikan kedua fungsi tersebut :) . Anda dapat membuat web tanpa harus memiliki account google ;)





  4. 11 Jan 2009 7:55 pm

    #164
    adriazka says:

    keren mas. jadi bahan pelajaran nih. 8)





    • 12 Jan 2009 7:52 am

      #167
      Yustian M says:

      Selamat belajar mas dan semoga sukses :)





  5. 12 Jan 2009 8:02 pm

    #170
    khabibi says:

    Waduh waduh mas… pa bisa ya aku niru kaya gitu. aku pake opera mini dihp jadi pa mungkin aku memaksimalkan blog aku. kalo ga keberatan bimbing aku ya… hehe. MAKLUM,,, Baru satu minggu latihan ngeblok





    • 12 Jan 2009 8:10 pm

      #171
      Yustian M says:

      Blog anda sepertinya bisa mengambil kategori Readability dan Social Media Integration dengan melakukan sedikit perubahan cssnya :pff: . Kalau aku mas baru sebulan mendalami blogging :rose:





  6. 16 Jan 2009 5:04 pm

    #179
    pAtoNi says:

    maksih ya…
    mau sih buat blog yg bagus…tp masih gaptek he he
    sukses dech buat postingnya….bagus bgt





  7. 19 Jan 2009 4:48 pm

    #185
    jeprie says:

    thanx buat infonya.
    Saya juga buat blog tutorial photoshop di sini. Tapi masih belum bisa ngatur desainnya.
    Tolong bantu ya.





  8. 21 Jan 2009 3:21 am

    #190
    upload files and earn says:

    Your post is very interesting, i have bookmarked your blog for future referrence :)





    • 24 Jan 2009 7:34 am

      #197
      Yustian M says:

      I hope you enjoy in this blog :)





  9. 26 Jan 2009 10:43 pm

    #209
    Ramdan says:

    blog saya masuk yang mana tuh?





    • 27 Jan 2009 1:35 am

      #212
      Yustian M says:

      Menurut saya blog mas Ramdan masuk pada kategori Interesting Headers tuh :) . Alangkah baiknya lebih perkuat lagi ilustrasi yang digunakan pada bagian headernya pasti akan lebih ok :)





  10. 06 Feb 2009 11:28 am

    #248
    dani says:

    kayaknya mas yustian hrs buka kolom review blog gratis nih mas..

    saya kok naksir yg model simpel tp elegan ya, tp ngga geh estetikanya..scr ngga sanggup ngedit jeroannya :(

    bole dong di-review jg [walau blm tentu saya bs ngubahnya nanti] :)
    makasi mas yustian





  11. 19 Feb 2009 3:28 pm

    #275
    Anneke Priskila says:

    Duh jadi pengen banget punya saya juga bisa kayak blog ini.

    Salam kenal ya Tian. Mohon izin dilink, makasih… ;)





  12. 22 Feb 2009 10:12 pm

    #301
    abid famasya says:

    Mas.. Aku mau cari icon yang cocok.. Kira2 dimana ya? :pff:





    • 04 Apr 2009 11:07 am

      #415
      Yustian M says:

      Tanya ama Om google keyword free icon





  13. 06 Apr 2009 9:35 pm

    #420
    HARUM GENTONG says:

    KEREN WEBNYA, GMN YA BUATNYA, GW BUAT BLOG TP MSH PEMULA, HEHEHE
    AJARIN DUNK KANG, PAK, OM !!!!!!!!!!!!!!!!! HEHEHEHEH
    THX





  14. 30 May 2009 1:40 pm

    #529
    Jaarwo al klateni says:

    apa kabar teman teman santri…?aku rindu sekali dengan pondok…salam buat Ust Abdul kholiq,Afif,mbah Imam, mbah wandi mbah Hari pak Bag pak Isro pak mul pak Said mas yuli mas wawan mas duloh pokoke semua penghuni pomdok dan para simpatisanya jazakumullohu khoyron katsiron





  15. 31 May 2009 5:54 pm

    #531
    sklep wedkarski says:

    Cool site, i will come back here, regards





  16. 04 Jun 2009 10:16 pm

    #541
    teksty z linkiem says:

    Interesting website, i have bookmarked your site for future referrence :)





  17. 25 Jun 2009 5:25 am

    #593
    dhenk says:

    Yup… Menurut ku design memang sangat ampuh buat menarik pengunjung,,, karena pandangan mata lah yang menjadi image pertama ketika visitor datang, terutama dengan visitor yang baru pertama kali datang, iya ga bro…??





    • 02 Jul 2009 6:35 am

      #604
      Yustian M says:

      Betul bro saya sependapat dengan anda :)





  18. 02 Jul 2009 1:51 am

    #601
    rengsorang says:

    pengen…sih pengen
    kemampuan kita di bawah standart nasional sih
    salam hangat…bro :)





  19. 09 Aug 2009 8:36 am

    #657
    immam says:

    Bung berapa biaya yang harus dikeluarkan untuk jasa disain web dinamis ?





  20. 12 Aug 2009 2:31 am

    #662
    Rusli Zainal says:

    Manthap…





  21. 12 Aug 2009 2:00 pm

    #664
    yaufani adam says:

    makasih mas atas infonya ….





  22. 23 Sep 2009 12:44 am

    #721
    adit says:

    kak, bisa bantu buatin desain theme kayak gini bwt blogspot?
    desainnya keren
    kalo boleh aku mw ngedit bag headernya aja…
    ohya, aku jg suka mendalami IT n design, tapi aku anak kedokteran, hehehe
    thx





  23. 05 Oct 2009 4:58 pm

    #732
    andi says:

    nais inpo gan :)





  24. 03 Nov 2009 11:25 am

    #783
    automnz...... says:

    kak boleh bntu bwtin theme kyax gini di web ku?
    themex bgus, imajinativ. :pff:





  25. 06 Jan 2010 6:23 am

    #861
    zahrah says:

    Kalau menurut mas Yustian desain web saya bagaimana tolong dikritik





    • 01 Mar 2010 3:50 am

      #940
      Yustian M says:

      Good & clean design …!! Tapi sedikit terkesan sedikit kaku pada bagian header dan sidebarnya mungkin bagian header lebih diperbesar dan sidebarnya dapat dikelompokan menjadi satu saja agar kelihatan sedikit lebih unik. Secara keseluran cukup bagus.. Ok salam sukses :D





  26. 08 Apr 2010 3:05 pm

    #984
    Lirik Lagu Barat says:

    Benar2 design super creative..saya suka theme ini.. :love:





  27. 24 Apr 2010 11:11 am

    #1020
    wpgallery says:

    ya mas emang benar. blog kita harus punya design yang bagus kalau ingin mendapat banyak traffic semakin bagus design blog kita maka pengunjung akan betah di blog kita BTW header sama footer blog ini keren habis..salam kenal ya





  28. 05 Jun 2010 5:54 pm

    #1060
    zahrah says:

    Mas Yustian terimakasih kritik membangunnya, :) saran mas yustian sudah saya ikuti, mudah-mudahan tidak terkesan kaku lagi… btw linknya udah aku pasang di http://www.zahrah-eshop.com/links/2?lPath=1





  29. 14 Jul 2010 2:14 am

    #1092
    zha says:

    hehehe.. sip bagus2 tuh maz.. yg dpajang..

    klo mw download video tutorial bkin kya desain2 d atas tuh kra2 dnmna ya mazz..??
    mhon bntuanx krn aq pngen bgd maz bs bkin desain kya gtu.. :pff:





  30. 06 Aug 2010 12:43 pm

    #1126
    Febri says:

    aku susah banget klo nata blog !!! kayaknya klo dikenalin keliatannya ga bagus deh =( !!!! gimana sih cara nata blog biar orang yang ngeliat biar betah!!! :) berhubung aku emang orang awam bid. ngeblog !!! 8)





  31. 19 Aug 2010 10:16 am

    #1142
    Iskandar says:

    Mantap ni Blog ny, keren habis… tapi bagi Aq susah banget, pa lagi yg kurang jiwa seninya… minta tolong ajarin buat tampilan templete seperti punya Mas dong…!! dan ngatur tata letak tampilan ny gimana y…?? Makasih sebelumnya…





  32. 28 Nov 2010 5:52 pm

    #1177
    ridwan says:

    Mas barner nya udah aku pasang, mohon barner blog aku juga dipasang….
    thanks sebelumnya . . .





  33. 09 May 2011 12:09 pm

    #1317
    buy proviron says:

    Ik heb gezocht op het internet proberen om ideeën over hoe je mijn persoonlijke blog site gecodeerd, uw huidige stijl en thema wonderbaar zijn te vinden. Heb je code het je zelf of heb je aanwerving van een coder om het gedaan te krijgen persoonlijk voor u?





  34. 31 May 2011 4:37 pm

    #1334
    heru says:

    salam kenal gan…gimana caranya buat blog agar banyak dikunjungi orang.tq





  35. 21 Sep 2011 11:36 pm

    #1446
    SuGaBzZ says:

    Good Good Good …
    Boleh belajar dari situ gak ???
    8) :):):) 8)8)8)8)8)

Leave a Reply

:p 8) :lol: =( :8 ;) :(( :o: :[ :) :D :-| :bloody: :cool: :choler: :love: :oups: :aie: :beurk: :canny: :go: :miam: :ueue: :nose: :oh: :oups2: :prud: :yo: :sadd: :bloody2: :cache: :rose: :sure: :dream: :neo: :yes: :sweat: :kiss: :creve: :what: :pff: :hm: :bobo: :ciao: :dribble: :gene: