Sorotan24.com, Indonesia – Untuk kamu yang ingin menjadi programmer website wajib banget belajar HTML karena HTML menjadi dasar untuk membuat website. Masih penasaran kan apa itu HTML dan cara kerjanya? Dalam artikel ini saya akan menjelaskan tentang HTML. Yuk simak informasinya.
Baca Juga : Panduan Belajar JavaScript Object Oriented Programming Bagi Pemula
Pengertian HTML dan Sejarahnya
HTML atau Hypertext Markup Language adalah bahasa markup standar yang digunakan untuk membuat halaman website dan aplikasi web.
Sejarah HTML dimulai oleh Tim Berners-Lee, seorang ahli fisika di lembaga penelitian CERN yang berada di Swiss. Versi pertama dirilis pada tahun 1991, dengan 18 tag. Sejak saat itu, setiap kali ada versi barunya, pasti akan selalu ada tag dan attribute (tag modifier) yang juga baru.
Belajar mengenai Bagaimana Cara Kerja HTML?
File HTML diakhiri dengan ekstensi .html atau .htm. Ekstensi file ini dapat dilihat dengan menggunakan web browser apapun seperti Google Chrome atau Safari. Browser tersebut membaca file HTML dan merender kontennya sehingga user internet dapat melihat dan membacanya.
Biasanya, dalam satu website terdapat sejumlah halaman HTML yang berbeda-beda. Contohnya, halaman “Tentang Kami”, halaman contact memiliki dokumen nya masing-masing.
Masing-masing halaman tersebut terdiri atas berbagai tags atau bisa disebut juga elements. Tags tersebut tersusun untuk membentuk sebuah halaman website seperti tags untuk menyusun konten hingga bagian paragraf, heading dan block konten lainnya.
Tags memiliki tiga bagian utama:
- Tag pembuka : digunakan untuk menyatakan di mana suatu elemen mulai berlaku. Tag dibungkus dengan tanda kurung buka dan tutup. Misalnya, gunakan tag awal <p> untuk membuat paragraf.
- Content : bagian ini adalah output yang dilihat pengguna lain.
- Tag penutup : sama dengan tag pembuka, tetapi dengan garis miring ke depan sebelum nama elemen. Misalnya, </p> untuk mengakhiri paragraf.
Representasi dari ketiga bagian tersebut untuk membuat HTML element sebagai berikut:
Bagian penting lain dari elemen HTML adalah atributnya, yang memiliki dua bagian nama dan nilai atribut. Nama mengidentifikasi informasi tambahan yang ingin ditambahkan pengguna, sedangkan nilai atribut memberikan spesifikasi lebih lanjut.
Misalnya, elemen gaya yang menambahkan warna ungu dan verdana font-family akan terlihat seperti ini:
Belajar Tag HTML dan Fungsinya
Tag HTML memiliki 2 tipe utama yakni block-level dan inline tags
- Elemen block-level memakai semua ruang yang tersedia dan selalu membuat line baru di dalam dokumen. Contoh dari tag block adalah heading dan paragraf.
- Elemen inline hanya memakai space sesuai dengan kebutuhannya dan tidak membuat line baru di halaman. Biasanya elemen ini akan memformat isi konten dari elemen block-level. Contoh dari tag inline adalah link dan emphasized strings.
Tag Block-Level
- Tiga tag wajib block-level yang harus ada disetiap dokumen HTML adalah :
- Tag <html></html> adalah elemen level tertinggi yang menyertakan setiap halaman HTML
- Tag <head></head> adalah elemen untuk menyimpan informasi meta, seperti judul dan charset halaman
- <body></body> adalah elemen untuk melampirkan semua konten untuk ditampilkan di halaman website
- Heading memiliki 6 level, mulai dari <h1></h1> sampai <h6></h6>. Dimana h1 merupakan level heading tertinggi dan h6 adalah level terendah. Perbedaan level tersebut hanya pada ukuran textnya.
- Tags paragraph : semuanya tertutup dengan menggunakan <p> tag.
- Tags list : memiliki variasi yang berbeda. Gunakan <ol> tag untuk daftar yang berurutan, menggunakan <ul> untuk daftar yang tidak berurutan. Kemudian, lampirkan item daftar individual menggunakan <li> tag.
Tag Inline
Sebagian besar tag inline digunakan untuk memformat teks. Sebagai contoh, tag <strong></strong> akan render elemen ke format bold, sedangkan tag <em></em> akan ditampilkan dalam format italic.
Hyperlink adalah elemen inline dengan tag <a></a> dan attribute href untuk mengindikasi link tujuan.
Perbedaan HTML dan HTML5
Versi pertama HTML terdiri dari 18 tag. Sejak itu, setiap versi baru datang dengan tag dan atribut baru yang ditambahkan ke markup. Peningkatan bahasa yang paling signifikan sejauh ini adalah pengenalan HTML5 pada tahun 2014.
Perbedaan utama antara HTML dan HTML5 adalah bahwa HTML5 mendukung jenis kontrol bentuk baru. HTML5 juga memperkenalkan beberapa tag semantik yang dengan jelas menggambarkan konten, seperti <article>, <header>, dan <footer>.
HTML bukan bahasa pemrograman karena tidak memiliki kemampuan untuk membuat fungsionalitas yang dinamis. Bahasa markup ini hanya bisa mengelola dan memformat dokumen secara statis. Dari cara kerja HTML, kamu dapat menggunakannya untuk membuat struktur konten pada website dan HTML adalah dasar untuk teknologi frontend.
