program situs web - · pdf filesholawat serta salam kepada junjungan kita nabi muhammad saw,...
TRANSCRIPT
PEMBUATAN SITUS WEB TAMAN BERMAIN ANAK
SHOLEH DENGAN MENGGUNAKAN PHOTOSHOP
DAN MACROMEDIA DREAMWEAVER 8
PROYEK SKRIPSI III
Diajukan untuk menyelesaikan mata kuliah Projek Program-III
Jenjang Pendidikan Strata 1
Tahun Akademik 2010-20
Disusun Oleh:
ARBA'ATUN NURHIDAYATI
109080640041
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER (STMIK)
PRANATA INDONESIA – BEKASI
2010
ii
LEMBAR PERSETUJUAN PEMBIMBING
Nama : Arba'atun Nurhidayati
NPM : 109080640041
Jurusan : Teknik Informatika
Jenjang Pendidikan : Strata Satu (S1)
Tempat Penelitian : Taman Bermain Anak Sholeh
Judul : Pembuatan Situs Web TB. Anak Sholeh Dengan
Menggunakan Adobe Photoshop CS 3 dan
Macromedia Dreamweaver
Dinyatakan telah SELESAI / BELUM SELESAI melaksanakan penulisan
laporan proyek situs web sehingga yang bersangkutan DIIZINKAN/TIDAK
DIIZINKAN mengikuti Ujian Project TA/Skripsi.
Bekasi, 23 Juni 2010
Pembimbing I Pembimbing II
Ahmad Ali Mahrus, S.Kom Purwanto, S.Kom NIK: 0920020213 NIK:
iii
LEMBAR PENGESAHAN SIDANG
Laporan ini telah diujikan pada tanggal …… Bulan ……. Tahun ……....
Dan dinyatakan : LULUS / TIDAK LULUS/LULUS BERSYARAT, dengan
catatan : …………………………………………………………………………...
………………………………………………………………………………………
No. Nama Penguji Tanda Tangan
1. ……………………………..
2. ……………………………..
3. ……………………………..
Menyetujui,
Koordinator Kampus B Ketua Project TA/Skripsi
Drs. Rusli Puteh Salman Farizy, S.Kom NIK :9605001 NIK:960301110002.
iv
MOTTO DAN PERSEMBAHAN
MOTTO
BERUSAHA, BERDO'A DAN BERTAWAKAL
ADALAH JALAN MENUJU KEBERHASILAN
PERSEMBAHAN
Untuk kedua orang tua dan kakak-kakakku tercinta
v
KATA PENGANTAR
Dengan memanjatkan puji serta syukur kehadirat Allah SWT dan
sholawat serta salam kepada junjungan kita Nabi Muhammad SAW,
akhirnya penulis dapat menyelesaikan penyusunan laporan proyek skripsi
tahap ketiga. Laporan program skripsi tahap ketiga ini disusun dengan
judul "Pembuatan Situs Web Taman Bermain Anak Sholeh dengan
Menggunakan Adobe Photoshop dan Macromedia Dreamweaver".
Hal ini dimaksudkan agar dalam tahap ketiga ini menjadikan suatu jalan
menuju program web yang sebenarnya.
Terima kasih penulis ucapkan yang sebesar-besarnya kepada :
1. Bapak Drs. Rusli Puteh, selaku Koordinator Kampus B STMIK
Pranata Indonesia
2. Bapak Salman Farizy, S.Kom, MCP, MCSA, MCTS, MCITP, selaku
Wakil Koordinator Kampus B Taman Bermain Anak Sholeh.
3. Bapak Ahmad Ali Mahrus, S.Kom selaku dosen pembimbing project
skripsi tahap ketiga.
4. Orang Tua dan Keluarga yang selalu memberi do'a dan
dukungannya.
5. Teman-teman, yang memberi semangat, motivasi, dan masukan
yang sangat membantu dalampenyusunan laporan proyek situs web
ini.
vi
Penulis menyadari bahwa dalam penyusunan proyek situs web
skripsi tahap ketiga ini jauh dari sempurna. Oleh karena itu penulis
mengharapkan masukan dari berbagai pihak yang sifatnya membangun,
untuk kemajuan penulis di masa yang akan datang.
Bekasi, Oktober 2010
Arba'atun Nurhidayati
vii
DAFTAR ISI
LEMBAR PERSETUJUAN PEMBIMBING ................................................... ii
LEMBAR PENGESAHAN SIDANG ............................................................ iii
MOTTO DAN PERSEMBAHAN ...................................................................iv
KATA PENGANTAR ..................................................................................... v
DAFTAR ISI ................................................................................................ vii
BAB I PENDAHULUAN
1.1 Latar Belakang Masalah ........................................................ 1
1.2 Identifikasi Masalah ................................................................. 2
1.3 Pembatasan Masalah ............................................................ 2
1.4 Maksud Penulisan Laporan .................................................... 2
1.5 Tujuan Penulisan Laporan ...................................................... 3
1.6 Metode Penulisan .................................................................... 3
1.7 Sistematika Penulisan ............................................................. 4
BAB II LANDASAN TEORI
2.1 Website … .............................................................................. 5
2.1.1 Pengertian ................................................................... 5
2.1.2 Unsur Dalam Penyediaan Website .............................. 6
2.2 Adobe Photoshop .................................................................... 7
2.2.1 Pengertian ...................................................................... 7
2.2.2 Bagian-bagian Photoshop ............................................. 8
viii
2.3 Macromedia Dreamweaver …………………………………. 9
2.4 Kelompok Bermain (play group) ……………………………. 10
BAB III RANCANGAN DAN IMPLEMETASI
3.1 Perancangan ………………………………………………..... 11
3.1.1 Perancangan Halaman Home …….……………….. 11
3.1.2 Perancangan Halaman Visi ………………………… 12
3.1.3 Perancangan Halaman Misi ………………………... 12
3.1.4 Perancangan Halaman Gallery …………………….. 13
3.1.5 Perancangan Halaman Sub Gallery ………………. 14
3.2 Implementasi ………………………………………………… 15
3.2.1 Implementasi Halaman Home …………………….. 15
3.2.2 Implementasi Halaman Visi ………………………... 16
3.2.3 Implementasi Halaman Misi ……………………….. 16
3.2.4 Implementasi Halaman Gallery ……………………. 17
3.2.5 Implementasi Halaman Sub Gallery ………………. 17
3.3 Proses Pembuatan ………………………………………….. 18
3.3.1 Perancangan Desain Template ……………………. 18
3.3.2 Pengelolaan Website ………………………………... 18
3.3.3 Imlementasi …………………………………………… 18
BAB IV PENUTUP
4.1 Kesimpulan ………………………………………………….... 19
4.2 Saran ………………………………………………………...... 20
ix
DAFTAR PUSTAKA
DAFTAR RIWAYAT HIDUP
LAMPIRAN-LAMPIRAN
1
BAB I
PENDAHULUAN
1.1 Latar Belakang
Semakin berkembangnya zaman maka semakin tinggi pula
permintaan masyarakat akan adanya teknologi yang dapat
memberikan pelayanan informasi mengenai berbagai macam hal,
antara lain informasi pendidikan, kesehatan, bisnis, hukum dan lain
sebagainya. Dengan menggunakan kecanggihan system
komputerisasi yaitu situs web, maka suatu institusi dapat
mengenalkan berbagai produknya ke masyarakat luas. Situs web
dapat digunakan untuk mempromosikan keunggulan institusinya.
Oleh karena itu dalam penulisan Laporan Proyek Tugas Akhir ini
penulis memilih judul Program Situs Web Sekolah dengan
Menggunakan Adobe Photoshop dan Macromedia Dreamweaver.
Dalam tugas laporan ini penulis membahas penerapan Adobe
Photoshop dan Macromedia Dreamweaver dalam pembuatan
sebuah situs web sederhana dengan konsep dasar untuk membantu
suatu institusi sekolah dalam mempromosikan keunggulannya dalam
bidang pendidikan.
2
Tentunya penulis bukan orang yang mengerti benar mengenai
situs web, tetapi dengan belajar selalu berlatih dan mencoba
diharapkan mampu menghasilkan karya yang baik. Penulis
mengucapkan terima kasih atas perhatian dan kesempatan yang
diberikan.
1.2 Identifikasi Masalah
Dewasa ini di dalam dunia pendidikan semakin bersaing dalam
menunjukkan kualitasnya. Namun promosi yang dilakukan masih
belum maksimal karena belum menggunakan media elektronik
sehingga masyarakat belum begitu mudah untuk mengakses
informasi yang dibutuhkan.
1.3 Pembatasan Masalah
Sehubungan dengan hal tersebut diatas penulis membatasi
masalah hanya pada media yang akan digunakan untuk
melakukan promosi yaitu dengan membuat Situs Web sederhana di
Internet.
1.4 Maksud Penulisan Laporan
Penulisan Laporan Proyek Tugas Akhir tahap ketiga bermaksud
untuk mengetahui sejauh mana kemampuan penulis dalam
mempelajari dan memahami Adobe Photoshop dan Macromedia
3
Dreaweaver dalam penerapannya ke sebuah Situs Web selama
mengikuti Program Proyek Tugas Akhir ini.
1.5 Tujuan Penulisan Laporan
Adapun tujuan dalam penulisan laporan ini, antara lain :
a. Memenuhi Tugas Akhir tahap ketiga sebagai syarat kelulusan
bagi mahasiswa STMIK Pranata Indonesia.
b. Sebagai sarana promosi bagi institusi terkait.
c. Media pembelajaran bagi mahasiswa tentang teknik penulisan
laporan.
d. Memberikan wawasan kepada penulis maupun pembaca.
1.6 Metode Penulisan
Adapun metode penulisan yang digunakan oleh penulis, antara lain :
1. Pustaka, yaitu memperoleh informasi dari berbagai buku-buku
yang berkaitan dengan judul karya tulis.
2. Observasi, yaitu mendapatkan informasi dengan cara melakukan
wawancara dengan institusi yang terkait.
3. Internet, yaitu dengan cara browsing ke situs-situs yang
menunjang karya tulis.
4
1.7 Sistematika Penulisan
Adapun sistematika penulisan agar penataannya lebih rapi :
BAB I PENDAHULUAN
Bab ini terdiri dari Latar Belakang, Identifikasi Masalah,
Pembatasan Masalah, Maksud Penulisan Laporan, Tujuan
Penulisan Laporan, Metode Penulisan, Sistematika
Penulisan
BAB II LANDASAN TEORI
Bab ini terdiri dari Website, Adobe Photoshop, Macromedia
Dreamweaver.
BAB III RANCANGAN DAN IMPLEMETASI
Bab ini membahas mengenai rancangan atau tampilan web
yang dibuat menggunakan Photoshop.
BAB IV PENUTUP
Bab ini menyajikan kesimpulan dan saran penulis yang
berkaitan dengan panulisan laporan ini.
5
BAB II
LANDASAN TEORI
2.1 Website
2.1.1 Pengertian
Website atau situs juga dapat diartikan sebagai
kumpulan halaman yang menampilkan informasi data teks,
data gambar diam atau gerak, data animasi, suara, video
dan atau gabungan dari semuanya, baik yang bersifat statis
maupun dinamis yang membentuk satu rangkaian bangunan
yang saling terkait dimana masing-masing dihubungkan
dengan jaringan-jaringan halaman (hyperlink). Bersifat
statis apabila isi informasi website tetap, jarang berubah,
dan isi informasinya searah hanya dari pemilik website.
Bersifat dinamis apabila isi informasi website selalu
berubah-ubah, dan isi informasinya interaktif dua arah
berasal dari pemilik serta pengguna website. Contoh website
statis adalah berisi profil perusahaan, sedangkan website
dinamis adalah seperti Friendster, Multiply, dll. Dalam sisi
pengembangannya, website statis hanya bisa diupdate oleh
pemiliknya saja, sedangkan website dinamis bisa diupdate
oleh pengguna maupun pemilik.
6
2.1.2 Unsur dalam Penyediaan Website
Untuk menyediakan sebuah website, maka kita
harus menyeediakan unsur penunjangnya, yaitu Nama
domain atau biasa disebut dengan Domain Name atau URL
adalah alamat unik di dunia internet yang digunakan untuk
mengidentifikasi sebuah website, atau dengan kata lain
domain name adalah alamat yang digunakan untuk
menemukan sebuah website pada dunia internet. Contoh :
http://www.nama situs .com
Nama domain sendiri mempunyai identifikasi
ekstensi /akhiran sesuai dengan kepentingan dan lokasi
keberadaan website tersebut. Contoh nama domain ber-
ekstensi internasional adalah com, net, org, info, biz, name,
ws. Contoh nama domain ber-ekstensi lokasi Negara
Indonesia adalah :
.co.id : Untuk Badan Usaha yang mempunyai badan
hukum sah
.ac.id : Untuk Lembaga Pendidikan
.go.id : Khusus untuk Lembaga Pemerintahan Republik
Indonesia
7
.mil.id : Khusus untuk Lembaga Militer Republik
Indonesia
.or.id : Untuk segala macam organisasi yand tidak
termasuk dalam kategori “ac.id”,”co.id”,”go.id”,”mil.id” dan
lain lain
.war.net.id : untuk industri warung internet di Indonesia
.sch.id : khusus untuk Lembaga Pendidikan yang
menyelenggara kan pendidikan seperti SD, SMP dan
atau SMU
.web.id : Ditujukan bagi badan usaha, organisasi ataupun
perseorangan yang melakukan kegiatannya di World
Wide Web.
2.2 Adobe Photoshop
2.2.1 Pengertian
Photoshop adalah software yang digunakan untuk
memodifikasi gambar atau foto secara profesional baik
meliputi modifikasi obyek yang sederhana maupun yang sulit
sekalipun. Photoshop merupakan salah satu software yang
berguna untuk mengolah gambar berbasis bitmap, yang
8
mempunyai tool dan efek yang lengkap sehingga dapat
menghasilkan gambar atau foto yang berkualitas tinggi.
2.2.2 Bagian-bagian Photoshop
Photoshop terdiri dari beberapa bagian dalam
tampilannya, yaitu :
a. Menu Bar
Menu bar adalah menu pulldown yang berisi perintah-
perintah dalam Photoshop seperti menu File, Edit, Image,
Layer, Select, Filter, View, Window, dan Help. Baris menu
ini terkelompok berdasarkan topiknya.
b. Toolbox
Toolbox adalah alat-alat yang digunakan untuk
memodifikasi image (gambar atau foto). Alat-alat ini juga
dikelompokkan menurut jenisnya.
c. Canvas
Canvas adalah bidang yang digunakan sebagai tempat
untuk meletakkan image. Biasanya ukuran canvas akan
sama dengan ukuran image, tetapi dalam Photoshop kita
dapat merubah ukuran canvas dan image sesuai dengan
kebutuhan. Kalau kita memunculkan canvas baru biasanya
ada tiga pilihan yaitu canvas yang putih, berwarna dan
transparan.
9
d. Window Pallete
Window pallete adalah window yang berguna untuk
memilih atau mengatur berbagai parameter pada saat
menyunting image dalam Photoshop. Untuk menampilkan
Window Pallete dapat kita lakukan dengan cara memilih
menu Window kemudian pilih pallete yang dimunculkan.
2.3 Macromedia Dreamweaver
Macromedia Dreamweaver adalah sebuah HTML editor
profesional untuk mendesain secara visual dan mengelola situs
web maupun halaman web. Bilamana kita menyukai untuk
berurusan dengan kode-kode HTML secara manual atau lebih
menyukai bekerja dengan lingkungan secara visual dalam
melakukan editing, Dreamweaver mambuatnya menjadi lebih
mudah dengan menyediakan tool-tool yang sangat berguna dalam
peningkatan kemampuan dan pengalaman kita dalam mendesain
web.
Dreamweaver MX dalam hal ini digunakan untuk web
desain.Dreamweaver MX mengikutsertakan banyak tool untuk
kode-kode dalam halaman web beserta fasilitas-fasilitasnya, antara
lain : Referensi HTML, CSS dan Javascript, Javascript debugger,
dan editor kode ( tampilan kode dan Code inspector) yang
10
mengizinkan kita mengedit kode Javascript, XML, dan dokumen
teks lain secara langsung dalam
Dreamweaver. Teknologi Dreamweaver Roundtrip HTML
mampu mengimpor dokumen HTML tanpa perlu memformat ulang
kode tersebut dan kita dapat menggunakan Dreamweaver pula
untuk membersihkan dan memformat ulang HTML bila kita
menginginkannya. Selain itu Dreamweaver juga dilengkapi
kemampuan manajemen situs, yang memudahkan kita mengelola
keseluruhan elemen yang ada dalam situs. Kita juga dapat
melakukan evaluasi situs dengan melakukan pengecekan broken
link, kompatibilitas browser, maupun perkiraan waktu download
halaman web.
2.4 Kelompok Bermain (play group)
Kelompok Bermain atau sering kita sebut dengan play group
merupakan satuan pendidikan anak usia dini pada jalur pendidikan
non formal yang menyelenggarakan pendidikan bagi anak usia di
bawah lima tahun. Kelompok bermain umumnya beroperasi sampai
siang hari dan hanya 3 kali saja dalam 1 pekan.
Di sini anak bisa belajar sambil bermain melalui alat
permainan yang sudah didesain untuk memberikan stimulus-
stimulus kepada si anak. Sehingga kemampuan otak bisa diaktifkan
sejak dini. Kelompok bermain juga menjadi sebuah ajang
sosialisasi bagi anak usia dini. Hal ini bertujuan untuk
11
menumbuhkan rasa kepercayaan diri, kepedulian terhadap
sesame, dan juga kemandirian.
Dewasa ini banyak orang tua yang menyadari akan
pentingnya sekolah di usia dini bagi anak-anaknya, apalagi bagi
orang tua yang sibuk bekerja sehingga tidak sempat mendidik
anak-anaknya secara maksimal.
Kesempatan inilah yang membuat setiap sekolah kelompok
bermain perlu untuk memberikan informasi kepada masyarakat luas
mengenai pentingnya sekolah di usia dini. Oleh karena itu, promosi
lewat internet merupakan jalan terbaik dan termudah yang bisa
dimanfaatkan.
11
BAB III
PERANCANGAN DAN IMPLEMENTASI
3.1 Perancangan
Dalam awal pembuatan sebuah web, perancangan desain
templatenya harus dibuat terlebih dulu. Semakin tinggi kreatifitas,
maka akan semakin indah dan menarik pula desain yang dihasilkan.
Berikut akan dibahas pola-pola setiap halaman yang akan dibuat.
3.1.1 Perancangan Halaman Home
Banner logo
Home
Halaman layout ini terdiri dari bentuk format teks. Sedangkan
isiannya berupa :
a. Informasi umum
b. Alamat
12
3.1.2 Perancangan Halaman Visi
Banner logo
Visi
Halaman layout ini terdiri dari bentuk format teks. Sedangkan
isiannya berupa visi dari institusi.
3.1.3 Perancangan Halaman Misi
Banner logo
Misi
13
Halaman layout ini terdiri dari bentuk format teks. Sedangkan
isiannya berupa misi dari institusi.
3.1.4 Perancangan Halaman Gallery
Banner logo
Gallery
Halaman layout ini terdiri dari bentuk format teks dan
gambar. Sedangkan isiannya berupa foto-foto kegiatan.
Dalam halaman ini terdapat koneksi ke halaman sub gallery
yang berisi foto-foto kegiatan yang lebih detail.
14
3.1.5 Perancangan Halaman Sub Gallery
Banner
Gallery
Halaman layout ini terdiri dari bentuk format teks dan gambar.
Sedangkan isiannya berupa :
a. Foto kegiatan
b. Nama
c. Lokasi
15
3.2 Implementasi
Setelah membuat rancangan layout tampilannya, maka
langkah selanjutnya yaitu mengimplementasikan ke dalam
pembuatan sebuah situs web dengan menggunakan program yang
diperlukan yaitu Adobe Photoshop CS3 untuk desain templatenya
lalu diaplikasikan melalui Macromedia Dreamweaver 8.
3.2.1 Implementasi Halaman Home
Untuk melihat listing program ada di Lampiran 3
16
3.2.2 Implementasi Halaman Visi
Untuk melihat listing program ada di Lampiran. 4
3.3.3 Implementasi Halaman Misi
Untuk melihat listing program ada di Lampiran.5
17
3.3.4 Implementasi Halaman Gallery
Untuk melihat listing program ada di Lampiran.6
3.3.5 Implementasi Halaman Sub Gallery (Gallery TABAS)
Untuk melihat listing program ada di Lampiran.7
18
3.3 Proses Pembuatan
Dalam pembuatan sebuah situs web terdapat beberapa
langkah yang harus direncanakan, yaitu sebagai berikut :
3.3.1 Perancangan Desain Template
Merupakan langkah awal, yaitu membuat desain
templatenya menggunakan suatu program aplikasi. Dalam
tugas kali ini penulis menggunakan Adobe Photoshop CS3.
Melalui program ini kita bisa memaksimalkan daya kreatifitas
dengan cara mengolah berbagai warna, gambar dan teks
yang ada sehingga terbentuklah suatu desain website yang
menarik.
3.3.2 Pengelolaan website
Setelah desain template selesai, maka kita perlu
mengelolanya agar bisa terkoneksi satu sama lain melalui
tools "link" yang sudah disediakan dalam program
Macromedia Dreaweaver 8.
3.3.3 Implementasi
Merupakan langkah terakhir, yaitu mengimplementasi-
kan website yang telah dibuat.
19
BAB IV
PENUTUP
4.1 Kesimpulan
Project ini bermanfaat untuk meningkatkan pengetahun
pemahaman tentang situs website. Proses pembuatan project ini
bertujuan untuk menumbuhkan sifat kreatif, inovatif, berdikari
sehingga mampu menghasilkan karya yang baik. Dan dapat
menjadi seorang pembuat situs website yang baik. Melalui project
ini mahasiswa dapat mempelajari segala hal tentang situs web.
Secara umum, pembuatan suatu situs web melalui beberapa
proses yaitu diantaranya, merancang design atau layout,
penentuan dan penempatan objek, lalu mengkoneksikan objek.
Hal yang penting dalam pembuatan situs web adalah
terbentuknya suatu situs web yang bagus. Penulis menyimpulkan
sebagai berikut :
1. Situs web yang bagus adalah situs web yang mampu
menyampaikan informasi yang diinginkan oleh pengguna.
2. Situs web yang bagus juga harus menarik, supaya
pengguna lebih tertarik untuk lebih mendalami apa yang
dipromosikan oleh pemilik situs tersebut.
20
4.2 Saran
Banyak hal yang didapat penulis selama proses pembuatan
situs web ini. Bukan hal mudah untuk mempelajari dan membuat
project ini baik secara teori maupun praktik di lapangan. Oleh
karena itu penulis ingin manyampaikan beberapa hal sebagai
berikut :
1. Diperlukan kreatifitas yang tinggi untuk menghasilkan karya
yang efektif dan juga menarik bagi pengguna.
2. Hendaknya dalam pembuatan situs web menggunaka
perencanaan yang baik. Mulai dari perancangan, pembuatan
hingga pemanfaatannya. Sehingga penggunaan waktu bisa
efisien.
DAFTAR PUSTAKA
Zainuddin, Imam, dkk.2010.Projek Skripsi / TA III Situs Web.Bekasi:
STMIK Pranata Indonesia
Komputer, Wahana.2006. Tutorial 5 Hari Membuat Website Interaktif
dengan Macromedia Dreamweaver 8 .Jakarta:Andi Publisher
________________2005. Adobe Photoshop untuk Desainer Web.Jakarta:
Andi Publisher
blog.re.or.id/macromedia-dreamweaver-mx-web-editor.htm
repository.usu.ac.id/bitstream/123456789/16955/4/Chapter%20II.pdf
www.total.or.id/info.php?kk=Adobe%20Photoshop
DAFTAR RIWAYAT HIDUP
Penulis dilahirkan di Jakarta pada tanggal 11 Juli 1989 dari ayah
H. Muntawalib dan ibu Siti Amirah, merupakan putri keempat dari empat
bersaudara. Tahun 2007 penulis lulus dari SMK Nina Insan Kamil
Bekasi. Berselang 1 tahun, yaitu tahun 2008 penulis melanjutkan kuliah
dan mengambil kelas sarjana di STMIK Pranata Indonesia dengan
memilih jurusan Teknik Informatika.
Saat ini penulis juga sedang bekerja di sebuah play group, yaitu
Taman Bermain Anak Sholeh. Karena kecintaannya terhadap kehidupan
anak-anak di play group inilah penulis termotivasi untuk membuat website
ini.
LAMPIRAN-LAMPIRAN
1. Kode listing index.html
<html> <head>
<title>Untitled-1</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1256">
<script type="text/JavaScript">
<!-- function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; }
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
} //-->
</script> <style type="text/css">
<!--
#Layer1 { position:absolute;
left:99px; top:140px;
width:627px; height:445px;
z-index:1; }
body {
background-color: #000000; background-image: url(images/Machovka_Happy_fish.JPG);
} .style3 {font-family: "Kristen ITC"; font-size: 14px;}
.style4 { font-family: "Curlz MT";
font-size: 30px; font-weight: bold;
} .style5 {
font-size: 16px;
font-family: "Californian FB"; }
#Layer2 { position:absolute;
left:728px; top:14px;
width:101px; height:98px;
z-index:2;
}
#Layer3 { position:absolute;
left:705px; top:418px;
width:131px; height:93px;
z-index:3; }
-->
</style> </head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/hover_03.gif','images/hover_04.gif','images/hover_05.gif','images/ho
ver_06.gif')"> <!-- ImageReady Slices (Untitled-1) -->
<div id="Layer1"> <ul type="square">
<li>
<h1 align="left" class="style4">Home </h1>
</li> </ul>
<blockquote> <blockquote>
<h4 align="justify" class="style3"> Memberikan pendidikan kepada anak di usia dini merupakan momentum
yang amat penting. Para ahli pendidikan menamakan usia pra sekolah sebagai "golden age" (usia emas).
Setiap orang tua muslim tentu memiliki obsesi untuk memiliki putra-putri yang cerdas secara intelegensi, emosional,
dan spiritual.</h4>
<h4 align="justify" class="style3">Taman Bermain Anak Sholeh merupakan lembaga pendidikan pra sekolah
(play group) yang menerapkan dasar-dasar pendidikan islami dengan mengacu Pada Kurikulum Departemen
Pendidikan Nasional yang dimodifikasi, berbasis pada kecerdasan intelegensi, emosional, dan spiritual disesuaikan
dengan ciri khas Taman Bermain Anak Sholeh melalui metode sentra.</h4>
</blockquote>
<h4 align="justify"> </h4>
<blockquote>
<h4 align="justify" class="style5">Hubungi kami : Taman Bermain Anak Sholeh, Taman Iqro' Permai No. 24 Rt.
01 / 09 Jatimakmur - Pondok Gede - Bekasi </h4>
</blockquote>
</blockquote>
</div>
<div id="Layer2"><img src="images/logo.JPG" width="100" height="100"></div>
<div id="Layer3"><img src="images/Machovka_Happy_fish.JPG" width="145" height="101"></div>
<table width="800" height="600" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#00FF00"
id="Table_01">
<tr>
<td colspan="2"><div><img src="images/index_01.gif" width="800" height="129"
alt=""></div></td>
</tr>
<tr>
<td rowspan="5">
<img src="images/index_02.gif" alt="" width="628" height="471"
lowsrc="images/index_02.gif"></td>
<td><a href="index.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('home','','images/hover_03.gif',1)"><img src="images/index_03.gif" alt="home"
name="home" width="172" height="71" border="0"></a></td>
</tr>
<tr>
<td><a href="visi.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('visi','','images/hover_04.gif',1)"><img src="images/index_04.gif" alt="visi"
name="visi" width="172" height="48" border="0"></a></td>
</tr>
<tr>
<td><a href="misi.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('misi','','images/hover_05.gif',1)"><img src="images/index_05.gif" alt="misi"
name="misi" width="172" height="53" border="0"></a></td>
</tr>
<tr>
<td><a href="gallery.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('gallery','','images/hover_06.gif',1)"><img src="images/index_06.gif" alt="gallery"
name="gallery" width="172" height="44" border="0"></a></td>
</tr>
<tr>
<td>
<img src="images/index_07.gif" width="172" height="255" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>
2. Kode listing visi.html
<html>
<head> <title>Untitled-1</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256"> <script type="text/JavaScript">
<!-- function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; }
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x; }
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
} //-->
</script>
<style type="text/css"> <!--
#Layer1 { position:absolute;
left:99px; top:140px;
width:627px; height:483px;
z-index:1;
} body {
background-color: #000000; background-image: url(images/Machovka_Happy_fish.JPG);
} .style4 {
font-family: "Curlz MT"; font-size: 30px;
font-weight: bold;
} .style6 {font-family: "Kristen ITC"; font-size: 18px; }
#Layer2 {
position:absolute;
left:728px; top:14px;
width:98px; height:102px;
z-index:2; }
#Layer3 { position:absolute;
left:724px;
top:403px; width:121px;
height:142px; z-index:3;
} #Layer4 {
position:absolute; left:569px;
top:442px;
width:225px; height:123px;
z-index:3; }
#Layer5 { position:absolute;
left:624px; top:414px;
width:189px; height:113px;
z-index:3;
} -->
</style> </head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/hover_03.gif','images/hover_04.gif','images/hover_05.gif','images/ho
ver_06.gif')"> <!-- ImageReady Slices (Untitled-1) -->
<div id="Layer1">
<ul type="square"> <li>
<h1 align="left" class="style4">Visi</h1> </li>
</ul> <blockquote>
<blockquote> <h4 align="center" class="style6">Menjadi Model Play Group Islami </h4>
<h4 align="center" class="style6">yang Berkualitas </h4>
<h4 align="center" class="style6">dalam Menyiapkan Generasi Robbani </h4> <h4 align="center" class="style6">yang Berakhlak Islami </h4>
</blockquote> <blockquote>
<p> </p> <p> </p>
<p> </p> </blockquote>
</blockquote>
</div> <div id="Layer2">
<div id="layer"><img src="images/logo.JPG" width="100" height="100"></div> </div>
<div id="Layer5"><img src="images/ikan2.JPG" width="218" height="135"></div> <table width="800" height="600" border="0" align="center" cellpadding="0" cellspacing="0"
bgcolor="#00FF00" id="Table_01"> <tr>
<td colspan="2"><img src="images/index_01.gif" width="800" height="129" alt=""></td>
</tr> <tr>
<td rowspan="5">
<img src="images/index_02.gif" alt="" width="628" height="471"
lowsrc="images/index_02.gif"></td> <td><a href="index.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('home','','images/hover_03.gif',1)"><img src="images/index_03.gif" alt="home" name="home" width="172" height="71" border="0"></a></td>
</tr> <tr>
<td><a href="visi.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('visi','','images/hover_04.gif',1)"><img src="images/index_04.gif" alt="visi"
name="visi" width="172" height="48" border="0"></a></td>
</tr> <tr>
<td><a href="misi.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('misi','','images/hover_05.gif',1)"><img src="images/index_05.gif"
alt="misi" name="misi" width="172" height="53" border="0"></a></td> </tr>
<tr> <td><a href="gallery.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('gallery','','images/hover_06.gif',1)"><img src="images/index_06.gif"
alt="gallery" name="gallery" width="172" height="44" border="0"></a></td> </tr>
<tr> <td>
<img src="images/index_07.gif" width="172" height="255" alt=""></td> </tr>
</table> <!-- End ImageReady Slices -->
</body> </html>
3. Kode listing misi.html
<html> <head>
<title>Untitled-1</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256"> <script type="text/JavaScript">
<!-- function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; }
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x; }
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
} //-->
</script>
<style type="text/css"> <!--
#Layer1 {
position:absolute;
left:99px; top:140px;
width:587px; height:445px;
z-index:1; }
body { background-color: #000000;
background-image: url(images/Machovka_Happy_fish.JPG);
} .style4 {
font-family: "Curlz MT"; font-size: 30px;
font-weight: bold; }
.style6 {font-family: "Kristen ITC"; font-size: 18px; }
.style8 {
font-family: "Kristen ITC";
font-size: 14px; font-weight: bold;
} #Layer2 {
position:absolute; left:728px;
top:14px; width:99px;
height:98px; z-index:2;
}
#Layer3 { position:absolute;
left:725px; top:401px;
width:118px; height:150px;
z-index:3; }
#Layer4 {
position:absolute; left:729px;
top:397px; width:110px;
height:152px; z-index:3;
} -->
</style>
</head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"
onLoad="MM_preloadImages('images/hover_03.gif','images/hover_04.gif','images/hover_05.gif','images/hover_06.gif')">
<!-- ImageReady Slices (Untitled-1) --> <div id="Layer1">
<ul type="square"> <li>
<h1 align="left" class="style4">Misi</h1>
<ol class="style8"><li> <p align="justify">Memberikan pelayanan pendidikan yang membantu meletakkan dasar-dasar
Keimanan, Ketaqwaan, dana Akhlakul Karimah</p> </li>
<li> <p align="justify">Mewujudkan program pendidikan yang mengintegrasikan kecerdasan intelegensi
(IQ), kecerdasan emosional (EQ), dan kecerdasan spiritual (SQ)</p> </li>
<li>
<p align="justify">Mewujudkan lingkungan belajar yang kondusif dengan membangun hubungan yang sinergis dan harmonis antara pengelola, pimpinan, dan seluruh staff sekolah, para orang tua murid
serta masyarakat</p>
</li>
<li> <p align="justify">Mewujudkan kurikulum yang berkualitas danmampu menjadi model play group
islami </p> </li>
</ol> </li>
</ul> <blockquote>
<blockquote>
<h4 align="center" class="style6"> </h4> </blockquote>
</blockquote> </div>
<div id="Layer2"> <div id="layer">
<div id="div"><img src="images/logo.JPG" width="100" height="100"></div> </div>
</div>
<div id="Layer4"><img src="images/kudalaut.JPG" width="119" height="164"></div> <table width="800" height="600" border="0" align="center" cellpadding="0" cellspacing="0"
bgcolor="#00FF00" id="Table_01"> <tr>
<td colspan="2"><img src="images/index_01.gif" width="800" height="129" alt=""></td> </tr>
<tr> <td rowspan="5">
<img src="images/index_02.gif" alt="" width="628" height="471" lowsrc="images/index_02.gif"></td>
<td><a href="index.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('home','','images/hover_03.gif ',1)"><img src="images/index_03.gif" alt="home" name="home" width="172" height="71" border="0"></a></td>
</tr> <tr>
<td><a href="visi.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('visi','','images/hover_04.gif',1)"><img src="images/index_04.gif" alt="visi"
name="visi" width="172" height="48" border="0"></a></td> </tr>
<tr>
<td><a href="misi.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('misi','','images/hover_05.gif',1)"><img src="images/index_05.gif"
alt="misi" name="misi" width="172" height="53" border="0"></a></td> </tr>
<tr> <td><a href="gallery.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('gallery','','images/hover_06.gif',1)"><img src="images/index_06.gif" alt="gallery" name="gallery" width="172" height="44" border="0"></a></td>
</tr>
<tr> <td>
<img src="images/index_07.gif" width="172" height="255" alt=""></td> </tr>
</table> <!-- End ImageReady Slices -->
</body> </html>
4. Kode listing gallery.html
<html>
<head> <title>Untitled-1</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256"> <script type="text/JavaScript">
<!-- function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x; }
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} }
//--> </script>
<style type="text/css"> <!--
#Layer1 { position:absolute;
left:99px; top:140px;
width:627px;
height:445px; z-index:1;
} body {
background-color: #000000; background-image: url(images/Machovka_Happy_fish.JPG);
} .style3 {font-family: "Kristen ITC"; font-size: 14px;}
.style4 {
font-family: "Curlz MT"; font-size: 30px;
font-weight: bold; }
.style6 {font-family: "Kristen ITC"; font-size: 18px; }
.style7 {font-size: 18px}
#Layer2 { position:absolute;
left:728px;
top:14px; width:102px;
height:97px; z-index:2;
} -->
</style> </head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"
onLoad="MM_preloadImages('images/hover_03.gif','images/hover_04.gif','images/hover_05.gif','images/hover_06.gif')">
<!-- ImageReady Slices (Untitled-1) --> <div id="Layer1">
<ul type="square"> <li>
<h1 align="left" class="style4">Gallery</h1> </li>
</ul>
<p align="left"><a href="gallery1.html"> <img src="images/foto1.JPG" width="130" height="100" hspace="50" border="0"></a><a href="gallery2.html"><img src="images/foto2.JPG" width="130"
height="100" border="0"></a><a href="gallery3.html"><img src="images/foto3.JPG" width="130"
height="100" hspace="50" vspace="0" border="0"></a></p> <p align="left"> </p>
<p align="left"><a href="gallery4.html"><img src="images/foto4.JPG" width="130" height="100" hspace="50" border="0"></a><a href="gallery5.html"><img src="images/foto5.JPG" width="130"
height="100" border="0"></a> <a href="gallery6.html"><img src="images/foto6.JPG" width="130" height="100" hspace="50" border="0"></a></p>
<p align="left"> </p> <blockquote>
<blockquote>
<h4 align="left" class="style3"> </h4> <h4 align="center" class="style6"> </h4>
</blockquote> </blockquote>
</div> <div id="Layer2">
<div id="layer"> <div id="div"><img src="images/logo.JPG" width="100" height="100"></div>
</div>
</div> <table width="800" height="600" border="0" align="center" cellpadding="0" cellspacing="0"
bgcolor="#00FF00" id="Table_01"> <tr>
<td colspan="2"><img src="images/index_01.gif" width="800" height="129" alt=""></td> </tr>
<tr> <td rowspan="5">
<img src="images/index_02.gif" alt="" width="628" height="471" lowsrc="images/index_02.gif"></td>
<td><a href="index.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('home','','images/hover_03.gif',1)"><img src="images/index_03.gif" alt="home" name="home" width="172" height="71" border="0"></a></td>
</tr> <tr>
<td><a href="visi.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('visi','','images/hover_04.gif',1)"><img src="images/index_04.gif" alt="visi"
name="visi" width="172" height="48" border="0"></a></td> </tr>
<tr>
<td><a href="misi.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('misi','','images/hover_05.gif',1)"><img src="images/index_05.gif"
alt="misi" name="misi" width="172" height="53" border="0"></a></td> </tr>
<tr> <td><a href="gallery.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('gallery','','images/hover_06.gif',1)"><img src="images/index_06.gif" alt="gallery" name="gallery" width="172" height="44" border="0"></a></td>
</tr>
<tr> <td>
<img src="images/index_07.gif" width="172" height="255" alt=""></td> </tr>
</table> <!-- End ImageReady Slices -->
</body> </html>
5. Kode listing gallery1.html
<html>
<head> <title>Untitled-1</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1256"> <script type="text/JavaScript">
<!-- function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x; }
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} }
//--> </script>
<style type="text/css"> <!--
#Layer1 { position:absolute;
left:99px; top:140px;
width:627px;
height:445px; z-index:1;
} body {
background-color: #000000; background-image: url(images/Machovka_Happy_fish.JPG);
} .style3 {
font-family: "Kristen ITC";
font-size: 14px; font-weight: bold;
} .style4 {
font-family: "Curlz MT"; font-size: 30px;
font-weight: bold; }
.style6 {font-family: "Kristen ITC"; font-size: 18px; }
#Layer2 { position:absolute;
left:726px; top:15px;
width:102px; height:94px;
z-index:2; }
-->
</style> </head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/hover_03.gif','images/hover_04.gif','images/hover_05.gif','images/ho
ver_06.gif')"> <!-- ImageReady Slices (Untitled-1) -->
<div id="Layer1"> <ul type="square">
<li>
<h1 align="left" class="style4">Gallery TABAS </h1> </li>
</ul>
<p align="left"><img src="images/foto1big.JPG" width="300" height="210" hspace="150"></p>
<blockquote> <blockquote> <em> </em>
<blockquote> <p align="left" class="style3">Nama kegiatan : Bersih-bersih Lingkungan</p>
<p align="left" class="style3">Lokasi : Outdoor Taman Bermain Anak Sholeh</p> </blockquote>
<p align="left" class="style3"> </p> <h4 align="center" class="style6"> </h4>
</blockquote>
</blockquote> </div>
<table width="800" height="600" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#00FF00" id="Table_01">
<tr> <td colspan="2"><img src="images/index_01.gif" width="800" height="129" alt=""></td>
</tr> <tr>
<td rowspan="5">
<img src="images/index_02.gif" alt="" width="628" height="471" lowsrc="images/index_02.gif"></td>
<td><a href="index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('home','','images/hover_03.gif',1)"><img src="images/index_03.gif"
alt="home" name="home" width="172" height="71" border="0"></a></td> </tr>
<tr> <td><a href="visi.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('visi','','images/hover_04.gif',1)"><img src="images/index_04.gif" alt="visi" name="visi" width="172" height="48" border="0"></a></td>
</tr>
<tr> <td><a href="misi.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('misi','','images/hover_05.gif',1)"><img src="images/index_05.gif" alt="misi" name="misi" width="172" height="53" border="0"></a></td>
</tr> <tr>
<td><a href="gallery.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('gallery','','images/hover_06.gif',1)"><img src="images/index_06.gif"
alt="gallery" name="gallery" width="172" height="44" border="0"></a></td>
</tr> <tr>
<td> <img src="images/index_07.gif" width="172" height="255" alt=""></td>
</tr> </table>
<!-- End ImageReady Slices --> </body>
</html>