You are on page 1of 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 Menyetujui
Pembimbing 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 Latar Belakang ....................................................................... 1
1.2 Rumusan Masalah ................................................................. 2
1.3 Tujuan ................................................................................... 2
1.4 Batasan Masalah ................................................................... 3
1.5 Metodologi penelitian ........................................................... 3
1.6 Sistematika Penulisan ........................................................... 4

BAB II : TEORI PENUNJANG


2.1 Pengertian website ................................................................ 6
2.2 Pengertian Dreamweaver ...................................................... 12
2.3 Pengertian PHP dan My SQL................................................. 12
2.4 Pengertian Adobe Photoshop ................................................. 15
2.5 Pengertian Database ............................................................... 17
2.6 Pengertian Macromedia Flash................................................ 17
2.7 Hadware pendukung ............................................................. 19

BAB III : DESAIN DAN IMPLEMENTASI


3.1 Pereancangan Halaman Website ........................................... 12
3.2 Desain ................................................................................... 22
3.2.1 Pembuatan Halaman index ....................................... 22
3.2.2 Pembuatan Halaman Utama ...................................... 22
3.2.3 Pembuatan Halaman Profile ..................................... 23
3.2.4 Pembuatan Halaman Galery ..................................... 24
3.2.5 Pembuatan Halaman Buku Tamu ............................. 25
3.2.6 Pembuatan Halaman Guru ........................................ 26
3.2.7 Pembuatan Halaman Refrensi ................................... 27
3.2.8 Pembuatan Halaman Pengumuman .......................... 27
3.2.9 Pembuatan Halaman Polling ..................................... 28
3.2.10 Pembuatan halaman Contact Us ............................... 28
3.2.11 Pembuatan website dengan dreamweaver ................ 25
3.2.12. Pembuatan Data base ................................................ 26
3.3 Pembuatan Database ............................................................... 30
3.3.1. Membuat Database baru ............................................... 31
3.3.2. Mengaktifkan/memembuka database ........................... 31
3.3.3. Membuat tabel secara manual ...................................... 32

BAB IV : PENGUJIAN DAN ANALISA


4.1 Pengujian Menu Tampilan .................................................... 34
4.2 Pengujian data Base .............................................................. 36
4.3 Analisa .................................................................................. 36
4.4 Waktu Pengujian ................................................................... 37

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

DAFTAR PUSTAKA
LAMPIRAN
DAFTAR GAMBAR

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


3.3 Halaman index.php .................................................................................... 13
3.4 Halaman utama.php ................................................................................... 14
3.5 Halaman profile.php ................................................................................... 15
3.6 Halaman gal.php ........................................................................................ 16
3.7 Halaman galery.php ................................................................................... 17
3.8 Halaman form buku_tamu.php.................................................................... 18
3.9 Halaman guestbook.php .............................................................................. 19
3.10 Halaman guru.php ...................................................................................... 20
3.11 Halaman refrensi.php ................................................................................. 21
3.12 Halaman pengumuman.php ....................................................................... 22
3.13 Halaman polling.php ................................................................................. 23
3.14 Halaman form_contactus.php .................................................................... 24
3.15 Halaman kontak.php .................................................................................. 25
3.16 Halaman Dreamweaver ............................................................................... 26
3.17 Aktifasi My SQL.......................................................................................... 26
3.18 mysql.exe .................................................................................................... 29
3.19 Pembuatan database..................................................................................... 30
3.20 Mengaktifkan database................................................................................. 31
3.21 Form buku tamu........................................................................................... 32
3.22 Pembuatan tabel data guru............................................................................ 33
3.23 Memasukan data guru................................................................................... 33
4.1 Halaman Index.............................................................................................. 35
4.2 Halaman Utama............................................................................................ 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 Ma’arif 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 pokok-
poko 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 KETERANGAN


INT(M) [UNSIGNED] Angka
-2147483648 s/d 2147483647
FLOAT(M,D)
Angka pecahan
DATE Tanggal
Format : YYYY-MM-DD
DATETIME Tanggal dan Waktu
Format : YYYY-MM-DD HH:MM:SS
String dengan panjang tetap sesuai dengan yang
CHAR(M)
ditentukan.
Panjangnya 1-255 karakter
String dengan panjang yang berubah-ubah sesuai
VARCHAR(M)
dengan yang disimpan saat itu.
Panjangnya 1 – 255 karakter
BLOB
Teks dengan panjang maksimum 65535 karakter
LONGBLOB
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 pake’nih ). 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 Flash berubah menjadi Adobe Flash .

Riwayat Produk :
• 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
Struktur Organisasi

Registrasi Kurikulum

Profil
Kurikulum
Data Karyawan

Guru
Data Guru

Gambar 3.1 Diagram alir


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 komponen-
komponen 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 Varchar(25) not null
mail Varchar(50) not null
Tanggal date
pesan 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 Varchar(25) not null
alamat Varchar(50) not null
jabatan Varchar(50) not null
mata_pel 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 HREF”c:\wwwwroot\berita.php”>berita</A><BR>
Pada baris pertama tertulis
<A HREF”c:\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 memasukkan gambar menggunakan perintah <IMG


ALING=”LEFT” SRC=”E:X_PICTURE\jenis file.gif ALT=”logo MAN
Denanyar”WIDTH=”100” HEIGHT”100”> 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

You might also like