Anda di halaman 1dari 60

LAPORAN TUGAS AKHIR

WEBSITE MAN DENANYAR JOMBANG

Oleh :

Andriana
NIM. 08.1012.002
PENDIDIKAN KOMPUTER TERAPAN
JURUSAN : INFORMATIKA & PEMROGRAMAN KOMPUTER
INSTITUSI SAINS & TEKNOLOGI INFORMATIKA KOMPUTER
JOMBANG 2009

LEMBAR PERSETUJUAN
TUGAS AKHIR

Laporan

tugas akhir ini

berjudul WEBSITE

MAN DENANYAR

JOMBANG diajukan untuk Melengkapi Tugas Akhir Program Tahun Komputer


Terapan jurusan : Informatika dan Pemrograman Komputer ISTIKOM Jombang.

Disetujui oleh Dosen Pembimbing pada :


Hari

Tanggal

Tempat

Menyetujui,

Ketua Istikom

Dosen Pembimbing

Imron Fuady, S.IP

Widya Effendi,ST

LEMBAR LAPORAN OJT


WEBSITE MAN DENANYAR JOMBANG

Disusun oleh :
Oleh :

Andriana
NIM. 08.1012.002
Dipertahankan di hadapan Dosen Penguji
Pada tanggal 14 September 2009

DOSEN PENGUJI
Penguji

Pembimbing

Imron Fuady, S.IP

Widya Effendi,ST

Laporan OJT telah diterima sebagai salah satu persyaratan


untuk lulus Program Pendidikan 1 tahun Komputer
Tanggal,

Imron Fuady, S.IP

LEMBAR PENGESAHAN INSTANSI


WEBSITE MAN DENANYAR JOMBANG

Oleh :

Andriana
NIM. 08.1012.002

Mengetahui
Pembimbing

Menyetujui
Kepala sekolah MAN Denanyar

Ahmad Nadlif. S Kom

H. Sunardi, SH, S.Ag, MPdi


NIP. 195604151985031004

KATA PENGANTAR

Alhamdulillahhirobbil alamin. Puji syukur atas kehadirat Allah SWT karena


dengan rahmat dan karunia-Nya penulis dapat menyelesaikan laporan Tugas Akhir
(TA) yang berjudul WEBSITE MAN DENANYAR JOMBANG.
Adapun maksud dan tujuan dari penulisan Laporan Tugas Akhir adalah untuk
memenuhi satuan kredit semester (SKS) yang dibebankan kepada penulis.
Laporan Tugas Akhir ini berisi tentang sebuah website sekolah, dimana
sekolah yang dimaksud adalah sekolah MAN Denanyar Jombang. Website MAN
Denanyar ini merupakan sarana informasi sekolah.Sedangkan aplikasi yang
digunakan adalah aplikasi database yakni pembuatan database Buku Tamu dan data
guru.
Dengan segala keterbatasan sebagai manusia, penulis menyadari sepenuhnya
bahwa Laporan Tugas Akhir ini masih jauh dari kesempurnaan. Oleh karena itu,
penulis mengharapkan kritik dan saran yang bersifat membangun agar penulisan
selanjutnya dapat lebih sempurna.
Akhir kata, semoga laporan ini dapat bermanfaat bagi pembaca pada
umumnya dan penulis pada khususnya.

Jombang 17 Agustus 2009

Penulis

UCAPAN TERIMAKASIH
Untuk dapat menyelesaikan tugas akhir ini. Saya selaku penulis tidak dapat
berhasil jika tidak ada unsur bimbingan, dorongan dan bantuan. Oleh karenanya bagi
saya selaku penulis laporan Tugas Akhir (TA) ini akan menyampaikan rasa syukur
serta terimakasih sebesar besarnya kepada:
Allah SWT, kerena dengan rahmad dan hidayahnya Tugas Akhir Perkulian
saya dapat terselesaikan.
Ibu saya Maftukhah yang telah memberi dorongan dan motifasi baik berupa
materi ataupun moril sehingga TA ini dapat selesai.
Ibu Widya Effendi,ST selaku dosen pembimbing yang telah banyak
memberikan arahan dan bimbingan kepada penulis untuk menyelesaikan
laporan tugas akhir ini.
MAN Denanyar Jombang tempat saya magang serta data yang dibuat dalam
TA.
Bapak Ahmad Nadlif. S. Kom selaku pembimbing di lapangan.
Sahabat saya Zus Anny Astsani serta Ibu Ainun Jariyah yang senantiasa
memberi dorongan dan memotifasi saya untuk segera menyeleseikan TA ini.
Teman-teman ISTIKOM Jombang yang telah membantu.
Semua pihak yang ikut terlibat dalam proses pembuatan tugas akhir ini yang
tidak dapat disebutkan satu persatu di sini.

Daftar Isi
Judul ....................................................................................................................
i
Lembar persetujuan ............................................................................................. ii
Lembar pengesahan ............................................................................................. iii
Lembar pengesahan instansi .............................................................................
iv
Kata pengantar ..................................................................................................... v
Ucapan terimaksih ............................................................................................... vii
Daftar isi .............................................................................................................. viii
Daftar gambar ...................................................................................................... x
Daftar tabel .......................................................................................................... xi
BAB 1

: PENDAHULUAN
1.1
1.2
1.3
1.4
1.5
1.6

BAB II

1
2
2
3
3
4

: TEORI PENUNJANG
2.1
2.2
2.3
2.4
2.5
2.6
2.7

BAB III

Latar Belakang .......................................................................


Rumusan Masalah .................................................................
Tujuan ...................................................................................
Batasan Masalah ...................................................................
Metodologi penelitian ...........................................................
Sistematika Penulisan ...........................................................

Pengertian website ................................................................


Pengertian Dreamweaver ......................................................
Pengertian PHP dan My SQL.................................................
Pengertian Adobe Photoshop .................................................
Pengertian Database ...............................................................
Pengertian Macromedia Flash................................................
Hadware pendukung .............................................................

6
12
12
15
17
17
19

: DESAIN DAN IMPLEMENTASI


3.1 Pereancangan Halaman Website ...........................................
3.2 Desain ...................................................................................
3.2.1 Pembuatan Halaman index .......................................
3.2.2 Pembuatan Halaman Utama ......................................
3.2.3 Pembuatan Halaman Profile .....................................
3.2.4 Pembuatan Halaman Galery .....................................
3.2.5 Pembuatan Halaman Buku Tamu ..............................
3.2.6 Pembuatan Halaman Guru ........................................
3.2.7 Pembuatan Halaman Refrensi ...................................
3.2.8 Pembuatan Halaman Pengumuman ..........................

12
22
22
22
23
24
25
26
27
27

3.2.9 Pembuatan Halaman Polling .....................................


3.2.10 Pembuatan halaman Contact Us ...............................
3.2.11 Pembuatan website dengan dreamweaver ................
3.2.12. Pembuatan Data base ................................................
3.3 Pembuatan Database ...............................................................
3.3.1. Membuat Database baru ...............................................
3.3.2. Mengaktifkan/memembuka database ...........................
3.3.3. Membuat tabel secara manual ......................................
BAB IV

: PENGUJIAN DAN ANALISA


4.1
4.2
4.3
4.4

BAB V

28
28
25
26
30
31
31
32

Pengujian Menu Tampilan ....................................................


Pengujian data Base ..............................................................
Analisa ..................................................................................
Waktu Pengujian ...................................................................

34
36
36
37

: PENUTUP
5.1 Kesimpulan ........................................................................... 38
5.2 Saran ..................................................................................... 38

DAFTAR PUSTAKA
LAMPIRAN

DAFTAR GAMBAR
2.1
3.3
3.4
3.5
3.6
3.7
3.8
3.9
3.10
3.11
3.12
3.13
3.14
3.15
3.16
3.17
3.18
3.19
3.20
3.21
3.22
3.23
4.1
4.2

Alur jalannya internet..................................................................................


Halaman index.php ....................................................................................
Halaman utama.php ...................................................................................
Halaman profile.php ...................................................................................
Halaman gal.php ........................................................................................
Halaman galery.php ...................................................................................
Halaman form buku_tamu.php....................................................................
Halaman guestbook.php ..............................................................................
Halaman guru.php ......................................................................................
Halaman refrensi.php .................................................................................
Halaman pengumuman.php .......................................................................
Halaman polling.php .................................................................................
Halaman form_contactus.php ....................................................................
Halaman kontak.php ..................................................................................
Halaman Dreamweaver ...............................................................................
Aktifasi My SQL..........................................................................................
mysql.exe ....................................................................................................
Pembuatan database.....................................................................................
Mengaktifkan database.................................................................................
Form buku tamu...........................................................................................
Pembuatan tabel data guru............................................................................
Memasukan data guru...................................................................................
Halaman Index..............................................................................................
Halaman Utama............................................................................................

13
14
15
16
17
18
19
20
21
22
23
24
25
26
26
29
30
31
32
33
33
35
36

DAFTAR TABEL
2.2 Tabel sistem Mysql....................................................................................... 14
3.1 Tabel Context Diagram .............................................................................. 20
3.2 Tabel Flowcart alur ................................................................................... 21

BAB I
PENDAHULUAN
1.1. Latar Belakang
Dalam hidup, manusia tak pernah luput dari kebutuhan untuk memperoleh data
serta informasi. Dengan kebutuhan akan informasi inilah manusia dapat
berkomunikasi serta bersosialisasi dengan manusia yang lainnya. Namun tanpa
adanya sentuhan teknologi, hasil data dan informasi yang diperoleh tentu tidak akan
mampu memuaskan keinginan. Berbagai kendala seperti ketidakakuratan data akan
sering dijumpai apabila informasi yang diperoleh tidak mendapat sentuhan dari
teknologi kemudahan dalam mendapatkan informasi.
Begitu pula dalam dunia pendidikan. Dalam pengelolaan sistem informasi
akademik, ketepatan serta keakuratan dan kemudahan dalam mendapatkan informasi
data tentu menjadi point utama untuk menghasilkan data atau informasi yang selalu
up to date. Namun tanpa adanya keterlibatan teknologi tentu akan sangat sulit untuk
mewujudkannya.
Sekolah MAN Denanyar Jombang sebagai tempat kerja praktek penulis
merupakan sekolah Islam dengan status Madrasah Aliyah Negeri Jombang
berdasarkan SK Menteri Agama No.24/1969. Sekolah MAN Denanyar dibawah
bimbingan yayasan Mambaul Maarif yang menerapkan program Full Day School
dengan menggunakan metode belajar yang bervariasi dan interaktif. Full Day School
merupakan program pembelajaran pendidikan sekolah dimana siswa belajar di
sekolah selama seharian penuh dari pagi hingga sore hari dengan tujuan siswa
tersebut diharapkan dapat benar-benar mengusai ilmu pengetahuan atau pendidikan
formal yang diperoleh di sekolah.
Dalam mengenalkan serta mempublikasikan sekolah, lembaga pendidikan MAN
Denanyar Jombang hanya mengandalkan penyebaran Brosur, hal ini kurang efisien
untuk mengenalkan atau mempublikasikan sekolah MAN Denanyar Jombang

dikarena banyak faktor yang kurang menguntungkan. Salahsatu iantaranya adalah


informasi sekolah hanya dapat digamabarkan melalui ukuran brosur yang hanya
berapa centimeter yang tentu saja tidak sepenuhnya dapat menggambarkan profil
sekolah yang bersangkutan, penerima brosur hanya dapat diterima oleh beberapa
kalangan saja.
Kegiatan akademik sekolah tidak hanya mencangkup kegiatan pengolahan nilai
sebagai hasil implementasi kegiatan belajar mengajar di sekolah, tetapi juga
bagaimana proses registrasi ketika pertama kali calon siswa mendaftar di sekolah
tersebut serta bagaimana bagaimana para siswa dan para wali murid mendapat banyak
informasi perkembangan sekolah MAN Denanyar dari tahun ketahun secara cepat
dan tepat.
Selain dari dua masalah diatas terdapat juga masalah ketika mengolah nilai hasil
belajar siswa. Kesalahan perhitungan dapat saja terjadi apabila proses pengolahan
nilai dihitung secara manual. Selain itu hasil dari proses belajar hanya dapat diketahui
pada buku rapor siswa sehingga untuk mengetahui perkembangan siswa dari tahun ke
tahun tentu akan sangat sulit jika harus melihat dari buku rapor, karena tidak setiap
orang diperbolehkan melihat buku rapor. Selain itu jika ingin melihat rapor tidak
setiap waktu bisa melihatnya.
Dengan adanya beberapa permasalahan di atas maka diperlukan adanya analisis
sistem untuk kemudian membuat implementasi dari hasil analisis sistem agar keadaan
sistem menjadi lebih baik.
1.2 . Rumusan Masalah
Dalam Penyampaian Informasi Akademik MAN Denanyar Jombang terdapat
beberapa permasalahan antara lain :
1. Kurang efisiennya sarana yang digunakan untuk menyampaikan atau
mempublikasikan Sekolah MAN Denanyar Jombang.
2. Bagaimana penyampaian informasi atau pengumuman agar cepat diterima oleh
para siswa atau pengajar MAN Denanyar Jombang.

1.3. Tujuan
Adapun tujuan dari penyusunan Laporan ini adalah :
1. Meningkatkan pelayanan untuk mahasiswa.
2. Mempermudah informasi sekolah.
3. Membantu proses pencarian data berupa informasi sekolah.
4. Infektifitas pencarian informasi.
5. Memberikan keakuratan waktu dari informasi, relevan, ekonomi, efisien dan
dipercaya.

1.4 Batasan Masalah


Berikut ini merupakan batasan masalah dari proses pengidentifikasian masalah
di atas :
1. Sebatas sarana informasi untuk para siswa yang ingin meneruskan study
selanjutnya.
2. Memberi informasi keberadaan MAN Denanyar didalam website MAN
Denanyar Jombang hanya terdapat informasi pada menu pilihan, Profil,
prestasi, kumpulan soal, galery, refrensi, ekstrakulikuler, buku tamu,
registrasi,serta polling. Yang terpenting adalah buku tamu atau guestbook
dimana halaman website ini berfungsi sebagai sarana para user untuk
menyampaikan pesan, saran dan kritik kepada sekolah MAN Denanyar
Jombang.

1.5 Metologi Penelitian


Pembuatan sebuah website MAN Denanyar diperlukan metode pencarian agar
desain yang dihasilkan sesuai dengan karakter atau keinginan pengguna, adapun
metode yang dilakukan antara lain :

1. Metode survey
Penulis melakukan pengamatan secara langsung pada objek penelitian yaitu
pada sekolah MAN Denanyar untuk mendapatkan data secara langsung yang
berkaitan dengan program yang nantinya akan dbuat.
2. Metode Experiment
Dari hasil survey penulis mencoba untuk membuat bentuk program yang tepat
dan sesuai yang dibutuhkan oleh obyek penelitian yaitu sekolah MAN
Denanyar Jombang.
3. Metode Pustaka
Untuk

pembuatan

program

ini,

penulis

mengacu

pada

buku-buku

pemrograman. Terutama pada buku-buku pemrograman Dream weaver.


4. Browser
Penulis juga mengambil dan mengumpulkan informasi melalui pencarian
melalui internet.
5. Wawancara (Interview)
Wawancara adalah suatu cara mengumpulkan data dengan tanya jawab
dengan responden secara langsung.

1.6 Sistematika Pembuatan laporan


Pembahasan dan penyusunan pada tugas akhir ini adalah sebagai berikut:
BAB I : LATAR BELAKANG
Pada bab ini akan dikemukakan tentang pendahuluan yang menyangkut
Latar Bekalang, Permasalahan, Tujuan, Batasan Masalah, Metologi Penelitian,
Sistematika Penelitian.
BAB II : TEORI PENUNJANG
Pada bab ini dikemukakan tentang teori-teori penunjang yang digunakan
dalam menyeleseikan tugas akhir.

BAB III : PERANCANGAN WEB


Pada bab ini dikemukakan tentang tahap-tahap pembuatan dan
perancangan website MAN Denanyar Jombang.
BAB IV : PENGUJIAN
Pada bab ini dikemukakan tentang pengujian website MAN Denanyar
yang berkaitan dengan menu tampilan seperti pilihan menu serta memuat
informasi-informasi website MAN Denanyar Jombang.
BAB V : PENUTUP
Pada bab ini dikemukakan tentang kesimpulan dan saran-saran serta
berbagai perkembangannya.

BAB II
TEORI PENUNJANG
2.1

Website
Teknologi Informasi dan Telekomunikasi (Information and Communication

Technology/ICT) merupakan tulang punggung aplikasi Web 2.0. Perkembangan


Teknologi Informasi dan Komunikasi yang fenomenal dan menjadi awal munculnya
aplikasi web adalah Internet. Internet yang berawal dari riset untuk pertahanan dan
keamanan serta pendidikan berkembang menjadi perangkat pendukung bisnis yang
sangat berpengaruh. Dalam kaitan dengan aplikasi Web 2.0 ini, terdapat beberapa
peristiwa penting dalam sejarah internet.

Gambar 2.1 Alur jalanya internet


Berawal pada tahun 1957, melalui Advanced Research Projects Agency
(ARPA), Amerika Serikat bertekad mengembangkan jaringan komunikasi terintegrasi

yang saling menghubungkan komunitas sains dan keperluan militer. Hal ini
dilatarbelakangi oleh terjadinya perang dingin antara Amerika Serikat dengan Uni
Soviet (tahun 1957 Soviet meluncurkan sputnik).
Perkembangan besar Internet pertama adalah penemuan terpenting ARPA yaitu
packet switching pada tahun 1960. Packet switching adalah pengiriman pesan yang
dapat dipecah dalam paket-paket kecil yang masing-masing paketnya dapat melalui
berbagai alternatif jalur jika salahsatu jalur rusak untuk mencapai tujuan yang telah
ditentukan. Packet switching juga memungkinkan jaringan dapat digunakan secara
bersamaan untuk melakukan banyak koneksi, berbeda dengan jalur telepon yang
memerlukan jalur khusus untuk melakukan koneksi. Maka ketika ARPANET menjadi
jaringan komputer nasional di Amerika Serikat pada 1969, packet switching
digunakan secara menyeluruh sebagai metode komunikasinya menggantikan circuit
switching yang digunakan pada sambungan telepon publik
Perkembangan besar Internet kedua yang dicatat pada sejarah internet adalah
pengembangan lapisan protokol jaringan yang terkenal karena paling banyak
digunakan sekarang yaitu TCP/IP (Transmission Control Protocol/ Internet
Protocol). Protokol adalah suatu kumpulan aturan untuk berhubungan antarjaringan.
Protokol ini dikembangkan oleh Robert Kahn dan Vinton Cerf pada tahun 1974.
Dengan protokol yang standar dan disepakati secara luas, maka jaringan lokal yang
tersebar di berbagai tempat dapat saling terhubung membentuk jaringan raksasa
bahkan sekarang ini menjangkau seluruh dunia. Jaringan dengan menggunakan
protokol internet inilah yang sering disebut sebagai jaringan internet.
Jaringan ARPANET menjadi semakin besar sejak saat itu dan mulai dikelola
oleh pihak swasta pada tahun 1984, maka semakin banyak universitas tergabung dan
mulailah perusahaan komersial masuk. Protokol TCP/IP menjadi protokol umum
yang disepakati sehingga dapat saling berkomunikasi pada jaringan internet ini.

Perkembangan besar Internet ketiga adalah terbangunnya aplikasi World Wide


Web pada tahun 1990 oleh Tim Berners-Lee. Aplikasi World Wide Web (WWW) ini
menjadi konten yang dinanti semua pengguna internet. WWW membuat semua
pengguna dapat saling berbagi bermacam-macam aplikasi dan konten, serta saling
mengaitkan materi-materi yang tersebar di internet. Sejak saat itu pertumbuhan
pengguna internet meroket.
2.1.1 Sejarah Website
Internet telah membuat revolusi baru dalam dunia komputer dan dunia
komunikasi yang tidak pernah diduga sebelumnya. Beberapa Penemuan telegram,
telepon, radio, dan komputer merupakan rangkaian kerja ilmiah yang menuntun
menuju terciptanya Internet yang lebih terintegrasi dan lebih berkemampuan dari
pada alat-alat tersebut. Internet memiliki kemampuan penyiaran ke seluruh dunia,
memiliki mekanisme diseminasi informasi, dan sebagai media untuk berkolaborasi
dan berinteraksi antara individu dengan komputernya tanpa dibatasi oleh kondisi
geografis.
Internet merupakan sebuah contoh paling sukses dari usaha investasi yang tak
pernah henti dan komitmen untuk melakukan riset berikut pengembangan
infrastruktur teknologi informasi. Dimulai dengan penelitian packet switching
(paket pensaklaran), pemerintah, industri dan para civitas academica telah
bekerjasama berupaya mengubah dan menciptakan teknologi baru yang menarik ini.
Perkembangan Sejarah intenet dapat dibagi dalam empat aspek yaitu
1. Adanya aspek evolusi teknologi yang dimulai dari riset packet switching
(paket pensaklaran) ARPANET (berikut teknologi perlengkapannya) yang
pada saat itu dilakukan riset lanjutan untuk mengembangkan wawasan
terhadap infrastruktur komunikasi data yang meliputi beberapa dimensi
seperti skala, performannce / kehandalan, dan kefungsian tingkat tinggi.

2. Adanya aspek pelaksanaan dan pengelolaan sebuah infrastruktur yang


global dan kompleks.
3. Adanya aspek sosial yang dihasilkan dalam sebuah komunitas masyarakat
besar yang terdiri dari para Internauts yang bekerjasama membuat dan
mengembangkan terus teknologi ini.
4. Adanya aspek komersial yang dihasilkan dalam sebuah perubahan ekstrim
namun efektif dari sebuah penelitian yang mengakibatkan terbentuknya
sebuah infrastruktur informasi yang besar dan berguna. Internet sekarang
sudah merupakan sebuah infrastruktur informasi global (widespread
information infrastructure), yang awalnya disebut the National (atau
Global atau Galactic) Information Infrastructure di Amerika Serikat.
Sejarahnya sangat kompleks dan mencakup banyak aspek seperti
teknologi, organisasi, dan komunitas. Dan pengaruhnya tidak hanya
terhadap bidang teknik komunikasi komputer saja tetapi juga berpengaruh
kepada masalah sosial seperti yang sekarang kita lakukan yaitu kita
banyak mempergunakan alat-alat bantu on line untuk mencapai
sebuah bisnis elektronik (electronic commerce), pemilikan informasi dan
berinteraksi dengan masyarakat.
2.1.2 Fasilitas Website
Fasilitas yang ditawarkan olehWebsite :
1. Informasi lebih detail dan tuntas dari sekolah. Hal ini terlihat jika
dibandingkan dengan iklan (yang mempunyai space terbatas). Sebagai contoh
pada sebuah brosur biasanya penjelasan yang diterima hanya berupa pokokpoko dari sekolah, tetapi di website pengunjung website dapat mendapat detail
spesifikasi dari produk tersebut.
2. Tampilan yang baik akan memberikan image yang baik dan menarik bagi
calon siswa.

3. Isi yang slalu up to date. Para pengunjunag website akan selalu menerima
informasi yang up to date dari sekolah.
4. Salah satu identitas. Saat ini alamat website menjadi salah satu identitas.
5. Mempermudah Komunikasi agar dapat saling berkomunikasi dengan para
calon siswa atau sekolah dapat menjalin komunikasi melalui email ataupun
informasi kontak yang berda dalam website. Komunikasi akan lebih mudah
walaupun perbedaan lokasi sangat jauh dan sudah tentu lebih efisien dalam
hal biaya.
2.1.3 WWW (Word Wide Web)
World Wide Web saat ini berkembang dengan pesatnya pada berbagai bidang
kehidupan manusia. Saat ini penggunaan Internet sangat dirasakan manfaatnya baik
dalam bidang aplikasi Sosial, militer, Scienci serta teknologi dan bisnis, menengah
ataupun kecil. Perkembangan Internet yang pada mulanya hanya diperuntukkan
terhadap pertukaran informasi rahasia antara beberapa badan intelejen rahasia USA,
yang sekarang ini sudah menjadi ajang informasi umum baik untuk bisnis maupun
hiburan. Manfaat yang dapat kita ambil dari keberadaan World Wide Web ini
sangatlah banyak diantaranya kita akan mendapatkan informasi-informasi tentang
kondisi dari sebuah perusahaan atau negara, kitapun dapat melakukan pertukaran
informasi dengan rekan bisnis kita. Disamping itu pula anda dapat dengan mudah
melakukan bisnis secara terbuka yang dikenal dengan E-Commerce (anda dapat
membaca buku yang berjudul Small Business Solutions E-Commerce yang
diterbitkan oleh Elexmedia komputindo). Namun jangan dilupakan juga bahwa
kemudahan yang ada , akan dibarengi dengan suatu bencana, kenapa? Karena
dengan informasi serta kemudahan yang didapatkan kita akan banyak menghadapi
bahaya yang ditimbulakan dengan keberadaan jaringan internet ini. Misalnya
informasi yang benar atau kebohongan, cukup banyak contoh-contoh semacam ini.
Belum lagi penyebaran virus komputer yang akan semakin merajalela. Akan tetapi

masih lebih besar merasakan kemanfaatannya dari pada bencana yang


ditimbulkannya.
2.1.4 Browser
Browser pertama masih berbasis pada teks dan untuk menyatakan link
dibuatkan sebagian menu-menu yang apabila di-klick akan membawa pengguna
bernavigasi di dalam web. Kebanyakan sofware tersebut dibuat untuk komputer
yang berbasis UNIX sebagai operating sistemnya.Browser atau sering disebut Web
Browser, Web Browser adalah program aplikasi yang dipergunakan untuk
menjelajahi

dunia

maya

internet.

Aplikasi

ini

mempunyai

kemampuan

menampilkan suatu Web page yang ditulis dalam bentuk dokumen HTML. Lynx
dan mosaic merupakan dua contoh program aplikasi Web Browser yang pertama.
Lynx adalah we browser yang berbasis Windows. Selain text, dengan Browser ini
kita sudah bisa menampilkan gambar. Program ini dibuat oleh NCSA (National
Center for Super-coputing Application).

2.1.5 Cara Kerja Web Browser


Hypertext Transfer Protocol (HTTP) adalah sebuah metode yang dipakai
untuk mengirim atau mentransfer filie-file (Web Page) dari server WWW ke
komputer client. Protocol ini merupakan protocol standar yang dipakai untuk
mengakses dokumen HTML (Hypertect Markup Languange) atau dengan kata lain
HTTP adalah sebuah protocol yang menentukan aturan main antara ofwarre Web
Server dalam penyediaan dokumen yang minati oleh browser. Uniform Resource
Locator (URL) menunjujkkan sumber daya internet atau alamat sebuah Hompage,
yaitu alamat suatu dokumen atau program yang ingin kita tampilkan satu gunanya.
Secara umum kita perlu memasukkan tiga informasi untuk menuju ke alamat
tertentu yaitu Protokol misalnya http:// atau https:// , lamat server dimana sumber
daya tersebut terletak misalnya www, Microsof.com, path file yang menunjukkan
lokasi dan nama dokumen atau program dalam server tersebut. Penggilan terhadap
sebuah alamat WWW tertentu yaitu dengan memasukkan URL nya, we browser

tersebut segera menjelajahi internet untuk mencari dimana server dengan alamat
tersebut berada. Jika alamat yang dicari tidak ditemukan maka layar akan muncul
pemberiyahuan bahwa alamat yang dimaksud tidak ditemukan. Jika ada perintah
mengambil gambar, maka gambar tersebut akan disertakan. Demikian juga bila ada
perintah frames yang mengatur tampilan bergerak.

2.2

Dreamweaver
Dreamweaver merupaka software web desain yang menawarkan cara mendesain

website dengan cara sekaligus dalam satu waktu yaitu mendesain dan memogram.
Dreamweaver memiliki dua area kerja, berupa kode-kode HTML tertulis. Setiap kita
mendesain website seperti : Mengetik kata-kata, meletakan gambar, table dan
sebagainya di desain view. Maka tag-tag HTML akan tertulis secara langsung
mengiringi proses pengaturan website. Artinya kita memiliki kesempatan untuk
mendesain website sekaligus mengenal tag-tag HTML yang membangun website tadi.
Disamping itu kita juga mendesain website hanya menulis tag-tag dan teks lain di
jendela HTML/code view. Dream weaver juga mempunyai kelebihan yaitu mampu
mengenali tag-tag lain diluar HTML seperti ASP, PHP, serta mendukung scrip-scrip
dinamis HTML dan CSS Style.

2.3

PHP dan My SQL


PHP adalah bahasa pemrograman script yang paling banyak dipakai saat ini.

PHP banyak dipakai untuk memrogram situs web dinamis, walaupun tidak tertutup
kemungkinan digunakan untuk pemakaian lain.
Contoh terkenal dari aplikasi PHP adalah phpBB dan MediaWiki (software
di belakang Wikipedia). PHP juga dapat dilihat sebagai pilihan lain dari
ASP.NET/C#/VB.NET

Microsoft,

ColdFusion

Macromedia,

JSP/Java

Sun

Microsystems, dan CGI/Perl. Contoh aplikasi lain yang lebih kompleks berupa CMS
yang dibangun menggunakan PHP adalah Mambo, Joomla!, Postnuke, Xaraya, dan
lain-lain. PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995. Pada waktu

itu PHP masih bernama FI (Form Interpreted), yang wujudnya berupa sekumpulan
script yang digunakan untuk mengolah data form dari web Selanjutnya Rasmus
merilis kode sumber tersebut untuk umum dan menamakannya PHP/FI, kependekan
dari Hypertext Preprocessing/Form Interpreter. Dengan perilisan kode sumber ini
menjadi open source, maka banyak programmer yang tertarik untuk ikut
mengembangkan PHP. Pada November 1997, dirilis PHP/FI 2.0. Pada rilis ini
interpreter PHP sudah diimplementasikan dalam program C. Dalam rilis ini
disertakan juga modul-modul ekstensi yang meningkatkan kemampuan PHP/FI
secara signifikan. Pada tahun 1997, sebuah perusahaan bernama Zend menulis ulang
interpreter PHP menjadi lebih bersih, lebih baik, dan lebih cepat. Kemudian pada Juni
1998, perusahaan tersebut merilis interpreter baru untuk PHP dan meresmikan rilis
tersebut sebagai PHP 3.0. Pada pertengahan tahun 1999, Zend merilis interpreter PHP
baru dan rilis tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah versi PHP yang paling
banyak dipakai pada awal abad ke-21. Versi ini banyak dipakai disebabkan
kemampuannya untuk membangun aplikasi web kompleks tetapi tetap memiliki
kecepatan dan stabilitas yang tinggi. Pada Juni 2004, Zend merilis PHP 5.0. Dalam
versi ini, inti dari interpreter PHP mengalami perubahan besar. Versi ini juga
memasukkan model pemrograman berorientasi objek ke dalam PHP untuk menjawab
perkembangan bahasa pemrograman ke arah paradigma berorientasi objek.
Kelebihan PHP dari bahasa pemrograman lain
1. Bahasa pemrograman PHP adalah sebuah bahasa script yang tidak
melakukan sebuah kompilasi dalam penggunaanya.
2. Web Server yang mendukung PHP dapat ditemukan dimana mana dari
mulai IIS sampai dengan apache, dengan configurasi yang relatif mudah.
3. Dalam sisi pengembangan lebih mudah, karena banyaknya milis milis
dan developer yang siap membantu dalam pengembangan.
4. Dalam sisi pemahamanan, PHP adalah bahasa scripting yang paling
mudah karena referensi yang banyak.

5. PHP adalah bahasa open source yang dapat digunakan di berbagai mesin
(linux, unix, windows) dan dapat dijalankan secara runtime melalui
console serta juga dapat menjalankan perintah-perintah system.
Dalam bahasa SQL pada umumnya informasi tersimpan dalam tabel-tabel
yang secara logik merupakan struktur dua dimensi terdiri dari baris (row atau record)
dan kolom(column atau field). Sedangkan dalam sebuah database dapa terdiri dari
beberapa table.
Beberapa tipe data dalam MySQL yang sering dipakai:
TIPE DATA
INT(M) [UNSIGNED]
FLOAT(M,D)
DATE
DATETIME
CHAR(M)
VARCHAR(M)
BLOB
LONGBLOB

KETERANGAN
Angka
-2147483648 s/d 2147483647
Angka pecahan
Tanggal
Format : YYYY-MM-DD
Tanggal dan Waktu
Format : YYYY-MM-DD HH:MM:SS
String dengan panjang tetap sesuai dengan yang
ditentukan.
Panjangnya 1-255 karakter
String dengan panjang yang berubah-ubah sesuai
dengan yang disimpan saat itu.
Panjangnya 1 255 karakter
Teks dengan panjang maksimum 65535 karakter
Teks dengan panjang maksimum 4294967295
karakter
Gambar 2.2 sistem Mysql

2. 4 Adobe Photoshop
Banyak dari kita yang sudah mengenal dengan yang namanya Adobe
Photoshop, aplikasi pengolah grafis terbesar di jagad raya ini. Kita bahkan mungkin
sangat dekat dan sangat sering memanfaatkan aplikasi yang satu ini. Roy suryo
termasuk orang yang beruntung berkat software satu ini. Tapi apakah orang-orang
yang kenal tentang sejarah Photoshop juga sebanyak orang yang memakainya ? Saya
rasa tidak, Sekarang saya akan mencoba menulis tentang sejarah aplikasi yang
canggih ini. Termasuk tanggal rilis tiap edisi, penambahan dan pembaruan fitur dll.
Sebelumnya, Photoshop adalah software yang dikembangkan oleh Adobe Inc.
Awalnya hanya sebuah aplikasi editing gambar sederhana yang biasa dipakai untuk
usaha percetakan. Tapi ia juga memperolah predikat sebagai aplikasi untuk membuat
dan mendesain halaman web. Inilah alasan lain mengapa ia bisa menjadi sangat
dikenal. Kelahiran aplikasi ini bermula dari dua bersaudara, Thomas Knoll dan John
Knoll yang memulai mengembangkannya pada 1987. Pada tahun 1989 mereka telah
berhasil merampungkan proyek yang disebut Photoshop 1.0. Adobe tertarik dengan
proyek tersebut hingga akhirnya Photoshop rilis pertama yang hanya seukuran disket
pada tahun 1990. Pada saat itu Photoshop dibuat untuk dapat bekerja pada platform
MacOS. Adobe Photoshop 1.0. Dirilis pada bulan Februari 1990 untuk Sistem
Operasi Macintosh. Adobe Photoshop 2.0. Dirilis pada Juni 1991 masih untuk Mac.
Fitur utamanya adalah pengenalan Paths. Pada januari 1992 versi 2.0.1 akhirnya
menysul pula yang diikuti lagi oleh versi 2.5 yang mau jalan di Windows di akhir
November tahun yang sama. Selang setahun kemudian pengguna IRIX dan Solaris
juga sudah dapat kesempatan untuk mencicipinya. Adobe Photoshop 3.0. Dirilis pada
bulan September 94 untuk Mac. Pada bulan November versi untuk OS yang lainnya
juga menyusul. Jurus baru andalannya adalah Layer dan Palet yang dimunculkan
dalam bentuk tab. Kali pertama bisa dirilis bersamaan antara Win dan Mac adalah
pada rilis 4.0 di bulan November 1996 sudah mulai dikenalkan dengan Adjusment
Layer dan Action. Dan pada bulan Agustus 1997, versi 4.0.1 juga dirilis. Bulan Mei

1998, saat negeri ini memanas karena banyaknya orang bakar-bakaran jenggot, versi
5.0 dari Photoshop dirilis. Hal baru yang ditanamkan dalam aplikasi ini adalah Palette
History, yang memungkinkan kita untuk membatalkan banyak aksi sekaligus.
Magnetik Lasso Tool juga disertakan untuk mendukung Type tool. Tahun 1999 versi
5.5 yang sudah dibundel dengan Image eady dan Extract tool kali pertamanya dirilis.
Adobe Photoshop 6.0. Dirilis pada bulan September 2000 pada versi ini terjadi
perombakan user interface yang cukup signifikan. Fitur Filter dan Vektor Shapes juga
sudah mulai ditambahkan. Di kemudian hari, Maret 2001, Photoshop lagi-lagi
diupdet ke versi 6.0.1Adobe Photoshop 7.0 (yang paling sering aku pakenih ). Maret
2002 versi ketujuh ini dirilis. Hadir dengan perkembangan yang lebih jauh lagi, Type
tool sekarang telah sepenuhnya dianggap sebagai vektor. Di lain sisi, Healing brush
juga ikut ditambahkan. Agustus 2002 versi 7.0.1 dimunculkan dengan banderol harga
$99 ini merupakan perkenalan yang sangat penting bagi plug-in Camera RAW 1.x.
Camera RAW 1.x dikembangkan oleh Thomas Knoll yang mengijinkan pengguna
membaca format RAW (kasar) dari kamera igital dan langsung mengimpor ke
Photoshop. Adobe Photoshop 8.0, atau yang lebih dikenal dengan Photoshop CS
dirilis pada bulan Oktober 2003 Plug-in Camera RAW telah meningkat ke versi 2.0,
begitu juga dengan fitur slice yang mengalami perkembangan besar. Perintah
Shadow\Highlight dan Match Color juga ditambahkan. Filter Lens Blur dan Smart
Guides dimasukkan pula dengan apiknya. Histogram pun sekarang bekerja secara real
time. Di awal dari versi 8.0 Photoshop memperkenalkan diri sebagai Adobe
Photoshop CS. Maksud CS adalah bahwa sekarang beberapa aplikasi telah
dimasukkan dalam satu paket software, Adobe Creative Suite. Beberapa produk
seperti Adobe Illustrator, Adobe InDesign, Adobe GoLive, Adobe Acrobat
Professional, Version Cue, Adobe Bridge, Adobe Stock Photos dan Dreamveaver 8
(setelah dibeli dari Macromedia)

telah diikutsertakan. Satu hal lagi yang ikut

menyertainya adalah, logo mata kini telah berganti menjadi bulu ayam Adobe
Photoshop 9.0, atau yang juga dikenal sebagai Adobe Photoshop CS2, dirilis pada
bulan April 2005, Plug-in Camera RAW pada rilis ini telah berada pada versi 3.x.
Smart Object dan fitur-fitur lain seperti Image Warp, Lens Correction, Smart Sharpen,

Vanishing Point. New Spot healing brush dan Red-Eye tools juga diperkenalkan.
Layer editing juga dikembangkan lagi.Versi terakhir adalah Adobe Photoshop CS3
(10.0)

2.5 Data Base


Pengertian data basis dengan sistem basis data memiliki makna yang berbeda.
Basis data (database) adalah sekumpulan data yang terhubung dan disimpan secara
bersama-sama pada suatu media, tanpa perlu suatu kerangkapan data dan kalaupun
ada maka kerangkapan data itu harus seminimal mungkin dan terkontrol (James
Martin, 1975). Sedangkan sistem basis data dapat didefinisikan sebagai sekumpulan
sub sistem yang terdiri atas basis data dengan para pemakai yang menggunakan basis
data secara bersama-sama, personal-personal yang merancang dan mengelola basis
data, teknik-teknik untuk merancang dan mengelola basis data, serta sistem komputer
untuk mendukungnya. (Edhy Sutanta, 2004).

2.6

Macromedia Flash
Adobe Flash (dahulu bernama Macromedia Flash) adalah salah satu perangkat

lunak komputer yang merupakan produk unggulan Adobe Systems. Adobe Flash
digunakan untuk membuat gambar vektor maupun animasi gambar tersebut. Berkas
yang dihasilkan dari perangkat lunak ini mempunyai file extension .swf dan dapat
diputar di penjelajah web yang telah dipasangi Adobe Flash Player. Flash
menggunakan bahasa pemrograman bernama ActionScript yang muncul pertama
kalinya pada Flash 5. Sebelum tahun 2005, Flash dirilis oleh Macromedia. Flash 1.0
diluncurkan pada tahun 1996 setelah Macromedia membeli program animasi vektor
bernama FutureSplash. Versi terakhir yang diluncurkan di pasaran dengan
menggunakan nama 'Macromedia' adalah adalah Macromedia Flash 8. Pada tanggal 3
Desember 2005 Adobe Systems mengakuisisi Macromedia dan seluruh produknya,
sehingga

nama

Macromedia

Riwayat Produk :

Flash

berubah

menjadi

Adobe

Flash

FutureSplash Animator (10 April 1996)

Flash 1 (Desember 1996)

Flash 2 (Juni 1997)

Flash 3 (31 Mei 1998)

Flash 4 (15 Juni 1999)

Flash 5 (24 Agustus 2000) - ActionScript 1.0

Flash MX (versi 6) (15 Maret 2002)

Flash MX 2004 (versi 7) (9 September 2003) - ActionScript 2.0

Flash MX Professional 2004 (versi 7) (9 September 2003)

Flash Basic 8 (13 September 2005)

Flash Professional 8 (13 September 2005)

Flash Basic 9 & Flash Professional 9 (segera diluncurkan) - ActionScript 3.0

2.6.1 Pengolahan dasar animasi pada mecromedia flash


Pengolahan animasi gravis ini menggunakan fasilitas animasi pada
macromedia flash objek gravis pada macromedia, flash merupakan hal yang
menarik dimana pemakai dapat mengedit sekaligus membuat animasi pada objek
gravis yang sudah dibuat kanvas. Objek penting dalam pembuatan animasi gambar
adalah : Baris waktu (time line)
Didalam komponen ini pemakai dapat membuta animasi yang terdiri dari
pecahan gambar yang disimpan pada tiap frame dibasis waktu yang diperlukan
adalah sebagai berikut :
1. Play head (pengaturan posisi animasi) bertugas menempatkan posisi
dimana animasi dimulai, serta diatur ukurannya sesuai dengan gambar
yang dibuat.
2. Layer (lapisan) adalah yang diciptakan oleh Time Line.

3. Show/Hie Layer Toggle (mengubah status tampak dan tidak tampak)


berfungsi untuk menyembunyikan atau memperlihatkan kembali status
layer yang sedang atau dikerjakan.
4. Action Layer Toggle (mengbah status layer).
5. Lock/Unlock toggle (mengubah status kunci atau tidak) berfungsi untuk
kunci layer agar tidak dapat diedit atau dihapus akibat tindakan yang
disengaja pada saat pengeditan animasi.
6. Add Layer berfungsi untuk manambah layer.
7. Add Guide Layer berfungsi untuk membuat lapisan yang menuntun
gereakan animasi.
8. Delete layer berfungsi untuk menghapus layer yang sedang aktif.
9. Center frame berfungsi untuk memindahkan frame ke posisi tengah pada
area baris waktu.
10. Ordon Skin berfungsi untuk membolehkan pemakai melihat serangkaian
objek dari animasi secara bersamaan.
11. Onion Skin Outline fungsinya adalah memperlihatkan kerangka dari
serangkaina objek animasi secaer bersamaan.
12. Edti Multiple Frame. Dengan menekan tombol ini maka pemakai
diperbolehkan untuk mengedit tiap frame pada area yang berbeda pada
onion Skin.
13. Key Frame adalah frame dimana terdapat perubahan yang spesifikasi di
dalam animasi.

2.7

Hardware
Dalam Pembuatan website MAN Denanyar Jombang penulis menggunakan

komputer dengan spesifikasi System : Microfoft Windows XP Profesional version


2002 Servis Pack 1, Inter Pentium III CPU 668 MHz 1.80 Ghz, 256 MB of Ram.

BAB III
PERANCANGAN WEBSITE

3.1 Perancangan Halaman Website


Diagram Alir halaman menu utama yang direncanakan adalah sebagai berikut:
Galery
About Us

Fasilitas

Guestbook

MENU

Referensi
Pengumuman

Contact Us
Kalender

Prestasi
Registrasi
Kurikulum

Struktur Organisasi
Kurikulum
Profil
Data Karyawan

Guru
Gambar 3.1 Diagram alir

Data Guru

Dalam diagram alir diatas dapat diketahui alur program yang dibuat oleh penulis,
dimulai dari halaman menu utama, adalah halaman yang akan pertama kali terlihat
jika kita meng-akses website MAN Denanyar jombang. Dalam halaman utama akan
terlihat menu-menu yang akan dihubungkan dengan halaman web lain sesuai dengan
pilihan menu. Proses akhir dari hasil pemilihan menu akan kembali ke halaman menu
utama. Yang terdapat pada halaman menu utama adalah animasi flash logo MAN
Denanyar Jombang. Dimana pada halaman index ini hanya ada satu menu yang dapat
menghubungkan kemenu uatama. Dalam menu utama ini terdapat beberapa menu
pilihan diantaranya menu pilihan Home, Galery, About Us, Guestbook, Refrensi,
Pengumuman, Contact Us, Prestasi, Registrasi, kurikulum, serta guru. Dalam
Pengujian Website MAN Denanyar Jombang, penulis mengunakan alur seperti pada
Gambar flowchart di bawah ini :

Mulai

Halaman
Utama
Kurikulum

About Us

Fasilitas
Guru

Galery
Contact Us

Gambar 3.2 Flowcart alur

3.2 Desain
Pada bagian ini akan dijelaskan tentang keseluruhan pembuatan halaman Web
dengan Dream weaver. Jika anda ingin membuat web baru didalam Dream weaver
langkah-langkah sebagai berikut :
3.2.1. Pembuatan Halaman Index
Didalam halaman ini adalah menu pertama sekali dari website MAN
Denanyar Jombang, halaman ini hanya terdiri dari animasi berupa Flash dan ada
juga link untuk masuk pada menu utama. Proses pembuatannya dengan
menguanakan aplikasi dreamweaver dan dengan mengunakan table sebagai letak
file flash yang sudah di simpan pada folder image. Sebelum meletakkan animasi
flas maka diaktifkan terlebih dahulu halaman layout dan pada table untuk
memperingan jalanya flash pada halaman browser.

Gambar 3.3 Halaman index.php

3.2.2. Pembuatan Halaman Utama.


Halaman utama ini berisi banyak komponen-komponen yang terhubung
dengan halaman berikutnya yang ada pada website ini. Sebagai contoh halaman
utama ini terdiri dari halaman berita pengumuman terbaru dari MAN Denanyar
Jombang.

Ada

pula

untuk

melihat

motifasi,infomasi

terbaru

MAN

Denanyar,soal-soal dan juga ruang polling yang ada di halam utama. Untuk
pembuatan halaman utama.php ini di berlukan tiga table untuk membagi ruang
utama untuk isi dan dua ruang untuk halaman pendukung.

Gambar.3.4 Halaman utama.php


3.2.3. Pembuatan Halaman Profile
Halaman ini di buat untuk menceritakan tentang profile MAN Denanyar
Jombang mulai dari visi dan misi, eskul, program pembelajaran serta sekilas
tentang MAN Denanyar Jombang. Alur pembuatanya adalah dengan
menduplikasi dari halaman utama.php karena keserasian antar halaman bila
terbentuk. Hanya saja pada halam isi di ganti dengan informasi yang ada pada
data MAN Denanyar.

Gambar.3.5 Halaman profil.php

3.2.4. Pembuatan Halaman Galery


Kumpulan beberapa kegiatan semua akan bisa terlihat pada halaman ini,
karena halaman ini berupa gambar maka dihalaman ini terdiri pada table-tabel
untuk menyesuaikan posisi gambar. Pembuatan halaman gallery ini merupakan
gabungan antara halaman gal.php dan gaelry. Gambar yang di masukkan adalah
gambar yang sudah di edit pada photoshop dengan file yang khusus untuk
website sehingga kapasitas file tidak terlalu besar dan ringan dijalankan pada
browser.

Gambar.3.6 Halaman gal.php

Gambar.3.7 Halaman galery.php

3.2.5. Pembuatan Halaman Buku Tamu


Buku tamu di sediakan untuk pengunjung yang ingin meninggalkan
pesan baik kritik maupun saran demi kemajuan MAN Denanyar. Halaman ini
juga di buat dengan menduplikasi halama utama.php dan di ganti dengan
halaman guestbook.php selain mengganti judul pada halam ini akan di tambah
dengan database yang di buat dengan menngunakan my SQL dan PHP yang di
masukkan pada halaman ini.

Gambar.3.8 Halaman form buku_tamu.php

Gambar.3.9 Halaman guestbook.php

3.2.6. Pembuatan Halaman Guru


Masih berkaitan dengan halaman gallery kegiatan. Halaman ini di buat
untuk stuktur yang ada pada MAN Denanyar, guru dan karyawan yang terlibat
dalam proses belajar mengajar di MAN Denanyar Jombang . sama halnya
dengan pada halaman sebelumnya, halaman Guru ini terdiri dari table yang
terbagi sesuai dengan jumlah guru dan karyawan yang ada dan ada sedikit
informasi tentang data diri pagawai MAN Denanyar.

Gambar.3.10 Halaman guru.php

3.2.7. Pembuatan Halaman Refrensi


Halaman refrensi ini menceritakan tentang bagaimana siswa MAN
Denanyar dapat mengumpilkan nilai dan diputuskan untuk naik kelas melalui
bebrapa ujian yang harus mereka tempuh.

Gambar.3.11 Halaman refrensi.php


3.2.8. Pembuatan Halaman Pengumuman
Pada halaman ini di sediakan untuk mendukung pada halaman utama
pada isi halaman ini haya berupa teks.

Gambar.3.12 Halaman pengumuman.php

3.2.9. Pembuatan Halaman Polling


Ruang polling dibuat dalam tampilan mendatar yang di letakkan pada
setiap halaman yang bertujuan untuk mengetahui seberapa jauh respon
pengunjung terhadap website yang telah di bangun serta bagaiman pendapat
mereka tentang website ini.

Gambar .3.13 Halaman polling.php


3.2.10. Pembuatan Halaman Contact Us.
Halaman ini disediakan untuk para pengunjung yang ingin
menghubungi Administrasi dalam menanyakan hal yang kurang jelas tentang
segala informasi yang telah disediakan didalam website. Untuk pembuatannya
sendiri masih menduplikasi dari halaman yang sebelunya dan didalam halaman
ini hanya berupa teks fom pengisian pesan.

Gambar.3.14 Halaman form_contactus.php

Gambar.3.15 Halaman kontak.php


3.2.11. Pembuatan halaman Website Dengan dreamweaver
Dalam membuat website MAN Denanyar ini kita harus mengenal dulu
area kerja dreamweaver karena itu merupakan tempat mendesain website.
Dreamweaver dilengkapi dengan jendela- jendela kecil tempat komponenkomponen yang akan membantu dan memaksimalkan hasil desain website
Adapun area kerja dreamweaver sebagai berikut:
-

Object Panell/pallete : Terdiri dari tombol- tombol yang akan dipakai


untuk mendesain website, seperti membuat table, meletakkan gambar,
menulis teks, menggambar layer, dan lainnya. Object pallete ini terdiri

dari enam bagian yaitu Common, Charakter, Form,Frames, Head,


Invisibles dan Spesial.
-

Property Inspector : Pada bagaian ini dapat di gunakan untuk setting


property sebuat objek yang di pilih. Fungsi utamanya untuk
memodifikasi objek yang di pilih, seperti mengatur panjang, lebar, dan
warna.

Laoucer bar : Merupakan tombol untuk membuka inspector, pallete


dan jendela lain yang sering di gunakan.

Gambar 3.16 Halaman Dreamweaver


3. 3 Pembuatan Database dengan My SQL
Pada bagian ini dijelaskan secara rutin yang penting dari keseluruhan
pembuatan Database dengan My SQL, maka untuk masuk ke dalam program My
SQL, pada prompt jalankan perintah sebagai berikut :
Cara mengaktifkan MySQL
C:\apache\mysql\bin\winmysqladmin.exe
Username: root
Password: mysql

Gambar 3.17 Aktifasi My SQL

Dalam penggunaan database dengan My SQL ini adalah sebuah tempat


untuk pembuatan Buku Tamu (guestbook). Cara memasukan ke dalam My SQL
seperti tampilan dibawah ini :

Gambar 3.18 mysql.exe

3.3.1

Membuat database baru


Create database namadatabase;

Gambar 3.19 Pembuatan database


3.3.2

Mengaktifkan/membuka database
use nama database;

Gambar 3.20 Mengaktifkan database

3.3.3

Membuat tabel Secara Manual


A. Buku Tamu
1)

Membuat tabel baru

Struktur tabel Buku tamu yang tersusun sebagai berikut :


Kolom/Field

Field Tipe Data

id

Int(11) not null auto_increment primary key

nama
mail
Tanggal
pesan

Varchar(25) not null


Varchar(50) not null
date
blob

Create table namatabel


(
struktur
);
table ---- buku_tamu
2)

Membuat form pengisian buku tamu.

Gambar 3.21 Form buku tamu


3)

Membuat program untuk menerima masukan data dari form yang telah
kita buat sebelumnya.

4)

Membuat program untuk menampilkan isi buku tamu.

B. Search

1) Membuat table search


Struktur tabel data_guru yang tersusun sebagai berikut :
Kolom/Field

Field Tipe Data

id

Int(11) not null auto_increment primary key

nama
alamat
jabatan
mata_pel

Varchar(25) not null


Varchar(50) not null
Varchar(50) not null
Varchar(50) not null

Gambar 3.22 Pembuatan tabel data guru


Create table namatabel
(
struktur
);
table ---- data_guru
5)

Menambahkan data kedalam table.

Insert into namatabel values(kolom1,kolom2,);

Gambar 3.23 Memasukan data guru


BAB IV
PENGUJIAN

4.1. Pengujian Menu Tampilan


Untuk melakukan pengujian menu tampilan maka digunakan program web
browser untuk melihat menu tampilan homepage. Ada beberapa program web
browser yang bisa di gunakan untuk melihat atau menguji suatu halam website
diantaranya adalah : Netscape, Internet Exploler, Opera dan masih banyak web
browser yang berkembang pada saat ini.Untuk menguji homepaghe MAN Denanyar
ini, penulis menggunakan web browser Internet Exploler versi 5, dimana bisa
menampilkan seluruh halaman dengan cara utuh tanpa ada gangguan dalam tampilan.
Setelah menggunakan browser Internet Exploler versi 5, maka bisa dilakukan secara
offline ( tidak dalam keadaan connect antar komputer), yaitu dengan memanggil file
MAN Denanyar dari harddisk. Untuk memanggil hompage browser sudah di setting
yang langsung menuju hompage MAN Denanyar Jombang.
Juga bisa melakukan dengan cara menggunakan localhost yang mana sudah ada
satu sofware yang mampu untuk menjalankan suaru halaman website yaitu My sQL
PHP dan apache. Cara untuk mejalankan di localhost adalah dengan mengaktifkan
sofware PHP Triat setelah itu file MAN Denanyar di copy pada folder C : Apache/
Mysql/ dan file di letakkan pada folder htdocs dan untuk database di copy pada
folder bin namun sebelum itu kita harus memasukkan User Name root dan password
mysql. Setelah semua sudah tersambung maka buka halaman website pada menu web
browser dengan format penulisan http://localhost/ nama folder/ dan file yang akan di
panggil sebagai contoh : http://localhost/man_denanyar/index.php maka di halam web
browser akan tampil seluruh halaman yang sudah kita buat.
Tampilan pertama pada homepage MAN Denanyar adalah halaman index yang
terdapat animasi logo sekolah dan juga terdapat link untuk memasuki halam utama
yang terdapat menu utama yaitu Home , galery, motifasi, profil, soal, halaman
polling, dan juga buku tamu.
Bentuk tampilan halaman Index pada MAN Denanyar Jombang :

Gambar 4.1 Halaman Index


Untuk Melink antar file atau antar halaman mengunakan perintah / tag <A
HREF=file yang akan di tuju></A> misalkan contoh di bawah ini:
<A HREFc:\wwwwroot\berita.php>berita</A><BR>
Pada

baris

pertama

tertulis

<A HREFc:\wwwwroot\berita.php>berita</A><BR>; yang artinya bahwa file


berita terdapat pada drive c di directory wwwroot dan dalam sub directory informasi
untuk mengenai informasi.
Untuk
ALING=LEFT

memasukkan

gambar

SRC=E:X_PICTURE\jenis

menggunakan
file.gif

perintah

<IMG

ALT=logo

MAN

DenanyarWIDTH=100 HEIGHT100> perintah ini mempunyai maksud sama


seperti link tapi perintahnya adalah <IMG SRC=file yang akan diambil
WIDH=HEIGHT=>

Bentuk halaman berikutnya pada homepage MAN Denanyar Jombang:

Gambar 4.2 Halaman Utama


4.2. Pengujian Data Base
Dalam pengujian database penulis juga harus teliti untuk menuliskan perintah.
Supaya data pengisi buku tanu dapat tersimpan dan dapat dibaca oleh pengisi buku
tamu lainnya.
Setelah membuat buku tamu dan disimpan pada directory yang di tentukan,
maka dan pengujian dapat dilakukan dengan cara mengaktifkan sofware PHPTriad
dan jika sudah aktif maka database di copy pada mysql dan di letakkan pada folder
data. Setelah semua berada pada tempatnya maka aktifkan mysql.exe stelah itu kita
tinggal memanggil data base yang kita inginkan.
4.3. Analisa
Dari pengujian diatas maka analisa penulis sebagai berikut:
1.

Dalam pembuatan homepage MAN Denanyar Jombang terdapat perintah


perintah yang harus sesuia dengan apa yang akan penulis buat, seperti
pembuatan database, memasukkan gambar, melink-kan antar file atau
halaman.

2.

Jika gambar yang berextensi JPG tidak butuh memori yaang sangat besar.

3.

Jika ada animasi gambar yang berupa flash maka di butuhkan suatu
tambahan yaitu layout dan form supaya ketika dijalankan pada web
browser tidak lambat.

4.4. Waktu Pengujian


Untuk proses pengujian halaman website MAN Denanyar Jombang dilakukan
dengan cara offline yang dijalankan melalui localhost yang terbubung degan apache
dan juga mySQL yang sudah di instal pada computer. Dan untuk kesemua file harus
ada pada file apache yang ada apada drive C.jadi hasil bisa di lihat pada web browser
internet exploler.

BAB V
PENUTUP
5.1. Kesimpulan
Dari hasil analisa dan penyelesaian pembuatan website ini dapat ditarik
kesimpulan sebagai berikut:
a. Dalam pembuatan website MAN Denanyar Jombang memerlukan waktu
yang cukup lama agar kwalitas website yang dibuat mendapatkan hasil yang
maksimal.
b. Dalam pembuatan websitae MAN Denanyar Jombang menggunakan
Macromedia Flash dan Adobe Photoshop untuk mempercantik dan
memperindah tampilan website.
c. Website ini merupakan suatu aplikasi yang terintegrasi antara dunia maya
dan dunia nyata yang mana suatu informasi dapat diakses kapanpun dan
dimanapun tanpa ada batas jarak tempuh sehingga semua masyarakat dapat
memperoleh informasi dan hiburan hanya dengan menggunakan fasilitas
jaraingan internet.
d. Dengan

menggunakan

program

Macromedia

dreamweaver

dapat

menciptakan suatu halaman website yang lebih mudah dan menarik serta
dreamweaver dapat mensupport berbagai macam file jadi sorang desainweb
yang baru akan mudah untuk merancang suatu halamn website.
5.2. Saran
Masih banyak kekurangan pada website ini, terutama dalam kelengkapan data
dan pembuatan form pendaftaran untuk mempermudah proses registrasi calon siswa
baru. Maka dari itu penulis akan berusaha untuk menambah beberapa halaman
website MAN Denanyar Jombang agar lebih baik.
LAMPIRAN LAMPIRAN

KODE PEMBUATAN TANGGAL.PHP


<?php
function tanggal_hari_ini (){
$hari=date(w,time());
$tanggal=date(d,time());
$bulan=date(m,time());
$tahun=date(Y,time());
switch($hari){
case 0 : $hari="Minggu";
break;
case 1 : $hari="Senin";
break;
case 2 : $hari="Selasa";
break;
case 3 : $hari="Rabu";
break;
case 4 : $hari="Kamis";
break;
case 5 : $hari="Jum'at";
break;
case 6 : $hari="Sabtu";
break;
}
switch($bulan){
case 01 : $bulan="Januari";
break;
case 02 : $bulan="Februri";
break;
case 03 : $bulan="Maret";

break;
case 04 : $bulan="April";
break;
case 05 : $bulan="Mei";
break;
case 06 : $bulan="Juni";
break;
case 07 : $bulan="Juli";
break;
case 08 : $bulan="Agustus";
break;
case 09 : $bulan="September";
break;
case 10 : $bulan="Oktober";
break;
case 11 : $bulan="November";
break;
case 12 : $bulan="Desember";
}
echo "$hari,$tanggal $bulan $tahun";
}
tanggal_hari_ini();
?>
TAG KODE CONFIG.PHP
<?php
$host="localhost";
$username="root";
$password="mysql";
$dbnama="situs";

mysql_connect($host,$username,$password)or die ("Database tidak dapat


diakses...!!!");
mysql_select_db($dbnama);
?>
TAG KODE FOOTER.PHP
<style type="text/css">
.style3 {
font-size: 10px;
color: #00FF00;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
body {
background-image: url();
}
.style8 {color: #CCCCCC; font-weight: bold;}
-->
</style>
<div align="center"><span class="style3"><span
class="style8">Copyright&copy;2009 MAN Denanyar Jombang Created By
AndrianaCs </span></span></div>
TAG HTML BUKU TAMU.PHP
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">

<!-body,td,th {
color: #000000;
}
.style72 {color: #000000}
.style73 {font-size: 18px}
-->
</style></head>
<body>
<div align="left">
<p align="center"><span class="style72">.<span class="style73">::Silahkan Isi
buku tamu::.</span></span></p>
<form id="form1" name="form1" method="post" action="input_pesan.php">
<table width="50%" border="0" align="center">
<tr>
<td align="left" valign="top">Nama</td>
<td align="left" valign="top">:</td>
<td align="left" valign="top"><label>
<input name="nama" type="text" id="nama" />
</label></td>
</tr>
<tr>
<td align="left" valign="top">Email</td>
<td align="left" valign="top">:</td>
<td align="left" valign="top"><label>
<input name="mail" type="text" id="mail" />
</label></td>
</tr>
<tr>

<td align="left" valign="top">Pesan</td>


<td align="left" valign="top">:</td>
<td align="left" valign="top"><label>
<textarea name="pesan" cols="35" rows="5" id="pesan"></textarea>
</label></td>
</tr>
<tr>
<td align="left" valign="top">&nbsp;</td>
<td align="left" valign="top">&nbsp;</td>
<td align="left" valign="top"><label>
<input type="submit" name="Submit" value="Simpan" />
<input type="submit" name="Submit2" value="Batal" />
</label></td>
</tr>
</table>
<div align="center"></div>
</form>
</div>
<? require("tampil.php") ?>
</body>
</html>
TAG PROGRAM INPUT PESAN BUKU TAMU
<?php
require("config.php");
$tanggal=date("Ymd");
$query = "INSERT INTO buku_tamu (nama,mail,tanggal,pesan)
VALUES('$nama','$mail','$tanggal','$pesan')";
$result = mysql_query($query);

if ($result) {
header("location:guestbook.php");
}else{
echo"Pesan Anda tidak dapat disimpan.";
}
?>
PROSES TAMPIL BUKU TAMU
<?php
require("config.php");
echo "<table cellpadding=\"3\" cellspacing=\"0\" width=\"100%\">";
$numresult = mysql_query("SELECT * FROM buku_tamu ORDER BY id DESC");
$jumlah = mysql_num_rows($numresult);
$limit = 5;
if (empty($offset)) {
$offset = 0;
}
$query = "SELECT * FROM buku_tamu ORDER BY id DESC LIMIT $offset,
$limit";
$result = mysql_query($query);
echo "<div align=\"left\">";
$halaman = intval($jumlah/$limit);
if ($jumlah%$limit) {
$halaman++;
}
for ($i=1;$i<=$halaman;$i++) {
$newoffset=$limit*($i-1);
if ($offset!=$newoffset)
{

echo "<b>[<a style=\"color: black\" href=\"guestbook.php?


offset=$newoffset\">$i</a>]</b>";
} else {
echo "<b><font color=\"red\">[$i]</font></b>";
}
}
echo "</div>";
while ($row = mysql_fetch_array($result)) {
echo ("
<tr>
<td width=\"100%\" colspan=\"3\"><hr></td>
</tr>
<tr>
<td width=\"20%\">Nama</td>
<td width=\"3%\">:</td>
<td width=\"75%\"><p align=\"justify\">$row[nama]</p></td>
</tr>
<tr>
<td>Tanggal</font>
<td>:</td>
<td><p align=\"justify\">$row[tanggal]</p></td>
</tr>
<tr>
<td>E-Mail</td>
<td>:</td>
<td><p align=\"justify\">$row[mail]</p></td>
</tr>
<tr>
<td valign=\"top\">Komentar</td>
<td valign=\"top\">:</td>

<td width=\"600\"><p align=\"justify\">$row[pesan]</p></td>


</tr>
");
}
echo "</table>";
?>
TAG KODE PROSES POLLING
<?php
//session_start();
echo "<font face=\"Arial\" size=\"2\">";
if(file_exists("datapolling.txt")) {
$file = fopen("datapolling.txt",'r');
$poll = fgets($file,4000);
fclose($file);
$data = explode("+",$poll);
$pilihan = explode(";",$data[1]);
$counter = explode(";",$data[2]);
if (!$_SESSION['status']) {
$_SESSION['status']="pilih";
$counter[$opt]++;
$file = fopen("datapolling.txt",'w');
$poll = $data[0]."+".$data[1]."+";
for($i = 0;$i < count($pilihan);$i++) {
$poll .= $counter[$i].";";
}
fputs($file,$poll);
fclose($file);
}
echo $data[0],"<br>Pilihan anda $pilihan[$opt]<br>";

for($i = 0;$i < count($pilihan); $i++){


$jml=$jml+$counter[$i];
}
echo "<table>
<tr>
<th>Jawaban</th>
<th>Persentase</th>
<th></th>
<th>Vote</th>
</tr>";
for($i = 0;$i < count($pilihan); $i++){
if($jml==0){
$j=1;
}else{
$j=$jml;
}
$hasil_vote=sprintf("%01.1f",(($counter[$i]/$j)*100));
echo "<tr>
<td>$pilihan[$i]</td>
<td>
<table>
<tr>
<td bgcolor=\"$pilihan[$i]\" width=$hasil_vote>&nbsp;</td>
</tr>
</table>
</td>
<td>$hasil_vote %</td>
<td align=center>$counter[$i]</td>
</tr>";
}

}
?>
KODE PROGRAM HALAMAN DETAIL SEARCH
<?php
require("config.php");
$cek="select * from data_guru where id=$id";
$hasil=mysql_query($cek);
while ($data=mysql_fetch_array($hasil)){
echo ("
<table width=\"100%\" height=\"58\" border=\"0\" cellpadding=\"0\"
cellspacing=\"5\">
<tr>
<td width=\"100%\" height=\"24\" bgcolor=\"#E8E9F4\"><font size=\"2\"
face=\"Arial\"><div align=\"left\"><strong class=\"style5\"> <img
src=\"images/dot.gif\" width=\"10\" height=\"10\" />
$data[nama]</strong></div></td>
</tr>
<tr><td><font size=\"2\" face=\"Arial\"><div
align=\"justify\">$data[nama]</div></td></tr>
<tr><td><font size=\"2\" face=\"Arial\"><div
align=\"justify\">$data[alamat]</div></td></tr>
<tr><td><font size=\"2\" face=\"Arial\"><div
align=\"justify\">$data[jabatan]</div></td></tr>
<tr><td><font size=\"2\" face=\"Arial\"><div
align=\"justify\">$data[mata_pel]</div></td></tr>
</table>
");
}
?>

DAFTAR PUSTAKA
Nurdin, Ali, 2002, Ujaran Rosullah SAW, penerbit Erlangga Jakarta
Enterprise, Jubilee, 2006, 101 Tips& Trik Dreamweaver 8, penerbit PT Elex
Komputerindo Jakarta
Wikipedia ensiklopedia online, http://www.wikipedia.co.id
www.adobe.com/products/photoshop,15 Oktober 2008
Stendy B. Sakur, SSt, Aplikasi WEB Database dengan Dreamweaver MX penerbit
ANDI Yogyakarta

Anda mungkin juga menyukai