Pada masa sekarang ini HTML merupakan interface standard Internet. Halaman-halaman HTML ini bisa mengandung animasi, suara, video, bahkan sampai program interaktif yang kompleks. Jataan halaman HTML setiap hari diakses dari WEB server – WEB server di seluruh dunia.
Sudah menjadi trend memang sekarang ini perusahaan-perusahaan melakukan pertukaran informasi bisnis dan informasi intern pegawai dan pelanggan-pelanggan mereka. HTML sekarang menjadi pilihan untuk presentasi. Bahkan Microsoft sendiri telah mengintegrasikan HTML ke system operasi Windows-nya. Pendeknya HTML terdapat di mana-mana.
Pengertian HTML
HTML adalah bahasa markup yang umum digunakan. Kepopuleran HTML disebakan karena HTML ini mudah digunakan. Pembuatan dokument WEB dengan HTML dapat dilakukan dengan mudah dan cepat. Dokumen WEB dapat tersaji dengan cepat ke banyak pembaca di seluruh dunia sekaligus. HTML mudah melakukan kontrol terhadap tampilan halaman WEB baik berupa teks, gambar, suara, animasi maupun video.
HTML merupakan singkatan dari Hypertex Markup Language. HTML digunakan untuk membangun halaman WEB. Sekalipun banyak orang menyebutnya sebagai bahasa pemrograman, HTML sebenarnya sama sekali bukan bahasa pemrograman, hal ini terlihat dari namanya, HTML adalah suatu bahasa Markup. HTML digunakan untuk melakukan mark-up (penandaan) terhadap sebuah dokumen teks. Tanda tersebut digunakan untukmenentukan format atau style dari teks yang ditandai
halaman web dibangun oleh kode-kode HTML yang disebut juga dengan tag-tag HTML
Tag yang harus di miliki oleh halaman WEB adalah:
<HTML>
<HEAD>
<TITLE>Halaman WEB pertama saya</TITLE>
</HEAD>
<BODY>
Halo Dunia!
</BODY>
</HTML>
Di antara kedua tag tadi adalah tempat memasukkan apa saja ke dalam halaman web.
Pada bagian HEAD, kita memberikan data mengenai dokumen kita. Tag penutup selalu ada pada halaman tersebut.
Paragraph/Baris Baru:
Contoh:
<HTML>
<HEAD>
<TITLE>Halaman WEB pertama saya</TITLE>
</HEAD>
<BODY>
Halo Dunia!<p>
Halo semuanya<br>
Ini adalah halaman WEB saya. <br>
Saya sedang belajar membuat halaman WEB dengan kode HTML<p>
Salam!
</BODY>
</HTML>
Hyperlink
Hyperlynk dapat dipergunakan untuk mengkaitkan dokumen HTML ke dokumen HTML pada URL (situs) yang berbeda, mengkaitkan antar dokumen HTML pada URL yang sama atau pengkaitan penunjukan tempat pada URL, dokumen HTML yang sama.
1. Mengkaitkan Halaman WEB pada URL yang Berbeda
contoh:
<HTML>
<HEAD>
<TITLE>Utama</TITLE>
</HEAD>
<BODY>
Halo Dunia!<p>
Halo semuanya<br>
Ini adalah halaman WEB saya. <br>
<A hreff=�http://www.xbasicpro.com/pribadi.htm�>Klik di sini</a>untuk melihat data pribadi saya.
</BODY>
</HTML>
simpan dokumen di atas dengan nama utama.htm kemudian buatlah file lain dengan nama pribadi.htm, lalu ketik kode-kode HTML di bawah ini:
<HTML>
<HEAD>
<TITLE>Data Pribadi</TITLE>
</HEAD>
<BODY>
Nama: Hartoto <br>
Alamat: Jl. Denai gg. Muslimin 35 Medan <br>
Pekerjaan: WEB Developer<br><p>
<A hreff=�utama.htm�>klik di sini</a>untuk kembali
<A hreff=�pribadi.htm�>Klik di sini</a>untuk melihat data probadi saya.
</BODY>
</HTML>
2. Mengkaitkan Halaman WEB pada URL yang sama dan Dokumen yang Berbeda
contoh:
<HTML>
<HEAD>
<TITLE>Utama</TITLE>
</HEAD>
<BODY>
Halo Dunia!<p>
Halo semuanya<br>
Ini adalah halaman WEB saya. <br>
<A hreff=�pribadi.htm�>Klik di sini</a>untuk melihat data pribadi saya.
</BODY>
</HTML>
simpan dokumen di atas dengan nama utama.htm kemudian buatlah file lain dengan nama pribadi.htm, lalu ketik kode-kode HTML di bawah ini:
<HTML>
<HEAD>
<TITLE>Data Pribadi</TITLE>
</HEAD>
<BODY>
Nama: Hartoto <br>
Alamat: Jl. Denai gg. Muslimin 35 Medan <br>
Pekerjaan: WEB Developer<br><p>
<A hreff=�utama.htm�>klik di sini</a>untuk kembali
<A hreff=�pribadi.htm�>Klik di sini</a>untuk melihat data probadi saya.
</BODY>
</HTML>
simpan dengan nama pribadi.htm
3. Mengkaitkan Halaman WEB pada URL yang sama dan Dokumen yang Sama
contoh:
<HTML>
<HEAD>
<TITLE>Utama</TITLE>
</HEAD>
<BODY>
Halo Dunia!<p>
Halo semuanya<br>
Ini adalah halaman WEB saya. <br>
<A href=�http://xbasicpro.com/latihan.htm#bab1�>klik di sini </A> untuk mulai ke BAB I <BR>
Kode HTML adalah kode-kode pembagun halaman web
Kode tersebut biasanya dibentuk dalam file teks biasa
Membuat kode-kode HTML dapat dilakukan dengan teks editor biasa seperti notepad
Ada juga software khusus yang dirancang untuk
memudahkan membangun kode-kode HTML seperti
Microsoft FrontPage, Macromedia DreamWeaver
lain-lain
Aplikasi pengolah kata Microsoft Word
juga dapat dipergunakan untuk
membuat dokument HTML.
Coba Lihat fasilitas Save AS WEB Page…
Halaman WEB yang dibentuk oleh kode-kode HTML
dapat menampilkan Teks, Gambar, animasi, Video, Suara
Dengan WEB pertukaran informasi menjadi lebih cepat
BAB I. HTML Sebagai Pembentuk Halaman WEB
</BODY>
</HTML>
Font
Speksifikasi dari Huruf (Font) : </FONT> tag ini menerangkan bahwa sebuah tulisan mempunyai beberapa pelengkap.
Pelengkapnya adalah: Ukuran (SIZE), FACE, dan Warna (COLOR)
Ukuran (SIZE): Menerangkan ukuran dari tulisan antara angka 1-7, tergantung kepada . angka 1 adalah yang terkecil dan angka 7 adalah yang terbesar.
FACE: Menerangkan huruf aktual yang Anda mau tampilkan jika huruf ini terinstal pada komputer pengguna. Anda diperbolehkan mempunyai 3 pilihan huruf, dengan dibatasi oleh koma. Semua batasan (spaces) pada nama huruf harus diganti dengan “garis bawah” ( _ ). Huruf yang Anda pilih harus ada pada komputer si pengunjung. Jika tidak, maka komputer akan lanjut ke pilihan huruf yang kedua (jika ada). Jika tidak ada huruf yang ditemukan, maka huruf yang menjadi default yang akan ditampilkan oleh komputer. Untuk menjamin gabungan tulisan itu agar terlihat adalah merubahnya menjadi grafik. Ini adalah huruf-huruf yang populer <FONT FACE=â��Helvetia, Times New Roman, Arial>
Warna (COLOR): Menerangkan warna dari huruf dengan namanya atau dengan angka RGB/HEX.
Contoh: <FONT SIZE=�4� FACE=�Arial� COLOR=�Red�> Tulisan ini akan berbeda dengan yang lain. </FONT> Kode tersebut akan terlihat seperti ini: Tulisan ini akan berbeda dengan yang lainnya.
Huruf Dasar (Base Font): Tag ini ditempatkan disebelah kanan bawah dari BODY tag Anda dan tag ini menerangkan “default text” yang akan digunakan pada seluruh bagian dari halaman tersebut. Perlengkapan yang jadi satu bagian dari FONT tag dapat diterima. FONT tag tersebut akan me-overwrite setting dari BASEFONT.
Contoh: <BASEFONT SIZE=2 FACE=�Arial� COLOR=�red�>
Font Tag lainnya:
Catatan: Semua tag di bawah ini juga memerlukan sebuah tag penutup.
<B> Tulisan Tebal
<I> Tulisan Italic
<U> Underscore
<S> Strong
<S> Strikeout Strikeout - menggambar sebuah garis sepanjang tulisan
<PRE> Preformatted Text
<SUP> Renders text sebagai superscript
<SUB> Renders test sebagai sub script
Membuat Tabel
Tabel adalah tag yang sangat penting dalam bahasa HTML. Untuk menjadi seorang web designer yang efektif Anda harus mengetahui dan mengerti bagaimana cara kerja dari sebuah tabel.
Ada tiga elemen pada tabel. tag dari <TABLE> tag dari row table
<TABLE> Pelengkapnya:
* align - meratakan tabel ke kiri, ke tengah atau ke kanan.
* bgcolor - menunjukkan warna background untuk semua tabel.
* border - menunjukkan lebarnya batas (border) dalam satuan pixel.
* cellpadding - luas yang tak terlihat diantara isi sel dan aktual dinding sel.
* cellspacing - luas yang aktual (dalam pixel) diantara dua sel.
* width - menunjukkan luas dari tabel dalam satuan pixel atau persentase
Contoh: <TABLE align=�center� bgcolor=�blue� border=�2� cellpadding=�5� cellspacing=�2� width=�90%�>
* align - meratakan isi dari baris (row) yaitu ke kiri, tengah atau ke kanan.
* bgcolor - menunjukkan warna background dari baris (row).
* valign - meratakan secara vertikal isi dari baris (row) ke atas, ke tengah atau ke bawah.
Contoh:
* align - meratakan isi dari row yaitu ke kiri, tengah atau ke kanan.
* background - tempat dari gambar background di dalam sel.
* bgcolor - menunjukkan warna background untuk semua tabel.
* height - menunjukkan tinggi dari sel dalam satuan pixel.
* nowrap - perlengkapan untuk mengunci isi yang kita buat agar tetap pada garis yang sama.
* valign - meratakan secara vertikal isi dari baris (row) ke atas, ke tengah atau ke bawah.
Latihan: Membuat Tabel 3 baris 4 kolom
ini adalah hasilnya:
tabel1
Menyatukan Baris
ini hasilnya (lihat baris yang disatukan)
tabelrowspan1
Menyatukan Kolom
| < /FONT> | |||
ini hasilnya (lihat kolom yang disatukan)
tabelcolspan1
Sumber : http://irfannds23.wordpress.com/2008/11/18/dasar-html/
Tidak ada komentar:
Posting Komentar