Tuesday, 17 December 2013

Belajar Membuat WEBSITE HTML SEDERHANA

Tugas sekolah yang baru-baru ini adalah tugas TIK.Tugas yang hampir ga semua temen gue bisa bikin.Meskipun apa adanya, gue mau kasih kalian contoh HTML gimana yang gue buat.

Sebelum ke contoh gue mau ngajarin kalian sedikit soal bikin website dengan html dasar ini.Cara bikinnya gampang kok.
  1. Sediakan aplikasi Notepad atau aplikasi-aplikasi lain sejenisnya.
  2. Buka aplikasi tersebut kemudian tuliskan kode html dasar. (Contoh ada dibawah)
  3. Edit bagian body dengan menambah  konten-konten variatif didalamnya, kamu juga bisa edit background, font, dan lain-lain, menambahkan gambar, link, dan juga animasi.Ditahap ini kamu bebas berkreasi dengan catatan berpedoman pada konsep dan kode-kode html.Kamu bisa search di google atau beli buku khusus kode html.
  4. Save file dengan akhiran .html contohnya seperti ini : website-giasani.html
KODE HTML DASAR

<html>
<title>nama website kamu, muncul di tab pada web browser</title>
<head>judul website kamu</head>
<body>isi website sesuai yang kamu mau, untuk konten yang kompleks dan beragam</body>
</html>

Oke langsung aja tengok contoh html website sederhana buatan gue dan sebangku gue Oca:

<html><title>Form Order</title>
<head></head>
<body background="Payment_Banner.jpg">
<form action=" formulir.html" method="get">
<table border='0' widht='450'>
<tr>
<td colspan='2'><font face="Arial" size="16" color=" #622222">Mahago Wristband</font><font face="Century Gothic" size="16" color="#008B8B">Delivery</font></td>
</tr>
<tr>
<td width="100%" bgcolor="#000000" align="center"><center><font face="Microsoft Sans Serif" size="5" color="#ff1493">FORM ORDER</font></td>
<td></td>
</tr>
<tr>
<td><marquee><font face="Comic Sans MS" size="6.5" color="Firebrick">Buy more than 20 pcs </font><font face="Century Gothic" size="7" color="Red">Disc 20%</font></td>
</tr>
</table>
<table align="center">
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
<tr>
<td><font face="Microsoft Sans Serif" size="3" color="#000000">Name</font></td>
<td> <input type='text'> </td>
</tr>
<tr> <td><font face="Microsoft Sans Serif" size="3" color="#000000">Country</font></td>
<td><select>
<option>Indonesia</option>
<option>Malaysia</option>
<option>Thailand</option>
<option>Kamboja</option>
<option>Singapore</option>
<option>Vietnam</option>
<option>Laos</option>
<option>Philiphine</option>
<option>Brunei Darussalam</option>
<option>Myanmar</option>
</td></select>
<tr>
<td><font face="Microsoft Sans Serif" size="3" color="#000000">Address</font></td>
<td> <textarea cols='30' rows='5'></textarea> </td>
</tr>
<tr>
<td><font face="Microsoft Sans Serif" size="3" color="#000000">City</font></td>
<td> <input type='text'> </td>
</tr>
<tr>
<td><font face="Microsoft Sans Serif" size="3" color="#000000">Phone Number</font></td>
<td> <input type='text'> </td>
</tr>
<tr>
<td><font face="Microsoft Sans Serif" size="3" color="#000000">Payment Via</font></td>
<td></td>

</tr>
<tr>
<td></td>
<td><input type="radio" name="visa" value="visa" checked/> Visa</td>
</tr>
<tr>
<td></td>      
<td><input type="radio" name="debit" value="debit" /> Debit</td>
</tr>
<tr>
<td></td>
<td><input type="radio" name="wesel" value="wesel" /> Wesel</td>
</tr>
<tr>
<td><font face="Microsoft Sans Serif" size="3" color="#000000">Wristband</font></td>
<td> <textarea cols='30' rows='5'>Code, colour, and quantity</textarea></td>
</tr>
<tr>
<td><font face="Microsoft Sans Serif" size="3" color="#000000">Picture (Optional)</font></td>
<td> <input type='file'> </td>
</tr>
<tr>
<td></td>
  <td><input type="submit" value="Process"></td>
</tr>
</table>
<table>
<tr> <td colspan='5'>
<marquee><img src='wb4.jpg'align=''width='100' height='100'>
<img src='wb.jpg'align=''width='100' height='100'>
<img src='wb2.jpg'align=''width='100' height='100'>
<img src='wb3.jpg'align=''width='100' height='100'>
<img src='wbb.jpeg'align=''width='100' height='100'>
<img src='wb5.jpg'align=''width='100' height='100'>
<img src='wb6.jpg'align=''width='100' height='100'>
<img src='wb7.jpg'align=''width='100' height='100'>
<img src='wb8.jpg'align=''width='100' height='100'></marquee></td>
</tr>
</table>
</body>
</html>

HTML diatas asli buatan gue sama oca loh, dan lo tau...gue dapet nilai yang yaa memuaskanlah buat gue.Sekarang ada yang mau lo tanyain?Kalo ada, langsung aja post comment.

No comments:

Post a Comment