HTML
atau Hypertext Marksup Language merupakan salah satu format yang digunakan
dalam pembuatan dokumen dan aplikasi yang berjalan dihalaman web.
Bermula dari
sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan
percetakan yang disebut dengan SGML (Standard Generalized Markup Language),
HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman
web. HTML saat ini merupakan standar Internet yang didefinisikan dan
dikendalikan penggunaannya oleh World Wide Web Consortium (W3C).
Sebenarnya,
dokumen HTML hanyalah sebuah dokumen teks biasa dan disebut sebagai Markup
Language yakni bahasa yang mengandung tanda (tag) tertentu yang digunakan untuk
mengatur format tampilan suatu dokumen.
Secara garis besar, terdapat 4 jenis elemen dari HTML:
structural.
tanda yang menentukan level atau tingkatan dari sebuah teks (contoh,
<h1>Golf</h1> akan memerintahkan browser untuk menampilkan “Golf”
sebagai teks tebal besar yang menunjukkan sebagai Heading 1
presentational.
tanda yang menentukan tampilan dari sebuah teks tidak peduli dengan level dari
teks tersebut (contoh, <b>boldface</b> akan menampilkan bold. Tanda
presentational saat ini sudah mulai digantikan oleh CSS dan tidak direkomendasikan
untuk mengatur tampilan teks,
hypertext.
tanda yang menunjukkan pranala ke bagian dari dokumen tersebut atau pranala ke
dokumen lain (contoh, <a
href="http://www.design70.com/">Desain</a> akan menampilkan
Desain sebagai sebuah hyperlink ke URL www.design70.com ),
Elemen
widget yang membuat objek-objek lain seperti tombol (<button>), list
(<li>), dan garis horizontal (<hr>).
Untuk membuat dokumen HTML hanya dibutuhkan sebuah aplikasi teks editor
biasa. Namun sekarang ini di pasaran
terdapat banyak sekali HTML authoring (software yang digunakan untuk membuat
atau mendesain halaman web).
Macromedia
Dreamweaver, Adobe GoLive, MS FrontPage, anda juga bisa menggunakan
NOTEPED++ untuk mengeditnya. Tetapi tanpa
mengetahui dasar-dasarnya Anda tidak akan memperoleh hasil yang maksimal.
Mengapa? Karena walaupun software-software tersebut semakin menawarkan
kemudahan dalam membuat halaman web, tetapi biasanya seseorang masih perlu
untuk mengedit halaman web tersebut secara manual. Terutama untuk halaman web
yang sangat komplek.
Sebagai Contoh membuat file html:
buka program
notepad
copy
markup/code/style berikut:
--------------------------------------------
<html>
<head>
<title>contoh html</title>
<style type="text/css">
<!--
/*fungsi style css untuk merubah tampilan tag-tag html, serta mendesai halaman website*/
/*contoh tag body*/
body{
background-color:black;/*warna latar belakang*/
color:white;/*umumnya warna text*/
margin:20 80px;/*jarak luar*/
}
/*************/
/*misal lagi tag h1*/
h1{
font-size:60px;/*ukuran font*/
}
/*misal lagi tag h2*/
h2{
font-size:45px;/*ukuran font*/
color:green;/**/
}
/*misal lagi tag p*/
p{font-weight:bold;/*font tebal*/}
/*yah, fungsi css adalah untuk merubah tampilan**/
-->
</style>
<script type="text/javascript">
//ini adalah contoh java script function
function contoh_js_simple()
{
alert("ini adalah javascript alert");
/*ini adalah komentar javascript untuk
lebih dari satu baris/line*/
//ini adalah komentar javascript hanya satu baris/line
//fungsi javascript adalah untuk menambah kemampuan web itu sendiri
}
</script>
</head>
<!-- fungsi html adalah untuk menampilkan content/web -->
<body onload="contoh_js_simple">
<h1>judul h1</h1>
<h2>judul h2</h2>
<p>ini adalah paragraf</p>
<script type="text/javascript">
//ini adalah contoh simplejava script
document.write ("<p>ini adalah paragraf yang dirulis dengan javascript</p>");/**/
</script>
<a href="javascript:contoh_js_simple()">ini adalah alert</a>
<p><a href="http://www.indaam.com" target="_blank">ini adalah link, salam indaam.com</a></p>
<!-- ini adalah komentar html, dan tidak akan ditampilkan-->
<!-- agar html ini bisa dilihat/dibuka oleh orang banyak, kita harus menguploadnya di hosting, namun jika hanya untuk belajar dengan komputerpun sudah cuku -->
</body>
</html>
-----------------------------------
<html>
<head>
<title>contoh html</title>
<style type="text/css">
<!--
/*fungsi style css untuk merubah tampilan tag-tag html, serta mendesai halaman website*/
/*contoh tag body*/
body{
background-color:black;/*warna latar belakang*/
color:white;/*umumnya warna text*/
margin:20 80px;/*jarak luar*/
}
/*************/
/*misal lagi tag h1*/
h1{
font-size:60px;/*ukuran font*/
}
/*misal lagi tag h2*/
h2{
font-size:45px;/*ukuran font*/
color:green;/**/
}
/*misal lagi tag p*/
p{font-weight:bold;/*font tebal*/}
/*yah, fungsi css adalah untuk merubah tampilan**/
-->
</style>
<script type="text/javascript">
//ini adalah contoh java script function
function contoh_js_simple()
{
alert("ini adalah javascript alert");
/*ini adalah komentar javascript untuk
lebih dari satu baris/line*/
//ini adalah komentar javascript hanya satu baris/line
//fungsi javascript adalah untuk menambah kemampuan web itu sendiri
}
</script>
</head>
<!-- fungsi html adalah untuk menampilkan content/web -->
<body onload="contoh_js_simple">
<h1>judul h1</h1>
<h2>judul h2</h2>
<p>ini adalah paragraf</p>
<script type="text/javascript">
//ini adalah contoh simplejava script
document.write ("<p>ini adalah paragraf yang dirulis dengan javascript</p>");/**/
</script>
<a href="javascript:contoh_js_simple()">ini adalah alert</a>
<p><a href="http://www.indaam.com" target="_blank">ini adalah link, salam indaam.com</a></p>
<!-- ini adalah komentar html, dan tidak akan ditampilkan-->
<!-- agar html ini bisa dilihat/dibuka oleh orang banyak, kita harus menguploadnya di hosting, namun jika hanya untuk belajar dengan komputerpun sudah cuku -->
</body>
</html>
-----------------------------------
paste ke
notepad tadi
klik
file(kiri atas)
pilih save
ass
pada file
name isi dengan contoh_html.htm atau contoh_html.html
pada seva
all type pilih all files
lalu save
ekstensinya
adalah [dot] html, bukan [dot] text
Untuk
menjalankan file html ikuti Langkah Berikut :
cari file
yang telah dibuat tadi contoh_html.htm atau contoh_html.html
arahkan
cursor ke file html tadi
lalu klik
kanan
pilih open
with pilih salah satu(firefox, ie, opera dll)
bisa juga
dengan double click(tergantung konfigurasi komputer)
Mengedit
file html :
arahkan
cursor ke file html tadi
klik kanan
lalu pilih
notepad
selakan edit
save
lalu
jalankan lagi filenya
Silahkan
Mencoba...