Apa itu HMTL? HTML (Hyper Text Markup Language) merupakan suatu bahasa standar yang digunakan dalam membuat sebuah halaman dalam suatu web yang berupa simbol-simbol atau tag-tag yang dituliskan dalam sebuah file yang dimaksudkan untuk menampilkan halaman pada web browser.
HTML dokumen tersebut mirip dengan dokumen tulisan biasa, hanya dalam dokumen ini sebuah tulisan bisa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan TAG tertentu. Sebagai contoh jika ingin membuat tulisan ditampilkan menjadi tebal seperti: Creative, maka penulisannya dilakukan dengan cara: <b>Creative</b>. Tanda <b> digunakan untuk mengaktifkan instruksi cetak tebal, diikuti oleh tulisan yang ingin ditebalkan, dan diakhiri dengan tanda untuk menonaktifkan cetak tebal tersebut atau menmampilkan tulisan miring seperti : Creative, maka dalam penulisannya dilakukan dengan cara : <i>Creative</i>. HTML lebih menekankan pada penggambaran komponen-komponen struktur dan formating di dalam halaman web daripada menentukan penampilannya.
Apa saja yang kita perlukan untuk belajar HTML
1. Media penulisan html : Dreamweaper, ultraedit, notepad dan masih banyak lagi.
2. Media untuk melihat hasil (preview) : Internet Explorer, Modzila Firefox, Google Chrome dll.
Berikut ini beberapa contoh tag HTML yang mungkin bisa dipelajari oleh sobat semua, termasuk saya :
1. HTML
<html></html> : baris paling atas dari setiap file html
2. Head
<head></head> : berfungsi untuk memberikan informasi-informasi penting tentang dokumen HTML tersebut dan informasi tersebut tidak ditampilkan di layar monitor.
3. Title
<title></title> : Judul halaman.
4. Body
<body></body> : berisi semua instruksi untuk mengatur seluruh tampilan halaman web di web browser dan informasi lain yang tidak termasuk dalam bagian head.
Berikut ini bentuk paling sederhana dalam sebuah halaman web :
<html>
<head>
<title>Halaman sederhana...</title>
<!-- bagian header berisi informasi tambahan yang menjelaskan dokumen ini dan
tidak ditampilkan -->
</head>
<body>
<!-- semua instruksi untuk mengatur tampilan -->
<h3> Halaman web sederhana... </h3>
</body>
</html>
Tag body mempunyai beberapa attribut yang bisa dipasangkan untuk setingan dokumen html yang kita buat, berikut salah satu conto dari attribut tag body :
a. BACKGROUND
Atribut ini berfungsi untuk memberikan tampilan latar belakang sebuah gambar dan atribut ini akan menimpa atribut BGCOLOR. Untuk dapat menggunakannya kita harus tahu dimanakah letak file gambar yang akan kita gunakan.
Contoh : <BODY BACKGROUND=”........gampar.jpeg”>
Jangan lupa untuk menambahkan tanda kutip diantara alamat file gambar yang akan digunakan.
b. BGCOLOR
Atribut ini untuk menjelaskan warna background untuk seluruh dokumen.
Contoh : <BODY BGCOLOR=white>
Warna putih (white) dapat diganti dengan red, blue, green, black atau warna yang lain. Bisa juga menggunakan color code.
c. TEXT
Atribut ini mengatur warna teks di halaman web
Contoh : <BODY TEXT=black>
warna hitam (black) juga bisa digantikan dengan warna lain.
d. LINK
Ini adalah warna hyperlink sebelum di-click. Sebaiknya gunakan warna hyperlink berbeda dengan warna teks untuk memudahkan pengguna, biar ga bingung.
Contoh : <BODY LINK=blue>
e. ALINK
Atribut ini mengeset warna link saat akan di-click (didekati dengan mouse).
Contoh : <BODY ALINK=red>
f. VLINK
Atribut ini mengeset warna link setelah sebuah link dikunjungi.
Contoh : <BODY VLINK=yellow>
Berikut ini Contoh sederhana kombinasi attribut untuk tag body di atas.
<body BACKGROUND="tes.jpg" bgcolor=green TEXT=white LINK=red ALINK=red VLINK=yellow >
</body>
5. Tag Meta
a. Tag Meta Author
Tag ini berfungsi untuk menjelaskan perancang halaman web.
Contoh :
<meta name="Author" content="Nama pembuat ">
b. Tag Meta Description
Tag meta ini berfungsi saat kita menggunakan search engine yang akan mengindex website secara otomatis. Program di search engine ini akan mencari deskripsi di website kita dan akan mencarinya di tag meta ini. Contoh :
<meta name="Description" content="Deskripsi web/Blog">
c. Tag Meta Keyword
Tag ini berfungsi untuk search engine yang bertipe auto robot yang secara otomatis akan mencari kata-kata di tag ini dan meletakkan di database mereka. Bila seseorang mencari dengan kata-kata yang terdapat dalam tag meta ini maka website kita akan termasuk dalam salah satu hasil pencarian. Contoh :
<meta name="Keywords" content="personal">
Tag meta merupakan salah satu teknik SEO dan banyak sekali yang menambahkan tag meta di blog dengan berbagai macam keywords.
Berikut ini salah satu contoh komposisi ketiganya dalam elemen Head sebuah dokumen HTML :
<html>
<head>
<title>Belajar bersama yu</title>
<meta name="Author" content="Crativoltz">
<meta name="Description" content="Tutorial Blog Pemula ">
<meta name="Keywords" content="Belajar, SEO, Internet, Tips Trik Internet, Komputer ">
</head>
<body>
contoh Meta Tags
</body>
</html>
to be continued....
Berhubung lagi banyak kerjaan di real mungkin tutor dasar ini akan saya lanjutkan segera dan mudah-mudahan pengenalan dasar yang cukup singkat ini bisa bermanfaat, mohon maaf atas segala kekurangannya.
Wenks@Creativoltz
Anda baru saja membaca artikel yang berkategori Tutorial
dengan judul TUTOR DASAR HTML. Anda bisa bookmark halaman ini dengan URL http://creativoltz.blogspot.com/2012/05/tutor-dasar-html.html. Terima kasih!
