Pertemuan : IV
Materi :
-
Memahami
konsep frame
-
Mengimplementasikan
konsep frame dalam merancang web
Contoh
web yang menggunakan konsep frame yaitu software phpmyadmin.
Kebanyakan
website dirancang dengan konsep tabel, walaupun masih ada website yang dirancang
dengan konsep frame.
Latihan
1.
1. Buka notepad
2. Ketikkan struktur html
<html>
<head>
<title>Latihan-4</title>
</head>
<body>
</body>
</html>
|
Kode frame diletakkan di
sebelah atas tag <body>
Setiap halaman frame harus
merujuk ke suatu halaman web
|
Kode
frame
<html>
<head>
<title>Latihan-4</title>
</head>
<frameset cols=30%,70%>
<frame src=menu.html>
<frame src=isi.html>
</frameset>
<body>
</body>
</html>
|
4. Simpan kode dengan nama lat4.html
5. Jalankan web browser
6. Buka file lat4.html dari web
browser
7. Ciptakan file menu.html
- buka notepad baru
- buat menu
<h1>MENU</h1>
<a
href=home.html>Home</a><br>
<a
href=product.html>Product</a><br>
<a
href=services.html>Services</a><br>
<a
href=contact.html>Contact</a>
|
-
simpan kode dengan nama menu.html
8. Ciptakan file isi.html
- buka notepad baru
- buat tulisan dalam suatu paragraph
<html>
<head>
<title>isi</title>
</head>
<body
bgcolor=yellow>
<h1>Well
Come To Imagination Station</h1>
<p>Imagination Is More Important Thank Knowledge (Albert
Enstein).
Acting and
Thinking Out Of Box. Maksud dari kalimat pertama adalah
imajinasi
lebih penting daripada pengetahuan. Misalkan kita
memiliki
imajinasi membuat produk gorengan seperti Goreng Mouse,
Goreng CPU,
Goreng Monitor, Goreng Keyboard, dsb. Difrensiasi
produk
membuat pengguna tertarik untuk menggunakan produk, dengan
syarat
layanan yang baik serta <i>packaging</i> yang baik.
Ditambah
dengan pemasaran yang tepat sasaran maka kita akan
menjadi
PEMIMPI yang BERBUAT. Semoga Sukses</p>
</body>
</html>
|
- simpan kode dengan nama isi.html
9. Ciptakan file home.html
-
buka notepad baru
-
buat tulisan dalam suatu paragraph
- simpan file
dengan nama home.html
<h1>HOME</h1>
|
10.
Ciptakan file product.html
-
Buka notepad baru
-
Buat tulisan dalam suatu paragraf
-
Simpan file dengan nama product.html
<h1>Product</h1>
The List
Of Our Products:
<table border=1 bgcolor=magenta>
<tr>
<td><blink>Goreng
CPU</blink></td>
<td>Goreng Mouse</td>
<td>Goreng Keyboard</td>
</tr>
<tr>
<td width=33%><img src=g1.jpg
align=left>Goreng CPU diracik dari bahan-bahan
alami
yang khusus didatangkan dari pulau Aceh yang terdiri atas<br>
<ol>
<li>Pisang Sunami</li>
<li>Tepung</li>
<li>Strawberry</li>
</ol>
</td>
<td width=33%><img src=g2.jpg
align=left>Goreng Mouse diracik dari bahan-bahan alami yang khusus
didatangkan dari
pulau
Aceh yang terdiri atas<br>
<ol>
<li>Pisang Sunami</li>
<li>Tepung</li>
<li>Strawberry</li>
</ol>
</td>
<td><img
src=g3.jpg></td>
</tr>
</table>
|
11.
Ciptakan file services.html
-
Buka notepad baru
-
Buat tulisan dalam suatu paragraf
-
Simpan file dengan nama services.html
<h1>Services</h1>
Our
Motto 24 Hours Services. You Can Contact Us With
telephone,
facebook, pos office.
Your
orders will come as soon as possible.
We
thanks very much for join with our business.
May Your
Day is Nice. God Bless Us.
|
12.
Ciptakan file contact.html
-
Buka notepad baru
-
Buat tulisan dalam paragraf
-
Simpan file dengan nama contact.html
<h1>contact</h1>
Jika anda kurang puas dengan layanan kami hubungi 08123456789
|
