HTML adalah bahasa yang wajib dipelajari, bagi yang kamu yang ingin menjadi web developer.
Karena HTML merupakan bahasa dasar untuk membuat web. Nah di artikel kali ini kita akan membahas dari nol mengenai HTML.
Mengenal Definisi HTML
HTML (Hypertext Markup Language) merupakan gabungan dari dua istilah: hypertext dan markup language.
Hypertext yaitu dokumen berisi tautan yang memungkinkan pengguna terhubung ke halaman lain.
Sedangkan markup language merupakan bahasa komputer yang terdiri dari sekumpulan kode untuk mengatur struktur dan menyajikan informasi.
Jadi, HTML adalah bahasa markup untuk membuat struktur halaman website.
Tools HTML
1. Teks Editor untuk Menulis HTML
Teks editor akan kita gunakan untuk menulis kode-kode HTML. Kamu bebas menggunakan teks editor apapun. Bisa menggunakan Notepad, notepad++, sublime text, Atom, Adobe dreamweaver, Visual Studio Code, dll..
2. Web Browser untuk Membuka HTML
Web browser akan kita gunakan untuk membuka HTML. Kamu juga bebas menggunakan web browser apapun. Dapat menggunakan Google Chrome, Safari, Mozila, Edge, dll..
Mengenal Tag, Elemen, dan Atribut pada HTML
Agar lebih mudah belajar HTML, kamu harus berkenalan dengan tag, elemen, dan atribut. Mereka adalah tiga sekawan yang menjadi atom pembentuk HTML.
- Tag, digunakan sebagai awalan instruksi atau perintah yang akan dibaca web browser. Misalnya: tag <bold>. Tag ini akan meminta browser menampilkan teks dalam format tebal.
- Element, merupakan keseluruhan kode yang terdiri dari tag pembuka (<>) hingga tag penutup (</>). Contohnya: <h1> Contoh Elemen </h1>. Meski demikian, tidak semua tag HTML memiliki pasangan penutup.
- Attribute, yaitu informasi atau perintah tambahan yang berada di dalam elemen. Misalnya: <img src=”pantai.jpg” alt=”Pantai Baron.”> Elemen ini menggunakan tag <img> dengan atribut sumber gambar (src) dan alt text (alt).
Setelah memahami komponen pembentuk HTML, silakan pelajari coding HTML dasar. Dengan mengetahui coding HTML dasar, kamu akan lebih siap untuk menggunakan tag HTML yang lebih menantang.
Kerangka Inti HTML
Kita akan mengulik bentuk dokumen HTML paling sederhana dan menjadi kerangka inti yang menyusun setiap dokumen HTML di dunia ini.
- <!DOCTYPE html> berfungsi untuk mendeklarasikan kepada komputer bahwa kamu akan menuliskan perintah dalam kode HTML;
- <html></html> merupakan tag yang menandakan bahwa kamu memulai dan mengakhiri dokumen dalam kode HTML;
- <head><head> diisi dengan metadata dari dokumen HTML. Seperti judul tab, deskripsi, dan lain-lain;
- <body></body> diisi dengan konten halaman website.
Membuat Dokumen HTML Pertamamu
Kini tiba saatnya, kamu harus mencoba sendiri membuat dokumen HTML. Caranya sangat mudah.
Mari kita mulai dengan membuka teks editor, lalu tulislah kode berikut.
Setelah itu, simpan dengan nama hello-world.html. Pastikan ekstensinya adalah .html yaaa.
Sekarang cobalah buka file hello-world.html dengan web browser.. maka hasilnya:
Selamat! 🎉
Kita sudah berhasil membuat halaman web pertama dengan HTML.