Blog Section
Blog Section
Blog Section menampilkan kumpulan artikel, tulisan, atau konten unggulan dalam satu halaman. Pola ini membantu pengguna menemukan konten informatif, studi kasus, atau insight yang relevan dengan organisasi atau produk.
Penggunaan
Section titled “Penggunaan”Gunakan pola desain ini untuk menampilkan daftar artikel atau publikasi yang ingin ditonjolkan di halaman utama, halaman berita, atau bagian publikasi. Blog section ini membantu memperkuat komunikasi dan kredibilitas brand lewat konten yang terkurasi dan relevan bagi pengguna.
Anatomi
Section titled “Anatomi”Struktur Blog Section terdiri dari beberapa elemen utama yang bekerja bersama untuk memberikan pengalaman yang jelas dan terstruktur dalam menampilkan konten artikel.
Section Title
Menampilkan judul utama dari bagian blog, seperti "Artikel Terbaru" atau "Berita & Kegiatan".
Blog Card Container
Wadah yang menampung seluruh kartu artikel.
See More Button
Tombol untuk melihat artikel lainnya dalam daftar penuh.
Kategori
Section titled “Kategori”Desktop
Menampilkan beberapa artikel sekaligus dalam satu baris (3-4 kolom).
Cocok untuk halaman utama atau publikasi yang ingin menonjolkan lebih dari satu artikel secara seimbang.
Mobile
Menampilkan artikel dalam tata letak vertikal untuk menjaga keterbacaan pada layar kecil. Setiap kartu ditampilkan secara berurutan dengan jarak antar elemen yang konsisten.
Align: Left
Digunakan untuk tampilan formal dan informatif.
Align: Center
Cocok untuk halaman dengan fokus visual yang kuat, seperti konten editorial atau promosi.
Cara Penggunaan yang Disarankan
Section titled “Cara Penggunaan yang Disarankan”
✅ Disarankan
Pertahankan jarak antar kartu agar tampilan tetap rapi dan proporsional.
❌ Dihindari
Hindari menggunakan ukuran yang tidak sama saat menampilkan antar kartu.
✅ Disarankan
Batasi jumlah artikel dalam satu baris (3-4 artikel) untuk menjaga keterbacaan.
❌ Dihindari
Hindari menampilkan terlalu banyak artikel dalam satu tampilan karena dapat membebani halaman.
Penerapan
Section titled “Penerapan”Featured Blog Section
Digunakan untuk menampilkan artikel-artikel unggulan atau konten prioritas yang ingin disorot oleh pengguna. Biasanya ditempatkan di bagian atas halaman dengan tata letak grid 3-4 kolom untuk menonjolkan konten utama.
Artikel Terkait
Digunakan untuk menampilkan daftar artikel yang berkaitan atau berelasi dengan artikel yang sedang dibaca. Cocok digunakan di halaman berita, publikasi, atau dokumentasi kegiatan organisasi.
Spesifikasi
Section titled “Spesifikasi”Panduan jarak antar elemen, rasio gambar, dan padding untuk memastikan konsistensi visual antarkartu artikel.
