Primer lesson: hyper text markup language

Bahasa Markup Hiperteks (HTML)

HTML adalah singkatan dari Hypertext Markup Language. Ini adalah bahasa markup standar untuk dokumen yang dirancang untuk ditampilkan di browser web. HTML dapat dibantu oleh teknologi seperti Cascading Style Sheets (CSS) dan bahasa scripting seperti JavaScript.

Landasan Web

Pada intinya, internet adalah jaringan komputer luas yang terhubung secara global. Cara utama kita berinteraksi dengan jaringan ini adalah melalui World Wide Web (WWW), sebuah sistem dokumen hypertext yang saling terkait dan diakses melalui internet. Inti dari WWW adalah halaman web, yaitu dokumen yang ditulis dalam HTML. HTML menyediakan struktur dasar situs, yang kemudian ditingkatkan dan dimodifikasi oleh teknologi lain seperti CSS dan JavaScript.

Struktur Dokumen HTML

Dokumen HTML disusun menurut sekumpulan tag bersarang, yang merupakan elemen yang diapit tanda kurung sudut. Tag ini memberi tahu browser web cara menampilkan konten. Contoh struktur dokumen HTML sederhana adalah:

 <!DOCTYPEhtml>
<html>
    <kepala>
        <title>Judul Halaman</title>
    </kepala>
    <tubuh>
        <h1>Ini adalah Judul</h1>
        <p>Ini adalah sebuah paragraf.</p>
    </tubuh>
</html>

Kode ini mendefinisikan halaman web dasar dengan judul, judul, dan paragraf teks.

Elemen dan Tag HTML

Dokumen HTML terdiri dari elemen HTML. Setiap elemen diwakili oleh tag awal, beberapa konten, dan tag akhir. Tag awal dan akhir suatu elemen identik, hanya saja tag akhir menyertakan garis miring sebelum nama elemen.

Misalnya, tag <code><p></code> mengapit paragraf teks, dan strukturnya sebagai berikut:

 <p>Ini adalah contoh paragraf.</p>

Elemen yang berbeda memiliki tujuan yang berbeda. Contohnya:

Tag <code><h1>...</h1></code> hingga <code><h6>...</h6></code> digunakan untuk judul.
Tag <code><a></code> mendefinisikan hyperlink.
Tag <code><img></code> menyematkan gambar ke dalam dokumen.

Atribut

Elemen HTML dapat memiliki atribut yang memberikan informasi tambahan tentang elemen tersebut. Atribut ditempatkan di dalam tag awal suatu elemen dan sering kali diberikan dalam pasangan nama/nilai seperti <code>name="value"</code>.

Misalnya, untuk menyematkan gambar, kita menggunakan tag <code><img></code> dengan atribut <code>src</code> (source) untuk menentukan URL gambar:

 <img src="url ke gambar.jpg" alt="Deskripsi gambar">

Atribut <code>alt</code> menyediakan teks alternatif untuk gambar jika tidak dapat ditampilkan.

Tautan dan Navigasi

Penggunaan tag <code><a></code> menciptakan hyperlink, yang merupakan dasar keterhubungan Web. Hyperlink dapat menghubungkan ke halaman web lain, bagian berbeda pada halaman yang sama, atau bahkan file yang dapat diunduh. Misalnya:

 <a href="https://example.com">Kunjungi Contoh.com</a>

Tindakan ini akan membuat tautan ke <code>https://example.com</code>.

Daftar

HTML menyediakan elemen untuk membuat daftar. Ada dua tipe utama daftar:

Daftar tidak berurutan (<code><ul></code>), yang urutan itemnya tidak signifikan. Item dalam daftar tidak berurutan ditandai dengan poin.
Daftar yang diurutkan (<code><ol></code>), yang urutan itemnya penting. Item dalam daftar yang dipesan diberi nomor.

Setiap item dalam daftar diapit dalam tag <code><li></code> (item daftar).

HTML5

HTML5 adalah evolusi terbaru dari standar ini, memperkenalkan banyak fitur baru yang mencerminkan kebutuhan modern akan multimedia dan dokumen interaktif. Ini mencakup elemen struktural baru (<code><header></code>, <code><footer></code>, <code><article></code>, <code><section></code>) , elemen grafis (<code><canvas></code> untuk gambar, <code><svg></code> untuk grafik vektor yang dapat diskalakan), dan elemen media (<code><audio></code> dan <code ><video></kode>).

HTML semantik

HTML semantik mengacu pada penggunaan markup HTML untuk memperkuat semantik, atau makna, informasi di halaman web. Daripada hanya mendefinisikan bagaimana elemen terlihat atau berperilaku (itulah tugas CSS dan JavaScript), HTML semantik secara akurat mendeskripsikan struktur dan jenis konten. Misalnya, tag <code><article></code> menunjukkan bahwa konten di dalamnya adalah artikel, sedangkan tag <code><nav></code> menandakan menu navigasi.

Menggunakan HTML semantik meningkatkan aksesibilitas dan kemampuan penelusuran konten web, menjadikannya lebih berguna dan mudah ditemukan.

Kesimpulan

HTML adalah teknologi landasan World Wide Web, yang menyediakan struktur dasar untuk halaman web. Melalui penggunaan tag, atribut, dan elemen, HTML memungkinkan pembuatan dokumen terstruktur. Dengan memahami dan menggunakan HTML, seseorang dapat membuat berbagai konten yang dapat diakses di web, mulai dari dokumen teks sederhana hingga pengalaman multimedia interaktif yang kompleks. Sebagai dasar pengembangan web, penguasaan HTML sangat penting bagi siapa pun yang ingin merancang atau mengembangkan web.

hyper text markup language