10 Elemen Desain Semua Blog Besar Memiliki Kesamaan

Diterbitkan: 2011-10-18

Setiap kali Anda membuat sesuatu yang baru, apakah itu produk, layanan, atau situs web, mulailah dengan melihat apa yang telah dibuat orang lain sebelum Anda.

Untuk membantu Anda menetapkan fondasi untuk desain blog Anda, saya telah mencantumkan 10 elemen desain yang hampir dimiliki semua blog besar dan bagaimana Anda dapat menerapkannya di blog WordPress Anda.

10 Blog Besar

Untuk memberi Anda beberapa data keras, saya memilih untuk menggunakan Mashable, TechCrunch, The Next Web, GigaOM, Blog Seth, Copyblogger, Problogger, Blog KISSmetrics, Freelance Switch, dan The Oatmeal sebagai contoh untuk posting ini.

tajuk

Header di sembilan dari sepuluh situs ini memiliki tinggi 100 piksel atau kurang. Kebanyakan dari mereka termasuk logo dan bilah pencarian.

Logo (10/10)

Kesepuluh blog ini memiliki logo mereka di sudut kiri atas dan hyperlink ke halaman rumah.

Header Logo Gigaom

Logo GigaOM.com ada di kiri atas dan tertaut ke beranda.

Bagaimana menerapkan logo hyperlink: Sebagian besar tema WordPress (yaitu WooThemes, Thesis, Genesis, dll.) memungkinkan Anda mengunggah logo melalui pengaturan desain tema dan secara otomatis menautkan ke rumah.

Kotak Pencarian (6/10)

Enam dari sepuluh blog besar memiliki kotak pencarian di sisi kanan header. Blog dan Copyblogger Seth menempatkan bilah pencarian mereka di bagian atas bilah sisi. Blog KISSmetrics dan The Oatmeal tidak memiliki mekanisme pencarian.

Kotak Pencarian Web Berikutnya

Kotak pencarian TheNextWeb.com ada di sisi kanan header.

Cara menerapkan kotak pencarian: Anda dapat menempatkan bilah pencarian sebagai widget di area Appearance > Widgets pada tema Anda. Jika Anda tidak memiliki header widget, ini adalah php untuk kotak pencarian:

<?php get_search_form(); ?>

Tempatkan di dalam header.php atau file php kustom tema Anda. Jika Anda tidak terbiasa dengan php, letakkan di dekat bagian atas sidebar Anda di dalam area widget.

Area Konten

Delapan dari sepuluh blog besar menampilkan area konten di sebelah kiri dan sidebar di sebelah kanan. Berikut adalah beberapa elemen desain yang lebih umum dalam area konten.

Tombol Sosial (Penggeser) (10/10)

Semua blog besar menyertakan tombol berbagi sosial dengan Like/Share Facebook dan Tweet Twitter menjadi yang paling populer. Tombol +1 Google dan Bagikan LinkedIn juga populer. Tombol Digg, StumbleUpon, dan Reddit tidak terdaftar sesering dulu.

Baik Mashable dan TechCrunch memiliki bilah geser sosial di sisi kiri konten yang meluncur ke bawah saat Anda menggulir halaman ke bawah. IncomeDiary juga memiliki ini.

Tombol Berbagi Sosial Techcrunch

Ikon berbagi TechCrunch.com ada di margin kiri dan mereka menggulir ke bawah halaman.

Cara menerapkan tombol sosial: Jika Anda memilih untuk tidak membuat hardcode tombol ke dalam tema Anda, saya merekomendasikan plugin Tombol Suka, Tombol Twitter Mudah, dan Tombol Google +1 WordPress. Gunakan plugin Sharebar untuk menempatkan slider sosial bergulir di sisi kiri konten Anda.

Posting Terkait (7/10)

Tujuh dari sepuluh blog tersebut menampilkan area posting terkait di bagian bawah setiap posting. Ini mendorong orang untuk membaca lebih banyak artikel Anda, menghabiskan lebih banyak waktu di situs Anda, dan menjadi lebih terlibat dengan blog atau bisnis Anda.

Posting Terkait FreelanceSwitch

FreelanceSwitch.com menampilkan tiga posting terkait di bagian bawah setiap posting.

Bagaimana menerapkan posting terkait: Saya sepenuh hati mendukung plugin Postingan Mirip Rob Marsh. Anda juga memerlukan plugin Post-Plugin Library agar rangkaian pluginnya berfungsi di situs Anda.

Posting Footer Ajakan Bertindak (5/10)

Setengah dari blog besar memiliki ajakan bertindak yang sangat spesifik di bagian bawah posting. Biasanya ajakan bertindak adalah berlangganan atau membeli.

Lima blog lainnya hanya mendorong Anda untuk berbagi, berkomentar, atau mengklik iklan. Dengan satu atau lain cara, mereka semua memiliki ajakan untuk bertindak.

Ajakan Bertindak TheOatmeal

Ajakan TheOatmeal.com biasanya untuk membeli buku The Oatmeal.

Cara menerapkan ajakan bertindak footer posting: Karena setiap tema bekerja secara berbeda, sulit untuk memberikan instruksi khusus di sini. Yang harus Anda lakukan adalah menghubungkan sepotong HTML ke tema Anda di bagian bawah area konten Anda dan di atas area komentar.

Bilah samping

Bilah sisi biasanya sekitar setengah lebar area konten, dan seperti yang saya sebutkan sebelumnya, sebagian besar bilah sisi ada di sebelah kanan.

Keikutsertaan Bilah Sisi (8/10)

Delapan dari sepuluh situs ini memiliki opt-in di sidebar mereka dan lima di antaranya berada di atas. Kata-kata Pembaruan Gratis dan Berlangganan adalah berita utama dan ajakan bertindak yang paling umum.

Keikutsertaan Berlangganan Copyblogger

Keikutsertaan Copyblogger.com ada di bagian atas bilah sisi dengan tajuk utama, PEMBARUAN GRATIS, dan ajakan bertindak, BERGABUNG DENGAN KAMI.

Cara menerapkan keikutsertaan bilah sisi: Setiap penyedia pemasaran email utama memiliki semacam pembuat formulir yang mengeluarkan HTML. Sematkan HTML di widget teks dan letakkan di bagian atas bilah sisi Anda. Anda mungkin harus bermain-main dengan CSS agar terlihat seperti yang Anda inginkan.

Postingan Populer (7/10)

Menampilkan posting populer Anda adalah cara yang bagus untuk memperkenalkan pengunjung baru ke konten terbaik di blog Anda. Tujuh dari sepuluh mempromosikan posting mereka yang paling populer di sidebar mereka.

Postingan Populer Kissmetrics

Blog KISSmetrics menampilkan posting populer mereka di sidebar mereka.

Bagaimana menerapkan posting populer: Gunakan plugin Posting Populer Rob Marsh untuk menampilkan posting Anda yang paling banyak dilihat. Instal plugin dan Anda akan menemukan widget "Popular Posts +" yang dapat Anda tarik dan lepas ke sidebar Anda.

Tautan Media Sosial (9/10)

Sembilan dari sepuluh blog menampilkan tautan ke profil media sosial mereka dengan Twitter dan Facebook menjadi yang paling populer. Tokoh lainnya adalah YouTube, LinkedIn, StumbleUpon, Flickr, dan Tumblr.

Bilah Sisi Ikon Sosial yang Dapat Dihancurkan

Sidebar Mashable.com menampilkan Kotak Suka, +1, Ikuti, LinkedIn, YouTube, Stumble, dan RSS.

Cara menerapkan tautan media sosial: Anda dapat membuat Kotak Suka Facebook di sini. Atau Anda bisa mendapatkan ikon media sosial gratis untuk membuat tombol Anda sendiri di sini.

Produk/Iklan (9/10)

Sembilan dari sepuluh mempromosikan produk atau iklan mereka di sidebar, dan lima di antaranya menampilkan keduanya. Satu-satunya alasan TheOatmeal.com tidak melakukannya adalah karena ia menampilkan produk terutama sebagai ajakan untuk bertindak.

Bilah Sisi Buku Seth Godin

Seth Godin mencantumkan semua bukunya di bilah sisinya dengan yang terbaru di bagian atas.

Cara menambahkan produk dan iklan: Menampilkan produk Anda di bilah sisi semudah menulis HTML dan menempatkannya di widget teks arbitrer. Untuk menampilkan iklan bergilir di sidebar Anda, saya merekomendasikan plugin OIOpublisher.

catatan kaki

Secara tradisional, footer digunakan sebagai tempat untuk mencantumkan tautan ke setiap sudut dan celah situs web Anda. Tetapi sebagian besar situs sekarang memilih desain yang lebih minimalis dengan footer mereka.

Kategori atau Tautan Lainnya (5/10)

Dari lima blog besar yang memiliki footer lebih kuat, semuanya mencantumkan tautan kategori atau tautan lain sebagai area menu navigasi tambahan.

Kategori Footer Problogger

Problogger.net mencantumkan semua kategori mereka di footer mereka untuk membantu pengunjung menavigasi konten.

Cara menerapkan tautan footer: Banyak tema WordPress memiliki footer widget. Jika milik Anda, gunakan widget Teks untuk menempatkan HTML di dalam footer Anda. Mirip dengan ajakan bertindak di footer posting, sulit untuk memberikan instruksi terperinci di sini karena setiap tema berbeda.

Lebih Banyak Pertanyaan?

Jika Anda ingin kiat lebih lanjut tentang cara menerapkan elemen desain ini ke blog atau tema spesifik Anda, tinggalkan komentar di bawah dan saya akan mengarahkan Anda ke arah yang benar.

Baca lebih lanjut: '13 Tip Desain Blog Tingkat Pakar untuk Pemula'