Assalamualaiqum
Kali ini saya akan ngepost tentang cara mendesain web sederhana, kebetulan saya baru dapat tugas desain web juga, jadi gini nih caranya:
Pertama desain bannernya dulu ya. Saya membuat banner dengan menggunakan Photoshop. Kalo bannernya udah jadi, sekarang kita akan membuat header atau bagian atasnya. Berikut codingnya:
<div id="container">
<div id="header">
<h1><img src="banner.png" width="717" height="141" /><img src="alamat.png" width="718" height="61" /></h1>
<table width="719" border="1">
<tr>
<td width="501" height="16" bgcolor="#faee8b"> <marquee direction="left">
Beauty Collection
</marquee>
</td>
</tr>
</table>
</div>
Hasilnya:
Selanjutnya kita akan membuat menu barnya sekaligus buat link, gini codingnya:
<div id="sidebar1">
<blockquote>
<h3> <a href="home.html"><img src="home.png" width="109" height="60" /></a></h3>
<h3><a href="property.html"><img src="catalog.png" width="110" height="58" /></a></h3>
<h3><a href="profil.html"><img src="about.png" width="110" height="63" /></a></h3>
</blockquote>
</div>
Hasilnya:
Sekarang kita tinggal buat konten didalamnya deh. Codingnya:
<div id="mainContent">
<h1> Putry's Shop</h1>
<p>Bagi anda yang terlalu sibuk dan tidak mempunyai waktu untuk berbelanja langsung ke pusat perbelanjaan, tidak perlu khawatir.</p>
<p>Sekarang telah hadir Putry's Shop yang memudahkan anda berbelanja secara online dan barang - barang yang tersedia dijamin berkualitas baik.</p>
<p>Jadi tunggu apalagi....! Segera kunjungi website kami. </p>
<p>
<!-- end #container --></p>
<p> </p>
</div></div>
Hasilnya:
Terakhir anda tinggal buat halaman lainnya supaya bisa dilink, caranya sama kok sama yang diatas :)
Sekian postingan kali ini semoga dapat bermanfaat bagi para pembaca.
Wassalamualaiqum wr. wb.
