 |
| tag sectioning |
Langsung saja ini adalah penjelasan dan fungsi tag sectioning.
<body>
Elemen utama sebagai tempat untuk mendifinisikan konten halaman web. Elemen body bersifat wajib dan hanya boleh dipakai sekali dalam sebuah dokumen.
<header>
Untuk mengelompokan informasi-informasi pendahuluan. Tag ini boleh digunakan berkali-kali di halaman yang sama. Elemen header lazim dipakai untuk menampilkan halaman web misalnya logo, nama website, menu utama, termasuk juga kotak pencarian (search). Namun tag <header> juga bisa disisipkan di awal elemen lain, misalnya di awal elemen article dan section. Gunanya untuk memberikan ringkasan atau prakata mengenai isi elemen tersebut.
<footer>
Untuk mengelompokan informasi-informasi pelengkap. Tag ini boleh digunakan berkali-kali pada halaman yang sama. Elemen footer lazim dipakai untuk menampilkan info pelengkap halaman web, misalnya mengenai hak cipta, link profil, link ketentuan, link form kontak, termasuk juga alamat korespondensi. Tag <footer> juga bisa disisipkan di akhir elemen lain. Gunanya untuk memberikan info terkait sebuah artikel, misalnya profil penulis atau catatan kaki.
<nav>
Untuk mengelompokkan link navigasi. Umumnya tag ini ditempatkan di dalam elemen header untuk menyajikan daftar link menu utama. Tag <nav> juga bisa ditempatkan secara terpisah diluar header.
<main>
Untuk mengelompokkan konten utama yang hanya di khususkan bagi halaman web ini. Konten info global seperti logo, kotak pencarian, sidebar dan link navigasi sebaiknya tidak ditempatkan dibagian ini. Hanya boleh ada satu tag <main> dan letaknya tidak boleh didalam tag <header>, <footer>, <nav>, <aside>, atau <article>.
Saat ini browser IE belum mendukung tag <main>. Solusinya, tambahkan atribut role="main".
<article>
Untuk memisahkan konten sebuah item artikel misalnya konten sebuah posting blog atau artikel berita. Elemen artikel bisa berisi judul, paragraf, gambar dan sebagainya.
Tag <article> berguna untuk membedakan isi artikel satu dengan artikel lain yang ada di halaman yang sama.
<section>
Untuk mengelompokkan beberapa konten dengan topik yang sama. Tag ini bisa dipakai di dalam elemen main untuk mengelompokkan beberapa topik artikel yang sama. Tag <section> juga bisa dipakai di dalam elemen article untuk mengelompokkan sub topik yang sama.
<aside>
Untuk memisahkan konten diluar topik utama, namun masih memiliki kesamaan tema. Tag <aside> bisa dipakai di dalam elemen article atau section untuk memberikan info mengenai konten lain yang terkait dengan isi elemen tersebut. Tag <aside> juga lebih sering digunakan untuk menandai daftar link halaman terkait di sidebar.
<address>
Untuk mengelompokan informasi kontak. Secara default isi elemen address akan ditampilkan dalam bentuk teks dengan efek cetak miring. Jika ditempatkan di footer website, tag <address> bisa dipakai untuk mencantumkan data alamat usaha, nomor telepon dan email resmi. Jika ditempatkan di footer elemen article, tag <address> bisa dipakai untuk mencantumkan data kontak penulis artikel.
Tentunya tehnik sectioning juga perlu dikombinasikan dengan CSS, sehingga tampilan halaman web menjadi lebih baik dan bagus, berwarna serta tertata lebih rapi. Kita akan mempelajari CSS di artikel selanjutnya.
1. Tidak semua pertanyaan dapat dijawab.
2. Komentar mengandung link akan otomatis terhapus.
3. Kode emoticon » :) :D :p :v :3 :x :| :cool: :sorry: :sip: :email: :bingung: