Pusat Ilmu Secara Detil

Pengenalan HTML

Pengenalan HTML

Apa itu HTML ?
HTML adalah singkatan dari Hyper Text Markup Language yang digunakan untuk membentuk struktur dokumen web (web pages). Tim Bernes-Lee merupakan orang pertama yang menemukan HTML yang dibantu oleh kolega-koleganya dari CERN, sebuah organisasi ilmiah internasional yang bermarkas di Jenewa, Swiss.

HTML mendefinisikan bagaimana gambar, multimedia dan teks dapat ditampilkan dalam web browser. Ketika anda membuat web, tentunya menggunakan HTML Tags, HTML Elements dan HTML Attributes.  Berikut ini adalah contoh penulisan stuktur kode HTML  :
<!DOCTYPE html>
<html>
<head>
<title>Ini contoh webpage</title>
</head>
<body>

<h1>Ini adalah Heading</h1>
<p>Ini adalah paragraf.</p>
<br>
<p style="color:#FF0000">Ini adalah paragraf yang memiliki atribute</p>

</body>
</html>
Script.1
Jika Script.1 diatas dijalankan pada browser, maka akan ditampilkan output seperti Gambar.1 berikut:
Gambar.1 Contoh Webpage

Apa itu HTML Tag ?
Pada Script.1 kita menggunakan instruksi <html>, <head>, <title>, </head>, <body>,<h1>, </h1>, <p>,</p>, <br>, </body> dan <html>. Instruksi-instruksi tesebutlah yang dinamakan dengan HTML Tag.

Secara umum, HTML Tag digunakan secara berpasangan yang dimulai dengan tag pembuka dan diakhiri tag penutup, seperti : <p> dan </p>. Namun ada juga HTML Tag yang tidak ditulis secara berpasangan, seperti : <br> yang memiliki fungsi untuk memberikan spasi.

Apa itu HTML Element ?
HTML Element ditulis dengan menggunakan tag pembuka, tag penutup dan konten diantara kedua tag tersebut.  Namun ada juga HTML Element yang tidak memiliki pasangan, seperti tag <br> yang biasa disebut empty element. Dari contoh Scrip.1 diatas, dapat kita simpulkan HTML Element sebagai berikut :
Start tagElement contentEnd tag
<html>Berisikan kumpulan tags.</html>
<head>Berisikan kumpulan tags.</head>
<title>Ini contoh webpage</title>
<body>Berisikan kumpulan tags</body>
<h1>Ini adalah Heading</h1>
<p>Ini adalah paragraf</p>
<br>

<p>Ini adalah paragraf yang memilki atribute</p>
Apa itu HTML Attributes ?
Attribute pada HTML Elements bertujuan untuk memberikan informasi tambahan. Terdapat empat atribut inti pada HTML Elemet, yaitu : 
  • id
  • title
  • class
  • style

Apa itu Markup Language ?
Markup language mengacu kepada sebuah bahasa yang berfungsi untuk menambahkan teks sehingga dapat dibaca oleh berbagai perangkat. Masih bingung dengan istilah Markup Language ?.  Perhatikan contoh potongan kode HTML berikut untuk menampilkan teks yang terformat dalam bentuk paragraf :
<p>
this is a paragraph of text written in HTML
</p>
Ketika dijalankan pada browser, maka akan ditampilkan teks "this is a paragraph of text written in HTML". Dimana instruksi <p></p> menyebabkan teks tersebut ditampilkan dalam format paragraf. Ketika anda ingin menampilkan teks tersebut agar dapat ditampilkan pada layar TV, maka ada aturan instruksi lain yang digunakan. Instruksi-instruksi tersebutlah yang disebut dengan markup language.

Misalkan ada seorang mahasiswa yang menandai bagian-bagian tertentu pada buku pelajarannya dengan menggunakan stabilo, hal ini bisa dianggap markup. Teknik markup tersebut akan menjadi suatu language jika diterapkan beberapa aturan, seperti :
  • Stabilo warna merah digunakan untuk topik
  • Stabilo warna kuning digunakan untuk menandai tema.
  • Stabilo warna hijau digunakan untuk menandai istilah-istilah.

Jadi bisa disimpulkan bahwa dalam markup language, ada aturan-aturan yang digunakan, sama halnya seperti dalam HTML :
  • Tag <p> digunakan untuk menampilkan teks dalam bentuk paragraf.
  • Tag <h1> digunakan untuk menampilkan teks dalam bentuk heading.
  • Tag <title> digunakan untuk memberikan judul pada bagian tab di Browser



Referensi

  1. Jennifer Krynin, 'What are Markup Language ? ', [online] , (http://webdesign.about.com/od/htmlxhtmltutorials/p/what-are-markup-languages.htm, diakses tanggal 28 November 2015)
  2. W3School, "HTML Introduction", [online], (http://www.w3schools.com/html/html_intro.asp, diakses tanggal 28 November 2015).
  3. Tutorialspoint, "HTML Attributes", [online], (http://www.tutorialspoint.com/html/html_attributes.htm, diakse tanggal 28 November 2015)

Share this:

You Might Also Like:

Disqus Comments