Elemen HTML
Suatu elemen HTML terdiri dari tag-tag dan atribut. Berikut ini ciri-ciri tentang elemen-elemen HTML :
• HTML element starts with a start tag / opening tag.
• HTML element ends with an end tag / closing tag.
• The element content is everything between the start and the end tag.
• Some HTML elements have empty content.
• Empty elements are closed in the start tag.
• Most HTML elements can have attributes.
Empty HTML Elements :
Elemen HTML yang tidak memiliki konten atau isi disebut empty element / elemen kosong.
Elemen dapat ditutup pada awal tag. <br> adalah contoh elemen kosong yang tidak memerlukan end tag.
<br> bermakna ganti baris. Pada XHTML, XML, dan versi HTML yang lebih baru, semua elemen harus ditutup dengan end tag.
Cara yang tepat untuk menutup elemen kosong yang dapat diterima oleh HTML, XHTML dan XML adalah dengan menambahkan garis miring di awal tag, seperti <br />.
Walaupun <br> terbukti berjalan baik disemua browser, menulis <br /> akan lebih baik.
Hyper Text Markup Language(HTML) TAG
HTML Tag:
Sewaktu browser menampilkan halaman web. Browser akan membaca teks pada dokumen HTML dan mencari kode khusus yang disebut tag
Tag biasanya merupakan suatu pasangan tag awal <…> dan tag akhir </..>. Format umum pasangan tag adalah sebagai berikut :
<html>
<head>
<title>Contoh Tag HTML</title>
</head>
<body>
.. Isi dokument HTML Anda ..
</body>
</html>
Nb : Tag yang mengandung tag lain di dalamnya disebut sebagai nested tag. jadi tag tidak boleh tumpang tindih
Beberapa Contoh HTML Tag :
• <br /> : Digunakan untuk berpindah baris.
• <p> </p> : Digunakan untuk mendeklarasikan paragraph.
• <hr /> : Membuat Garis Horizontal.
• <blink> : Membuat Text berkedip-kedip.
• <font> : Menformat huruf.
• DLL.
HTML Atribute
Setelah sebelumnya kita belajar tentang Tag HTML maka kita sekarang mencoba untuk melihat kemampuan ekstra lain dari tag HTML.
Kemampuan tambahan ini diperoleh melalui penggunaan atribut tag HTML. Atribut memungkinkan informasi tambahan pada elemen HTML.
Tag awal biasanya memiliki beberapa buah atribut yang menyatakan karakteristik tag tersebut, contoh :
<p align=“center”>Hallo World</p>
Pada contoh diatas “p” adalah nama tag, “align” adalah nama atribut sedangkan “center” adalah nilai atribut.
Nb : atribut selalu melibatkan nilai.
• <p align=“center”> : digunakan untuk menengahkan text paragraph.
• <table border = “1px solid”> : digunakan untuk membuat table yang mempunyai ketebalan garis sebesar 1 pixel dan berwarna solid (hitam).
• <body bgcolor="#000000"> : digunakan untuk membuat background body dengan warna hitam.
• <font size=“12”> : digunakan untuk memrubah ukuran font.
DLL.
HTML Heading
Contoh HTML Heading head :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transational//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transational.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link rel="SHORTCUT ICON" href="images/favicon.ico"/>
<title>PenerimaanMahasiswaBaru</title> <metaname="keywords"content="penerimaanMahasiswaBaru,STIKOM,Suraba ya,penmaru/>
<meta name="description" content="Saat ini, tidak satupun perusahaan/organisasi maju yang tidak menerapkan teknologi informasi. Surabaya sebagai kota industri merupakan icon perkembangan teknologi informasi kedua setelah jakarta. Meskipun kota besar, biaya hidup di Surabaya (makan, kost-kostan, transportasi, dll) lebih murah dibanding kota besar lainnya (Survei Mercei Indonesia tahun 2008). Sangatlah tepat bila memutuskan belajar teknologi informasi di SURABAYA. " />
</head>
Keterangan HTML Heading diatas :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transational//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transational.dtd"> : menjelaskan bahwa html tersebut menggunakan format xhtml versi 1.0 transational.
<link rel="SHORTCUT ICON" href="images/favicon.ico"/> : Membuat images shortcut icon pada address bar di browser.
<metaname="keywords"content="penerimaan Mahasiswa Baru,STIKOM,penmaru/> : digunakan untuk spesifikasi keyword (kata kunci) oleh search engine.
<meta name="description" content="Saat ini, tidak satupun perusahaan/organisasi maju yang tidak menerapkan teknologi informasi. Surabaya sebagai kota industri merupakan icon perkembangan " /> : digunakan untuk mendeskripsikan halaman wep page yang anda buat.
Untuk membuat judul pada suatu dokumen HTML digunakan pasangan tag <title> .. </title>. Tag <title>..</title> hanya boleh berada di bagian HEAD dan setiap dokumen hanya boleh memiliki satu <title>..</title>.
Title biasanya ditampilkan oleh browser pada title bar dari jendela browser dan berfungsi sebagai label di browser yang anda gunakan.
Contoh HTML Heading title :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transational//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transational.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Penerimaan Mahasiswa Baru</title>
</head>
Keterangan :
<title>Penerimaan Mahasiswa Baru</title> : digunakan untuk membuat judul suatu dokumen HTML.
Berbagi Informasi HTML Heading
Elemen Meta:
• Elemen META digunakan untuk memberikan informasi tentang suatu dokumen.
• Elemen META bukan untuk mengantikan elemen title.
• Elemen META digunakan untuk memberikan informasi lain yang bermanfaat bagi browser atau server.
HTML Paragraph
Contoh sintax Penggunaan HTML Paragraph :
<html>
<head>
<title>Coba Blink-Blink</title>
</head>
<body>
<div align=left>apes </div>
<div align=center> apes </div>
<div align=right> apes </div>
</body>
</html>
Contoh sintax Penggunaan HTML Paragraph :
<html>
<head>
<title>Coba Blink-Blink<a/title>
</head>
<body>
<aaa
es </p>
<p align=right> apes </p>
</body>
</html>
