Pengenalan tentang HTML



Pengenalan tentang HTML



Pengertian singkat tentang HTML
HTML (Hyper Text Markup Language) merupakan bahasa standat untuk membuat suatu dokumen HTML (halaman web) yang terdiri dari kode-kode singkat tertentu, dimana dengan kode-kode tersebut akan memerintahkan Web browser bagaimana untuk menampilkan halaman Web yang terdiri dari berbagai macam format file seperti texs, grafik, animasi link maupun audio-video.
Sedangkan Web browser adalah sebuah progam yang dapat menterjemahkan kode perintah dari dokumen HTML tersebut sehingga dapat kita lihat dan kita baca. Contoh dari Web Browser adalah Internet Exsplorer, Netscape Navigator, Mozilla Firefox dll.
HTML mempunyai file perluasan (extention) htm atau html. Dimana kedua perluasan tersebut adalah sama, jadi anda boleh menyimpan file dokumen HTML dengan extention ".htm" atau ".html".
Untuk mulai belajar HTML anda bisa menggunakan Texs Editor misalnya Notepad. Di bawah ini adalah contoh suatu dokumen HTML yang sangat sederhana. Start Notepad, silahkan mulai dengan mengetikkan (copy/paste) texs di bawah ini:


Titel Websiteku


Ini adalah dokumen HTML pertamaku



Simpan file dengan pilihan "save as" ke C:\My Documents dengan nama "websiteku.htm".
Kemudian Start Internet Explorer. Pilih menu File, Open dan tujukan ke C:\My Documents\websiteku.htm " klik Ok, maka halaman website pertama anda akan ditampilkan.
*Lakukan hal yang sama untuk contoh-contoh selanjutnya.
Perintah didalam dokumen HTML terdiri dari berbagai struktur penyusun seperti Tag, elemen, atribut dan nilai. Tag terdiri dari lambang-lambang khusus seperti: "<", ">" dan "/", untuk menuliskannya di dalam dokumen HTML dimulai dengan tag pembuka "<...>"dan diakhiri dengan tag penutup "". Kemudian di dalam tag tersebut terdapat teks seperti contoh diatas :html, head, title,body dan yang lainnya ini disebut dengan Elemen HTML.
Elemen HTML kemudian ada yang memiliki atribut dan nilai tertentu, seperti contoh untuk membuat warna latar belakang (background): , body merupakan elemen, bgcolor adalah atribut dan 0000ff merupakan nilai (value).
Elemen HTML mempunyai tiga hal penting yaitu: tag pembuka, isi, dan tag penutup. Sebagai contoh: Elemen html mempunyai tag pembuka "" dan tag penutup "" dan yang berada diantaranya merupakan isi dari elemen html. Untuk menuliskan Elemen HTML bisa menggunakan huruf besar maupun huruf kecil. Contoh: , , , , semuanya adalah sama.



TAG DASAR HTML
Komponen dasar dari suatu dokumen HTML terdiri dari tag elemen HTML, HEAD dan BODY. Berikut ini adalah penjelasan dari Tag Elemen tersebut:


Disini adalah Titel Websiteku


Ini adalah dokumen HTML pertamaku



Tag pertama pada dokumen HTML diatas adalah: "" tag ini merupakan awal dari suatu dokumen HTML, dan tag "" merupakan akhir dari dokumen HTML. Isi keseluruhan dari suatu dokumen HTML selalu berada diantara tag ....
Kemudian tag "..." (header) adalah informasi dari dokumen HTML. Informasi di dalam header meliputi: title, meta, style, script dll. Selain Title informasi di dalam header ini nantinya tidak akan di tampilkan di web browser.
Tag berikutnya adalah "..." merupakan bagian dari Head, tag ini adalah sebagai Titel dari dokumen HTML, titel ini akan tampil di titel browser atau list paling atas dari web browser. Sebagai contoh sewaktu anda membuka file contoh diatas perhatikan di sudut kiri paling atas dari browser anda, akan muncul tulisan "Disini adalah Titel Websiteku".
Tag "..." merupakan isi dari suatu dokumen HTML yang akan ditampilkan di web browser, yang terdiri dari berbagai macam format file berupa texs, grafik, link, animasi maupun audio-video (multimedia).


MENULIS TEXT HTML
Untuk menulis biasanya ada paragraf dan baris baru, lantas bagaiman cara menuliskannya di dokumen HTML?. Dari contoh yang sudah kita buat coba tambahkan dengan tag-tag berikut ini:


Selamat Datang di Websiteku


Ini adalah halaman HTML pertamaku.

Aku sedang membuat paragraf dan ini contohnya.


Ini contoh paragraf yang lainnya.


Ini juga paragraf mm...tapi de-

ngan baris baru.

Ini baris baru yang lain.





Untuk membuat suatu paragraf tag elemennya adalah

...

, dan untuk baris baru adalah
, perlu diketahui bahwa sebagian tag elemen HTML tidak memerlukan tag penutup, sebagai contoh adalah
ada juga
, apa itu
?, coba lanjutkan lagi dengan contoh berikut ini:


Selamat Datang di Websiteku



Ini adalah halaman HTML pertamaku.


Dikerjakan oleh:

Aku sedang membuat paragraf dan ini contohnya.


Ini contoh paragraf yang lainnya.


Ini juga paragraf mm...tapi de-

ngan baris baru.

Ini baris baru yang lain.





Nah..udah tau kan apa itu
. Garis Horizontal
juga tidak menggunakan tag penutup. Kemudian ada

...

disebut dengan Heading, merupakan ukuran teks yang biasa di pakai untuk judul, bab, maupun sub-bab lainnya. Ukurannya ada 6 jenis mulai dari

sampai

, ukuran yang paling besar adalah h1 dan yang terkecil adalah h6.
Selanjutnya tag adalah Comments digunakan untuk memasukkan (menyisipkan) suatu komentar di dalam HTML. Suatu comments akan diabaikasn oleh browser. Kamu dapat menggunakan komentar untuk menjelaskan sesuatu hal.


FORMAT TEXT HTML
Dibawah ini adalah contoh format teks yang sering digunakan di dalam dokumen HTML:




Ini adalah halaman HTML pertamaku.


Dikerjakan oleh:

Aku sedang mempelajari format-format teks.

Contoh-contohnya adalah sebagai berikut:


Teks Normal

Teks mesin ketik

Teks tebal (bold)

Teks tebal dengan perintah Strong

Teks dengan italic (miring)

Teks miring dengan perintah Emphasized

Teks bergaris bawah (underline)

Teks tercoret (strike)

Teks lebih besar dari normal

Teks lebih kecil dari normal

Teks menggunakan Subscript: Molekul Air adalah H2O

Teks menggunakan Superscript: Hasil dari 102=100





Kemudian untuk menampilkan teks sesuai dengan yang tertulis kita gunakan tag 
...
, misalnya jika anda menuliskan syair sebuah lagu atau puisi:


 
    PUITUIS ASA
    Hari ini...
    Aku sedang belajar...
    Belajar tentang HTML.
       Sulit 'ntuk dimengerti,
       Karena banyaknya teks-teks aneh.
       Tapi biarlah...
    Akan kucoba...
    sampe kelenger..!





FORMAT FONT HTML
Tag HTML untuk font adalah ..., dengan tag ini kita bisa menentukan jenis font (face), warna (color), dan ukuran (size), untuk lebih jelasnya anda coba contoh berikut ini:



Untuk membuat jenis font (face):

Judul dengan font Verdana


Isi dengan font Times


Untuk membuat ukuran (size):

Judul dengan size 5


Isi dengan size 3


Untuk membuat warna font (color):

Judul dengan warna biru



Isi dengan warna merah


Contoh komplit untuk membuat jenis font (face),size dan color:

Judulnya Tentang Font


Ini adalah contoh tulisan dengan pengaturan font yang menggunakan

tag HTML elemen font. Jika anda berminat pesan sekarang juga......





Dibawah ini adalah sebagai referensi bagi anda untuk memanipulasi atribut face, color dan size:
Atribut
face="Jenis font yang digunakan", contoh: face="Tahoma"
size="Ukuran dari font (1-7)", contoh: size="3"
size="Memperbesar ukuran font", contoh: size="+1"
size="Memperkecil ukuran font", contoh: size="-1"
color="Warna dari font", contoh: color="blue"
color="Warna dari font", contoh: color="#FF0000"
Sesuai dengan recomendasi dari World Web Consortium (W3C), Untuk HTML 4.0 keatas, tag tidak dipergunakan lagi, sebagai gantinya dibuat tag