Ide & Tren Cemerlang untuk Widget Posting Fitur yang menonjol

Menjalankan majalah online yang sukses membutuhkan audiens yang solid dan banyak tulisan berkualitas tinggi. Namun tata letak majalah juga memainkan faktor penting dalam keterlibatan pengunjung. Salah satu teknik adalah membuat widget posting fitur di bagian atas beranda. Ini menampilkan artikel-artikel terbaru yang paling populer untuk mendorong pembaca lebih jauh ke dalam situs.

Dalam posting ini saya ingin membahas teknik desain yang dapat digunakan untuk membuat widget posting fitur yang sukses. Meskipun widget ini sering bekerja paling baik pada tata letak gaya majalah, Anda juga dapat menerapkannya pada blog yang lebih kecil atau situs web konten dinamis.

Kontras tipografi

Sebagian besar tulisan fitur bergantung pada gambar kecil untuk menarik perhatian. Ini sering mengambil bentuk gambar latar belakang yang diikat ke setiap judul artikel.

Teknik ini terlihat fantastis tetapi itu sulit untuk membangun kontras yang terlihat antara tipografi dan gambar latar belakang yang dinamis. Dengan mempelajari majalah lain, Anda dapat mengambil teknik halus untuk membantu meningkatkan keterbacaan.

Next Web adalah majalah online besar dengan widget posting yang menonjol di beranda. Setiap thumbnail berbeda-beda ukurannya tetapi semuanya digunakan gradien gelap untuk meningkatkan kontras.

Judul artikel ditempatkan di bagian bawah blok thumbnail di atas gradien gelap. Itu teks terang mudah dikonsumsi pada latar belakang yang gelap, namun juga tidak mencakup keseluruhan gambar.

Kemajuan modern dalam CSS3 memungkinkan pengembang untuk membuat ulang efek ini dengan mudah. Gradien tetap sempurna jika Anda bisa melakukannya mengalir secara alami di atas setiap thumbnail dan masih cukup pamer gambar untuk menarik perhatian.

Teknik yang sedikit berbeda digunakan di beranda Digital Trends. Widget posting ini menggunakan latar belakang padat kontras tinggi di balik teks untuk membuat setiap judul menjadi renyah dan bersemangat.

Perbedaannya di sini adalah bahwa setiap warna latar belakang adalah 100% solid. Anda tidak dapat melihat seluruh gambar mini foto begitu porsi kecil hilang dari pandangan. Tapi teksnya jelas terbaca yang sama menariknya dengan pengunjung yang pertama kali mendarat di beranda Digital Trends.

Menemukan jumlah kontras yang tepat itu sulit. Beberapa situs web seperti TechCrunch mencoba menempatkan teks di sebelah thumbnail untuk menghilangkan masalah ini sepenuhnya.

Tetapi jika Anda menyukai gaya desain teks judul di atas thumbnail, Anda akan menginginkannya pertimbangkan bagaimana faktor kontras masuk ke dalam persamaan.

Ukuran Gambar Sporadis

Nilai widget posting yang ditampilkan adalah untuk konten fitur di bagian atas halaman. Asimetri adalah cara yang bagus untuk membawa perhatian pada sesuatu, dan dalam hal ini ukuran thumbnail asimetris sangat bagus.

Ambil contoh beranda ZDNet. Dalam widget unggulannya, artikel terbesar di sebelah kiri menggunakan gambar thumbnail terluas untuk mengambil lebih banyak ruang dan mudah-mudahan menarik lebih banyak perhatian. Thumbnail berfitur lainnya jatuh ke ukuran yang lebih kecil dengan tajuk berita yang lebih kecil.

Perhatikan bagaimana struktur kotak ini secara alami mengarahkan mata Anda ke sekeliling halaman. Pandangan setiap pengunjung cenderung jatuh di satu area tertentu, lalu berpindah di antara setiap thumbnail hingga sesuatu melompat keluar.

ZDNet juga menempatkan a gradien gelap di atas setiap gambar mini membangun kontras tipografi untuk teks yang lebih mudah dibaca. Pada dasarnya ini adalah salah satu desain widget posting fitur terbaik yang pernah saya lihat.

Gaya desain yang sangat mirip dapat ditemukan di beranda CNET. Thumbnail terbesar mengambil tempat di sisi kiri karena sebagian besar pengunjung membaca dari kiri ke kanan.

Saat merancang widget posting fitur Anda sendiri, jangan merasa wajib untuk mengikuti teknik yang sama ini. Anda dapat menggunakan ukuran thumbnail apa pun asalkan sesuai satu sama lain secara kohesif dan membentuk tata letak kotak yang terpadu.

Gaya Gambar Mini Kustom

Pilihan desain sangat bervariasi dari tata letak hingga tata letak sehingga tidak ada satu solusi yang sempurna. Widget posting yang ditampilkan jelas lebih kompleks untuk dirancang, sehingga membutuhkan penelitian dan kesabaran agar sesuai dengan tata letak khusus.

Gaya setiap thumbnail mempengaruhi bagaimana keseluruhan widget terlihat oleh audiens Anda. Ambil contoh gaya widget unggulan yang ditemukan di The Verge.

Setiap thumbnail memiliki gradien warna-warni di atas foto. Ini meningkatkan kontras dan meningkatkan keterbacaan, tetapi juga menambah bakat tertentu ke situs web juga.

Beberapa orang tidak menyukai gaya ini karena mereka merasa mencolok atau tidak menarik. Tapi itu juga agak populer di kalangan pembaca Verge dan desainer lain meniru gaya ini.

Namun warna dan teknik mewah bukan satu-satunya faktor yang perlu dipertimbangkan. Ukuran kisi dan thumbnail juga harus dipilih dengan hati-hati karena membantu menentukan gaya widget posting yang ditampilkan secara keseluruhan.

Mungkin salah satu contoh terbaik adalah desain Mashable yang telah melalui banyak fase selama bertahun-tahun. Sekarang dianggap sebagai sumber berita utama, Mashable berfungsi untuk menjejalkan banyak posting ke beranda untuk memudahkan penjelajahan.

Beberapa posting menggunakan thumbnail persegi kecil sementara papan peringkat utama mereka memperbaiki banner thumbnail berukuran besar untuk artikel tersebut. Ini harus memerlukan kerja ekstra dari editor untuk memastikan bahwa semua posting memiliki foto yang sesuai dengan ukuran yang benar.

Tetapi segera setelah mendarat di situs Anda akan melihat itu memberikan rasa kredibilitas. Gaya ini terasa sangat umum dan dapat digunakan oleh hampir semua jenis majalah online untuk membangun kepercayaan dengan readerbase. Satu-satunya masalah adalah menulis konten yang cukup untuk mengisi halaman!

Widget Multi-Posting

Beberapa fitur posting widget menampilkan artikel di a kotak statis. Ini sering menjadi pilihan paling populer karena bisa jadi dibuat responsif dan berpadu apik dalam tata letak apa pun.

Widget lain bergantung pada interaksi dinamis seperti tampilan slide. Ambil contoh beranda Vanity Fair dengan blok postingan unggulan mereka di bagian atas halaman. Hanya satu posting yang ditampilkan pada satu waktu tetapi artikel baru ditampilkan ketika mengarahkan judul tertentu.

Baik thumbnail maupun judul pembaruan otomatis dengan interaksi melayang sederhana. Satu hal yang perlu diperhatikan adalah ini bisa sangat membingungkan bagi pengguna internet yang tidak terbiasa dengan teknik melayang dinamis ini.

Tetapi di sisi positifnya teknik ini akan menghemat ruang pada halaman dengan menyembunyikan konten berlebih.

Cobalah untuk tidak menganggap widget posting unggulan sebagai hitam-putih. Itu hanya bagian halaman yang digunakan untuk menampilkan artikel paling menarik atau populer. Teknik yang digunakan untuk menyelesaikan tugas ini selalu terbuka untuk diperdebatkan.

Majalah Complex menggunakan tampilan slide penuh untuk widget unggulannya. Setiap posting memiliki thumbnail fitur bersama dengan gradien bawah untuk kontras tipografi.

Tapi alih-alih menempatkan setiap thumbnail bersebelahan, artikel-artikel itu streaming secara dinamis melalui kotak slideshow. Navigasi dapat diatur secara otomatis atau dikendalikan oleh tautan panah. Desain ini menghemat banyak ruang dan membuat pengguna lebih mau berinteraksi dengan halaman.

Bungkus

Tidak ada desain benar atau salah ketika datang ke menampilkan posting yang ditampilkan. Mereka semua memiliki banyak sifat yang sama tetapi setiap majalah menggunakan gaya mereka sendiri untuk mengatur konten yang ditampilkan.

Saya harap posting ini menawarkan tips praktis untuk digunakan ketika merancang widget posting fitur Anda sendiri. Jika Anda merasa buntu, lihat saja ke majalah lain untuk mencari inspirasi. Temukan sifat-sifat yang Anda sukai dan cari cara mereplikasi mereka untuk berbaur dengan desain majalah Anda sendiri.