Desain Web Dinamis Menggunakan Macromedia Dreamwever Mx Pada Madrasah Aliyah Laboraturium Iain Sumatera Utara

(1)

DESAIN WEB DINAMIS MENGGUNAKAN MACROMEDIA

DREAMWEVER MX PADA MADRASAH ALIYAH

LABORATURIUM IAIN SUMATERA UTARA

TUGAS AKHIR

OLEH :

ANIKA WAFI LUBIS NIM : 072406038

PROGRAM STUDI D-3 ILMU KOMPUTER

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 20010


(2)

DESAIN WEB DINAMIS MENGGUNAKAN MACROMEDIA

DREAMWEVER MX PADA MADRASAH ALIYAH

LABORATURIUM IAIN SUMATERA UTARA

TUGAS AKHIR

Diajukan Sebagai Salah Satu Syarat Untuk Menyelesaikan Studi Pada Program Studi D 3 Ilmu computer

OLEH :

ANIKA WAFI LUBIS NIM : 072406038

PROGRAM STUDI D-3 ILMU KOMPUTER

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 2010


(3)

PERSETUJUAN

Judul : DESAIN WEB DINAMIS MENGGUNAKAN

MACROMEDIA DREAMWEAVER MX PADA MADRASAH ALIYAH LABORATURIUM IAIN SUMATERA UTARA

Kategori : PROPOSAL PENELITIAN

Nama : ANIKA WAFI LUBIS

Nomor Induk Mahasiswa : 072406038

Program Studi : D3 ILMU KOMPUTER

Departemen : MATEMATIKA

Fakultas : MATEMATIKA DAN ILMU PENGETAHUAN

ALAM (FMIPA)

UNIVERSITAS SUMATERA UTARA Disetujui oleh :

Diketahui

Departemen Matematika FMIPA USU

Ketua, Pembimbing

Dr. Saib Suwilo, M.Sc. Dr. Tulus, M.Si


(4)

PERNYATAAN

DESAIN WEB DINAMIS MENGGUNAKAN

MACROMEDIA DREAMWEAVER MX PADA MADRASAH ALIYAH LABORATURIUM IAIN SUMATERA UTARA

TUGAS AKHIR

Saya mengakui bahwa Tugas Akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.

Medan, Mei 2010

ANIKAWAFI LUBIS 072406038


(5)

PENGHARGAAN

Syukur Alhamdulillah KepadaMu Ya Allah SWT, berkat ridho dan kesehatan yang Engkau berikan kepada penulis, penulis dapat menyelesaikan Tugas Akhir ini sesuai dengan waktu yang telah ditargetkan penulis. Adapun Tugas Akhir ini berjudul Desain Web Dinamis Menggunakan Macromedia Dreamweaver MX Pada Madrasah Aliyah Laboraturium IAIN Sumatera Utara .

Selama penulisan tugas akhir ini, penulis menyadari akan hal kesalahan-kesalahan yang mungkin terjadi, baik itu dari segi teknik tata penyajian ataupun dari segi tata bahasa. Oleh karena itu penulis bersedia menerima kritik dan saran dari pembaca dalam upaya perbaikan tugas akhir ini.

Tugas Akhir ini tidak mungkin bisa selesai dengan baik, jika tidak ada bantuan dari berbagai pihak. Pada kesempatan yang baik ini, penulis ingin mengucapkan terima kasih yang setulus-tulusnya kepada :

1. Bapak Dr. Eddy Marlianto, M.Sc selaku Dekan Fakultas MIPA Universitas Sumatera Utara.

2. Bapak Dr. Saib Suwilo, M.Sc selaku Ketua Jurusan Program Studi D-3 Ilmu Komputer.

3. Bapak Dr. Tulus, M.Si. selaku Dosen Pembimbing Tugas Akhir Program Studi D-3 Ilmu Komputer Fakultas MIPA Universitas Sumatera Utara yang telah memberikan bimbingan dan arahan selama ini kepada penulis dalam penyelesaian tugas akhir.


(6)

4. Bapak Drs. Ahmad Bangun Nasution, MA. selaku Kepala Sekolah MA. Laboraturium IAIN SU yang telah memberikan kesempatan kepada penulis untuk melakukan riset sebagai data dalam pembuatan tugas akhir.

5. Seluruh Staf Pengajar Program Studi D-3 Ilmu Komputer Faklutas MIPA Universitas Sumatera Utara yang telah memberikan ilmu dan pengetahuannya kepada penulis selama masa perkuliahan.

6. Teristimewa buat Ayahanda Kasmir Lubis dan Ibunda tercinta Nurhidayah serta kakak-kakakku Hazuma hanun yang senantiasa menasehati penulis dan mendoakan penulis agar lancar dalam segala urusan.

7. Rekan-rekan seangkatan Komputer B 2007 khususnya Liza, Sarah, Iis, Elvi, Mira dan teman-teman Kom B semuanya.

8. Seluruh guru dan pegawai MA. Laboraturium IAIN SU yang telah banyak membantu penulis dalam mengumpulkan data dalam pembuatan tugas akhir. 9. Pihak-pihak yang telah banyak membantu penulis, yang tidak dapat penulis

sebutkan namanya satu-persatu.

Medan, Mei 2010 Penulis Anika Wafi Lubis


(7)

ABSTRAK

Kajian ini bertujuan untuk membangun suatu website pada MA. LAboraturium IAIN SU Medan. Dreamwever MX, Apache, PHP, dan MYSQL, website ini berfungsi untuk memberikan informasi tenteng MA. LAboraturium IAIN SU Medan. Tujuan

website ini adalah untuk mempermudah masyarakat dalam memperoleh informasi mengenai MA. LAboraturium IAIN SU Medan secaraonlinedanupdate.


(8)

DESAIN WEB DINAMIS MENGGUNAKAN MACROMEDIA

DREAMWEVER MX PADA MADRASAH ALIYAH

LABORATURIUM IAIN SUMATERA UTARA

TUGAS AKHIR

OLEH :

ANIKA WAFI LUBIS NIM : 072406038

PROGRAM STUDI D-3 ILMU KOMPUTER

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 20010

DESAIN WEB DINAMIS MENGGUNAKAN MACROMEDIA

DREAMWEVER MX PADA MADRASAH ALIYAH


(9)

TUGAS AKHIR

Diajukan Sebagai Salah Satu Syarat Untuk Menyelesaikan Studi Pada Program Studi D 3 Ilmu computer

OLEH :

ANIKA WAFI LUBIS NIM : 072406038

PROGRAM STUDI D-3 ILMU KOMPUTER

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 2010


(10)

PERSETUJUAN

Judul : DESAIN WEB DINAMIS MENGGUNAKAN

MACROMEDIA DREAMWEAVER MX PADA MADRASAH ALIYAH LABORATURIUM IAIN SUMATERA UTARA

Kategori : PROPOSAL PENELITIAN

Nama : ANIKA WAFI LUBIS

Nomor Induk Mahasiswa : 072406038

Program Studi : D3 ILMU KOMPUTER

Departemen : MATEMATIKA

Fakultas : MATEMATIKA DAN ILMU PENGETAHUAN

ALAM (FMIPA)

UNIVERSITAS SUMATERA UTARA Disetujui oleh :

Diketahui

Departemen Matematika FMIPA USU

Ketua, Pembimbing

Dr. Saib Suwilo, M.Sc. Dr. Tulus, M.Si


(11)

PERNYATAAN

DESAIN WEB DINAMIS MENGGUNAKAN

MACROMEDIA DREAMWEAVER MX PADA MADRASAH ALIYAH LABORATURIUM IAIN SUMATERA UTARA

TUGAS AKHIR

Saya mengakui bahwa Tugas Akhir ini adalah hasil kerja saya sendiri, kecuali beberapa kutipan dan ringkasan yang masing-masing disebutkan sumbernya.

Medan, Mei 2010

ANIKAWAFI LUBIS 072406038


(12)

ABSTRAK

Kajian ini bertujuan untuk membangun suatu website pada MA. LAboraturium IAIN SU Medan. Dreamwever MX, Apache, PHP, dan MYSQL, website ini berfungsi untuk memberikan informasi tenteng MA. LAboraturium IAIN SU Medan. Tujuan

website ini adalah untuk mempermudah masyarakat dalam memperoleh informasi mengenai MA. LAboraturium IAIN SU Medan secaraonlinedanupdate.


(13)

BAB 1 PENDAHULUAN

1.1. Latar Belakang

Saat ini adalah zamannya internet dimana batasan waktu dan jarak tidak berarti lagi bagi media yang satu ini.. Kita dapat berkomunikasi dengan siapa saja dan dimana saja di seluruh dunia ini dengan menggunakan fasilitas e-mail maupun dengan cara

chatting. Mungkin pada saat ini hampir setiap orang sudah memiliki e-mail untuk dapat bergabung di internet. Namun, bagaimana dengan yang memiliki website

pribadi? Apalagi website yang merupakan hasil karya sendiri, mungkin tidak semua orang memilikinya. Padahal dengan memilikiwebsitekita dapat mengenalkan diri kita pada semua orang yang ada di seluruh dunia, baik mengenai diri kita, perusahaan kita atau segala sesuatu yang ingin kita sampaikan. Tidak mustahil juga kita dapat memperoleh uang dengan memilikiwebsite pribadi, asalkan kita dapat mengelolanya dengan baik..

Pengembangan jaringan komunikasi data antar komputer menjadikan internet

muncul dengan berbagai macam aplikasi. internet dengan berbagai aplikasinya pada dasarnya adalah media yang digunakan untuk mengefesienkan proses komunikasi. Untuk dapat memaksimalkan penggunaan internet, harus dapat kita tentukan dan artikan tentang kebutuhan komunikasi dari seseorang.

Salah satu aplikasinya yaitu World Wide Web (WWW). Di awal perkembangannya World Wide Web hanya digunakan untuk kalangan akademisi dan


(14)

riset, namun sekarang World Wide Web digunakan untuk bisnis dan hiburan. Oleh karena itu, dengan berkembangnya kemajuan teknologi ini, Madrasah Aliyah Laboraturium IAIN Sumatera Utara perlu mempromosikan dirinya melalui sebuah

website yang online di internet. Dengan sebuah website yang online di internet, masyarakat dapat dengan mudah mengakses dan mengetahui segala sesuatu mengenai Madrasah Aliyah Laboraturium IAIN Sumatera Utara dengan cepat tanpa memerlukan waktu yang banyak. Perananwebsiteini juga tidak terlepas dari penggunaan peralatan yang mampu mengatasi kelemahan-kelemahan yang mengandalkan tenaga manusia.

Informasi tentang sekolah yang dapat di akses oleh semua orang melalui

internetmemberikan ide buat penulis untuk membuat suatuwebsitesekolah yang bisa memberikan informasi bagi para pengunjungnya.

Atas dasar pertimbangan itu, maka penulis tertarik membuat suatu website

pendidikan (sekolah) dengan judul :

DESAIN WEB DINAMIS MENGGUNAKAN MACROMEDIA DREAMWEAVER MX PADA MADRASAH ALIYAH LABORATURIUM SUMATERA UTARA

Penulis berharap semoga penulisan tugas akhir ini dapat memberikan kemudahan bagi seluruh masyarakat terutama siswa-siswi Madrasah Aliyah Laboraturium IAIN Sumatera Utara melalui sebuah website yang online di internet

dan umumnya bagi siapa saja yang ingin tahu mengenai Madrasah Aliyah Laboraturium IAIN Sumatera Utara.


(15)

1.2. Identifikasi Masalah

Kegiatan penelitian penulis lakukan di SMA Madrasah Aliyah Laboraturium IAIN Sumatera Utara yang berada di Jl. Sutomo No.1 Medan. Mengingat jumlah siswa-siswi, staf pengajar dan pegawai dan keingintahuan masyarakat yang tinggi, maka penulis mencoba mengidentifikasi permasalahan :

1. Sejauh mana website ini dapat dirancang dengan semenarik mungkin sehingga dapat memenuhi keingintahuan masyarakat mengenai Madrasah Aliyah Laboraturium IAIN Sumatera Utara.

2. Memberikan kemudahan bagi para alumni untuk mengetahui tentang keberadaan dari semua teman temannya semasa sekolah dulu dengan menggunakan website

yang telahonlinediinternet.

1.3. Ruang Lingkup Masalah

Adapun batasan dari tugas akhir ini adalah membahas pembuatan desain web dinamis sebagai suatu website yang memberikan informasi bagi pengguna baik kalangan masyarakat umum maupun dari pihak sekolah itu sendiri yang membutuhkan informasi tentang Madrasah Aliyah Laboraturium IAIN Sumatera Utara.

Aplikasi web ini dibangun dibawah sistem operasi Windows XP yang mencakup aplikasi Macromedia Dreamweaver MX 2004, Web Server Apache, Web Scripting PHP dan MySQL. Selain itu. aplikasi web ini juga didukung bahasa


(16)

pemrograman web lainnya seperti HTML (Hypertext Markup Language), CSS (Cascading Style Sheet), dan bahasa pemrogramanweblainnya.

1.4. Maksud dan Tujuan

Dengan semakin berkembangnya perangkat komputer baik hardware maupun

software membuat seluruh aspek kehidupan menuntut suatu manajemen yang baikdalam meningkatkan efisiensi dan efektivitas kerja. Salah satu cara penerapannya adalah dengan membuat website Madrasah Aliyah Laboraturium IAIN Sumatera Utara. Adapun maksud dan tujuan dari penelitian ini adalah :

1. Mempromosikan dan mengenalkan Madrasah Aliyah Laboraturium IAIN Sumatera Utara agar para orang tua mau menyekolahkan anak anak mereka disekolah ini.

2. Membantu para alumni untuk tetap menjalin hubungan dengan para teman-temannya.

1.5. Metode Penelitian

Adapun metodologi penelitian yang digunakan penulis dalam mengumpulkan data adalah:


(17)

1. Penelitian kepustakaan (Library Research)

Disini penulis menggunakan buku-buku yang berhubungan dengan masalah sehingga dapat membantu penyelesaian masalah dalam perancangan situs yang benar, serta dalam mendukung tugas akhir ini untuk menyusun landasan teoritis. 2. Penelitian Lapangan (Field Research)

Penelitian dilakukan langsung ke Madrasah Aliyah Laboraturium IAIN Sumatera Utara untuk mendapatkan data, dimana penulis melakukan pengumpulan data dengan cara bertanya langsung kepada kepala sekolah, guru-guru dan pegawai pada sekolah tersebut.

3. Studi Literatur

Mempelajari website-website yang berhubungan dengan tugas akhir mahasiswa seperti website-website sekolah, serta mempelajari bahasa-bahasa pemrograman

web dengan mengunjungi website-website yang menyediakan tutorial mengenai pemrogramanweb.

1.6. Sistematika Penulisan

Secara garis besar tugas akhir ini terdiri dari 6 (enam) bab dan beberapa lampiran. Adapun setiap bab terdiri dari sub-sub bab. Adapun sistematika penulisan tugas akhir ini adalah :


(18)

BAB 1 : PENDAHULUAN

Pada bab ini diuraikan secara ringkas pembahasan tentang Latar Belakang, Identifikasi Masalah, Ruang Lingkup Masalah, Maksud dan Tujuan, Metode Penelitian, dan Sistematika Penulisan.

BAB 2 : TINJAUAN TEORI

Di dalam bab ini diuraikan sekilas tentang Pengertian Web Dinamis, Pengenalan Internet, Teknologi Internet, Pengenalan HTML, PHP,

MySQL, CSS, dan DHTML, serta Macromedia Dreamweaver MX 2004.

BAB 3 :GAMBARAN SEKILAS MADRASAH ALIYAH

LABORATURIUM SUMATERA UTARA

Bab ini berisikan tentang profil Madrasah Aliyah Laboraturium IAIN Sumatera Utara, struktur organisasi Madrasah Aliyah Laboraturium IAIN Sumatera Utara, uraian tugas dan fungsi organisasi, serta visi dan misi Madrasah Aliyah Laboraturium IAIN Sumatera Utara.

BAB 4 : PERANCANGAN SISTEM

Bab ini berisikan pembahasan mengenai sistem yang dirancang, dan penggunaan Macromedia Dreamweaver MX 2004 sebagai editor perancangan website.

BAB 5 : IMPLEMENTASI SISTEM

Pada bab ini berisikan Pengertian Implementasi Sistem, tujuan Implementasi Sistem, Spesifikasi Sistem, dan InstalasiApache, PHP, danMySQL.


(19)

BAB 6 : KESIMPULAN DAN SARAN

Di bab ini diuraikan kesimpulan dan saran dari hasil penelitian yang penulis peroleh.


(20)

BAB 2

TINJAUAN TEORI

2.1. PengertianWebDinamis

Bagi orang awam yang ingin membuat website atau home page pribadi pasti pernah mendengar istilah web dinamis. Web dinamis adalah website dimana halaman yang akan ditampilkan dibuat pada saat halaman tersebut diminta oleh user/pemakai, misalnyauser/pemakai ingin mengaksesdatabasedan menampilkannya pada halaman

website. Jika zaman dulu, pembuat masih menggunakanHTML biasa untuk membuat

home page, tapi untuk saat ini, akan sangat "ketinggalan zaman" zaman jika hanya menggunakanHTMLsaja.

2.1.1. Syarat-SyaratWebDinamis

Adapun syarat- syarat agarwebsiteselalu dinamis adalah; 1. TersedianyaWeb Server.

Baik web statis ataupun dinamis, jika ingin bisa online di internet, maka syarat pertama haruslah memiliki server, baik berupahardware maupunsoftware. Untuk

hardware yaitu seperangkat komputer yang selalu terhubung online dengan internet. Untuk software, selain operating system, harus disediakan juga software


(21)

untuk web server itu sendiri. Untuk saat ini web server yang menjadi favorit adalah

Apache.

2. TersedianyaSoftwarePemrogramanWebBerbasisServer.

Jika ingin membuat web dinamis, berarti harus tersedia sebuah bahasa pemrograman web selain HTML, baik itu client side maupun server side. Untuk yang client side, memiliki kekurangan yaitu instruksi program bisa terlihat oleh penggunainternet. Sedangkanserver side lebih aman karena instruksi programnya tidak terlihat oleh user. Yang terlihat adalah seperti HTML biasa. Contoh bahasa pemrograman web yang favorit adalahPHP.

3. TersedianyaDatabase.

Database merupakan software yang digunakan untuk menyimpan dan memanajemen data. Jika memiliki data yang sedikit, mungkin masih bisa memakai

file biasa sebagai media penyimpanannya. Tapi jika datanya sudah sangat banyak, tanpa database akan sangat rumit. Database dapat menyimpan berjuta-juta data, dan dapat diakses dengan sangat cepat. Contoh database yang bisa dipakai untuk membuat web adalah Oracle, MsSQLServer, MySQL dan masih banyak lagi yang lain. Saat inidatabaseyang menjadi favorit adalahMySQL.

2.2. Sekilas LahirnyaInternet

Sejarah internet dimulai pada 1969 ketika Departemen Pertahanan Amerika memutuskan untuk mengadakan riset tentang bagaimana caranya menghubungkan


(22)

sejumlah komputer sehingga membentuk jaringan organik. Program riset ini dikenal dengan nama ARPANET. Pada 1970, sudah lebih dari 10 komputer yang berhasil dihubungkan satu sama lain sehingga mereka bisa saling berkomunikasi dan membentuk sebuah jaringan.

Tahun 1972, Roy Tomlinson berhasil menyempurnakan program e-mail yang ia ciptakan setahun yang lalu untuk ARPANET. Program e-mail ini begitu mudah, sehingga langsung menjadi populer. Pada tahun yang sama, icon @ juga diperkenalkan sebagai lambang penting yang menunjukan "at" atau "pada". Tahun 1973, jaringan komputer ARPANET mulai dikembangkan meluas ke luar Amerika Serikat. Komputer University College di London merupakan komputer pertama yang ada di luar Amerika yang menjadi anggota jaringan ARPANET. Pada tahun yang sama, dua orang ahli komputer yakni Vinton Cerf dan Bob Kahn mempresentasikan sebuah gagasan yang lebih besar, yang menjadi cikal bakal pemikiraninternet. Ide ini dipresentasikan untuk pertama kalinya di Universitas Sussex. Hari bersejarah berikutnya adalah tanggal 26 Maret 1976, ketika Ratu Inggris berhasil mengirimkan e-mail dari Royal Signals and Radar Establishment di Malvern. Setahun kemudian, sudah lebih dari 100 komputer yang bergabung di ARPANET membentuk sebuah jaringan atau network. Pada 1979, Tom Truscott, Jim Ellis dan Steve Bellovin, menciptakan newsgroups pertama yang diberi nama USENET. Tahun 1981 France Telecom menciptakan gebrakan dengan meluncurkan telpon televisi pertama, di mana orang bisa saling menelpon sambil berhubungan dengan video link. Karena komputer yang membentuk jaringan semakin hari semakin banyak, maka dibutuhkan sebuah protokol resmi yang diakui oleh semua jaringan.


(23)

Pada tahun 1982 dibentuk Transmission Control Protocol atau TCP dan

Internet Protocolatau IP yang kini kita kenal semua. Sementara itu di Eropa muncul jaringan komputer tandingan yang dikenal dengan Eunet, yang menyediakan jasa jaringan komputer di negara-negara Belanda, Inggris, Denmark dan Swedia. Jaringan Eunet menyediakan jasa e-mail dan newsgroup USENET. Untuk menyeragamkan alamat di jaringan komputer yang ada, maka pada tahun 1984 diperkenalkan sistem nama domain, yang kini kita kenal dengan DNS atau Domain Name System. Komputer yang tersambung dengan jaringan yang ada sudah melebihi 1000 komputer lebih. Setahun kemudian alamat anggota jaringan mulai menggunakan alamat dengan akhiran .com.. Sistem alamat yang serba praktis ini langsung menggelumbungkan jumlah komputer yang tersambung dengan jaringan. Pada 1987 jumlah komputer yang tersambung ke jaringan melonjak 10 kali lipat menjadi 10.000 lebih.

Tahun 1988, antar sesama komputer sudah mulai dapat mengobrol atau

chatting, karena Jarko Oikarinen dari Finland berhasil menemukan dan sekaligus memperkenalkan IRC atau Internet Relay Chat. Setahun kemudian, jumlah komputer yang saling berhubungan kembali melonjak 10 kali lipat dalam setahun. Tak kurang dari 100.000 komputer kini membentuk sebuah jaringan. Tahun 1990 adalah tahun yang paling bersejarah, ketika Tim Berners Lee menemukan program editor dan browser yang bisa menjelajah antara satu komputer dengan komputer lainnya, yang membentuk jaringan itu. Program inilah yang disebutwww,atauWorld Wide Web.

Tahun 1992, komputer yang saling tersambung membentuk jaringan sudah melampaui sejuta komputer, dan di tahun yang sama muncul istilah "surfing the internet". Tahun 1994, situsinternettelah tumbuh menjadi 3.000 alamat halaman, dan untuk pertama kalinya virtual-shopping atau e-retail muncul di internet. Dunia


(24)

langsung berubah. Di tahun yang sama Yahoo! Didirikan, yang juga sekaligus tahun kelahiranNetscape Navigator 1.0.

Setahun kemudian internet sudah menjadi jalur di mana suara, gambar, bisa streaming sekaligus. Tahun 1996 transaksi perdagangan di internet sudah mencapai satu milyar dollar AS. Tahun 1997 situs internet sudah melewati 1,2 juta. Nama domain business.com mencapai rekor penjualan 150.000 dollar AS. Tahun 1998, situs

internet tumbuh menjadi 4,2 juta, dan nama domain yang terdaftar sudah melewati angka dua juta. Tahun 1999 nama domain business.com terjual kembali 7,5 juta dollar AS. Tahun 2000 situsinternetsudah melewati 21,1 juta.

2.3. Teknologi Internet

Internet sebagai suatu media informasi memiliki beberapa teknologi yang umum untuk diketahui diantaranya adalah URL, TCP/IP, nama domain, browser, email, dan

chatting. Semuanya adalah alat bagi seseorang dalam berhubungan dengan dunia internet.

2.3.1. URL (Uniform Resource Locator)

URL digunakan sebagai penunjuk lokasi padainternet. URL dapat dimisalkan dengan alamat yang menunjuk pada suatu lokasi . Contoh penggunaan URL adalah untuk menunjuk alamat pada suatuwebsite.


(25)

2.3.2. Nama Domain

Setiap komputer yang terhubung jaringan TCP/IP akan memilkiIP addressyang unik. IP address terdiri dari empat grup angka yang dipisahkan oleh titik. Nama domain sebenarnya adalah representasisari IP address. Sebagai contoh IP address dari www.google.com adalah http://64.233.167.99/. Kedua URL tersebut akan menampilkan halaman yang sama, yaitu website Google. Perbedaannya adalah saat mengetikkan url http://www.google.com, komputer terlebih dahulu mencari IP addressdari google.com yaitu (http://64.233.167.99) kemudian akan me-linkke server tempatfile filenya disimpan.

2.3.3. Browser

Browser adalah sebuah program yang digunakan untuk menampikan halaman web.

Browser berkomunikasi dengan web server melalui protocol HTTP, yang membaca dan menerjemahkan bahasa HTML dan data gambar untuk ditampilkan secara visual sehingga informasi yang ada dapat dibaca.. Pengeksekusian atau pembacaan halaman

web oleh browser dibagi menjadi dua berdasarkan pengeksekusiannya, yaitu pengeksekusian pada sisi klien dan pada sisiserver.

a. Client Side

Pada sisi klien, script yang dibuat akan dijalankan pada komputer klien (user) lalu ditampilkan hasinya pada browser sehingga sering disebut browser scripting.

Diantaranya adalah HTML, JavaScript, VBScript, DHTML dan lain lain. Kegunaannya untuk membuat tampilan pada web lebih menarik dan dinamis.


(26)

b. Server Side

Pada sisi server, script akan dijalankan pada komputer server, kemudian server akan mengirimkan hasilnya pada browser komputer klien. Kerja script pada server side berbeda dengan client side, pada server side, server pada komputer menjadi berat , karena server side membutuhkan banyak resource server untuk mendukung scriptingnya. Scripting pada server side diantaranya adalah Perl, PHP, ASP, JSP, Coldfusion dan lain-lain.

2.3.4. Email

Email adalah salah satu produk yang dihasilkan pada masa sejarah berkembang internet. Dengan email komunikasi pada dunia internet menjadi lebih cepat dan efisien. Emailadalah singkatan dari electronic mail(surat elektronik) yang fungsinya sama yaitu untuk mengirim surat atau pesan ke alamat yang dituju, tetapi dengan media internet.

2.3.5. Chatting

Chatting adalah pembicaraan yang dilakukan kepada orang lain dengan menuliskan kata-kata dan menggunakan komputer yang terhubung ke internet secara bersamaan. Apapun yang anda ketik melalui keyboard, maka akan muncul pada layar komputer rekan chatting anda. Ada banyak program-pogram chatting diantaranya Yahoo Instant Messager (YIM), MIRC, MSN, dan lain-lain.


(27)

2.4. Pengenalan HTML

2.4.1. Pendahuluan HTML

HTML atau yang memiliki kepanjanganHypertext Markup Language adalah script dimana kita bisa menampilkan informasi dan daya kreasi kita lewat internet. HTML sendiri adalah suatu dokumen teks biasa yang mudah dimengerti dibanding bahasa pemrograman lainnya, dan karena bentuknya itu maka HTML dapat dibaca oleh berbagai platform seperti : Windows, Linux, Macintosh. Kata Markup Language pada HTML menunjukkan fasilitas yang berupa tanda tertentu dalam skrip HTML dimana kita bisa mengatur judul, garis, tabel, gambar, dan lain-lain dengan perintah yang telah ditentukan pada elemen HTML.

HTML sendiri dikeluarkan oleh W3C (World Wide Web Consortium), setiap terjadi perkembangan level HTML, harus dievaluasi ketat dan disetujui oleh W3C. Hingga kini versi terakhir HTML yang telah disetujui oleh W3C adalah HTML versi 4.01.

2.4.2. Bagian-Bagian HTML

HTML terdiri dari beberapa bagian yang fungsinya sebagai penanda suatu kelompok perintah tertentu, misalnya kelompok perintah form yang ditandai dengan kode


(28)

<form>, judul dengan <title> dan sebagainya. Untuk lebih lanjut mengenai bagian-bagian HTML perhatikan skema dibawah ini :

<html> <head>

<title> </title> </head>

<body>

isi dari halaman web </body>

</html>

Tag adalah kode-kode yang digunakan untuk men-setting dokumen HTML. Secara garis besar bentuk umum tag adalah sebagai berikut :

<tag-awal>TEKS<tag-akhir>

Namun ada juga tag yang tidak perlu ada tag penutup seperti <br>, <hr>, <img>, dan lain-lain.


(29)

2.5. Pengenalan PHP

2.5.1. Sejarah PHP

PHP adalah bahasa pemrograman web atau scripting language yang didesain untuk web. PHP dibuat pertama kali oleh satu orang yaitu Rasmus Lerdorf, yang pada awalnya dibuat untuk menghitung jumlah pengunjung pada homepagenya. Pada waktu itu PHP bernama FI (Form Interpreted). Pada saat tersebut PHP adalah sekumpulan script yang digunakan untuk mengolah data form dari web.

Perkembangan selanjutnya adalah Rasmus melepaskan kode sumber tersebut dan menamakannya PHP/FI, pada saat tersebut kepanjangan dari PHP/FI adalah

Personal Home Page/Form Interpreter. Dengan pelepasan 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 sudah diimplementasikan dalam 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 nama rilis tersebut menjadi PHP 3.0.

Pada tahun 1997, sebuah perusahaan bernamaZend, menulis ulang interpreter PHP menjadi lebih bersih, lebih baik dan lebih cepat. Kemudian pada Juni 1998


(30)

perusahaan tersebut merilis interpreter baru untuk PHP dan meresmikan nama rilis tersebut menjadi 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. Versi ini banyak dipakai sebab versi ini mampu dipakai untuk membangun aplikasi web kompleks tetapi tetap memiliki kecepatan proses dan stabilitas yang tinggi.

Pada Juni 2004, Zend merilis PHP 5.0. Versi ini adalah versi mutakhir dari PHP. Dalam versi ini, inti dari interpreter PHP mengalami perubahan besar. Dalam versi ini juga dikenalkan model pemrograman berorientasi objek baru untuk menjawab perkembangan bahas pemrograman kearah pemrograman berorientasi objek.

2.5.2. Kelebihan dan Kelemahan PHP

Kelebihan PHP sebagai bahasa server-side adalah :

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 pemahaman, php adalah bahasa scripting yang paling mudah karena referensi yang banyak.


(31)

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.

Adapun Kelemahan PHP adalah :

1. Tidak ideal untuk pengembangan skala besar.

2. Tidak bisa memisahkan antara tampilan dengan logik dengan baik (walau penggunaan template dapat memperbaikinya).

3. PHP memiliki kelemahan security tertentu apabila programmer tidak jeli dalam melakukan pemrograman dan kurang memperhatikan isu dan konfigurasi PHP.

2.5.3. Penggabungan Script PHP dan HTML

Bahasa pemrograman PHP dapat digabungkan dengan HTML dengan terlebih dahulu memberikan tanda tag buka dilanjutkan tanda tanya (<? ) kemudian ditutup dengan tanda tanya dilanjutkan tanda tag tutup (?>). Ada dua tipe penggabungan antara PHP dan HTML yaitu:

1. Embedded Script

Yakni penulisan tag PHP di sela-sela tag HTML. Dengan cara ini, penulisan tag PHP digunakan untuk mengapit bagian-bagian tertentu dalam dokumen yang memerlukan script PHP untuk proses di dalam server. Embedded Script menempatkan sebagai bagian dari script HTML.


(32)

<html> <head>

<title>Testing</title> </head>

<body>

<? echo "Halo Dunia"; ?> </body>

</html>

2. Non Embedded Script

Yakni cara penulisan tag PHP dibagian paling awal dan paling akhir dokumen. Dengan cara ini, penulisan tag PHP digunakan untuk mengawali dan mengakhiri keseluruhan bagian dalam sebuah dokumen. Non Embedded Script menempatkan script HTML sebagai bagian dari script PHP.

Contoh Penulisan Non Embedded Script dapat dilihat dibawah ini : <?

echo <html> ; echo <head> ;

echo <title>Testing</title> ; echo </head> <body> ; echo Halo Dunia ;


(33)

echo </body> ; echo </html> ; ?>

2.6. Pengenalan SQL

2.6.1. Sejarah SQL

SQL adalah sebuah database yang dapat berjalan sebagai Server maupun Client. Produk database MySQL ini memiliki General Public Licence, dan bersifat Open Source, sehingga bebas untuk digunakan, diedarkan, maupun dikembangkan kembali, tanpa harus khawatir dengan hak cipta. Sejarah SQL dimulai dari artikel seorang peneliti dari IBM bernama EF Codd yang membahas tentang ide pembuatan basis data relasional pada bulan juni tahun 1970. Dalam artikel ini juga dibahas tentang kemungkinan pembuatan bahasa standar untuk mengakses data dalam basis data tersebut. Bahasa tersebut kemudian diberi nama SEQUEL (Structured English Query Language).

Setelah terbitnya artikel tersebut, maka IBM mengadakan proyek pembuatan basis data relasional beserta SEQUEL. Akan tetapi karena permasalah hukum mengenai penamaan SEQUEL, maka IBM merubahnya menjadi SQL. Implementasi basis data relasional dikenal dengan System/R.


(34)

Di akhir tahun 1970-an muncul perusahaan bernama Oracle yang membuat server basis data populer yang bernama sama dengan nama perusahaannya. Dengan naiknya kepopuleran Oracle, maka SQL juga ikut populer sehingga saat ini menjadi standar defacto bahasa dalam manajemen basis data.

2.6.2. Standarisasi SQL

Standarisasi SQL dimulai pada tahun 1986, ditandai dengan dikeluarkannya standar SQL oleh ANSI. Standar ini sering disebut dengan SQL86. Standar tersebut kemudian diperbaiki pada tahun 1989 kemudian diperbaiki lagi pada tahun 1992. Versi terakhir dikenal dengan SQL92. Pada tahun 1999 dikeluarkan standar baru yaitu SQL99 atau disebut juga SQL99, akan tetapi kebanyakan implementasi mereferensi pada SQL92.

2.6.3. Pemakaian Dasar SQL

Pemakaian dasar SQL adalah sebagai berikut: 1. Mendefinisikan Tabel

Untuk mendefinisikan / membuat suatu tabel digunakan sintaks : CREATE TABLE NAMA_TABLE (DEFINISI_TABLE); Contoh:

CREATE TABLE TEST ( NAMA VARCHAR(20), ALAMAT VARCHAR(255), PASSWORD VARCHAR(10) );


(35)

2. Menyimpan data

Untuk menyimpan data dalam tabel dipergunakan sintaks :

INSERT INTO NAMA_TABLE (DAFTAR_FIELD) VALUES (DAFTAR_NILAI);

Contoh:

INSERT INTO TEST (NAMA, ALAMAT, PASSWORD) VALUES ('rozi', 'jl. Kapten muslim gg. Pertama no. 74', '201285');

3. Mengambil data

Untuk mengambil data dipergunakan sintaks :

SELECT DAFTAR_FIELD FROM NAMA_TABLE KONDISI; Contoh:

SELECT nama FROM TEST;

Kondisi diatas berupa optional (bisa digunakan dan bisa tidak digunakan). 4. Mengubah data

Untuk mengubah data dipergunakan sintaks :

UPDATE NAMA_TABEL SET DATA_FIELD_LAMA WHERE DATA_FIELD_BARU;

Contoh:

UPDATE mahasiswa SET nama = 'rozi' WHERE nama = 'fachru'; 5. Menghapus data

Untuk menghapus data dipergunakan sintaks: DELETE FROM NAMA_TABLE KONDISI


(36)

Contoh:

DELETE FROM TEST WHERE NAMA='rozi';

2.7. Pengenalan CSS

Cascading Style Sheets (CSS) adalah suatu bahasa stylesheet yang digunakan untuk mengatur tampilan suatu dokumen yang ditulis dalam bahasa markup. CSS bekerja sebagai pelengkap pada HTML. Dan tugas utama CSS adalah adalah menetapkan aturan tampilan/style yang akan digunakan pada sebuah website. CSS dapat mengubah besar kecilnya text, mengganti warna background pada sebuah halaman, atau dapat pula mengubah warna border pada tabel, dan masih banyak lagi hal yang dapat dilakukan oleh CSS. Singkatnya, CSS digunakan untuk mengatur susunan tampilan pada halaman HTML.

2.8. Pengenalan DHTML

DHTML adalah suatu istilah yang diberikan untuk suatu halaman web yang memanfaatkan HTML (Hypertext Markup Language) dan DOM (Document Object Model), CSS (Cascading Style Sheet) dan client-side scripting untuk membuat tampilan halaman tersebut dinamis atau interaktif. Istilah Dynamic ditambahkan untuk membedakan sifat dinamis halaman web ini dengan halaman web statis yang dibuat hanya berdasarkan HTML.

DHTML mulai diterapkan pada browser generasi ke empat - Microsoft Internet Explorer 4 (IE4) dan Netscape Communicator 4 (NS4). DHTML sepenuhnya


(37)

merupakan teknologi client side yang hanya bergantung pada kemampuan browser untuk menampilkan dan memanipulasi elemen halaman web yang tidak bisa dilakukan dengan hanya mengandalkan HTML.

Sebagian besar hal yang bisa dibuat dengan DHTML bisa juga dibuat dengan menggunakan teknologi authoring web lain seperti Java, Flash, atau ShockWave. Penggunaan DHTML mempunyai kelebihan karena tidak memerlukan plugin apapun untuk menjalankannya dan ukurannya jauh lebih kecil dibandingkan penggunaan teknologi lain. Kelemahannya, masih banyak hal-hal yang belum bisa dilakukan dengan menggunakan DHTML seperti suara dan video. Saat ini sudah cukup banyak penerapan DHTML yang sering anda temukan sewaktu mengakses internet sehari-hari. Yang umum misalnya rollover menu (baik berbentuk image ataupun teks biasa), dropdown menu, trailing cursor, sliding text, dll.

2.9. Mengenal Macromedia Dreamweaver MX 2004

Macromedia Dreamweaver adalah sebuah editor HTML profesional untuk mendesain secara visual dan mengelola situs Web maupaun halaman Web. Macromedia Dreamweaver MX 2004 adalah salah satu produk dari vendor Macromedia Inc. Pada saat ini, pihak Macromedia telah mengeluarkan versi terbaru dari Macromedia Dreamweaver yaitu Macromedia Dreamweaver MX 8.

Dreamweaver MX 2004 memiliki kemampuan untuk menyunting kode dengan lebih baik, serta mampu menggabungkan layout site dengan programming webnya. Kehebatan Dreamweaver ini menjadikan Dreamweaver lebih banyak digunakan oleh Web Desainer maupun Web Programmer guna mengembangkan situs web. Ruang


(38)

kerja, fasilitas, dan kemampuan Dreamweaver mampu meningkatkan produktivitas dan efektivitas dalam desain maupun membangun situs web.

2.9.1. Memulai Dreamweaver MX 2004

Sepertinya halnya dengan program-program lain, untuk menjalankan Macromedia Dreamweaver MX 2004, mulailah dengan memilih tombol Start pada taskbar, kemudian pilih All Program pada tampilan Start Menu Program, pilih folder Macromediadan klikMacromedia Dreamweaver MX 2004. Pada saat pertama kali menggunakan Dreamweaver setelah penginstallan, kita akan mendapatkan tampilan kotak dialog yang menanyakan pilihan layout ruang kerja yang ingin anda gunakan, sebaiknya kita gunakan ruang kerja designer.

2.9.2. Area Kerja Pada Dreamweaver MX 2004

Komponen yang terdapat pada ruang kerja Dreamweaver MX 2004 adalah :

1. Document Window berfungsi untuk menampilkan dokumen dimana Anda sekarang bekerja.

2. Menu Utamaberisi semua perintah yang dapat digunakan untuk bekerja pada Dreamweaver.

3. Insert Bar terdiri dari tombol-tombol untuk menyisipkan berbagai macam objek seperti hyperlink, image, tabel, daan lain-lain.

4. Document Toolbar berisi tombol-tombol dan menu pop-up dari dokumen yang sedang kita gunakan.


(39)

5. Panel Groups adalah sekumpulan panel window yang saling berkaitan satu sama lain, yang dikelompokkan dibawah satu judul untuk membantu bekerja dengan Dreamweaver.

6. Tag Selector adalah tag-tag HTML yang terpilih sesuai dengan objek yang ada di area kerja.

7. Properti Inspector digunakan untuk melihat dan megubah berbagai properti dari tiap objek terpilih yang ada di area kerja. Setiap objek memiliki properti yang berbeda-beda.

2.9.3. Menu Bar Area Kerja

Di dalam area kerja Dreamweaver MX 2004 terdapat beberapa menu utama yang sangat sederhana dan mudah untuk dipahami. Pada Menu Bar Area Kerja Dreamweaver MX 2004 terdiri dari beberapa komponen yang dapat kita gunakan, yaitu :

1. Menu File

Menu File terdiri dari perintah untuk membuat dokumen baru, membuka dokumen yang telah disimpan, dan lain-lain.

2. Menu Edit

Menu Edit terdiri dari perintah untuk mencopy, memindahkan, serta perintah untuk pemilihan seperti Select All, dan lain-lain.


(40)

3. Menu View

Berisi perintah untuk menampilkan beberapa macam tampilan jendela dari area kerja Dreamweaver MX 2004. Seperti jendela Code dan View, serta untuk menampilkan dan menyembunyikan beberapa elemen halaman dan toolbar.

4. Menu Insert

Berisikan alternatif baris insert untuk menyisipkan obyek didalam dokumen. 5. Menu Modify

Berfungsi untuk melakukan perubahan properti pada item atau halaman terpilih. Dengan menggunakan menu ini kita dapat mengedit atribut tag, mengganti tabel dan elemen tabel, dan bermacam bentuk aksi untuk item library dan template.

6. Menu Text

Berfungsi untuk mempermudah dalam melakukan format teks. 7. Menu Commands

Berisi akses ke beberapa perintah, format kode yang sesuai dengan format pilihan kita, membuat photo album, dan melakukan pengeditan gambar dengan menggunakan Macromedia Fireworks.

8. Menu Site

Berisi item untuk mengelola situs seperti mendefenisikan situs baru, menghapus situs, menduplikasikan situs yang telah didefenisi.


(41)

9. Menu Window

Menyediakan akses ke seluruh panel, inspector, dan jendela didalam Dreamweaver.

10. Menu Help


(42)

BAB 3

SEKILAS MA LABORATURIUM IAIN MEDAN

3.1 Profil

Madarasah sebagai salah satu lembaga pendidikan Islam di Indonesia muncul dan berkembang seiring dengan masuk dan berkembangnya Islam di Indonesia. Madrasah mengalami perkembangan jenjang dan jenis seirama dengan perkembangan kehidupan masyarakat Islam Indonesia, dan telah merubah bentuk pendidikan dari bentuk awal seperti dari mushalla dan mesjid menjadi lembaga pendidikan formal seperti sekarang ini.

Pada sisi lain dapat dilihat, bahwa masyarakat Islam memiliki keterikatan dengan madrasah sebagai suatu ikatan emosional ikatan yang muncul karena adanya hasrat masyarakat Islam untuk berperan serta dalam pendidikan dan adanya motivasi keagamaan yang berupa keinginan agar anak-anak mendapat pendidikan agama yang cukup disamping pendidikan umum.

Keterikatan emosional ini merupakan potensi dan kekuatan madarasah dalam artian bahwa rasa memiliki dan rasa tanggungjawab masyarakat terhadap madrasah cukup tinggi dan ini dapat menjadi jaminan kelangsungan hidup madrasah ditengah-tengah masyarakat.

Fakultas Tarbiyah IAIN SU sebagai Lembaga Pendidikan Tinggi Keguruan Agama, melihat keberadaan madrasah sebagai suatu yang sangat dibutuhkan dalam rangka memenuhi tugaspokoknya melaksanakan pendidikan, penelitian dan pengabdian masyarakat.

Madrasah Aliyah Laboraturium IAIAN SU sebagai lembaga pendidikan menengah umum bercirikan Islam, didirikan oleh Fakultas tarbiyah IAIN SU Medan pada bulan Mei Tahun 1994, berdasarkan keputusan Dekan Fakultas Tarbiyah IAIN


(43)

SU Nomor: 05 Tahun 1994 tanggal 12 Mei 1994. Dan proses belajar mengajar dimulai pada Tahun pelajaran 1994/1995.

Madrasah Aliyah Laboraturiu pada awal berdirinya berlokasi di Jalan Wiliam Iskandar, Pasar V Medan Estate (Kampus IAIN SU), kemudian pada tahun 1999 pindah lokasi ke Kampus I IAIN, lokasi yang sekarang.


(44)

3.2 Struktur Organisasi

- - - - - - - - -

-- -- -- -- -- -- -- --

-Gambar 3.1 Struktur Organisasi MA Laboraturium IAIAN SU. Kepala Madrasah

Penasehat Rektor IAIN

Pembina Dekan Fakultas Tarbiyah

PKM Bid. Kurikulum

PKM Bid. Keagamaan dan

Sarana Prasarana PKM

Bid. Kesiswaan

Wali Kelas Bimbingan Konseling

Siswa/i

Keterangan.

Garis Komando - - - - Garis Kordinasi

Komite Madrasah

Kepala Tata Usaha Bendahara


(45)

3.3 Uraian Tugas dan Fungsi Organisasi

3.3.1 Kepala Sekolah

Kepala Sekolah berfungsi dan bertugas sebagai edukator, manejer, administrator,

supervisorserta pemimpin/Leader inovator.

3.3.2 Wakil Kepala Sekolah

Wakil Kepala Sekolah bertugas membantu Kepala Sekolah dalam kegiatan: 1. Menyusun kurikulum

2. Mengatur segala program kesiswaan.

3. Merencanakan kebutuhan sarana dan prasarana.

4. Mengatur dan mengembangkan hubungan dengan masyarakat.

3.3.3 Guru

Guru bertanggung jawab kepada Kepala Sekolah dan mempunyai tugas melaksanakan kegiatan proses belajar mengajar secara efektif dan efisien.

3.3.4 Wali Kelas

Membantu Kepala Sekolah dalam kegiatan: 1. Pengelolaan kelas.


(46)

2. Penyelenggaraan administrasi kelas. 3. Pembuatan catatan khusus tentang siswa. 4. Penyusunan statistik bulanan siswa. 5. Penyusunan nilai siswa.

3.3.5 Guru Pembimbing dan Konseling.

Bertugas membantu Kepala Sekolah dalam penyusunan dan pelaksanaan pembimbingan dan konseling di sekolah.

3.3.6 Pustakawan Sekolah

Bertugas membantu Kepala Sekolah dalam kegiatan: 1. Perencanaan pengenalan buku-buku.

2. Pengurusan pelayanan perpustakaaan. 3. Perencanaan pengembangan perpustakaan.

4. Menyusun laporan pelaksanaan kegiatan perpustakaan secara berkala.

3.3.7 Pengelola Laboratorium

Bertugas membantu Kepala Sekolah dalam kegiatan-kegiatan sebagai berikut: 1. Perencanaan dan pengadaan alat laboratorium.

2. Menyusun jadwal laboratorium.


(47)

3.3.8 Kepala Tata Usaha

Kepala Tata Usaha mempunyai tugas melaksanakan ketatausahaan sekolah dan bertanggung jawab kepada Kepala Sekolah dalam kegiatan-kegiatan sebagai berikut: 1. Penyusunan program kerja tata usaha sekolah.

2. Pengolahan keuangan sekolah.

3. Penyusunan administrasi perlengkapan sekolah.

4. Penyusunan laporan pelaksanaan kegiatan pengurusan ketatausahaan secara umum.

3.4 Visi dan Misi 3.4.1 Visi Sekolah

Islam unggul dan terpercaya membina imtak dan imtek untuk mencapai rahmatan lilalamin.

3.4.2 Misi Sekolah

1. Menyelenggarakan pendidikan untuk membentuk siswa-siswi yang beriman, berilmu, bertaqwa, berakhlak mulia dan berdaya guna untuk masyarakat dan abngsa, sesuai dengan nilai metode dan tujuan islam.

2. Melaksanakan pembinaan penyelenggaraan, melengkapi sarana prasarana, menjalin kerjasama denagan berbagai elemen masyarakat untuk mendukung pendidikan.


(48)

3. Meningkatakan kualitas pendidikan dan pembelajaran melalui pengembanagn kurikulum, metode, media, evaluasi sumber dan sarana pembelajaran.

4. Memfasilitasi dan meningkatkan mutu pelaksanaan pratikum mahasiswa Fakultas Tarbiyah IAIAN SU Medan.


(49)

BAB 4

PERANCANGAN SISTEM

4.1 Perencanaan dan Perancangan

Dalam membangun sebuah website diperlukan sebuah persiapan, perencanaan yang baik, tujuan pembutan yang jelas dan percobaan yang lakukan secara berulang-ulang karena hal ini menyangkut semua elemen yang membentuk website.

Sebelum membangun website, akan muncul beberapa pertanyaan seperti berikut ini:

a. Website apa yang akan dibuat?

b. Siapa saja pengunjung yang diharapkan berkunjung ke website tersebut? c. Kegiatan apa saja yang dapat pengunjung lakukan didalam website tersebut? d. Apa target yang ingin dicapai dari pembuatan website tersebut?

Dengan menjawab pertanyaan-pertanyaan di atas, maka akan semakin memperjelas dan mempermudah dalam membangun website karena dari sanalah nantinya akan terbentuk fokus dalam membuat dan mengembangkan website tersebut lebih lanjut.

Sesuai dengan website yang akan dibuat, maka jawaban untuk pertanyaan-pertanyaan di atas sebagai berikut:


(50)

a. Website yang akan dibuat adalah website Madrasah Aliyah Laboraturium yang menyediakan segala informasi-informasi mengenai sekolah tersebut, artikel mengenai pendidikan dan tempat yang akan mengumpulkan seluruh alumninya. b. Pengunjung dari website tersebut diharapkan adalah siswa siswi, guru, pegawai

dan alumni dari Madrasah Aliyah Laboraturium serta masyarakat luas yang ingin tahu mengenai segala sesuatu tentang sekolah ini.

c. Aktivitas yang akan dijumpai di dalam website tersebut adalah pengunjung dapat mengetahui segala informasi mengenai Madrasah Aliyah Laboraturium, membaca artikel yang dikirimkan oleh pengunjung lain, dan bagi alumni dapat mencari teman-temannya semasa sekolah dulu.

d. Target yang ingin dicapai dari website tersebut adalah pengunjung mendapatkan segala informasi tentang Madrasah Aliyah Laboraturium dan para alumni dapat mengetahui mengenai teman-temannya.

Langkah selanjutnya adalah membuat garis besar dari website tersebut. Salah satu cara yang dapat digunakan adalah dengan membuat aliran informasi website tersebut. Aliran Informasi merupakan gambaran yang menampilkan struktur, hierarki dan isi halaman per halaman.

Dengan adanya aliran Informasi ini , akan membantu dalam menggambarkan isi dari setiap halaman dan link atau navigasi antara halaman-halaman didalam


(51)

website tersebut. Di samping itu, juga dapat mempermudah dalam mengatur kode dan file HTML-nya, terutama link untuk navigasi penjelajahan ke seluruh halaman web. Secara sederhana aliran Informasi dalam membangun website ini dapat dilihat pada gambar di bawah ini:

Gambar 4.1 Aliran Informasi rancanganwebsite

Pada gambar 4.1, aliran informasinya masih sangatlah sederhana karena di setiap cabang aliran informasi masih terdapat cabang-cabang lagi bergantung pada seberapa kompleks dan seberapa banyak halaman yang akan dibuat. Misalnya pada halaman Login dibagi lagi ke Halaman Admin dan Halaman User , maka harus dibuat dua cabang lagi. Seperti pada Gambar 4.2.

Login Index


(52)

Gambar 4.2 Percabangan Dalam Aliran Informasi

4.2 MendesainLayout/Header

Salah satu faktor agar website banyak dikunjungi para pengunjung adalah desain

layout yang bagus. Desain Layout dibentuk oleh gambar-gambar dan teks-teks yang menarik. Adapun langkah-langkah yang penulis lakukan dalam mendesain layout

adalah sebagai berikut:

a. Membuat dokumen baru dengan ukuran panjang 700 pixel dan lebar 300 pixel. Kemudian mengisi warnabackgrounddengan warna biru (#048FFD).

b. Membuat layer baru dan mengisinya dengan ellipse tool (#000000) dan kemudian memberikan gradient fill tool dengan warna biru(#048FFD) pada foreground colordan warna putih(#FFFFFF) padabackground color.

Login

HalamanAdmin


(53)

c. Dengan memanfaatkan tool-tool yang ada di Photoshop seperti rectangular marquee tool, gradient fill tool,dan text tooldan dengan kreasi penulis, dibentuk suatulayout/headerseperti gambar berikut ini:

Gambar 4.3Layout/Header WebsiteYang Dibentuk DenganPhotoshop

4.3 Pemotongan GrafikWeb

Pemotongan (slice) grafik adalah suatu proses memotong suatu grafik menjadi bagian-bagian kecil. Slice merupakan suatu teknik yang sering digunakan oleh seorang web designeruntuk mempercepat akses loading situs yang dibuat.

Suatu browser tidak membaca keseluruhan grafik terlebih dahulu lalu menampilkannya tetapi browser akan membaca potongan kecil grafik yang telah dibuat lalu langsung menampilkannya. Dengan memanfaatkan teknik ini dapat mempercepat prosesloadingdalam menampilkan halamanweb.

Pemotongan grafik ini dapat dilakukan diPhotoshopatau menggunakan Image Readyyang sudah terinstal secara otomatis ketika menginstalPhotoshop. Adapun tool

yang digunakan adalah slice tool dan slice select tool. Hasil dari prosesnya dapat dilihat pada gambar di bawah ini:


(54)

Gambar 4.4 Pemotongan (Slice) PadaLayout/Header Web

4.4 MempersiapkanDatabase Server

Pada tahapan ini dipersiapkan tempat untuk menampung data diserver, data tersebut nantinya akan diproses oleh program yang kita buat pada tahap pemrograman, baik penambahan, pengeditan, panghapusan dan menampilkan isi database ke halaman

website.Database terdiri atas tabel-tabel yang dibuat dengan menggunakan program

MySQL.

Adapundatabase yang dibuat oleh penulis adalah databaseMadrasah Aliyah LAboraturium dengan tabel-tabel sebagai berikut:


(55)

a. Tabel anggota terdiri dari:

Field Jenis

No Int(11)

Username Varchar(20) Password Varchar(10)

Level char(1)

Nama Varchar(45)

Ttglahir Varchar(50)

Alamat Text

Phone Varchar(15) Pekerjaan Varchar(30) Email Varchar(25) Tabel 4.1 Tabel Anggota b. Tabel artikel terdiri dari:

Field Jenis

No int(11)

Judul char(100) Nama char(100) Tanggal char(50) Isi_artikel Text

4.2 Tabel Artikel c. Tabel guru terdiri dari:

Field Jenis

No Int(11)

Nama_guru varchar(30) Nip Varchar(10)

Gol Varchar(6)

Bid_studi Varchar(25) Alamat Text

Phone Varchar(15) 4.3 Tabel Guru


(56)

d. Tabel alumni terdiri dari:

Field Jenis

No int(11)

Nama varchar(25) Ttglahir varchar(40) Alamat Text

Phone Varchar(15) Kota Varchar(30) Tamat Varchar(20) Pekerjaan Varchar(30) Email Varchar(15)

4.4 Tabel Alumni

4.5 Membangun HalamanWebsite

Adapun halaman-halaman yang dibangun oleh penulis adalah:

a. Halaman index.php, merupakan halaman yang pertama kali muncul pada saat website dibuka. Halaman ini berisikan artikel dan link-link menuju halaman berikutnya.

b. Halaman profil.php, inventory.php, tarteb.php, visi.php dan fasilitas.php, merupakan halaman yang memberikan informasi mengenai profil, inventory, tata tertib sekolah, visi dan misi dan fasilitas dari Madrasah Aliyah Laboraturium. c. Halaman staff.php, merupakan halaman yang berisikan tentang data guru dan


(57)

d. Halaman artikel.php, merupakan halaman dimana user dapat menuliskan artikel tentang pendidikan. Untuk dapat mengakses halaman ini user harus login terlebih dahulu pada halaman login.php.

e. Halaman alumni.php, merupakan halaman yang diperuntukan bagi alumni Madrasah Aliyah Laboraturium. Pada halaman ini para alumni yang sedang membuka website ini dapat mengisi biodata dan dapat melihat alumni lain yang telah mendaftar.

f. Halaman daftar.php, merupakan halaman ynag digunakan untuk mendaftar sebagai anggota di website ini. Dengan mendaftar di website ini user dapat menulis artikel. g. Halaman admin.php, merupakan halaman yang hanya dapat diakses oleh admin untuk melakukan pengaturan seperti menghapus atau mengubah artikel, alumni dan anggota serta menambah data guru baru.

Tahap-tahap yang dilakukan penulis dalam membangun halaman website adalah sebagai berikut:

1. Membuka Macromedia Dreamweaver MX 2004 sebagai software pengatur letak

layout dan penulisan skrip-skrip PHP dalam membangun halaman. Tampilannya dapat dilihat seperti gambar berikut ini:


(58)

Gambar 4.5 TampilanMacromedia Dreamweaver MX 2004

2. Mengatur letaklayout dengan memanfaatkantool dan perintah yang terdapat pada

Macromedia Dreamweaver yaitu dengan meletakkan link-link, grafik, isi berita dan modul-modul lainnya di tempat yang telah ditentukan.

3. Menulis dan meletakkan skrip-skripPHPdanHTMLyang diperlukan pada tempat yang sesuai yang dikerjakan di jendelaCodepadaMacromedia Dreamweaver. 4. Menulis skripCSSuntuk memperindah tampilan situs.


(59)

BAB 5

IMPLEMENTASI SISTEM

5.1 Pengertian Implementasi Sistem

Implementasi sistem adalah prosedur-prosedur yang dilakukan dalam menyelesaikan desain sistem yang telah disetujui seperti menginstall sistem, menguji sistem yang dibuat dan memulai sistem baru atau sistem yang diperbaiki.

5.2 Tujuan Implementasi Sistem

Adapun tujuan dari implementasi sistem ini adalah sebagai berikut: 1. Menyelesaikan desain sistem yang telah disetujui sebelumnya.

2. Memastikan bahwa pemakai(user)dapat mengoperasikan sistem baru 3. Menguji apakah sistem baru tersebut sesuai dengan pemakai (user).

4. Memastikan bahwa konversi ke sistem baru berjalan yaitu dengan membuat rencana, mengontrol dan melakukan instalasi baru secara benar.


(60)

Spesifikasi sistem untuk yang dianjurkan penulis untuk membuat dan menjalankan aplikasiwebini di komputer lokal adalah sebagai berikut:

1. Komputer denganprocessor Intel Pentium3 667MHzatau setara. 2. MemoriRAM128MBatau lebih.

3. KapasitasHardiskminimal 10GB.

4. Microsoft Windows2000service pack4 atauXP Home. 5. Microsoft Windows XP Professional(lebih disarankan).

5.4 InstalasiApache, PHP dan MySQL

Dalam menginstalasi Apache, PHP dan MySQL dilakukan secara satu per satu. Adapunsoftwarenya dapat diperoleh dari situs http://www.apache.org untukApache, http://www.php.net untuk PHP dan http://www.mysql.com untuk MySQL. Tahap instalasinya dimulai dengan menginstalasi Apache, kemudian disusul dengan menginstalasi PHP dan MySQL. Setelah instalasi selesai dilanjutkan dengan melakukan pengaturan konfigurasi yang diberikan setelah instalasi selesai. Namun hal ini memerlukan pengaturan yang sedikit rumit.

5.4.1 MengkonfigurasiApache, MySQL,danPHP


(61)

2. Buka file php.ini di folder C:\WINDOWS dengan menggunakan notepad dan lakukan beberapa perubahan.

3. Mengatur MySQL dengan caraKlik Start > Programs > MySQL > MySQL Server 5.0 > MySQL Instance Config Wizard.

4. PilihStandard Configuration, KlikNextsampai keSecurity Options.

5. Konfigurasi Apache 2.0, MySQL 5.0 dan PHP 5.1.2 telah berhasil dan dapat dipergunakan.

5.4.2. MenjalankanApache, MySQL,danPHP

Untuk Menjalankan ketiga software yang digunakan dapat dilakukan dengan cara sebagai berikut:

1. Untuk menjalankan Apache, Klik Start > Programs > Apache HTTP Server 5.0.55 > Control Apache Server > Monitor Apache Servers.

2. Kemudian untuk melihat Apache telah ter-install dengan baik, tuliskan http://localhost/ di URL. Jika telah berhasil akan terlihat seperti gambar berikut ini:


(62)

Gambar 5.1 Uji Apache

3. Uji apakah PHP telah dapat dijalankan dengan cara tuliskan script berikut pada notepad :

<?php phpinfo(); ?>

Simpan dengan namainfo.phpdan letakkan difolder htdocspadaApache.

4. Buka internet explorer dan tulis http://localhost/info.php di URL address. Jika berhasil akan tampil sebagai berikut:


(63)

Gambar 5.2 Uji PHP

5. Uji apakah MySQLtelah dapat dijalankan dengan cara jalankan command prompt

dan ketikan seperti gambar berikut:

Gambar 5.3 Uji MySQL 6. MakaApache, MySQLdanPHPtelah dijalankan.


(64)

5.5. PengujianWebsitediBrowser

Setelah selesai mengerjakan semua halaman website yang dibuat, maka website

tersebut harus di uji terlebih dahulu dibrowsersebelum di-uploaddi internet. Adapun cara mengujiwebsitedibrowsersebagai berikut:

1. Simpan website yang telah dibuat pada folder htdocs yang terdapat pada apache dalam folder tersendiri, misalnya C:\Program Files\Apache Group\Apache2\htdocs\MAL IAIN.

2. Buka internet explorer kemudian ketikan http://localhost/MAL_IAIN/index.php pada URL. Jika berhasil akan tampil seperti berikut ini:


(65)

5.6. MelakukanUpload FiledanDatabase

Untuk meng-upload file dan database diperlukan sebuah server hosting atau yang lebih dikenal denganweb hosting. Ada dua jenis web hostingyaituweb hosting yang gratis dan web hosting yang berbayar. Untuk menggunakan web hosting gratis diharuskan mendaftar terlebih dahulu pada penyedia web hosting tersebut. Setelah mendaftar akan diperoleh nama domain, Misalnya: mendaftar pada situs http://www.tripod.lycos.co.uk/ maka akan diperoleh nama domain dengan nama http://www.geocities.com/ username_anda .

5.6.1 ProsesUpload File

Setelah memperoleh domain, maka langkah selanjutnya adalah meng-upload file dan

database websiteyang dibuat keweb hostingtersebut. Ada dua cara meng-upload file

yang dapat digunakan yaitu:

1. Menggunakan fasilitas yang disediakan olehweb hosting tersebut. Misalnya: pada http://www.tripod.lycos.co.uk/ menggunakan WebFTP. Caranya yaitu pilih menu WebFTP yang terdapat pada halaman account situs ini. Kemudian pilih tiap file

yang akan di-uploaddengan mengklik tombolBrowse, lalu klik tombolUpload.


(66)

5.6.2. ProsesUpload Database

Database adalah tempat menampung data dalam bentuk tabel-tabel yang nantinya akan diakses/diproses oleh script PHP dan disajikan sesuai dengan keinginan user. Untuk meng-upload database diperlukan web hosting yang mendukung PHP karena biasanya web hosting tersebut menyediakan tool PHPMyAdmin untuk memudahkan pelanggan dalam meng-upload databasenya. Sebaiknya databse dikonversi terlebih dahulu sebelum di-upload ke dalam bentuk teks (dump) agar memudahkan dalam proses upload-nya.


(67)

BAB 6

KESIMPULAN DAN SARAN

6.1. Kesimpulan

Dalam penulisan Tugas Akhir ini telah diuraikan bagaimana perancangan sistem dalam pembangunan website MA Laboraturium IAIN SU Medan. Maka dapat penulis simpulkan :

1. Macromedia Dreamweaver adalah sebuah editor HTML profesional untuk mendesain secara visual dan mengelola situs Web maupaun halaman Web

2. Website merupakan sarana informasionlineyang dapat diakses oleh siapapun. 3. Dalam membangun sebuahwebsitetidak harus terhubung denganinternet.Internet

diperlukan pada saatupload filedan pengaksesan website.

4. Layout/header yang bagus dan menarik dapat menambah daya tarik website

sehingga banyak dikunjungi para pengunjung.

5. website yang baik adalah website yang selalu meng-update informasinya dengan segala yang baru.


(68)

6.2. Saran

1. Senantiasa menjaga dan memperbaharuiwebsiteagar pengunjung tidak merasa bosan dan mendapatkan informasi-informasi yangup-to-date.

2. Pemeliharaan keamanan terhadap data-data padaserverperlu diperhatikan dan dijaga agar data-data pada server tidak bisa diakses oleh orang yang tidak berhak mengaksesnya.


(69)

DAFTAR PUSTAKA

Bambang, P, Mahardika,I, dan Djalle, Z. G. 2004. Flash MX: 3 in 1. Bandung: Informatika Bandung.

Hakim, L, dan Musalini, U. 2004. Cara Cerdas Menguasai Layout, Desain dan Aplikasi Web. Jakarta: PT Elex Media Komputindo.

Hakim, L, dan Musalini, U. 2004. Cara Mudah Memadukan Web Design dan Web Programming.Jakarta: PT Elex Media Komputindo.

http://id.wikipedia.org/wiki/HTML. Diakses tanggal 29 April 2006

http://id.wikipedia.org/wiki/Internet. Diakses tanggal 29 April 2006

http://id.wikipedia.org/wiki/MYSQL. Diakses tanggal 29 April 2006

http://id.wikipedia.org/wiki/PHP. Diakses tanggal 29 April, 2006.

http://siryogi.blogspot.com/2005/11/membuat-web-dinamis.html. Diakses tanggal 8 Juni 2006


(70)

LAMPIRAN A: OUTPUT PROGRAM


(71)

(72)

(73)

(74)

(75)

(76)

(77)

(78)

(79)

(80)

LAMPIRAN B: LISTING PROGRAM File index.php:

<?php

include 'koneksi_db.php'; ?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html> <head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title> SMUN 17 MEDAN</title>

<style type="text/css">

<!--.style1 {

font-family: Geneva, Arial, Helvetica, sans-serif; font-weight: bold; } body { background-color: #0099FF; } a:link { text-decoration: none; } a:visited { text-decoration: none; color: #FFFFFF; } a:hover { text-decoration: underline; color: #FFFFFF; } a:active { text-decoration: none; color: #FFFFFF; }

.style5 {font-family: "King Arthur Special"; font-weight: bold; } .style9 {font-size: 14px}

.style10 {font-size: 16px}

.style13 {font-size: 16; font-weight: bold; } a {

font-family: Arial, Helvetica, sans-serif; font-size: 14px;

color: #FFFFFF; }


(81)

.style14 {font-family: "Times New Roman", Times, serif} .style15 {color: #FFFF00}

.style16 {font-family: Arial, Helvetica, sans-serif} -->

</style> </head> <body>

<table width="750" border="0" align="center" cellpadding="0" cellspacing="0"> <tr>

<td height="25" colspan="2" class="style13"><img src="image/index_01.gif" width="105" height="83"></td>

<td height="25" class="style13"><img src="image/index_02.gif" width="145" height="83"></td>

<td height="25" class="style13"><img src="image/index_03.gif" width="237" height="83"></td>

<td height="25" class="style13"><img src="image/index_04.gif" width="134" height="83"></td>

<td height="25" colspan="2" class="style13"><img src="image/index_05.gif" width="129" height="83"></td>

</tr> <tr>

<td height="25" colspan="2" class="style13"><img src="image/index_06.gif" width="105" height="84"></td>

<td width="145" class="style13"><img src="image/index_07.gif" width="145" height="84"></td>

<td width="237" class="style13"><img src="image/index_08.gif" width="237" height="84"></td>

<td width="134" class="style13"><img src="image/index_09.gif" width="134" height="84"></td>

<td colspan="2" class="style13"><img src="image/index_10.gif" width="129" height="84"></td>

</tr> <tr>

<td width="7" height="25" class="style13"><img src="image/index_11.gif" width="7" height="33"></td>

<td width="98" background="image/index_12.gif" class="style9"><a href="profil.php" target="_self" class="froozy

"><strong>:.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;PROFIL </strong></a></td> <td background="image/index_13.gif" class="style13"><a href="staff.php" target="_self" class="froozy "><strong>STAFF &amp;

PENGAJAR</strong></a></td>

<td class="style13"><img src="image/index_14.gif" width="237" height="33"></td>

<td background="image/index_15.gif" class="style11"><span class="style13"><a href="artikel.php" target="_self"

class="froozy"><strong>:.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ARTIKEL</strong></a></span></td>


(82)

<td width="125" background="image/index_16.gif"><a href="alumni.php" target="_self" class="froozy style11 style14"><strong>:<span

class="style16">.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;A LUMNI </span></strong></a></td>

<td width="4"><img src="image/index_17.gif" width="10" height="33"></td> </tr>

</table>

<table width="750" height="28" border="1" align="center" cellpadding="0" cellspacing="0">

<tr bgcolor="#0099FF">

<td height="26" align="center" valign="middle"><span class="style7"> <span class="style3"> <span class="style15"> <span class="style16">

<marquee scrollamount="5" scrolldelay="100">

<strong> :. Selamat Datang Di Situs MA Laboraturium IAIN Medan.: </strong>

</marquee>

</span> </span> </span> </span></td> </tr>

</table>

<table width="750" align="center" cellpadding="0" cellspacing="0"> <tr>

<td width="236" background="image/bar1.jpg" class="style1">LINKS</td> <td width="512" background="image/bar2.jpg" class="style1">SELAMAT DATANG</td>

</tr> </table>

<table width="750" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#000000">

<tr>

<td width="232" height="139" align="left" valign="top" bordercolor="#000000" background="image/back2.jpg" bgcolor="#CCCCCC">

<ul type="square" class="style14">

<li><span class="style9"><span class="style10"><span class="style13"><a href="fasilitas.php">Fasilitas</a></span></span></span></li>

<li class="style13"><a href="tarteb.php">Tata Tertib Sekolah</a></li> <li><span class="style13"><a href="inventory.php">Inventory

Sekolah</a></span></li>

<li><a href="visi.php"><strong>Visi dan Misi Sekolah</strong></a> </li> <li><a href="login.php"><strong>login</strong></a> </li>

</ul></td>

<td width="512" rowspan="3" align="left" valign="top" background="image/back1.jpg" bgcolor="#FFFFFF">

<p align=right><?php include "date.php"; ?></p>

<div align="center"><span class="style5">Selamat Datang di Website Resmi<br>

MA. Laboraturium IAIN SU Medan </span><br> </div>

<p align="center"><img src="image/gambar.jpg" width="400" height="300"></p></td>


(83)

</tr>

<tr align="left" valign="top">

<td background="image/bar1.jpg" class="style1">ARTIKEL</td> </tr>

<tr align="left" valign="top">

<td height="337" background="image/back2.jpg" bgcolor="#00FFFF">&nbsp; <?php include "tampilartikel.php"; ?>

</td> </tr>

<tr align="left" valign="top" bgcolor="#FFFFFF" >

<td colspan="2" background="image/bawah.jpg"><div align="center"

class="style1">Copyright&copy;MA. Laboraturium IAIN Medan. All Right Reserved </div></td> </tr> </table> <br> <br> </body> </html> File profil.php:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html> <head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>PROFIL SMUN 17 MEDAN</title>

<style type="text/css">

<!--.style1 {

font-family: Geneva, Arial, Helvetica, sans-serif; font-weight: bold; } body { background-color: #0099FF; } a:link { text-decoration: none; } a:visited { text-decoration: none; color: #FFFFFF; } a:hover {


(84)

text-decoration: underline; color: #FFFFFF; } a:active { text-decoration: none; color: #FFFFFF; }

.style10 {font-size: 16px}

.style13 {font-size: 16; font-weight: bold; } .style9 {font-size: 14px}

.style14 {color: #FFFF00}

.style15 {font-family: Arial, Helvetica, sans-serif} a {

font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #FFFFFF; font-weight: bold; } --> </style> </head> <body>

<table width="750" border="0" align="center" cellpadding="0" cellspacing="0"> <tr>

<td height="25" colspan="2" class="style13"><img src="image/index_01.gif" width="105" height="83"></td>

<td height="25" class="style13"><img src="image/index_02.gif" width="145" height="83"></td>

<td height="25" class="style13"><img src="image/index_03.gif" width="237" height="83"></td>

<td height="25" class="style13"><img src="image/index_04.gif" width="134" height="83"></td>

<td height="25" colspan="2" class="style13"><img src="image/index_05.gif" width="129" height="83"></td>

</tr> <tr>

<td height="25" colspan="2" class="style13"><img src="image/index_06.gif" width="105" height="84"></td>

<td width="145" class="style13"><img src="image/index_07.gif" width="145" height="84"></td>

<td width="237" class="style13"><img src="image/index_08.gif" width="237" height="84"></td>

<td width="134" class="style13"><img src="image/index_09.gif" width="134" height="84"></td>

<td colspan="2" class="style13"><img src="image/index_10.gif" width="129" height="84"></td>

</tr> <tr>


(1)

font-size: 14px; color: #FFFFFF; font-weight: bold; }

.style26 {font-size: 16} .style28 {font-size: 18px}

.style30 {font-family: Geneva, Arial, Helvetica, sans-serif}

.style31 {font-family: Georgia, "Times New Roman", Times, serif} -->

</style> </head> <body>

<table width="750" border="0" align="center" cellpadding="0" cellspacing="0"> <tr>

<td height="25" colspan="2" class="style13"><img src="image/index_01.gif" width="105" height="83"></td>

<td height="25" class="style13"><img src="image/index_02.gif" width="145" height="83"></td>

<td height="25" class="style13"><img src="image/index_03.gif" width="237" height="83"></td>

<td height="25" class="style13"><img src="image/index_04.gif" width="134" height="83"></td>

<td height="25" colspan="2" class="style13"><img src="image/index_05.gif" width="129" height="83"></td>

</tr> <tr>

<td height="25" colspan="2" class="style13"><img src="image/index_06.gif" width="105" height="84"></td>

<td width="145" class="style13"><img src="image/index_07.gif" width="145" height="84"></td>

<td width="237" class="style13"><img src="image/index_08.gif" width="237" height="84"></td>

<td width="134" class="style13"><img src="image/index_09.gif" width="134" height="84"></td>

<td colspan="2" class="style13"><img src="image/index_10.gif" width="129" height="84"></td>

</tr> <tr>

<td width="7" height="25" class="style13"><img src="image/index_11.gif" width="7" height="33"></td>

<td width="98" background="image/index_12.gif" class="style9"><a href="profil.php" target="_self" class="froozy

"><strong>:.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;PROFIL </strong></a></td> <td background="image/index_13.gif" class="style13"><a href="staff.php" target="_self" class="froozy "><strong>STAFF &amp;

PENGAJAR</strong></a></td>

<td class="style13"><img src="image/index_14.gif" width="237" height="33"></td>


(2)

<td background="image/index_15.gif" class="style11"><span class="style13"><a href="artikel.php" target="_self"

class="froozy"><strong>:.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ARTIKEL</strong></a></span></td>

<td width="125" background="image/index_16.gif"><a href="alumni.php" target="_self" class="froozy style11

style14"><strong>:.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ALUMNI </strong></a></td>

<td width="4"><img src="image/index_17.gif" width="10" height="33"></td> </tr>

</table>

<table width="750" height="28" border="1" align="center" cellpadding="0" cellspacing="0">

<tr bgcolor="#0099FF">

<td height="26" align="center" valign="middle"><span class="style7"> <span class="style3"> <span class="style15"> <span class="style16"> <span

class="style15"> <span class="style16">

<marquee scrollamount="5" scrolldelay="100">

<strong> :. Selamat Datang Di Situs MA. Laboratorium IAIN Medan .: </strong>

</marquee>

</span> </span> </span> </span> </span> </span></td> </tr>

</table>

<table width="750" align="center" cellpadding="0" cellspacing="0"> <tr>

<td width="236" background="image/bar1.jpg" class="style1">KEGIATAN</td> <td width="512" background="image/bar2.jpg" class="style1">VISI DAN MISI </td>

</tr> </table>

<table width="750" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#000000">

<tr>

<td width="232" height="139" align="left" valign="top" bordercolor="#000000" background="image/back2.jpg" bgcolor="#CCCCCC"><span class="style1"></span>

<ul type="square" class="style14">

<li><span class="style4"><span class="style10"><span class="style13"><a href="fasilitas.php">Fasilitas</a></span></span></span></li>

<li class="style13"><a href="tarteb.php">Tata Tertib Sekolah</a></li> <li><span class="style13"><a href="inventory.php">Inventory

Sekolah</a></span></li>

<li><strong><a href="visi.php">Visi dan Misi Sekolah</a> </strong></li> <li><a href="login.php"><strong>login</strong></a> </li> </ul>

<br></td>

<td width="512" rowspan="3" align="left" valign="top" background="image/back1.jpg" bgcolor="#FFFFFF">


(3)

<div align="center"> <p align="center">

<strong><span class="style4"><span class="style26"><span class="style28">VISI DAN MISI MAL IAIN SU

MEDAN</span></span></span></strong></p> <p align="center">.</p>

<p align="left"><strong> &nbsp;<u>VISI SEKOLAH</u> </strong></p> <p align="justify" class="style30">&nbsp;Islam unggul dan terpercaya membina imtak dan imtek untuk mencapai rahmatan lilalamin.</p>

<p align="justify" class="style30">.</p>

<p align="justify" class="style14"><strong>&nbsp;<U>MISI SEKOLAH </U></strong></p>

<ol class="style30"> <li>

<div align="justify">Menyelenggarakan pendidikan untuk membentuk siswa-siswi yang beriman, berilmu, bertaqwa, berakhlak mulia dan berdaya guna untuk masyarakat dan abngsa, sesuai dengan nilai metode dan tujuan islam.<br>

</div> </li> <li>

<div align="justify">Melaksanakan pembinaan penyelenggaraan, melengkapi sarana prasarana, menjalin kerjasama denagan berbagai elemen masyarakat untuk mendukung pendidikan.</div>

</li> <li>

<div align="justify">Meningkatakan kualitas pendidikan dan pembelajaran melalui pengembanagn kurikulum, metode, media, evaluasi sumber dan sarana pembelajaran.</div>

</li> </ol>

<p align="justify" class="style14">.</p> <p align="left"><strong><br>

</strong></p>

<p align="right"><span class="style1"><strong><a href="index.php"><font color=red>&lt;&lt;BACK</font></a></strong></span><strong><a

href="profil.php"><br> </a></strong></p> </div></td>

</tr>

<tr align="left" valign="top">

<td background="image/bar1.jpg" class="style1">ARTIKEL</td> </tr>

<tr align="left" valign="top">

<td height="337" background="image/back2.jpg" bgcolor="#00FFFF">&nbsp; <? include "tampilartikel.php"; ?>

</td> </tr>


(4)

<td colspan="2" background="image/bawah.jpg"><div align="center"

class="style1">Copyright&copy;MA. Laboraturium IAIN SU. All Right Reserved </div></td>

</tr> </table> <br> <br> </body> </html>


(5)

DEPARTEMEN PENDIDIKAN NASIONAL

UNIVERSITAS SUMATERA UTARA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM (FMIPA) JL. BIOTEKNOLOGI NO. 1 KAMPUS USU Telp. (061) 8214290s

MEDAN 20155, EMAIL :Dekanat@FMIPA.USU.AC.ID

KARTU BIMBINGAN TUGAS AKHIR MAHASISWA

Nama Mahasiswa

: Anika Wafi Lubis

Nomor Stambuk

: 072406038

Judul Tugas Akhir

: Desain web Dinamis Menggunakan

Dreamwever MX Pada Madrasah

Aliyah Laboraturium Sumatera

Utara

Dosen Pembimbing 1

: Dr. Tulus, M.Si

Tanggal Mulai Bimbingan

:

Tanggal Selesai Bimbingan :

No TANGGALASSISTEN

BIMBINGAN

PEMBAHASAN PADA ASSISTEN MENGENAI

PADA BAB

PARAF DOSEN

PEMBIMBING KETERANGAN

Kartu ini harap dikembalikan kejurusan Matematika

Bila Bimbingan Mahasiswa telah Selesai.

Diketahui

Disetujui

Ketua jurusan Matematika

Pembimbing Utama/

Penaggung Jawab


(6)

Dr. Saib Suwilo, M.Sc.

Dr. Tulus, M.Si