Primer lesson: hyper text markup language

Bahasa Markup Hiperteks ( HTML )

HTML adalah singkatan dari Hypertext Markup Language. Bahasa markah standar untuk dokumen yang dirancang untuk ditampilkan di peramban web. HTML dapat dibantu oleh teknologi seperti Cascading Style Sheets ( CSS ) dan bahasa skrip seperti JavaScript.

Dasar-dasar Web

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

Struktur Dokumen HTML

Dokumen HTML disusun berdasarkan serangkaian tag bertingkat, yang merupakan elemen yang diapit tanda kurung siku. Tag ini memberi tahu peramban web cara menampilkan konten. Contoh struktur dokumen HTML sederhana adalah:

 <!DOCTYPE html>
Bahasa Indonesia:
    <kepala>
        <title>Judul Halaman</title>
    </kepala>
    <tubuh>
        <h1>Ini adalah Judul</h1>
        <p>Ini adalah sebuah paragraf.</p>
    </tubuh>
Bahasa Indonesia:

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

Elemen dan Tag HTML

Dokumen HTML terdiri dari elemen-elemen HTML. Setiap elemen diwakili oleh tag pembuka, beberapa konten, dan tag penutup. Tag pembuka dan penutup suatu elemen identik, kecuali bahwa tag penutup menyertakan garis miring sebelum nama elemen.

Misalnya, tag <code><p></code> membungkus sebuah paragraf teks, dan terstruktur sebagai berikut:

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

Elemen yang berbeda memiliki tujuan yang berbeda. Misalnya:

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 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 diberikan dalam pasangan nama/nilai seperti <code>name="value"</code>.

Misalnya, untuk menanamkan gambar, kami menggunakan tag <code><img></code> dengan atribut <code>src</code> (sumber) 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 bagi keterhubungan Web. Hyperlink dapat menautkan ke halaman web lain, bagian lain pada halaman yang sama, atau bahkan berkas yang dapat diunduh. Misalnya:

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

Ini membuat tautan ke <code>https://example.com</code>.

Daftar

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

Daftar tak berurutan (<code><ul></code>), yang urutan itemnya tidak penting. Item dalam daftar tak berurutan ditandai dengan poin.
Daftar berurutan (<code><ol></code>), di mana urutan item penting. Item dalam daftar berurutan diberi nomor.

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

HTML5

HTML5 merupakan evolusi terbaru dari standar tersebut, yang memperkenalkan banyak fitur baru yang mencerminkan kebutuhan modern untuk dokumen multimedia dan interaktif. Fitur-fitur tersebut meliputi elemen struktural baru (<code><header></code>, <code><footer></code>, <code><article></code>, <code><section></code>), elemen grafis (<code><canvas></code> untuk menggambar, <code><svg></code> untuk grafik vektor yang dapat diskalakan), dan elemen media (<code><audio></code> dan <code><video></code>).

HTML semantik

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

Penggunaan HTML semantik meningkatkan aksesibilitas dan penelusuran konten web, membuatnya lebih mudah digunakan dan ditemukan.

Kesimpulan

HTML merupakan teknologi dasar 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 mendesain atau mengembangkan web.

hyper text markup language