Pertemuan 2 HTML Basic (Text Formating, Link & Frame) Pengembangan Web Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
HTML (HyperText Markup Language) HTML bukan bahasa pemrograman, tapi merupakan sebuah mark up language. HTML salah satu bahasa pemrograman di mana browser sebagai compilernya. HTML menggunakan mark up tags untuk mendeskripsikan halaman web. Digunakan untuk memberi tahu web browser bagaimana menampilkan halaman web. Sebuah HTML file harus mempunyai ekstensi .htm atau .html. dapat dibuat menggunakan text editor (notepad, edit plus dsb).
Web Browser Tugas dari web browser (IE, Mozilla) adalah membaca dokumen HTML dan menampilkannya sebagai halaman web. Web browser tidak menampilkan tag HTML, tapi menggunakan / membaca tag tersebut untuk menginterprestasi sebuah halaman web.
Penulisan Tags Tag dibentuk oleh suatu kata (keyword) yang diapit oleh tanda kurung lancip (<tag>). Tag boleh ditulis dalam huruf kecil maupun kapital. Tag harus berpasangan, yaitu tag awal diikuti tag akhir, kecuali tag tunggal. <p> teks </p>, <br> Penulisan tag tidak boleh tumpang tindih. <tag1><tag2> teks </tag1></tag2> → penulisan yang salah <tag1><tag2> teks </tag2></tag1> → penulisan yang benar
Contoh dasar <html> <HEAD> <TITLE>Judul dokumen</TITLE> </HEAD> <body> <h1>My First Heading</h1> <p>My first paragraph</p> </body> </html>
Penjelasan Ditulis dalam tag <html></html> yang menunjukkan sebuah halaman web. Tag <header></header> menandai bagian header dokumen html. Text di antara <body></body> merupakan konten halaman yang ditampilkan.
Tag Judul (heading) <hn>Judul paragraf</hn> n = 1,2,3,4,5,6 (tingkat judul) Untuk menuliskan judul suatu paragraf.
Tag Paragraf <p>paragraf</p> Untuk menandai suatu paragraf. Suatu paragraf akan terlihat dibatasi oleh satu baris kosong sebelum dan sesudahnya.
Text Formating (Bold, Italic, Underline) <b>Kalimat yang dicetak tebal</b> <i>Kalimat yang dicetak miring</i> <u>Kalimat yang digarisbawahi</u>
Text Formating (Superscript, Subscript) <sup>bagian yang dicetak tinggi</sup> <sub>bagian yang dicetak rendah</sub> Untuk menandai bagian karakter agar dicetak tinggi atau rendah, biasanya untuk rumus matematika atau kimia.
Tag Ganti Baris (Break line) <br> Untuk pindah ke baris berikutnya. Bentuk penulisan lain yang dianjurkan (XML style) : <br />
Tag Font (size) Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Parameter : size, face, color
Tag Font (face) Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Parameter : size, face, color
Tag Font (color) Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Parameter : size, face, color
Tag Link (Anchor) <a href="Link">Kata yang di-click</a> <a name="#Acuan">Kata yang dituju</a> Link = Alamat URL atau nama file dan/atau acuan yang dituju Acuan = Kata sembarang sebagai penanda membentuk link ke URL/file/bagian dokumen lain.
Tag Link (2)
Frame Frame membagi layar dalam beberapa jendela, dimana masingmasing layar menampilkan web page yang berbeda. Tag Dasar: <frameset> . . . . </frameset> <frame/> <noframes> . . . . </noframes> Basic Atributes - cols = “values” …. (value biasanya dituliskan dalam % menunjukkan besar pembagian area. - rows = “values” - name = “frame_name” - src = “frame_source(url)” - target = “frame_name”
Frame (2)
See You Next Week