HTML sederhana
Kali ini saya akan membahas tentang Html sederhana, Apa itu Html sedrhana?Html sederhana adalah awal kita membuat sesuatu script sederhana untuk memulai membuat suatu website atau juga blog.
Pengertian HTML
HTML merupakan singkatan dari Hyper Text Markup Language. HTML merupakan bahasa pengkodean yang digunakan untuk menghasilkan dokumen-dokumen hypertext untuk digunakan di WWW (World Wide Web) atau menampilkan sebuah halaman dokumen web. HTML terlihat seperti bahasa pengkodean lama, yang diawali dan diakhiri dengan command-command HTML dimana menunjukkan bagaimana keluarannya pada saat dijalankan pada sebuah web browser.Yang membedakan dokumen HTML dengan dokumen-dokumen lainnya adalah adanya elemen HTML yang disebut juga dengan command HTML dan biasa disebut dengan tag yang digunakan untuk menentukan tampilan dari dokumen HTML. Setiap dokumen HTML diawali dan diakhiri dengan tag HTML.
Contoh: <BEGIN TAG> </END TAG>
Tag tidak case sensitive sehingga bisa menggunakan <HTML> atau <html>
Bentuk dari tag HTML adalah <element atribute = value> dimana:
Element = nama tag
Atribute = atribut dari tag
Value = nilai dari atribut
Contoh: <body bgcolor = white>
Body merupakan elemen, sedangkan bgcolor merupakan atribut yang memiliki nilai white.
Sejarah Singkat HTML
Pada tahun 1980, IBM memikirkan pembuatan suatu dokumen yang akan mengenali setiap elemen dari dokumen dengan suatu tanda tertentu. IBM kemudian mengembangkan suatu jenis bahasa yang menggabungkan teks dengan perintah-perintah pemformatan dokumen. Bahasa ini dinamakan Markup Language, sebuah bahasa yang menggunakan tanda-tanda sebagai basisnya. IBM menamakan sistemnya ini sebagai Generalized Markup Language atau GML.Tahun 1986, ISO menyatakan bahwa IBM memiliki suatu konsep tentang dokumen yang sangat baik, dan kemudian mengeluarkan suatu publikasi (ISO 8879) yang menyatakan markup language sebagai standar untuk pembuatan dokumen-dokumen. ISO membuat bahasa ini dari GML milik IBM, tetapi memberinya nama lain, yaitu SGML (Standard Generalized Markup Language). ISO dalam publikasinya meyakini bahwa SGML akan sangat berguna untuk pemrosesan informasi teks dan sistem-sistem perkantoran. Tetapi di luar perkiraan ISO, SGML dan terutama subset dari SGML, yaitu HTML juga berguna untuk menjelajahi internet. Khususnya bagi mereka yang menggunakan World Wide Web. Versi terakhir dari HTML saat ini adalah HTML5.
Fungsi HTML
Fungsi dari HTML adalah digunakan untuk membuat sebuah halaman website dan juga menampilkan berbagai informasi yang di inputkan ke dalam html tersebut seperti gambar, teks, video, dan lainnya sehingga bisa di tempilkan melalui web browser. Selian itu HTML juga bisa digunakan untuk membuat sebuah link yang nantinya menuju ke sebuah halaman website lainnya dengan kode tertentu.Inilah contoh salah satunya, mari kita cermati secara sesama dan coba mengunakan NOTPAD:
Awal perama kita bisa copy script di bawah ini
<html>
<head>
<title>.:: Latihan Membuat Frame ::.</title>
</head>
<frameset rows=20%,* framespacing="0" border="0" frameborder="0">
<frame name=atas src=header.html scrolling="no" noresize>
<frameset cols=25%,*framespacing="0" border="0" frameborder="0">
<frame name=kiri src=kiri.html scrolling="no" noresize>
<frame name=kanan src=kanan.html scrolling="no" noresize>
</frameset>
</frameset>
</html>
Save as file tersebut dengan kata " latihan6.html "
-copy file di bawah ini
<html>
<head>
<title>.:: Latihan Membuat Frame ::.</title>
</head>
<body bgcolor=#ffffcc>
<font face=arial size=6 color=morron>
<b>.:: SMK ::. <b><br>
<font face=arial size=4 color=blue>
<i>Success By Discipline</i>
</body>
</html>
Save as file tersebut dengan kata " header.html "
-copy file di bawah ini
<html>
<head>
<title>.:: Latihan Membuat Frame ::.</title>
</head>
<body bgcolor=#fff>
<table border=1 width="228" height="28" cellspacing=0>
<tr>
<td width="218" height="22" bordercolor="#800080" bgcolor="#bdced9">
<b><font face=tahoma" size="2" Menu</font></b>
</td></tr><tr>
<td width="218" height="22" bordercolor="#800080">
<b><font face="tahoma" size="2"> <a href=kanan.html target=kanan>Home</a>
</font></b></td>
</tr>
<tr>
<td width="218" height="22" bordercolor=#800080">
<b><font face="thoma"size=2"> <a href=proli.html target=kanan>Program Keahlian</a>
</font></b></td></tr>
<tr>
<td width="218" height="22" bordercolor=#800080">
<b><font face="thoma"size=2"> <a href=ekstra.html target=kanan>Ekstra Kurikuler</a>
</font></b></td></tr>
</table>
</body>
</html>
Save as file tersebut dengan kata " kiri.html "
-copy file di bawah ini
<html>
<head>
<title>.:: Latihan Membuat Link Ke Dokumen Lain ::.</title>
</head>
<body bgcolor=#fff>
<table border=1 bordercolor=bordercolor="800080" cellspacing=0 cellpadding=50 width=750 height=450>
<tr>
<td valign=top>
<font face=verdana size=4 color=blue>
Selamat datang di web Kami ...
</td>
</tr>
</body>
</html>
Save as file tersebut dengan kata " kanan.html "
-copy file di bawah ini
<html>
<head>
<title>::: Link Dokumen Lain :::</title>
</head>
<body bgcolor=#fff>
<table border=1 bordercolor=bordercolor"#800080" cellspacing=0 cellpadding=50 width=750 height=450><tr>
<td valign=top>
<font face=verdana size=4 color=blue>
Program Keahlian:<br>
<font size=1><ul type=cirle>
<li>Rekayasa Perangkat Lunak
<li>Teknik Elektronika Industri
<li>Teknik Pembangkit Tenaga Listrik
<li>Teknik Mekanik Otomotif
<li>Teknik Pemesinan
<li>Teknik Las
</ul></td>
</tr>
</body>
</html>
Save as file tersebut dengan kata " proli.html "
-copy file di bawah ini
<html>
<head>
<title>::: Link Dokumen Lain:::</title></head>
<body bgcolor=#fff>
<table border=1 bordercolor=bordercolor="#800080" cellspacing=0 cellpadding=50 width=750 height=450>
<tr>
<td valign=top>
<font face=verdana size=4 color=blue>Ekstra Kurikuler:<br>
<font size=1>
<ul type=circle>
<li>Seni Bela Diri Tampak Suci
<li>Keagamaan
<li>Sepak Bola
<li>Bola Basket
<li>Kepenyiaran
</ul>
</td></tr></body></html>
Save as file tersebut dengan kata " ekstra.html "
Dan sekarang bisa lihat hasilnya.
0 Comments
EmoticonEmoticon