blogilicious palembang 2011 - desain blog (stripped)
Embed Size (px)
DESCRIPTION
Peran desain blog dan prinsip-prinsip desain blog yang baik. Dibawakan di Blogilicious Palembang, 5 Juli 2011. Full presentation version: http://db.tt/l5mnefITRANSCRIPT
- 1. Desain Blog Palembang | 5 Juni 2011
- 2. http://about.me/andisaleh
- 3. Peran Desain Blog Antarmuka
- 4. Antarmuka Back-end Front-end Konten Pengunjung Antarmuka
- 5. Peran Desain BlogAntarmuka Teknis Tema
- 6. iniJIE.com | inijie.com
- 7. Blog Teknologi | teknologi.gravisware.com
- 8. Kartunmania | kartunmania.wordpress.com
- 9. Keluarga Nugraha | keluarganugraha.net
- 10. Jurus Grafis | jurusgrafis.com
- 11. GoenRocks Vlog | goenrock.com
- 12. Ruang Freelance | ruangfreelance.com
- 13. idBlogNetwork | idblognetwork.com
- 14. Tema Topik utama (Niche/ceruk) Elemen visual yang relevanBlog yang masuk akal & dapat dipercaya
- 15. Peran Desain BlogAntarmuka Teknis Tema Identitas
- 16. Per Mei 2011163 juta blogRata-rata 67 ribu blog baru/hari Sumber: blogpulse.com
- 17. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 18. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 19. Konsistensi Ekspektasi
- 20. Konsistensi Anatomi blog Newbie Fotografer Blog | patrush.wordpress.com
- 21. Konsistensi Anatomi blog Header Navigasi Konten Sidebar Newbie Fotografer Blog | patrush.wordpress.com
- 22. Header NavigasiSidebar Konten Coretan Tanganku | m-aulia-r.blogspot.com
- 23. Header NavigasiSidebar Konten Coretan Tanganku | m-aulia-r.blogspot.com
- 24. Jurnalnya Nike | nike.rasyid.net
- 25. My Xperience | fandagri.blogdetik.com
- 26. Konsistensi Logo Pojok kiri atas Tagline di bawah logo Taut ke halaman depan
- 27. Konsistensi Home Pada logo Pilihan pertama dalam navigasi Beberapa terminologi
- 28. bennychandra.com
- 29. Itik Kecil | itikkecil.wordpress.com
- 30. HIPMI Sumsel | hipmisumsel.org
- 31. Tpas Pangacaprukan Mojang Bandung | liezmaya.web.id
- 32. Konsistensi Navigasi Horizontal di bagian atas Halaman dan kategori penting
- 33. Konsistensi Kotak pencarian Kanan atas Mencari ke dalam blog
- 34. Konsistensi Sidebar Kategori dan Arsip Fitur pendukung
- 35. Konsistensi Footer Di bagian bawah Navigasi sekunder Pernyataan copyright, peta situs, kontak webmaster
- 36. Konsistensi Konsistensi memberi pengunjung gambaran yang jelas mengenai: di mana mereka berada apa yang bisa mereka lakukan Melalui bahasa visual yang telah mereka kenali dari blog/situs lain
- 37. Konsistensi
- 38. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 39. Navigasi
- 40. Navigasi Menu navigasi utama Bagian khusus promosi konten Halaman peta situs dan arsip Tautan internal di dalam tulisan Fitur pencarian
- 41. Menu navigasi utama Posisi yang mudah dilihat dan dikenali Tautan yang jelas ke Home Tautan ke halaman/kategori utama lain Raditya Dika | radityadika.com
- 42. Promosi konten Tulisan terbaru Tulisan terpopuler Komentar terbaru Kategori & arsip bulanan imansulaiman.com
- 43. Peta situs & arsip Berdasarkan kategori Berdasarkan tanggal terbit Jimmy Sun | jimmysun.net
- 44. Breadcrumb! Hirarki yang jelas Taut, kecuali item terakhir YopDesign | yopdesign.com
- 45. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 46. Tipografi cuddlysheepdesigns.be
- 47. Tipografi Readable Kontras warna Lebar blok teks
- 48. Tipografi Readable
- 49. Tipografi Readable
- 50. Tipografi ReadableKontras warnahttp://snook.ca/technical/colour_contrast/colour.html
- 51. Tipografi Readable Blok teks ~ 5080 CPL (karakter per baris)
- 52. Tipografi Readable Priyadis Place | priyadi.net
- 53. Tipografi Readable
- 54. Tipografi Scalable Gunakan ukuran font relatif
- 55. Tipografi Scalable andi.saleh.web.id
- 56. Tipografi Available Fontstack Gunakan fail-safe font
- 57. Tipografi media.24ways.org/2007/17/fontmatrix.html
- 58. Tipografi Sans-serif Calibri, Tahoma, Geneva, Arial, Helvetica Neue, Helvetica, sans-serif Serif Constantia, Lucida Bright, Liberation Serif, Georgia, serif
- 59. Tipografi Web font google.com/webfonts
- 60. kartunama.net/blog
- 61. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 62. Kecepatan Teknis Cepat untuk dibuka
- 63. Kecepatan Optimasi: Gambar Kode
- 64. Kecepatan CSS sprite generator csssprites.com Analisa kecepatan Firefox Extension: YSlow addons.mozilla.org/en-US/firefox/addon/yslow/
- 65. Membandingkan load time: whichloadsfaster.com
- 66. Kecepatan Struktur Cepat untuk dipindai
- 67. Aziz Hadi Photoworks | azizhadi.com/category/blog
- 68. Kecepatan Konten Cepat untuk dipahami
- 69. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 70. Tata letak C.R.A.P. Contrast Repetition Alignment Proximity
- 71. Shimmering Pearl | n45y4.wordpress.com
- 72. Pensil Warna Design | graphic-3d.pensilwarnadesign.com
- 73. blog.faniez.net
- 74. Jafis | jafis.net
- 75. Tata letak White space
- 76. myraffaell.com/blog
- 77. albasit.Sketchbook | albasit.tumblr.com
- 78. NavinoT | navinot.com
- 79. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 80. Interaksi Ajak pengunjung berpartisipasi Feedback dan rating Komentar Kontribusi konten
- 81. Interaksi Richard Fang | richardfang.com
- 82. Interaksi gantibaju.com
- 83. Blog ePalembang | blog.epalembang.com
- 84. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 85. Aksesibilitas Bangun akses Usabale Cross-browser dan cross-platform
- 86. Aksesibilitas Usable Simpel Fokus pada pengunjung Manusia pertama, mesin kedua
- 87. Aksesibilitas Cross-browser IE, Firefox, Safari, Opera Cross-platform PC, Apple, Linux, mobile
- 88. Aksesibilitas Tes! browsercam.com multibrowserviewer.com
- 89. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 90. Teknologi
- 91. Teknologi Pikirkan nilai tambah yang diberikan Jangan jadikan faktor penentu
- 92. http://about.me/andisaleh
- 93. Cara mendapatkan Theme Unduh yang gratis Beli yang berbayar Buat sendiri
- 94. WordPresshttp://wordpress.org/extend/themes
- 95. WordPresswpcharity.com
- 96. Bloggerbtemplates.com
- 97. Bloggerbloggerthemes.net
- 98. Theme gratis Biaya: Rp0,- Fungsi general, tema general Sedikit ruang untuk customization Dukungan komunitas
- 99. Theme gratis Besar peluang dipakai juga oleh blog lain Mencantumkan nama (dan link) desainer Umumnya dilarang digunakan secara komersil
- 100. Theme berbayar Biaya: $x - $xxx Fungsi spesifik, tema spesifik Banyak ruang untuk customization
- 101. Theme berbayar Garansi dan dukungan developer (dan komunitas) Kecil peluang dipakai juga oleh blog lain Penggunaan dan credit diatur lisensi
- 102. WordPresstokokoo.com
- 103. Buat sendiri Biaya: gratis s/d sangat mahal Fungsi sangat spesifik, tema sangat spesifik Unik dan personal Kendali total!
- 104. Membuat desain blog sendiri Kuasai HTML dan CSS
- 105. w3schools.com
- 106. Membuat desain blog sendiri Kuasai HTML dan CSS Kuasai platform blog
- 107. codex.wordpress.org
- 108. http://google.com/support/blogger
- 109. Membuat desain blog sendiri Kuasai HTML dan CSS Kuasai platform blog Follow the rules
- 110. 8 Prinsip DasarKonsistensi Tata letakNavigasi InteraksiTipografi AksesibilitasKecepatan Teknologi
- 111. BREAK THE RULES!
- 112. Desain BlogAndi [email protected] Palembang | 5 Juni 2011