Belajar HTML Dasar : Struktur HTML

Setiap halaman website atau dokumen HTML yang baik pada umumnya memiliki struktur tertentu. Secara umum dokumen HTML memiliki struktur yang dibagi menjadi 3 yaitu : HTML, HEAD, BODY. Secara struktur HTML akan terdiri dari dua bagian utama yaitu HEAD dan BODY. Memang dianalogikan seperti manusia yang memiliki kepala dan badan.

Untuk lebih jelasnya silahkan perhatikan ilustrasi berikut ini :

Setiap dokumen HTML diawali dengan tag pembuka <html> dan diakhiri tag penutup </html>. Kemudian di dalam HTML terdiri dari dua bagian seperti dijelaskan diatas yaitu HEAD dan BODY. Bagian HEAD diawali dengan tag pembuka <head> dan diakhiri dengan tag penutup <head>. Bagian BODY diawali dengan tag pembuka <body> dan diakhiri tag penutup </body>.
Bagian HEAD atau kita sebut header biasanya mengantung tag-tag seperti tag TITLE, META dan lain-lain. Tag TITLE digunakan untuk menampilkan judul halaman HTML pada title di browser. Tag META digunakan untuk mengisikan informasi seperti author, keyword dan lain-lain. Bagian BODY merupakan bagian yang digunakan untuk menampilkan isi dokumen/halaman HTML. Isi yang ditampilkan informasi yang dapat berupa teks, gambar, link dan lain sebagainya.
Jadi untuk pemula atau yang baru belajar HTML, kita akan lebih banyak belajar pada bagian BODY seperti tag-tag untuk heading, paragraf, tabel, link, images, form, list dan lain sebagainya.

sumber : http://kuliah.imadewira.com

Belajar HTML Dasar : Element

Element Pada HTML

Setiap dokumen HTML terdiri dari satu atau beberapa element. Element terdiri dari atas tiga bagian yaitu : Tag Pembuka, Isi dan Tag Penutup. Berikut ini contoh Element HTML :

1	<title>Judul Website</title>

Pada contoh Element diatas :

• <title> adalah Tag Pembuka

• “Judul Website” adalah Isi (semua yang ada diantara Tag Pembuka dan Tag Penutup).

• </title> adalah Tag Penutup.

Isi element adalah semua yang berada diantara Tag Pembuka dan Tag Penutup. Isi element dapat saja berupa element lainnya, jadi sebuah element dapat terdiri dari element lainnya. Inilah yang disebut dengan istilah “nested element”.  Dalam “nested element” yaitu element yang mengandung element lainnya, tag-tag yang ditulis tidak boleh saling tumpang tindih. Berikut ini contoh penulisan yang benar :

1	<p>Ini contoh tulisan cetak <b>tebal</b></p>

Jika penulisan skrip (kode) HTML salah atau kurang tepat, maka browser tidak dapat membaca dengan sempurna (terjadi error) sehingga tampilan website menjadi tidak sesuai dengan apa yang diinginkan.
Jangan lupa untuk selalu menuliskan tag penutup
Contoh :

1	<p>Ini sebuah paragraf

2	<p>Ini contoh paragraf lain

Pada saat ini sebagian besar browser akan menampilkan kode HTML diatas dengan baik walaupun tanpa diisin dengan tag penutup </p>. Tetapi sebaiknya kita tetap menuliskan dan melengkapi dengan tag penutup sebagaimana mestinya karena kesalahan tanpa tag penutup itu akan menimbulkan error atau tampilan yang tidak sesuai dengan yang kita harapkan ketika kode HTML yang kita buat semakin kompleks.
Element Kosong
Element kosong adalah element HTML tidak memiliki Isi. Element kosong menggunakan tag penutup pada tag pembuka. Jadi tag pembuka menjadi satu dengan tag penutup. Contohnya adalah tag <br> yaitu tag yang digunakan untuk berpindah ke baris baru. Pada XHTML, XML dan versi HTML yang lebih baru setiap element harus menggunakan tag penutup.  Untuk itu perlu ditambahkan tanda garis miring pada tag tersebut menjadi <br />. Walaupun saat ini penulisan <br> masih bisa diterima oleh semua browser, tetapi sebaiknya ditulis menjadi <br />.
Lowercase
Seperti pernah dijelaskan sebelumnya, pada dasarnya tag HTML tidak bersifat case sensitive, artinya penulisan tag HTML bisa menggunakan huruf kapital atau pun huruf kecil. Tetapi lebih disarankan untuk menggunakan huruf kecil (lowercase) atau setidaknya menggunakan huruf yang sama dalam sebuah dokumen.

Sumber : http://kuliah.imadewira.com

Belajar HTML Dasar : Pengenalan

Definisi HTML

HTML adalah sebuah bahasa untuk menampilkan halaman sebuah website. HTML merupakan singkatan dari Hyper Text Markup Language. HTML bukan termasuk dalam bahasa pemrograman, tetapi HTML adalah “markup language“, “markup language” ini merupakan sekumpulan “tag“. “tag” inilah yang digunakan untuk menampilkan halaman website dalam tampilan tertentu.

Tag HTML

Tag adalah teks khusus (markup) yang terdiri dari nama tag yang diapit oleh karakter “<” (tanda lebih kecil) dan “>” (tanda lebih besar). Contoh tag <body> : adalah tag dengan nama tag body. Tag umumnya ditulis secara pasangan yaitu tag pembuka dan tag penutup. Contoh tag pembuka : <body> dan tag penutup </body> (ditambah tanda “/”).
Tag HTML tidak bersifat case sensitive, maksudnya tag HTML tidak membedakan huruf besar/katipal dan huruf kecil. Jadi anda bisa menggunakan huruf kapital atau pun huruf kecil ketika menuliskan tag HTML. Misalnya menuliskan <body> dengan <BODY> maka hasilnya akan sama saja. Namun walaupun begitu, akan lebih bagus jika kita konsisten memilih salah satu saja untuk semua tag di halaman HTML yang kita buat.

Web Browser dan Dokumen HTML

Web browser adalah aplikasi atau software yang digunakan untuk menampilkan halaman website. Contoh web browser adalah Internet Explorer, Mozilla Firefox, Opera dan lainnya. Web browser memiliki tugas untuk membaca dokumen HTML dan menampilkan sebagai halaman website. Web browser tidak menampilkan tag HTML tetapi menggunakan tag HTML untuk menampilkan isi dari halaman HTML tersebut.
Dokumen HTML sendiri terdiri dari tag-tag HTML dan teks biasa. Jadi dokumen HTML bisa disamakan dengan halaman website. Artinya dokumen HTML juga bisa disebut dengan halaman website.
Contoh HTML sederhana :

1

<html>

2

<head>

3	<title>Judul Halaman</title>

4

</head>

5

<body>

6	<h1>Heading</h1>

7	<p>Isi paragraf disini.</p>

8

</body>

9

</html>

Hasil tampilan kode HTML diatas pada browser adalah seperti berikut :

Ekstensi HTML atau HTM?

Dokumen HTML ada yang disimpan dengan ektensi HTM dan HTML. Mungkin ketika anda mencoba latihan membuat HTML sederhana anda pernah bingung, apakah harus disimpan dengan ekstensi “htm” atau “html”. Sebenarnya sama saja, tidak ada pengaruhnya pada halaman HTML anda antara ektensi “htm” atau pun “html”, jadi anda bebas memilihnya. Tapi disarankan anda konsisten dengan memilih salah satu untuk mempermudah mengingat nama file. Karena misalnya ketika memanggil file tertentu agar anda tidak salah mengetikkannya.
Untuk diketahui bahwa pada awalnya ektensi “htm” digunakan karena berbagai sistem dan software hanya mengijinkan 3 digit/karakter untuk dijadikan ekstensi sebuah file/dokumen. Tapi untuk saat ini, kita sudah dapat menggunakan ekstensi “html” sebagai ekstensi file/dokumen HTML.

Sumber: http://kuliah.imadewira.com