HTML Layout dan Navigation
Apa Itu Layout dan Navigation?
Layout dalam HTML adalah cara kita menyusun elemen-elemen dalam halaman web agar terlihat terstruktur dan mudah dibaca. Biasanya kita menggunakan elemen seperti:
<div>
: wadah umum untuk mengelompokkan elemen<header>
: bagian atas halaman (biasanya berisi logo, judul, dan menu)<main>
: isi utama dari halaman<footer>
: bagian bawah halaman (biasanya berisi copyright, kontak, dll.)<section>
,<article>
,<aside>
: untuk pengelompokan konten secara semantik
Sementara itu, navigation (navigasi) adalah menu atau tautan yang membantu pengguna berpindah antar halaman atau bagian dalam website. Biasanya dibungkus dalam elemen <nav>
.
Contoh Layout dan Navigation
<!DOCTYPE html>
Website Saya
Selamat Datang
Ini adalah halaman utama dari website saya.
Tentang Saya
Saya sedang belajar HTML & Web Development.
Kesimpulan
- Elemen layout seperti <header>, <main>, <footer>, <section>, dan <div> digunakan untuk menyusun tampilan halaman agar rapi dan semantik.
- Navigasi dibuat dengan tag <nav> dan isi link di dalamnya.
- Struktur layout yang baik memudahkan pengguna dan pengembang memahami isi halaman.
- Kombinasi layout dan navigasi adalah fondasi dari semua website modern.
- Gunakan elemen semantik untuk membuat kode HTML kamu lebih terstruktur dan mudah dipahami — baik oleh manusia maupun mesin pencari (SEO)!