Halo, Sahabat Pemrograman! Pernah mendengar tentang <section> dalam dunia HTML? Bagi kamu yang baru terjun dalam belajar pemrograman web, istilah ini mungkin masih asing. Tapi, jangan khawatir! Kali ini kita akan membahas secara mendalam tentang fungsi section pada HTML dan bagaimana perngaruhnya untuk SEO.
So, silahkan simak sharing kita kali ini sampai selesai!
Apa Itu HTML?
HTML adalah singkatan dari Hypertext Markup Language. Ini adalah bahasa markup yang digunakan untuk membuat dan memformat halaman web. HTML digunakan untuk menentukan struktur dan konten dari sebuah halaman web, termasuk teks, gambar, video, dan elemen-elemen lainnya.
Dalam HTML, konten pada halaman web dikelompokkan dalam elemen-elemen HTML. Setiap elemen HTML memiliki tag pembuka dan tag penutup, dan konten yang ingin ditampilkan di antara keduanya. Tag pembuka dan tag penutup ditempatkan di sekitar konten, dan tag penutup diawali dengan tanda slash (/) untuk menandakan bahwa elemen tersebut akan ditutup.
Contohnya, elemen HTML untuk membuat paragraf adalah <p>. Tag pembuka <p> ditempatkan sebelum teks paragraf, dan tag penutup </p> ditempatkan setelah teks paragraf. Berikut adalah contoh kode HTML untuk menampilkan paragraf:
<p>Ini adalah sebuah paragraf.</p>
HTML juga mendukung atribut, yang dapat digunakan untuk menambahkan informasi tambahan pada elemen HTML. Atribut ditempatkan di dalam tag pembuka, dan biasanya terdiri dari sebuah nama atribut dan sebuah nilai atribut yang ditempatkan di antara tanda kutip ganda (“) atau tanda kutip tunggal (‘).
Contohnya, atribut “src” pada elemen HTML <img> digunakan untuk menentukan sumber gambar yang ingin ditampilkan. Berikut adalah contoh kode HTML untuk menampilkan gambar:
<img src="gambar.jpg" alt="Deskripsi Gambar">
Dalam contoh tersebut, atribut “src” digunakan untuk menentukan sumber gambar, sedangkan atribut “alt” digunakan untuk memberikan deskripsi gambar.
🔥 Baca Juga : Teknik SEO Link Building Yang Efektif Agar Web Rank 1 Google
Apa Itu <Section> pada HTML?
Nah, sekarang kita tahu apa itu HTML, mari kita lanjutkan ke topik utama kita yaitu fungsi section pada HTML. Dalam HTML, ‘section’ adalah salah satu dari berbagai jenis elemen yang bisa kamu gunakan untuk mengatur dan memformat konten web kamu.
Elemen ‘section’ biasanya digunakan untuk mengelompokkan konten yang berhubungan dalam satu bagian atau ‘section’. Ini membantu dalam meningkatkan struktur dan keterbacaan sebuah website.
Contoh penggunaan <section> dalam HTML adalah sebagai berikut:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hermes Medical</title>
</head>
<body>
<section> <!-- ini adalah section -->
<h1>Jasa Pembuatan Website</h1>
<p>
IXORA SEO melayani jasa pembuatan website dan Jasa Optimasi SEO <br>
Dimana kamu akan mendapatkan desain website profesional dan masuk page one google
</p>
</section>
<section>
<h1>Fitur Unggulan</h1>
<h3>
Desain SEO Friendly
</h3>
<p>
Dapatkan tampilan website Mobile SEO Friendly
</p>
<h3>
Support 24/7
</h3>
<p>
Konsultasi bebas selama 24 jam
</p>
<h3>
Optimasi SEO
</h3>
<p>
Free Optimasi SEO sehingga web mudah di index google.
</p>
</section>
</body>
</html>
Dalam contoh di atas, <section> digunakan untuk memisahkan dua konten yang saling berhubungan. Banyak tidaknya section yang dibuat, itu semua bisa ditentukan sesuai dengan yang kamu butuhkan.
🔥 Baca Juga : Cara Membuat URL Blog yang Menarik dan SEO-Friendly
Fungsi Section pada HTML
Lalu, apa sebenarnya fungsi section pada HTML? Berikut ini adalah beberapa fungsi dari <section> di HTML yang harus kamu tau :
1️⃣ Membantu Dalam Struktur Konten
Salah satu fungsi utama dari elemen ‘section’ adalah membantu dalam struktur konten. Dengan menggunakan ‘section’, kamu bisa mengelompokkan dan memisahkan bagian-bagian dari konten web kamu yang berhubungan. Hal ini akan membuat konten kamu lebih terstruktur dan mudah dipahami oleh pengguna.
2️⃣ Meningkatkan Keterbacaan
Elemen ‘section’ juga bisa meningkatkan keterbacaan website kamu. Dengan membagi konten kamu ke dalam berbagai ‘section’, pengguna akan lebih mudah menemukan informasi yang mereka cari. Ini juga akan membuat pengalaman pengguna menjadi lebih baik saat mengunjungi website kamu.
3️⃣ Memudahkan Optimasi SEO
Fungsi section pada HTML juga berkaitan erat dengan SEO. Dengan struktur konten yang lebih terorganisir, mesin pencari akan lebih mudah mengenali konten pada website kamu. Ini bisa membantu dalam meningkatkan peringkat website kamu di hasil pencarian mesin pencari.
🔥 Baca Juga : 4 Tips Mudah SEO UMKM: Panduan Pemula Untuk Optimasi Bisnis
Apa perbedaan section dan DIV?
Section dan DIV adalah dua elemen HTML yang digunakan untuk mengelompokkan dan memformat konten pada halaman web. Meskipun keduanya dapat digunakan untuk tujuan yang serupa, ada beberapa perbedaan antara keduanya.
Fungsionalitas:
- Section
Digunakan untuk mengelompokkan konten pada halaman web yang memiliki arti terkait, misalnya bagian-bagian dari sebuah artikel. - DIV
Digunakan untuk mengelompokkan konten pada halaman web secara generik.
Penggunaan:
- Section
Biasanya digunakan dalam konteks struktur halaman web, seperti header, main content, sidebar, dan footer. - DIV
Biasanya digunakan untuk mengelompokkan elemen-elemen visual pada halaman web, seperti layout, style, dan tampilan.
Dalam penggunaannya, section lebih disarankan untuk digunakan karena memiliki arti yang lebih jelas dan spesifik, sementara DIV lebih cocok digunakan untuk tujuan yang lebih generik dan visual. Namun, penggunaan section atau DIV tergantung pada kebutuhan dan preferensi pengembang web.
🔥 Baca Juga : Cara Menghubungkan CSS ke HTML dengan file style.css
Kesimpulan
Itulah beberapa fungsi section pada HTML. Dengan pemahaman yang baik tentang fungsi ini, kamu bisa membuat website yang lebih terstruktur, mudah dibaca, dan ramah SEO. Jadi, jangan ragu untuk mulai belajar dan menggunakan elemen ‘section’ dalam pembuatan website kamu.
Ingat, belajar pemrograman bukanlah hal yang sulit asalkan kamu bersedia meluangkan waktu dan berlatih secara konsisten. Semoga artikel ini bisa membantu kamu dalam memahami fungsi section pada HTML.
Apabila kamu merasa artikel ini bisa bermanfaat untuk banyak orang, silakan bantu kita untuk share artikel ini kepada teman-temanmu ya. Dan apabila ada hal yang ingin kamu tanyakan, silahkan bisa bertanya melalui kolom komentar yang tersedia dibawah ini!