Langsung ke konten utama

Pengantar HTML

HTML, yang merupakan kepanjangan dari Hyper Text Markup Language, adalah standard markup language yang digunakan untuk membangun halaman web. HTML merupakan bahasa pemrograman yang mudah dipelajari dan cocok sebagai pembelajaran awal bagi para programmer baru. Dengan menggunakan HTML, meskipun bahasa pemrograman pendukung (CSS, Javascript, SQL, PHP, dan lainnya) belum dibuat, suatu halaman web standar dapat ditampilkan.

HTML digunakan untuk membentuk struktur halaman web, yang didalamnya mencakup berbagai elemen dengan masing-masing fungsinya. Elemen-elemen tersebut ditulis dalam bentuk tag (<...>). Tag tersebut tidak akan ditampilkan dalam web browser, yang ditampilkan hanyalah konten yang terdapat di dalam tag.


A Simple HTML Document
Berikut ini adalah contoh dokumen HTML sederhana:

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Page Title</title>
  5. </head>
  6.  
  7. <body>
  8. <h1>My First Heading</h1>
  9. <p>My first paragraph.</p>
  10. </body>
  11. </html>

Penjelasan

  • Elemen <!DOCTYPE html> mendefinisikan bahwa dokumen HTML tersebut merupakan dokumen HTML versi HTML5.
  • Elemen <html> merupakan root element (elemen dasar) agar dokumen tersebut dikenali sebagai dokumen HTML.
  • Elemen <head> merupakan bagian yang membungkus elemen-elemen berjenis meta information.
  • Elemen <title> berfungsi untuk memberikan judul halaman web yang akan muncul dalam window title pada web browser.
  • Elemen <body> merupakan bagian yang membungkus elemen-elemen yang ditampilkan pada halaman web.
  • Elemen <h1> merupakan elemen yang berisi konten teks yang ditampilkan dalam format large heading.
  • Elemen <p> merupakan elemen yang berisi konten teks yang ditampilkan sebagai paragraf.


HTML Tags
Dari contoh di atas, terlihat bahwa beberapa tag memiliki penutup yang disisipkan forward slash (/) sebelum tag name, seperti <html> yang ditutup dengan </html>. Tag pembuka disebut dengan “opening tag”, sedangkan tag penutup disebut dengan “closing tag”.


The <!DOCTYPE> Declaration
<!DOCTYPE> berfungsi untuk merepresentasikan tipe dokumen HTML (versi) dan membantu web browser mengenai bagaimana memperlakukan coding yang terdapat dalam dokumen HTML tersebut. <!DOCTYPE> harus ditulis pada setiap dokumen HTML dan hanya ditulis sekali saja di baris paling atas dokumen HTML tersebut, sebelum tag apapun. <!DOCTYPE> tidak bersifat case sensitive, maka ia bisa ditulis dengan format uppercase maupun selain uppercase. <!DOCTYPE> untuk versi HTML5 ditulis dengan <!DOCTYPE html>.

Macam-macam versi HTML

Versi Tahun
 HTML 1991
 HTML 2.0 1995
 HTML 3.2 1997
 HTML 4.01 1999
 XHTML 2000
 HTML5 2014


HTML Editor
Notepad merupakan aplikasi standar pada windows yang dapat digunakan untuk membuat suatu dokumen HTML atau dokumen pemrograman lain, sedangkan pada mac dapat menggunakan aplikasi TextEdit. Selain kedua aplikasi tersebut, dokumen HTML juga dapat dibuat dengan menggunakan professional HTML editor seperti notepad++ atau professional HTML editor lainnya yang dapat diunduh di internet, mulai dari yang gratis hingga berbayar.

Kami merekomendasikan penggunaan notepad++, karena memiliki fitur warna pembeda untuk masing-masing fungsi coding yang ditulis pada dokumen pemrograman. Hal ini dapat mempermudah programmer untuk menemukan suatu coding tertentu ataupun kesalahan/bug pada dokumen pemrograman tersebut.

Menyimpan (save) dokumen HTML
Agar dapat dijalankan dan ditampilkan dalam web browser, dokumen HTML harus disimpan dengan nama yang memiliki ekstensi “.htm” atau “.html” dan menggunakan encoding UTF-8. Apabila menggunakan notepad, biasanya terdapat pilihan encoding ini, namun apabila menggunakan notepad++, dokumen HTML tersebut secara default menggunakan encoding UTF-8.

Komentar