Apa sih yang dimaksud dengan HTML? Untuk apa fungsi dan kegunaannya? Berikut ini akan Asaljeplak coba jelaskan gambaran awalnya untuk coba dipahami beserta contoh latihan dasar.
HTML (Hyper Text Markup Language) adalah bahasa markup standar untuk membuat halaman Web, yang menjadi fondasi / kerangka struktur dari suatu website.
HTML sendiri terdiri dari elemen-elemen. dikenal dengan istilah “tags”. yang menginfokan kepada web browser mengenai bagaimana cara menampilkan suatu konten. Nantinya web browser akan mengambil informasi dari “tags” tersebut dan mengubahnya menjadi tampilan pada layar.
Contoh format HTML paling sederhana adalah seperti berikut ini:
<!DOCTYPE html> <html> <head> <title>Judul Halaman</title> </head> <body> <h1>Heading</h1> <p>Paragraf pertama.</p> </body> </html>
Tidak usah bingung dan pusing melihat baris kode HTML di atas, karena kalau kamu cermati sebenarnya sangat mudah dipahami struktur dari suatu halaman HTML.
Belajar Memahami Struktur HTML
Pertama-tama silahkan kamu buat sebuah file baru di komputer atau laptop dengan nama “nyoba.html” tanpa tanda kutip.
Selanjutnya, buka file tersebut (Open with) menggunakan notepad atau text editor sejenisnya, tapi jangan MS Word atau Office lainnya ya.
Setelah terbuka nantinya kamu paste baris kode di atas (atau ketikkan ulang supaya bisa lebih cepat dalam mempelajari HTML), lalu simpan filenya dengan mengetikkan ctrl+S.
Lalu, kembali ke windows explorer dan coba buka file tersebut (Open with) menggunakan browser apapun itru, bisa Chrome, Safari, Firefox, Opera, dsb.
Nanti bisa terlihat kan tampilannya seperti apa?
Pada gambar di atas bisa terlihat bahwa ada 3 hal yang muncul sesuai dengan yang tadi tertulis pada file nyoba.html , yaitu kalimat “Judul Halaman”, “Heading”, dan “Paragraf pertama”.
Sekarang coba kamu perhatikan lagi ke baris kode HTML yang ada di file nyoba.html tersebut. Di situ bisa disimpulkan sementara bahwa:
- Tags title yang dibuka dengan <title> dan diakhiri dengan </title> berfungsi untuk memberi judul pada bagian tab pada browser,
- Tags H1 yang dibuka dengan <h1> dan ditutup dengan </h1>berfungsi membuat tulisan tampak lebih besar dan tebal,
- Tags p yang dibuka dengan <p> dan diakhiri dengan </p> berfungsi untuk memunculkan tulisan dengan ukuran normal, dan memulai paragraf baru.
Lalu bagaimana dengan tags-tags lainnya yang seakan tidak berpengaruh apa-apa? Apakah ada fungsinya?
Tentu saja ada, berikut ini penjelasannya:
- Tag <!DOCTYPE html> bertujuan untuk memberitahu bahwa dokumen tersebut (nyoba.html) mengandung format HTML, atau bisa juga XHTML, yang nantinya akan dipakai oleh browser mengenai bagaimana dokumen akan ditampilkan. Ditutup dengan tag </html>
- Tag <head> akan berisikan data meta (metadata) mengenai judul halaman, yaitu <title> atau bisa juga deskripsi halaman, atau hal-hal lain yang nantinya tidak akan ditampilkan pada layar, tapi bisa mempengaruhi. Tag ini ditutup dengan </head>
- Kemudian untuk <body> adalah isi dari dokumen yang umumnya akan ditampilkan mulai dari atas sampai bawah, misalnya banner iklan, menu, isi halaman, dsb. Ditutup dengan tag </body>.
Kurang lebih seperti itu dulu penjelasan mengenai HTML, untuk materi yang lebih mendalam akan Asaljeplak lanjutkan pada artikel mendatang. Untuk sekarang, coba dahulu browsing dan mencoba bermain dengan beberapa tag HTML yang sudah diberikan di atas sebagai latihan awal.
