HTML adalah singkatan dari Hypertext Markup Language. HTML lah yang bisa dikatakan membentuk internet hingga seperti sekarang ini. HTML tidak lebih dari sekumpulan teks sederhana, jadi jangan takut. HTML itu gampang sekali ( beneran), gak percaya? Ikuti pencerahan ala saya mengenai HTML untuk pemula.
Perkenalan
Yang diperlukan untuk menulis HTML cukup dengan notepad saja (dan bahasa Inggris!). Software-software HTML editor seperti Dreamweaver dan Microsoft FrontPage, juga dapat melakukan tugasnya membuat HTML dengan baik. Tapi untuk tahap ini, saya lebih merekomendasikan untuk memakai notepad (jadi terbiasa mengetik dan lama-lama akan hapal syntaxnya).
Jadi, buka notepad sekarang dan save file tersebut di dalam folder ‘belajar’, dengan nama ekstension ‘.html’ jadi seperti “c:/belajar/okeh.html” . Klik enter, browser terbuka, dan itulah halaman HTML pertama kamu, selamat!
TAG, ATTRIBUTE DAN ELEMENT
Copy kode HTML berikut ini kedalam file yang baru saja dibuat
This is my first web page
Struktur TAG HTML yang benar adalah :
sekaranglihat kode dibawah :
<div align="left">orangorangan okeh!</div>
Penjelasan:
align = ATTRIBUTE
left = VALUE atau nilai dari ATTRIBUTE align
p = TAG
orangorangan okeh! = ELEMENT dari TAG p
semoga, sampai sini penjelasannya cukup self explanatory…………
PAGE TITLE
Semua Halaman HTML harus mempunyai Page Title / judul halaman. Kembali lihat kode berikut ini :
This is my first web page
Kelihatan kan yang mana page title, dan harus diletakkan dimana? yes, harus diletakkan dalam tag HEAD seperti ini :
PARAGRAPH
Coba ketikkan kode seperti ini pada file kamu :
Halo ini website pertama saya Masih bingung nih saya sama artikel ini.
Setelah di-save, kenapa hasilnya hanya 1 baris yah? dan bukan 2 baris seperti yang saya ketik? inilah fungsi tag PARAGRAPH (P) berperan. Sekarang bandingkan kode2 berikut dan tes hasilnya masing2 pada browser.
1. Halo ini website pertama saya Masih bingung nih saya baca artikel ini. 2. Halo ini website pertama saya Masih bingung nih saya baca artikel ini. 3. Halo ini <strong>website</strong> pertama saya.Masih <em>bingung</em> nih saya baca artikel ini.
haha…TAG apalagi yah?
HEADINGS
Apa itu HEADINGS? semacam pre-format untuk judul, ukurannya dari h1 sampai h7, dicoba-coba aja sendiri =) berikut samplenya
<h1>ini Heading satu</h1> <h2>heading dua nih</h2> Isi pargraph aja <h2>masih heading dua</h2> belajar HTML
LISTS
Sesuai judulnya, TAG ini berguna untuk menampilkan daftar. Ada 2 macam, ordered list (ada nomornya) dan un-ordered list (hanya me-listing saja).Langsung aja cekibrot codenya :
<h2>unordered list</h2> <ul> <li>jipeus</li> <li>orangorangan</li> <li>okeh</li> </ul> <h2>ordered list</h2> <ol> <li>jipeus</li> <li>orangorangan</li> <li>okeh</li> </ol>
LINKS
<a href="http://www.htmldog.com" target="_blank" rel="noopener">HTML Dog</a>
HREF di-isi dengan alamat tujuan, TARGET diisi dengan metode yang diinginkan. (ada 2 yang umum digunakan _blank, _self).
IMAGE
Berikut adalah TAG untuk menampilkan gambar.
<img src="http://www.orangorangan.com/images/tes.gif" alt="Gambar tes" width="100" height="100" />
SRC = lokasi dari gambar berada
ALT = alternative text, teks yang akan ditampilkan jika browser tidak menampilkan gambar
sedikit masukkan : gunakan format GIF untuk gambar yang memiliki warna2 solid, dan gunakan JPEG untuk gambar-gambar foto. Semakin kecil ukuran gambar, semakin cepat browser menampilkan halaman website kita.
hufff, itu dulu yah, nanti berlanjut lagi part 2 nya, membahas Table dan Form.
Thanks sudah meluangkan waktu untuk baca =)