🎯 Tujuan

Tutorial ini bertujuan untuk menerapkan hierarki font yang konsisten pada website untuk perangkat desktop, tablet, dan mobile. Tujuannya adalah memastikan teks di website terlihat rapi, terstruktur, dan mudah dibaca di semua ukuran layar.

⏰ Konteks

Hierarki font sangat penting untuk menjaga keteraturan informasi dan meningkatkan pengalaman pengguna. Menggunakan ukuran dan gaya font yang tepat sesuai dengan perangkat (desktop, tablet, mobile) akan memberikan pengalaman yang konsisten dan nyaman bagi pengguna.

🪵 Hal yang Diperlukan

1. Akses ke editor WordPress.
2. SOP Font https://it.dakobc.com/SOP-font/.
3. Tools untuk pengujian responsivitas (seperti Chrome DevTools atau ekstensi untuk tampilan mobile dan tablet).

📹 Video Tutorial

https://youtu.be/6w59WLNdaKs

📋 Langkah-Langkah

1. Akses Panduan Font:
   • Buka URL yang telah disediakan untuk melihat pedoman hierarki font yang telah ditetapkan.
2. Pahami Pedoman Hierarki Font:
   • Pelajari ukuran dan gaya font yang berlaku untuk setiap elemen teks (Main Title, Heading 1, Heading 2, dll).
3. Terapkan Hierarki Font:
   • Implementasikan hierarki font pada halaman website yang sedang dikerjakan untuk setiap perangkat (desktop, tablet, mobile) sesuai pedoman yang ada.

Kesimpulan Dengan menerapkan hierarki font yang konsisten:

• Desktop: Ukuran font yang lebih besar digunakan untuk judul utama dan heading agar lebih menonjol di layar besar.
• Tablet: Ukuran font disesuaikan agar nyaman dilihat di layar yang lebih kecil sambil tetap mempertahankan struktur hierarki.
• Mobile: Ukuran font dibuat lebih kecil dan tetap mudah dibaca tanpa harus memperbesar tampilan, tetap menjaga penekanan pada elemen penting seperti judul dan heading.

✅ Definisi Selesai