Dasar HTML
HTML merupakan akronim dari Hyper Text Markup Language. Html tidak termasuk dalam bahasa pemograman, melainkan bahasa markah (markup language). Bahasa markah adalah bahasa yang deklaratif dan menggunakan berbagai tags dan atribut untuk menggambarkan tampilan dari sebuah dokumen.
Misalkan saja terdapat dokumen dengan teks
contoh dokumen html
untuk membuat teks tersebut tampil dengan huruf yang tebal, maka ditambahkan tag <b> di antara teks yang akan ditebalkan. Misal
contoh <b>dokumen</b> html
akan tampil di browser menjadi
contoh dokumen html
teks ‘<b>’ disebut dengan opening tag, sedangkan ‘</b>’ disebut sebagai closing tag. Setiap end tag, selalu dimulai dengan garis miring (slash, / ). Namun ada juga jenis tag yang lain, yang disebut dengan self-closing tag. Yaitu tag yang berdiri sendiri dan tidak membutuh kan closing tag. Tag seperti langsung menggunakan slash di akhir kode tagnya. Misalkan ‘<br />’ untuk ganti baris, atau ‘<hr />’ untuk membuat garis horisontal.
Membuat Dokumen HTML Pertama
HTML merupakan bahasa yang berbasis pada teks. Kita dapat menggunakan berbagai teks editor untuk membuat dokumen HTML. Namun, saya menyarankan untuk menggunakan Bluefish. Selain karena open source, bluefish juga bersifat gratis dan multiplatform. Bluefish memang editor yang dirancang khusus untuk progammer dan web developer. Bluefish mendukung banyak bahasa pemograman dan bahasa markup.
Buat sebuah dokumen baru menggunakan bluefish, lalu copy paste baris kode berikut :
<!DOCTYPE html>
<html>
<body>
<h1>Hallo, HTML</h1>
<p>Ini adalah contoh halaman HTML</p></body>
</html>
Lalu simpan dokumen tersebut dengan format .html. Maka tampilan dari dokumen yang telah disimpan akan menjadi seperti ini :
Dengan menggunakan bluefish, file html yang telah disimpan dengan format .html, akan berwarna berbeda pada setiap tag nya. Hal ini karena secara otomatis bluefish bekerja dengan Language Mode Generic HTML.
Sekarang kita coba buka file HTML yang telah kita simpan dengan menggunakan browser. Dan inilah yang akan terlihat:
Teks yang muncul pada browser, memiliki ukuran yang berbeda. Tag ‘<h1>’ merupakan tag untuk style Header 1. Sedangakan tag ‘<p>’ merupakan tag untuk style Paragraf. Teks yang diapit dengan tag Header 1 akan berukuran sesuai dengan standar ukuran Header pada browser, begitupula dengan teks yang diapit tag Paragraf.
Baris pertama pada dokumen html kita menjelaskan tipe dari dokumen tersebut.
<!DOCTYPE html>
Browser yang digunakan untuk membuka dokumen kita membutuhkan informasi ini untuk mengetahui jenis dokumen yang dibuka.
Selanjutnya yaitu baris opening tag
<html>
Tag ini merupakan tag utama. Setiap dokumen html dimulai dengan tag ini, dan kemudian diakhiri dengan tag ‘</html>’.
Begitu pula dengan tag ‘<body>’. Setiap hal yang akan ditampilkan kedalam browser, diletakkan di dalam tag ini.
Salam,
Afief Yona Ramadhana
This site uses Akismet to reduce spam. Learn how your comment data is processed.
Leave a Reply