404 Section
404 Section
404: Halaman Tidak Ditemukan
Maaf, halaman yang Anda cari tidak tersedia. Halaman tersebut mungkin telah dipindahkan atau tidak lagi dapat diakses.
404 Section digunakan untuk memberitahu pengguna bahwa halaman atau tautan yang mereka tuju tidak tersedia.
Pola ini membantu pengguna kembali ke jalur utama dengan menyediakan elemen Call-to-Action (CTA) seperti tombol “Kembali ke Beranda”.
Penggunaan
Section titled “Penggunaan”Gunakan 404 Section pada halaman kosong, rusak, atau tidak ditemukan untuk mengarahkan pengguna ke halaman yang masih aktif.
Pola ini membantu pengguna kembali ke jalur utama dengan menyediakan elemen Call-to-Action (CTA) seperti tombol “Kembali ke Beranda”.
Anatomi
Section titled “Anatomi”Title
Description
Text Content
Pesan utama yang menjelaskan kondisi halaman, seperti "Halaman Tidak Ditemukan" sekaligus teks tambahan untuk memberikan konteks atau penjelasan singkat dan tombol tindakan untuk mengarahkan pengguna kembali ke halaman utama atau halaman lain yang relevan.
Illustration
Elemen visual yang memperkuat pesan kesalahan.
Kategori
Section titled “Kategori”Kategori pada 404 Section berfokus pada pengaturan alignment serta opsi penambahan ilustrasi.
Horizontal
Menampilkan ilustrasi di sisi kanan atau kiri dengan teks dan tombol di sisi berlawanan. Cocok untuk tampilan desktop untuk menjaga keseimbangan visual.
Title
Description
Horizontal with Icon
Menambahkan ikon tambahan di atas judul sebagai penanda visual kesalahan. Cocok untuk tampilan yang lebih kompak seperti halaman mobile.
Title
Description
Vertical
Menampilkan semua elemen (ikon, teks, tombol) secara vertikal di tengah layar. Cocok untuk halaman dengan ruang terbatas atau tampilan responsif.
Title
Description
Cara Penggunaan yang Disarankan
Section titled “Cara Penggunaan yang Disarankan”Teks Utama (Text Content)
Gunakan bagian ini untuk menambahkan elemen teks seperti kode error, judul, deskripsi, dan tombol tindakan (CTA).
Teks berfungsi memberi konteks kepada pengguna tentang apa yang terjadi dan langkah apa yang bisa dilakukan selanjutnya. Misalnya, tombol untuk kembali ke beranda atau memuat ulang halaman.
Ilustrasi
Tambahkan ilustrasi yang relevan untuk memperkuat pesan.
Pilih gaya ilustrasi yang konsisten dengan identitas visual produk dan tetap menjaga keseimbangan antara teks dan gambar agar tampilan tidak terasa berat.
Informasi yang Jelas
✅ Disarankan
Tampilkan pesan 404 yang jelas pada bagian judul dan deskripsi.
❌ Dihindari
Jangan gunakan pesan umum seperti "Terjadi kesalahan" tanpa penjelasan tambahan.
✅ Disarankan
Gunakan nada yang sopan, tenang, dan membantu. Tunjukan empati tanpa membuat pengguna merasa bersalah.
❌ Dihindari
Hindari bahasa yang menyalahkan atau terkesan bercanda. Nada atau bahasa tersebut dapat dianggap tidak profesional, terutama di konteks layanan publik.
✅ Disarankan
Gunakan tombol CTA yang membantu pengguna mengambil langkah berikutnya. Pastikan tombol mudah ditemukan dan menggunakan kata kerja yang jelas.
❌ Dihindari
Jangan biarkan pengguna tanpa arah atau tombol tindakan apa pun. Hindari penggunaan CTA yang tidak relevan dengan konteks halaman error, seperti tautan ke halaman acak atau promosi.
Penerapan
Section titled “Penerapan”Halaman 404
404 Section ditempatkan pada halaman khusus yang berdiri sendiri, yaitu halaman 404 atau Not Found. atau Not Found. Halaman ini muncul ketika halaman yang dituju pengguna tidak berhasil ditemukan.
404: Halaman Tidak Ditemukan
Maaf, halaman yang Anda cari tidak tersedia. Halaman tersebut mungkin telah dipindahkan atau tidak lagi dapat diakses.
Spesifikasi
Section titled “Spesifikasi”Pastikan jarak antar elemen (spacing), ukuran font untuk judul dan deskripsi, proporsi ilustrasi, dan pastikan tombol CTA memiliki kontras warna yang cukup.