Konsep Hypertext Markup Language
Objektif
¡ Markup Language
¡ Web Page
¡ HTML
¡ XHTML
¡ Browser
Definisi
Markup Language
Markup language adalah sejenis pengkodean pada teks yang merepresentasikan teks sebagai suatu struktur detil tentang teks yang diperlihatkan.
Pada markup language modern, penggunanya yang sangat menyebar adalah HTML dan XML
Web Page
Web adalah sarana yang dapat membantu anda untuk mengemukakan ide-ide anda. Dalam merancang sebuah web site, sebaiknya anda menentukan :
• Tentukan tujuan membuat website.
• Tentukan halaman-halaman web apa yang diperlukan untuk website tersebut.
• Tentukan sasaran pembaca web yang anda buat.
• Usahakan menambah suara, gambar, animasi atau fitur-fitur agar web anda terlihat menarik.
Hyper Text Markup Language
Tag markup HTML biasanya disebut tag HTML
Tag HTML adalah kata kunci dikelilingi oleh tanda kurung siku seperti <html>
Tag HTML biasanya datang dalam pasangan seperti <b> dan </ b>
Tag pertama dalam pasangan adalah tag awal, tag kedua adalah tag akhir
Mulai dan tag akhir juga disebut tag pembuka dan tag penutup
Tag HTML biasanya datang dalam pasangan seperti <b> dan </ b>
Tag pertama dalam pasangan adalah tag awal, tag kedua adalah tag akhir
Mulai dan tag akhir juga disebut tag pembuka dan tag penutup
Contoh penulisan (tag) HTML
<html>
<head>
<title>website pertama</title>
</head>
<body>
<p><span style = “font weight:bold”>Aku adalah teks tebal</span></p>
<span style = “font weight:bold;text decoration:underline;font style:italic”>
Aku adalah teks tebal, bergaris bawah dan miring </span>
</body>
</html>
<head>
<title>website pertama</title>
</head>
<body>
<p><span style = “font weight:bold”>Aku adalah teks tebal</span></p>
<span style = “font weight:bold;text decoration:underline;font style:italic”>
Aku adalah teks tebal, bergaris bawah dan miring </span>
</body>
</html>
Fungsi masing-masing tag HTML
Fungsi | Notasi | Hasil |
Garis Bawah | <u>Contoh Kalimat</u> | Contoh Kalimat |
Huruf Miring | <i>Contoh Kalimat</i> | Contoh Kalimat |
Huruf Tebal | <b>Contoh Kalimat</b> | Contoh Kalimat |
Huruf Bercoret | <s>Contoh Kalimat</s> | |
Huruf Besar | <big>Contoh Kalimat</big> | Contoh Kalimat |
Huruf Kecil | <small>Contoh Kalimat</small> | Contoh Kalimat |
Huruf Agak Kebawah | <sub>Contoh Kalimat</sub> | Contoh Kalimat |
Huruf Agak Keatas | <sup>Contoh Kalimat</sup> | Contoh Kalimat |
Ukuran Huruf | <font face=&size=5>Contoh Kalimat</font> | Contoh Kalimat |
Merubah Huruf | <font face="arial">Contoh Kalimat</font> | Contoh Kalimat |
Merubah Huruf dan Ukuran Huruf | <font face="arial"size=1>Contoh Kalimat</font> | Contoh Kalimat |
Link dengan target halaman baru | <a href="http://Contoh Kalimat.com/" target="_blank">Contoh Kalimat</a> |
Extensible Hyper Text Markup Language (XHTML)
Definisi
singkatan dari Extensible Hipertext Markup Language adalah “bahasa baru” yang dibuat oleh W3C untuk menggantikan kedudukan HTML. Namun sebenarnya, XHTML adalah gabungan dari HTML dan XML. Sejak kelahirannya XHTML 1.0 pada tahun 2000, kemudian XHTML dirilis pada tahun 2001. Tentu saja dengan adanya XHTML tidak semata-mata hanya menggantikan, tentunya XHTML memiliki kelebihan dibandingkan dengan HTML. ( sumber: wordpress)
XHTML dibuat dengan tujuan agar terdapat sebuah “bahasa” standar yang dapat digunakan oleh aplikasi lain secara luas dan oleh platform yang berbeda. Dengan menggunakan XHTML, sebuah situs masih dapat dinikmati dengan baik menggunakan browser teks, PDA, Phone Cell, dan lain-lain. Sedangkan HTML hanya dapat dinikmati dengan baik bila menggunakan Web browser seperti IE atau Netscape. Hal ini memungkinkan halaman Web yang menggunakan HTML akan lebih dapat diterima secara luas oleh berbagai aplikasi.
Tiga tipe XHTML
XHTML sendiri di bagi menjadi tiga type dokumen yaitu :
STRICT. Puncaknya standard, gunakan ini apabila anda benar-benar menginginkan kode yang benar-benar terstruktur. Beberapa tag sudah dihilangkan disini seperti <iframe>. Anda harus mengkombinasikan antara XHTML dan CSS
TRANSITIONAL. Gunakan ini apabila anda ingin tampilan ditampilkan didalam file XHTML tidak di CSS
FRAMESET. Gunakan yang ini, jika anda ngotot ingin menggunakan frames
Contoh Deklarasi
1. Deklarasi XHTML Strict
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
2. Deklarasi XHTML Transitional
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3. Deklarasi XHTML Frameset
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">