10 materi

Belajar Membuat Layout Website dengan CSS

Layout website adalah cara untuk menyusun elemen-elemen di website secara visual dengan membaginya ke bagian-bagian tertentu.

Misalnya di website berita ada elemen logo, menu, banner, daftar artikel terbaru, daftar artikel populer, kontak dan menu informasi. Maka elemen-elemen tersebut bisa disusun menjadi seperti berikut:

1. Navbar, berisi logo dan menu. Posisinya paling atas sendiri.
2. Banner, berisi artikel utama. Posisinya di bawah Navbar, memenuhi lebar halaman website.
3. Main, berisi daftar artikel terbaru. Posisinya di bawah Banner.
4. Sidebar, berisi daftar artikel populer. Posisinya di sebelah Main.
5. Footer, berisi kontak dan menu informasi. Posisinya paling bawah sendiri.

Susunan di atas adalah layout yang paling umum digunakan di website berita. Disusun seperti itu agar semua konten di dalam website dapat ditampilkan dengan baik dan rapi secara visual.

Layout website secara visual hanya bisa dibuat dengan CSS, sedangkan HTML hanya untuk kerangkanya saja.

Di panduan ini, kita akan belajar membuat layout dengan CSS, mulai dengan mengenal properti-properti untuk membuat layout, jenis-jenis layout website, layout responsive, dan diakhiri dengan praktik membuat layout untuk beberapa website.

Mulai Belajar