Pada tugas kali ini saya membuat sebuat rancangan WEB dengan HTML menggunakan Notepad ++ . Disini kita membuat Web menggunakan tag <> HTML. Tag sendiri terbagi menjadi dua yaitu tag container dan tag biasa. Baiklah sekilas langkah membuat web yang telah saya coba :
1. buka Notepad ++ dan tulis codingannya (berikut saya beri contoh sytax index web saya)
<html>
<head><title>happylife</title><link rel = "stylesheet" type = "text/css" href = "css/lab-6.css"></link>
<style>
#warnabiru{
color:blue;
}
#warnahijau{
color:green;
}
</style>
</head>
<body onload="alert('Hallo Selamat Datang :)');"id = "body">
<div id = "header" style='background:url("gambar/happy.jpg");'>
</div>
<!--<p id="warnahijau">Warna</p>-->
<div id="menu">
<ul>
<li><a href="index.html"style='color:blue;'>Home</a></li>
<li><a href="profile.html">Profile</a></li>
<li><a href="gallery.html">Gallery</a></li>
<li><a href="contact.html">Contact Me</a></li>
<li><a href="games.html">Games</a></li>
</ul>
</div>
<div id = "content">
<div id = "lefthome" style="background-image:url('gambar/tes5.jpg');">
<p id = "Home"> What's inside my page?</p>
<p id = "homeparagraf" style='color:blue; margin: 0 50 0 50;'>
Welcome to my homepage! This is a website where you can know more about me and
keep in touch with me. On my profile page, you can see my curriculum vitae containing
my personal information, my education history. I'll entertain you with some photos on
my gallery page. As i said before, you can keep in touch with me by filling my feedback
forms on the 'Contact Me' page. There are also my social network accounts that can
make no distance between us. Happy browsing!
</p>
</div>
<div id = "right" style='background:url("gambar/kiri.png");'>
<p id = "ika devi">
<label>Search keyword:<input type = "search"/></label>
<input type = "submit" value = "Search">
</p>
<br>
<br>
<h3 id = "social">SOCIAL MEDIA</h3>
<div id = "social">
<table>
<tr><td>
<img src = "gambar/twitter.png" width = "70" height = "70" alt = "img">
</td>
<td>
<a href = "http://twitter.com/ikadevi26">@ikadevi26</a>
</td></tr>
<tr><td>
<img src = "gambar/facebook.png" width = "70" height = "70" alt = "img">
</td>
<td>
<a href = "http://facebook.com/ikadevi"> ika devi </a>
</td></tr>
</table>
</div>
</div>
</div>
<div id = "gambar/01.jpg">
</div>
</body>
</html>
jangan lupa pada saat menyimpan di beri (.HTML) maka nanti hasil-nya akan seperti ini :
Setelah di klik OK maka akan tampil seperti ini. Pada web ini saya membuat Home, Profile, Gallery, Contat Me, dan Games.
ini lah tampilan keseluruhan dari web saya :
-Profile
pada profile ini berisi identitas dan asal sekolah saya.
- Gallery
di gallery ini berisikan foto-foto yang saya sukai.
- Contact Me
page ini berisi jika ada pengunjung yang ingin berinteraksi atau memberi saran dan masukan kepada saya.
- Games
tujuan saya membuat games adalah aga pengunjung web saya merasa betah dengan web ini dengan ada-nya 2 buah permainan yang telah saya sediakan.
web ini bernama happy life, tujuan saya membuat web ini adalah untuk menjadikan web pribadi saya dan jika ada yang ingin berinteraksi dengan saya melalui media lain saya telah memberikan account media social saya yang lain yaitu facebook dan twitter.
sekilas penjelasan tentang web yang telah saya buat.
sumber bantuan :
teman saya Andreas Billy
dan teman saya Sarah Aurelia yang telah mengizinkan untuk memperbaharui web buatannya.
