Editor HTML

HTML dapat diedit dengan menggunakan editor HTML profesional seperti:

• Adobe Dreamweaver
• Microsoft Expression Web
• CoffeeCup HTML Editor

Namun, untuk proses belajar, halaman HTML sebaiknya dibuat menggunakan teks editor sederhana  seperti Notepad (PC), Notepad++, atau TextEdit (Mac).

Latihan.

Buatlah sebuah halaman HTML dengan teks editor kemudian buka dengan browser.

 

HTML Elements

Sebuah elemen HTML adalah segalanya dari tag awal sampai tag akhir:

Tag Awal	Element content	Tag Akhir
<p>	this is a paragraf	</p>
<a href=”default.htm”>	this is a link	</a>
<br>

*) Tag awal sering disebut tag pembuka. Tag akhir sering disebut tag penutup.

 

Sintaks Elemen HTML

Sebuah elemen HTML dimulai dengan start tag / tag pembuka

• Sebuah elemen HTML diakhiri dengan tag akhir / tag penutup
• Isi elemen adalah segalanya antara tag awal dan tag akhir
• Beberapa elemen HTML memiliki konten kosong
• elemen kosong ditutup pada tag awal
• Kebanyakan elemen HTML dapat memiliki atribut

Empty HTML Elements

Elemen HTML tanpa konten disebut elemen kosong.
<br> merupakan elemen kosong tanpa tag penutup (Jaringan tag mendefinisikan satu baris).

Tip: Dalam XHTML, semua elemen harus ditutup. Menambahkan garis miring di dalam tag awal, seperti <br />, adalah cara yang tepat untuk menutup elemen kosong di XHTML (dan XML)

Tip HTML: Tag menggunakan huruf kecil

Tag HTML tidak case sensitif: <P> berarti sama dengan <p>. Banyak situs web menggunakan tag HTML huruf besar.

HTML Attributes

• Elemen HTML dapat memiliki atribut
• Atribut memberikan informasi tambahan tentang elemen
• Atribut selalu ditentukan dalam tag awal
• Atribut datang dalam pasangan nama dan nilai seperti: name = “value”

 

Contoh

Link HTML didefinisikan dengan tag <a>. Alamat link ditentukan dalam atribut href:

Tip HTML: Atribut menggunakan huruf kecil
Atribut nama dan nilai atribut bersifat case-sensitive.
HTML Attributes Reference
Berikut ini adalah daftar dari beberapa atribut yang biasa digunakan pada setiap elemen HTML:

Attribute	Deskripsi
class	Menentukan satu atau lebih classnames untuk elemen (mengacu pada kelas dalam style sheet)
id	Menentukan sebuah id unik untuk sebuah elemen
style	Menentukan Style CSS inline untuk suatu elemen
title	Menentukan informasi tambahan tentang elemen (ditampilkan sebagai tool tip)

 

HTML Headings

Didefinisikan dengan tag <h1> sampai <h6>.
<h1> mendefinisikan heading yang paling penting.
<h6> mendefinisikan judul yang paling tidak penting.
Contoh

Catatan: Browser secara otomatis menambahkan beberapa ruang kosong (margin) sebelum dan sesudah setiap heading.

Headings Sangat Penting

• Gunakan judul HTML untuk judul saja.
• Jangan gunakan judul untuk membuat teks BESAR atau tebal.
• Mesin pencari menggunakan Heading untuk indeks struktur dan isi dari halaman web Anda.
• Headings H1 harus digunakan sebagai judul utama, diikuti oleh H2 headings, kemudian headings H3 untuk yang kurang penting, dan seterusnya.

 

HTML Lines

Tag <hr> menciptakan garis horizontal di halaman HTML.

 

Contoh :