PENGETAHUAN DASAR HTML

1. Pengenalan HTML

Dalam membangun sebuah website tidak terlepas dari HTML yang merupakan bahasa yang umum digunakan untuk membuat suatu web page (halaman web). Isi HTML dapat dilihat pada setiap halaman web dengan cara melihat pada bagian source codenya. Bahasa HTML ini berbasis pada text mode sehingga dalam penulisannya menggunakan program-program yang berbasis pada text, contohnya Catatanpad, Textpad, Wordpad, Notepad dan lain-lain. Tanpa menggunakan penulisan HTML, halaman web juga dapat dibuat selain dengan program text mode yaitu dengan program berbasis Graphics User Interface (GUI), contohnya: Macromedia Dreamweaver, Macromedia Flash, Microsoft Frontpage, Microsoft Publisher dan lain-lain.

Hypertext Mark Up Language atau biasa disebut HTML adalah bahasa standar pemrograman untuk membuat suatu website yang bisa diakses dengan internet. Dengan kata lain halaman website yang dilihat dan dibaca disusun dengan menggunakan bahasa ini dan kemudian diterjemahkan oleh komputer agar dapat dipahami oleh penggunanya. Html merupakan standar pembuatan website secara luas agar laman website dapat ditampilkan pada layar komputer (Muhardian, 2016).

HTML terdiri dari simbol dan kode tertentu yang dimasukkan ke dalam dokumen atau file. Oleh karena itu, ketika seseorang membuka web dengan browser, mereka mengetahui bahwa web tersebut dibuat dengan menggunakan HTML. Anda dapat memahami makna HTML dari singkatan hypertext markup language. Dengan mengklik tulisan atau simbol pada sebuah situs web, orang dapat berpindah ke situs web lain melalui hypertext (Adani, 2021).

Markup dalam html sendiri berarti apa yang dilakukan oleh tag html terhadap teks yang berada di dalamnya. Misalnya, jika Anda mengetik teks dengan tanda tag di laman web, teks tersebut akan ditampilkan dengan huruf tebal atau bold. Simbol atau tag html tersebut ditempatkan pada laman html yang biasanya tersedia di dashboard web. Namun, bahasa HTML adalah bahasa pemrograman atau script yang terdiri dari tag-tag yang akan diterjemahkan ke dalam teks atau visual yang dapat dilihat di website.

2. Sejarah Perkembangan HTML

Pada tahun 1980 seorang ahli fisika, Tim Berners-Lee, dan juga seorang kontraktor di CERN (Organisasi Eropa untuk Riset Nuklir) mengusulkan dan menyusun ENQUIRE, sebuah sistem untuk ilmuwan CERN dalam membagi dokumen. Sembilan tahun kemudian, Berners-Lee mengusulkan adanya sistem markup berbasis internet. Berners-Lee menspesifikasikan HTML dan menulis jaringan beserta perangkat lunaknya di akhir 1990. Pada tahun yang sama, Berners-Lee dan Robert Cailliau, insinyur sistem data CERN berkolaborasi dalam sebuah permintaan untuk pendanaan, namun tidak diterima secara resmi oleh CERN.

Informasi pertama yang dipublikasikan ke umum tentang HTML adalah sebuah dokumen yang disebut "Tanda HTML", pertama kali disebutkan di internet oleh Tim Berners-Lee pada akhir 1991. Tanda ini menggambarkan 18 tag awal versi sederhana dari HTML. Tag hyperlink, dipengaruhi oleh SGML (Standard Generalized Markup Language) yang berbasis format dokumen di CERN. Berikut ini garis besar Sejarah HTML:

a. 24 November 1995

HTML 2.0 dipublikasikan sebagai IETF RFC 1866. Penambahan RFC memperbanyak kemampuan untuk mengunggah file berdasarkan bentuk, tabel dan gambar.

b. 14 Januari 1996: Rilis HTML 3.2.

c. 14 Januari 1997

HTML 3.2 dipublikasikan sebagai konsorsium World Wide Web. Versi ini merupakan versi pertama yang dikem- bangkan dan distandardisasi secara khusus oleh Konsorsium World Wide Web (W3C).

d. 18 Desember 1997: Rilis HTML 4.0.

e. 28 Oktober 2014: Rilis HTML 5 (stabil).

HTML5 menambahkan banyak fitur baru. Salah satu yang paling canggih adalah kemampuan untuk memasukkan audio dan video ke dalam website dengan menambahkan tag "audio></audio> dan "video></video". HTML5 juga mendukung grafis vektor (SVG) yang dapat diskalakan dan MathML untuk formula matematika dan ilmiah. Tag semantic yang paling umum digunakan dalam HTML5 adalah "artikel", "bagian", "aside", "header", dan "footer". Tag semantic ini memberi tahu browser tentang arti konten, yang membantu mesin pencari dan pembaca.

3. Fungsi HTML

HTML yang dikenal sebagai bahasa pemrograman dalam ilmu komputer memiliki beberapa fungsi, diantaranya adalah sebagai berikut (Alfarabi Hadi, n.d.):

a. Html digunakan untuk membuat halaman website yang mudah dibaca dan dipahami oleh pengguna. Setiap halaman website yang ada di internet dibuat dengan html.

b. Menandai teks pada suatu laman, html ditulis pada suatu halaman dokumen dengan tag atau simbol tertentu dimana simbol dan tag tersebut akan menandai teks menjadi tebal, miring, bergaris tebal dan lain sebagainya. Untuk menandai teks pada halaman web, kode html digunakan untuk menandai teks tertentu, seperti teks tebal, miring, atau bergaris bawah.

c. Sebagai dasar website, website yang dibuat tentunya memiliki beberapa fitur yang dibuat dengan menggunakan java script (untuk mengatur perilaku web), implemetasi bahasa pemrograman server PHP, dan mendesain web menggunakan CSS. Semua bahasa tersebut dapat diaplikasikan jika web memiliki bahasa html sebagai dasarnya.

d. Tabel, gambar, video, dan konten lainnya dapat ditampilkan. Dalam kebanyakan kasus, tabel, gambar, dan video tidak dapat dimasukkan secara langsung ke dalam website atau blog, jadi komponen tersebut ditempatkan di web dengan menggunakan bahasa HTML.

e. Selain digunakan untuk menandai elemen dan membuat formulir online, html juga digunakan untuk menandai bagian-bagian website, seperti header, main, footer, navigasi, dan lainnya. Selain itu, html biasanya digunakan sebagai bahasa untuk membuat formulir online atau formulir digital.

4. Dasar-dasar HTML

Dasar-dasar HTML mencakup elemen-elemen dasar yang digunakan untuk struktur dasar dan konten halaman web. Berikut adalah beberapa dasar HTML:

a. Elemen HTML: HTML terdiri dari elemen-elemen dasar seperti tag, atribut, dan teks. Setiap elemen dimulai dengan tag dan dapat memiliki atribut yang memberikan informasi tambahan tentang elemen tersebut.

Contoh elemen HTML:

<tag>Nama Elemen</tag>

b. Struktur Dasar HTML: Setiap halaman HTML memiliki struktur dasar yang terdiri dari elemen-elemen seperti <html>, <head>, dan <body>. Elemen-elemen ini membantu browser memahami bagaimana halaman web seharusnya ditampilkan.

Contoh struktur dasar HTML:

<!DOCTYPE html>

<html>

<head>

<title>Judul Halaman</title>

</head>

<body>

<h1>Selamat Datang!</h1>

<p>Ini adalah paragraf pertama saya.</p>

</body>

</html>

c. Tag Heading dan Paragraf: Tag-heading (<h1> hingga <h6>) digunakan untuk menandai judul halaman atau bagian, sementara tag paragraf (<p>) digunakan untuk menandai paragraf teks.

Contoh penggunaan tag heading dan paragraf:

<h1>Judul Utama</h1>

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

d. Tag List: HTML mendukung list, baik ordered (<ol>) maupun unordered (<ul>). Setiap item dalam list diwakili oleh tag <li>.

Contoh penggunaan tag list:

<ul>

<li>Item pertama</li>

<li>Item kedua</li>

<li>Item ketiga</li>

</ul>

e. Atribut: Atribut memberikan informasi tambahan tentang elemen dan didefinisikan dalam tag pembuka. Contohnya, atribut href pada tag <a> digunakan untuk menentukan URL tautan.

Contoh penggunaan atribut:

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

Example.com</a>

f. Tag Gambar: Tag <img> digunakan untuk menyisipkan gambar ke dalam halaman web.

Contoh penggunaan tag gambar:

Pengembangan web membutuhkan pemahaman yang kuat tentang tag, elemen, dan atribut, yang merupakan bagian penting dari struktur dokumen HTML. Ini adalah dasar dari setiap halaman web dan memungkinkan pengembang untuk merancang dan menyusun konten dengan cara yang terstruktur dan dapat diakses. Berikut adalah penjelasan tentang tag, elemen, dan atribut dalam konteks pengembangan web.

1. Tag

Tag adalah elemen dasar dalam HTML yang digunakan untuk menandai atau mengelompokkan bagian-bagian tertentu dari dokumen. Tag, yang biasanya terdiri dari tag pembuka dan tag penutup, menandai bagian tertentu dari dokumen. Paragraf dengan tag <p> dan judul dengan tag <h1> hingga <h6> adalah contoh tag dasar.

2. Elemen

Elemen adalah struktur dasar dokumen HTML dan menentukan bagaimana konten ditampilkan di browser. Elemen terdiri dari tag pembuka, konten, dan tag penutup, yang digunakan untuk menyelesaikan elemen.

3. Atribut

Atribut ditemukan di dalam tag pembuka dan biasanya memiliki nilai yang memberikan informasi tambahan tentang elemen. Atribut juga sering digunakan untuk mengonfigurasi atau menyesuaikan elemen tersebut. Sebagai contoh:

<a href="https://www.contohwebsite.com">Link ke contoh

website</a>

Dalam contoh di atas, src dan alt adalah atribut dari elemen

gambar (<img>), sementara href adalah atribut dari elemen

tautan (<a>).

Dengan menggunakan struktur HTML dengan benar, pengembang dapat membuat konten yang mudah dimengerti oleh browser dan mesin pencari, meningkatkan pengalaman pengguna dan dapat

ditemukan dengan lebih mudah.

Dokumen HTML yang valid memberikan sejumlah manfaat, termasuk konsistensi antar browser, perbaikan aksesibilitas, dan kinerja yang lebih baik.

Sumber:

Kaban, R., & Sembiring, D. J. (2021). HTML (Hypertext Markup Language) pengantar pemrograman berbasis web. CV. Mitra Cendekia Media.

Limbong, T. (2021). Pemrograman Web Dasar.

Mukhlis, Iqbal Ramadhani. dkk. (2023). Buku Ajar Pemrograman Web 1. Penerbit SONPEDIA.COM PT. Sonpedia Publishing Indonesia.

Harry's Study Area

Jumat, 15 Maret 2024