Bahasa Penanda Hiperteks (HTML)/Pengenalan

HTML ialah bahasa penanda yang digunakan dalam kebanyakan halaman yang terdapt dalam Jaringan Sejagat (WWW). Fail HTML adalah fail teks yang, berlainan dengan teks biasa, memiliki jujukan penanda tambahan yang memberitahu pelayar web bahagaian mana teks harus dipaparkan tebal, di mana letaknya pengepala, atau jadual, ataupun di mana mula dan akhirnya lajur dan baris jadual. HTML dapat dipaparkan oleh pelayar visual, pelayar yang membacakan teks laman kepada pengguna, pembaca Braille yang mengubah laman ke dalam format braille, pelanggan e-mel, ataupun peranti wayarles seperti telefon selular.

Sebelum kita mula

Anda memerlukan penyunting dan pelayar sesawang jika anda ingin mengarang dan menguji halaman HTML. HTML dapat disunting dengan menggunakan perisian [pautan ke Wikipedia] penyunting teks biasa, termasuklah perisian yang mewarnakan penanda HTML agar lebih mudah dibaca. Terdapat juga apa yang digelar penyunting [pautan ke Wikipedia] HTML WYSIWYG (What You See Is What You Get, Apa yang anda lihat ialah apa yang anda dapat) dan juga perisian WYSIWYG yang kompleks yang mampu mengendali projek tapak web dan sekitaran pembangunan.

(Disarankan anda mempelajari XHTML, JavaScript, ASP.NET dan/atau PHP jika anda mahu membuat tapak web yang bermutu).

Penyunting teks biasa termasuklah Notepad (atau Notepad++) bagi Microsoft® Windows, TextEdit bagi Mac, atau Vim, Emacs dan lain buat Linux.

Penyunting HTML komersil termasuk Adobe Contribute CS5 dan Dreamweaver CS5 (kedua-dua Win/Mac), dan Visual Web Developer Microsoft (Win). Juga terdapat penyunting HTML yang bebas dan percuma termasuk Evrsoft First Page (Win), Mozilla KompoZer (Win/Mac/Linux) dan Quanta Plus (Linux). Namun, adalah disarankan bahawa lebih baik jika anda memperoleh pengetahuan asas tentang HTML dengan mengguna penyunting HTML berlandaskan kod sebelum anda mengguna penyunting WYSIWYG.

Anda memerlukan pelayar web bagi melihat dokumen-dokumen anda. Bagi memastikan dokumen atau laman anda itu dapat kelihatan elok pada seramai pengguna mungkin, uji dokumen anda dengan seberapa bilangan pelayar yang mungkin. Setiap pelayar mempunyai cara penampilan dan keanehannya tersendiri, yang menyebabkan beberpa jujukan HTML yang ditulis betul menjadi paparan yang berlainan.

Microsoft Internet Explorer merupakan pelayar yang paling banyak diguna (46% pasaran pada November 2010). Pelayar-pelayar lain termasuk Mozilla Firefox, Google Chrome, Safari, dan Opera. Untuk memastikan dokumen anda dapat dibaca dalan sekitaran teks sahaja, anda boleh menggunakan pelayar teks seperti Lynx.

Sebuah Dokumen Ringkas

Mari kita mula dengan sebuah dokumen ringkas. Tulis kod ini dalam penyunting anda (ataupun salin dan tampal) dan simpannya sebagai fail yang memiliki akhiran ".html" atau ".htm", misalnya sebagai "indeks.html" atau "indeks.htm". Fail perlu disimpan dengan akhiran sedemikian agar dapat dibuka dan dipaparkan dengan betul (langkah ini perlu buat platform Windows. Mac dan Linux tidak memerlukan penamaan fail atau demikian demikian cara).

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title> Dokumen ringkas </title>
 </head>
 <body>
  <p>Teks dokumen diletakkan di sini.</p>
 </body>
</html>

Sekarang buka dokumen ataupun fail ini dengan pelayar anda dan lihat hasilnya. Daripada contoh di atas kita dapat simpulkan beberapa perkara pokok berkaitan dokumen HTML:

Baris pertama sesuatu dokumen HTML yang sah ("valid") perlu memuatkan versi HTML yang diguna dokumen. Contoh ini mengguna sebuah variasi HTML, yakni HTML versi 4.01 yang ditulis seperti berikut:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Dokumen HTML bermula dengan tag <html> dan berakhir dengan rakannya, tag </html>.
Terkandung dalam tag-tag <html></html>, terdapat sepasang tag, <head></head> dan <body></body>.
Terkandung dalam tag-tag <head></head>, juga terdapat tag-tag <title></title> yang merangkumi judul teks yang akan dipaparkan pada bar tajuk pelayar web.
Terkandung tag-tag <body></body> ialah satu perenggan yang ditanda dengan pasangan tag .
Kebanyakan tag perlu ditulis dengan pasangan masing-masing. Kesan tag ditulis antara tag-tag tersebut.
- Teks ini ditekankan – Teks ini ditekankan
- Teks ini memuatkan <code>kod komputer</code> – Teks ini memuatkan kod komputer
- Ini memuatkan teks yang ditekankan beserta <code>kod komputer</code> – Ini memuatkan teks yang ditekankan beserta kod komputer
Pasangan tag HTML perlu diselaraskan agar merangkumi tag-tag lain, contoh:
- <code>Teks ini adalah kod dan ditekankan</code> – Teks ini adalah kod dan ditekankan
- Satu kesilapan: – <code>Penanda ini mengandungi ralat</code>

Sebelum: Prakata

Indeks

Berikut: Kepala dan Badan