Perancangan Sistem Informasi SMA Negeri 5 Medan Berbasis Web

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

PERANCANGAN SISTEM INFORMASI SMA NEGERI 5 MEDAN

BERBASIS WEB

TUGAS AKHIR

ADE YULIA SARI

062406117

DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SUMATERA UTARA

MEDAN

2009

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

PERANCANGAN SISTEM INFORMASI SMA NEGERI 5 MEDAN BERBASIS WEB

TUGAS AKHIR

Diajukan untuk melengkapi tugas dan memenuhi syarat memperoleh Ahli Madya

ADE YULIA SARI 062406117

DEPARTEMEN MATEMATIKA

FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM UNIVERSITAS SUMATERA UTARA

MEDAN 2009

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

PERSETUJUAN

Judul : PERANCANGAN SISTEM INFORMASI SMA

NEGERI 5 MEDAN BERBASIS WEB

Kategori : TUGAS AKHIR

Nama : ADE YULIA SARI

Nomor Induk Mahasiswa : 062406117

Program Studi : D3 ILMU KOMPUTER

Departemen : MATEMATIKA

Fakultas : MATEMATIKA DAN ILMU PENGETAHUAN

ALAM (FMIPA) UNIVERSITAS SUMATERA UTARA

Diluluskan di

Medan, Juni 2009

Diketahui / Disetujui oleh

Departemen Matematika FMIPA USU

Ketua, Pembimbing

Dr. Saib Suwilo, M.Sc Dra. Normalina Napitupulu, M.Sc NIP 131796149 NIP 131831527

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

PERNYATAAN

PERANCANGAN SISTEM INFORMASI SMA NEGERI 5 MEDAN BERBASIS WEB

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 2009

ADE YULIA SARI 062406117

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

ABSTRAK

Perancangan Sistem Informasi SMA Negeri 5 Medan Berbasis Web ini bertujuan untuk mempermudah proses pencarian atau searching data dan informasi untuk seluruh siswa SMA Negeri 5 Medan yang mengalami kesulitan dalam memperoleh data mengenai aktivitas akademik di SMA Negeri 5 Medan tersebut. Fasilitas-fasilitas yang terdapat dalam aplikasi ini berupa penyediaan data dan informasi mengenai berita- berita terbaru, profil agenda kegiatan, dan data- data yang berguna untuk kelangsungan belajar siswa. Pada proses pembuatan aplikasi ini perangkat lunak yang digunakan adalah PHP ( terdiri dari Apache Server dan MySQL ) sebagai bahasa pemrograman dengan mengunakan PHP 5.0, Macromedia Dreamweaver 8 digunakan sebagai editor skrip, Adobe Photoshop CS2 sebagai editor grafis.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

DAFTAR ISI

Halaman

Persetujuan ii

Pernyataan iii

Penghargaan iv

Abstrak vii

Daftar Isi viii

Daftar Tabel xi

Daftar Gambar xiii

Bab 1 Pendahuluan 1

1.1 Latar Belakang 1

1.2 Identifikasi Masalah 2

1.3 Tujuan Masalah 3

1.4BatasanMasalah 4

1.5 Metode Penelitian 4

1.6 Tinjauan Pustaka 5

1.7SistematikaPenulisan 6

Bab 2 Landasan Teori 8

2.1 Pengertian Komputer 8

2.2 Pengertian Sistem 8

2.3 Pengertian Informasi 9

2.4 Pengertian Sistem Informasi 10

2.5 Syarat-Syarat Merancang Sistem Informasi Berbasis Web 10

2.6 Pengertian Internet 12

2.7PengertianWeb Server 15

2.8 HTML (Hypertext Markup Language) 15

2.8.1 Pendahuluan HTML 15

2.8.2 Bagian-Bagian HTML 16

2.9 Pengenalan PHP (Personal Home Page) 17

2.9.1 Sejarah PHP 17

2.9.2 Kelebihan dan Kelemahan PHP 18

2.9.3 Penggabungan Script PHP dan HTML 19

2.10 Pengenalan MySQL 21

2.11 Pengenalan CSS (Cascading Style Sheet) 23

2.12 Pengenalan Macromedia Dreamweaver 8 24

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Bab 3 Sekilas Tentang SMA Negeri 5 Medan 25

3.1 Profil SMA Negeri 5 Medan 25

3.2 Struktur Organisasi 26

3.3 Uraian Tugas dan Fungsi Organisasi 27

3.3.1 Kepala Sekolah 27

3.3.2 Wakil Kepala Sekolah 27

3.3.3 Tata Usaha 28

3.3.4 Komite Sekolah 28

3.3.5 Bidang Sarana dan Prasarana 28

3.3.6 Bidang Kurikulum 29

3.3.7 Bidang Kesiswaan 29

3.3.8 Bidang Humas (Hubungan Masyarakat) 29

3.3.9 Guru 30

3.3.10 Wali Kelas 30

3.3.11 Guru Pembimbing dan Konseling (BP / BK) 31

3.4 Visi dan Misi dan Motto Sekolah 31

3.4.1 Visi Sekolah 31

3.4.2 Misi Sekolah 31

3.4.3 Motto Sekolah 32

Bab 4 Perancangan Sistem 33

4.1 Perancangan Sistem 33

4.2 Perancangan Struktur Menu Utama 34

4.3 Perancangan Halaman Website 37

4.4 Perancangan User Interface 38

4.4.1 Perancangan Halaman Utama 39

4.4.2 Perancangan Halaman Admin 41

4.4.3 Perancangan Halaman Utama Siswa 43

4.4.2 Perancangan Halaman Utama Guru 45

4.5 Mempersiapkan Database 51

Bab 5 Implementasi Sistem 56

5.1 Pengertian Implementasi sistem 56

5.2 Tujuan Implementasi Sistem 56

5.3 Lingkungan Implementasi 57

5.4.1 Halaman Utama 58

5.4.2 Halaman Utama Tampil Guestbook 59

5.4.3 Halaman Utama News 59

5.4.4 Halaman Visi Misi 60

5.4.5 Halaman Profil 60

5.4.6 Halaman Utama Siswa 61

5.4.7 Halaman Absensi Siswa 61

5.4.8 Halaman Nilai Siswa 62

5.4.9 Halaman Jadwal Siswa 62

5.4.10 Halaman Profil Siswa 63

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

5.4.12 Halaman Absensi Guru 64

5.4.13 Halaman Jadwal Guru Mengajar 64

5.4.14 Halaman Profil Guru 65

5.4.15 HalamanUtama Admin 65

5.4.16 Halaman Data Kelas 66

5.4.17 Halaman Created 66

5.4.18 Halaman Edit Absensi Guru 67

5.4.19 Halaman Edit Berita 67

5.4.20 Halaman Input Data Jadwal 68

5.4.21 Halaman Input Data Guru 68

5.4.22 Halaman Input Data Nilai Siswa 69

5.5 Petunjuk Instalasi 69

Bab 6 Kesimpulan dan Saran 81

6.1 Kesimpul 81

6.2 Saran 82

Daftar Pustaka 83

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

DAFTAR TABEL

Halaman

Tabel 4.1 Penjelasan Perancangan Halaman Utama Website 39

Tabel 4.2 Algoritma Umum Halaman Utama Website 40

Tabel 4.3 Penjelasan Perancangan Halaman Admin 42

Tabel 4.4 Algoritma Halaman Utama Admin 42

Tabel 4.5 Penjelasan Perancangan Halaman Utama Siswa 43

Tabel 4.6 Algoritma Umum Halaman Utama Siswa 44

Tabel 4.7 Penjelasan Perancangan Halaman Utama Guru 45

Tabel 4.8 Algoritma Umum Halaman Utama Guru 46

Tabel 4.9 Algoritma Login Admin 47

Tabel 4.10 Algoritma Login Guru 47

Tabel 4.11 Algoritma Login Siswa 48

Tabel 4.12 Algoritma Pengolahan Jadwal 48

Tabel 4.13 Algoritma Pengolahan Absensi Siswa 49

Tabel 4.14 Algoritma Pengolahan Nilai Siswa 49

Tabel 4.15 Algoritma Pengolahan Absensi Guru 50

Tabel 4.16 Jajak 51

Tabel 4.17 Halaman Berita 51

Tabel 4.18 Siswa 52

Tabel 4.19 Absensi Siswa 52

Tabel 4.20 Absensi Guru 52

Tabel 4.21 Guru 53

Tabel 4.22 Mata Pelajaran 53

Tabel 4.23 Nilai 53

Tabel 4.24 Agenda 54

Tabel 4.25 Jadwal 54

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Tabel 4.27 Profil 54

Tabel 4.28 Semester 54

Tabel 4.29 User 55

Tabel 4.30 Buku Tamu 55

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

DAFTAR GAMBAR

Halaman Gambar 3.1 Struktur Organisasi SMA Negeri 5 Medan 26

Gambar 4.1 Struktur Menu Utama 35

Gambar 4.2 Perancangan Halaman Utama Website 39 Gambar 4.3 Perancangan Halaman Utama Admin 41 Gambar 4.4 Perancangan Halaman Utama Siswa 43 Gambar 4.5 Perancangan Halaman Utama Guru 45 Gambar 5.1 Halaman Utama 58

Gambar 5.2 Halaman Guestbook 59

Gambar 5.3 Halaman News 59

Gambar 5.4 Halaman Visi Misi 60

Gambar 5.5 Halaman Profil 60

Gambar 5.6 Halaman Utama Siswa 61

Gambar 5.7 Halaman Absensi Siswa 61

Gambar 5.8 Halaman Nilai Siswa 62

Gambar 5.9 Halaman Jadwal Siswa 62

Gambar 5.10 Halaman Profil Siswa 63

Gambar 5.11 Halaman Utama Guru 63

Gambar 5.12 Halaman Absensi Guru 64

Gambar 5.13 Halaman Jadwal Guru Mengajar 64

Gambar 5.14 Halaman Profil Guru 65

Gambar 5.15 Halaman Utama Admin 65

Gambar 51.6 Halaman Data Kelas 66

Gambar 5.17 Halaman Created 66

Gambar 5.18 Halaman Edit Absensi Siswa 67

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.20 Halaman Input Data Jadwal 68

Gambar 5.21 Halaman Input Data Guru 68

Gambar 5.22 Halaman Input Data Nilai 69

Gambar 5.23 Pemilihan Instalasi 70

Gambar 5.24 Instalasi Apche Sukses 71

Gambar 5.25 Test PHP 74

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

BAB 1

PENDAHULUAN

1.1 Latar Belakang

Dewasa ini perkembangan teknologi informasi dan teknologi komputer berkembang dengan sangat pesat. Kebutuhan tersebut semakin diminati oleh semua kalangan masyarakat, baik masyarakat awam maupun kaum intelektual. Hal ini berkaitan dengan kegiatan-kegiatan yang sering dilakukan manusia yang biasanya dilakukan secara manual dan tradisional, kini akan semakin lebih cepat dan tepat jika dilakukan dengan bantuan mesin yaitu teknologi komputer. Dengan pemanfaatan teknologi komputer tersebut juga dapat menghemat segala sesuatu, baik itu tenaga, waktu, maupun biaya, sehingga pengeluaran untuk itu dapat ditekan seminimal mungkin.

Sistem Informasi di SMA Negeri 5 Medan khususnya dalam beberapa bidang diantaranya penilaian, penjadwalan, dan absensi siswa masih menggunakan sistem manual, sehingga mempersulit dalam pencarian data. Hal tersebut dapat mengakibatkan berkurangnya kinerja SMA Negeri 5 Medan ini. Oleh sebab itu penulis tertarik membuat tugas akhir dengan judul ”Perancangan Sistem Informasi

SMA Negeri 5 Medan Berbasis Web” .

Perancangan Sistem Informasi SMA Negeri 5 Medan Berbasis Web ini berisi data dan informasi mengenai SMA Negeri 5 Medan yang terdiri dari data guru, data siswa, nilai, mata pelajaran, absensi, berita – berita mengenai kegiatan sekolah dan

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

mengenai perkembangan dunia pendidikan yang ada, serta jadwal pengajaran. Aplikasi ini dirancang oleh sistem operasi Windows XP SP2 yang didukung oleh software Web Server Apache, web scripting PHP dan MySQL sebagai Database server. Selain itu, aplikasi web ini juga didukung bahasa pemrograman web lainnya seperti HTML (Hypertext Markup Language), CSS (Cascading Style Sheets) serta menggunakan Website editor Macromedia Dreamweaver 8 sebagai aplikasi perancangan layout.

Administrator dalam aplikasi ini adalah anggota Tata Usaha yang diberi wewenang untuk mengatur jalannya aplikasi ini. Misalnya mengatur hak akses user. Pengguna / user yang kami maksud dalam aplikasi ini adalah siswa- siswi SMA Negeri 5 Medan yang diberi hak akses oleh administrator, hak akses yang diberikan oleh administrator adalah hanya untuk melihat data nilai, data jadwal, dan data absensi siswa- siswi tersebut. Sehingga dapat mendukung peningkatan produktifitas dan peningkatan kinerja SMA Negeri 5 Medan.

1.2 Identifikasi Masalah

Berdasarkan latar belakang di atas ada beberapa masalah yang melatar belakangi pembuatan aplikasi ini, diantaranya :

a. Pengelolaan data nilai, data jadwal, dan data absensi masih menggunakan sistem manual.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

b. Masih kurangnya prediksi data nilai, data jadwal, dan data absensi siswa yang dapat membantu dalam pengolahan data akademik secara cepat, akurat dan terpercaya.

c. Laporan data hasil penilaian, absensi siswa, dan jadwal mata pelajaran yang masih manual.

1.3 Tujuan Masalah

Ada beberapa tujuan yang ingin dicapai setelah dibuatnya aplikasi ini yaitu:

a. Pengelolaan data nilai, data jadwal, dan data absensi menjadi sistematis.

b. Memberikan pengolahan data akademik secara cepat, akurat, dan terpercaya.

c. Memberikan hasil Laporan data hasil penilaian, absensi siswa, dan jadwal mata pelajaran menjadi lebih cepat dalam penyampaian laporan kepada pihak Kepala Sekolah.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. Dalam merancang Sistem Informasi ini terdapat beberapa batasan,yaitu:

a. Aplikasi Sistem Akademik ini merupakan aplikasi yang cukup sederhana, sehingga tidak terlalu banyak fitur di dalamnya.

b. Aplikasi ini hanya mengatur data nilai siswa, data absensi, dan data penjadwalan.

c. Aplikasi ini hanya khusus digunakan oleh kalangan sekolah saja termasuk siswa- siswi.

1.5 Metode Penelitian

Metode penelitian yang digunakan dalam penelitian ini terdiri dari 2 macam, yaitu :

1. Studi Pustaka

Studi pustaka dilakukan dengan cara mempelajari teori-teori literature dan buku-buku yang berkaitan dengan Tugas Akhir penulis.

2. Studi Lapangan

a. Interview (wawancara)

Yaitu pengumpulan data dengan cara mengadakan wawancara secara langsung kepada pihak yang terkait.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. b. Observasi (pengamatan)

Yaitu teknik pengumpulan data secara langsung dilapangan sehingga memperoleh data yang lebih akurat dan keterangan yang cukup jelas.

1.6 Tinjauan Pustaka

Dalam pembuatan tugas akhir ini penulis mengunakan empat buku yang menjadi acuan dalam pembuatan tugas akhir, yaitu:

1. Peranginangin,Kasiman. 2006. Aplikasi Web dengan PHP dan MySQL.

Yogyakarta:Penerbit Andi.

Dimana dalam buku ini menjadi acuan dalam pembuatan program yang menggunakan bahasa script PHP dalam pengembangan Web pada dokumen HTML.

2. Jogiyanto. 2005. Analisis dan Desain. Yogyakarta: Penerbit Andi.

Buku ini menjadi tuntunan penulis dalam pembuatan sistem penulisan pada tugas akhir.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. Buku ini menjadi acuan penulis dalam pembuatan database.

4. Selain ketiga buku di atas, penulis juga menggunakan beberapa pendukung lainnya yang menjadi referensi dalam pembuatan tugas akhir ini.

1.7 Sistematika Penulisan

Sistematika penulisan tugas akhir ini terdiri dari :

BAB 1 PENDAHULUAN

Bab ini berisikan mengenai latar belakang masalah, identifikasi masalah, tujuan masalah, batasan masalah, metode penelitian, tinjauan pustaka, dan sistematika penulisan.

BAB 2 LANDASAN TEORI

Pada bab ini diuraikan teori yang mendukung perancangan aplikasi ini.

BAB 3 GAMBARAN SEKILAS SMA NEGERI 5 MEDAN

Bab ini berisikan tentang profil SMA Negeri 5 Medan, struktur organisasi SMA Negeri 5 Medan, uraian tugas dan fungsi organisasi, serta visi, misi dan motto SMA Negeri 5 Medan.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

BAB 4 PERANCANGAN SISTEM

Di dalam bab akan dijelaskan tentang penentuan bentuk dari kebutuhan aplikasi pada saat membangun maupun pada saat implementasi.

BAB 5 IMPLEMENTASI SISTEM

Bab ini menguraikan tentang definisi, tujuan, dan langkah-langkah dalam implementasi sistem juga disertai dengan komponen-komponen kebutuhan sistem.

BAB 6 KESIMPULAN DAN SARAN

Berisi pencapaian tujuan dari aplikasi yang dibuat. Saran berisi hal- hal yang dirasakan masih belum sempurna.

BAB 2

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

2.1 Pengertian Komputer

Kata komputer berasal dari bahasa Inggris yaitu “to compute” yang artinya menghitung. Bila ditinjau dari asal kata maka komputer adalah alat hitung atau mesin hitung. Tentu saja orang berpandangan komputer sama dengan kalkulator. Pandangan ini tentunya salah karena komputer bukanlah kalkulator.

Menurut buku Computer Today (Donald H.Sanders), ”Komputer adalah

sistem elektronik untuk memanipulasi data yang cepat dan tepat serta dirancang dan diorganisasikan supaya secara otomatis menerima dan menyimpan data input, memprosesnya dan menghasilkan output dibawah pengawasan suatu langkah instruksi-instruksi program yang tersimpan di memori”.

2.2 Pengertian Sistem

Fatansyah (Basis data 1999, hal 9), ”Sistem merupakan suatu tatanan yang terdiri atas

sejumlah komponen fungsional (dengan satuan fungsi atau tugas khusus) yang saling berhubungan secara bersama-sama yang bertujuan untuk memenuhi suatu proses atau pekerjaan tertentu” .

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Jogiyanto H.M (Pengenalan Komputer, 2000, hal 683), ” Sistem adalah suatu

kesatuan yang terdiri dari dua atau lebih komponen atau subsistem yang saling berinteraksi untuk mencapai suatu tujuan” .

Dari beberapa uraian diatas mengenai defenisi sistem, penulis dapat menyimpulkan pengertian dari sistem yang berkaitan dengan judul, yaitu ”Sistem adalah suatu cara yang dibuat sedemikian rupa yang terdiri dari dua elemen atau lebih yang saling berhubungan untuk mengatasi masalah atau kendala-kendala yang terjadi dengan tujuan yang diinginkan.

2.3 Pengertian Informasi

Informasi didefenisikan sebagai sesuatu yang nyata atau setengah nyata yang dapat mengurangi derajat ketidakpastian tentang suatu keadaan atau kejadian (Analisi, Design, dan Implementasi Sistem Informasi, Henry C.Lucas Jr, Erlangga).

Jogiyanto H.M (Analisis Dan Desain Sitem Informasi Pendekatan Terstruktur Teori Dan Praktek Aplikasi Bisnis, 1989, hal 8), ”Informasi adalah data

yang diolah menjadi bentuk yang lebih berguna dan lebih berarti bagi yang menerimanya.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Sistem informasi adalah suau cara tertentu untuk menyediakan informasi yang dibutuhkan oleh organisasi untuk beroperasi dengan cara yang sukses dan untuk organisasi bisnis dengan cara yang menguntungkan. Dalam beberapa permasalahan sistem informasi selalu dititikberatkan kepada dan bagaimana dalam menghasilkan sebuah informasi dan saran apa yang harus dilengkapi sebagai pendukung yang handal. Perlu diperhatikan bahwa informasi yang digunakan di dalam suatu sistem informasi pada umumnya dapat digunakan.

Jogiyanto H.M (Analisa Dan Desain Sistem Informasi Pendekatan Terstruktur Teori Dan Praktek Aplikasi Bisnis, 1989, hal 11), ” Sistem Informasi

adalah suatu sistem di dalam suatu organisasi yang mempertemukan kebutuhan pengolahan transaksi harian, bersifat manajerial dan kegiatan strategi dan suatu organisasi dan menyediakan pihak luar tertentu dengan laporan-laporan yang diperlukan” .

2.5Syarat-Syarat Merancang Sistem Informasi Berbasis Web

Adapun syarat- syarat agar terbentuknya sebuah website adalah;

1. Tersedianya Web Server

Baik web statis ataupun dinamis, jika ingin bisa online di internet, maka syarat pertama haruslah memiliki server, baik berupa hardware maupun software. Untuk hardware yaitu seperangkat komputer yang selalu terhubung online dengan internet. Untuk software, selain operating system, harus disediakan juga

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

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

2. Tersedianya Software Pemrograman Web Berbasis Server.

Jika ingin membuat web, 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 pengguna internet. Sedangkan server side lebih aman karena instruksi programnya tidak terlihat oleh user. Yang terlihat adalah seperti HTML biasa. Contoh bahasa pemrograman web yang favorit adalah PHP.

3. Tersedianya Database.

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 ini database yang menjadi favorit adalah MySQL.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Internet adalah metode untuk menghubungkan berbagai komputer ke dalam satu jaringan komputer global, melalui protokol yang disebut Transmission Control Protocol/ Internet Protokol (TCP / IP). Protokol adalah suatu petunjuk yang menunjukkan pekerjaan yang akan pengguna lakukan dengan internet, apakah akan mengakses situs web melakukan transfer file, mengirim email dan sebagainya.

Sejarah Internet

Sejarah internet dimulai pada 1969 ketika Departemen Pertahanan Amerika memutuskan untuk mengadakan riset tentang bagaimana caranya menghubungkan 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

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

sebuah gagasan yang lebih besar, yang menjadi cikal bakal pemikiran internet. 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.

Pada tahun 1982 dibentuk Transmission Control Protocol atau TCP dan Internet Protocol atau 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

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

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 disebut www, atau World 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, situs internet telah tumbuh menjadi 3.000 alamat halaman, dan untuk pertama kalinya virtual-shopping atau e-retail muncul di internet. Dunia langsung berubah. Di tahun yang sama Yahoo! Didirikan, yang juga sekaligus tahun kelahiran Netscape 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

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

angka dua juta. Tahun 1999 nama domain business.com terjual kembali 7,5 juta dollar AS. Tahun 2000 situs internet sudah melewati 21,1 juta.

2.7 Pengertian Web Server

Web server adalah perangkat lunak server yang berfungsi menerima permintaan HTTP atau HTTPS dari client yang dikenal dengan nama web browser dan akan mengirim kembali hasilnya dalam bentuk halaman – halaman web yang umumnya berbentuk dokomen HTML. Salah satu web server yang banyak dipakai adalah Apache. Apache merupakan web server antara platform yang dapat berjalan di beberapa flatfrom seperti Linux dan Windows.

2.8 HTML (HyperText Markup Language)

2.8.1 Pendahuluan HTML

HTML atau yang memiliki kepanjangan Hypertext 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

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

dimana kita bisa mengatur judul, garis, tabel, gambar, dan lain-lain dengan perintah yang telah ditentukan pada elemen HTML.

2.8.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

<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>

Keterangan:

1. Dokumen HTML selalu diawali dengan tanda tag pembuka <html> dan diakhiri dengan tag penutup </html>.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

2. Pada elemen head <head>, dapat kita sisipkan kode-kode untuk menuliskan keterangan tentang dokumen HTML, atau dapat juga kita sisipkan scripts-scripts pemograman web seperti JavaScript, VBScripts, atau CSS untuk menambah daya tarik pada situs yang kita buat agar lebih menarik dan dinamis.

3. Elemen <body> </body> berisi tag-tag untuk isi atau layout tampilan pada situs, seperti : <font> </font>, <table>, </table>, <form>, </form>. Tag adalah kode-kode yang digunakan untuk mem_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 sebagainya.

2.9 Pengenalan PHP (Personal Home Page)

2.9.1 Sejarah PHP

Hypertex Preprocessor (PHP) adalah skrip yang berjalan pada server side yang ditambahkan dalam HTML. PHP itu sendiri merupakan singkatan dari Personal Home Page Tools. Skrip ini akan membuat suatu aplikasi yang dapat diintegrasikan kedalam HTML sehingga suatu halaman HTML tidak lagi bersifat statis, namun menjadi bersifat dinamis. Sifat server side membuat pengerjaan skrip tersebut dikerjakan di

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

server sedangkan yang dikirimkan kepada browser adalah hasil proses dari skrip tersebut yang sudah berbentuk HTML.

PHP dibuat pada tahun 1994 oleh Rasmus Lerdof. Tetapi dikembangkan oleh orang lain dan setelah melalui tiga kali karya penulisan, akhirnya PHP menjadi bahasa pemograman Web. PHP adalah sebuah produk yang berbentuk open source, sehingga source code-code dari PHP dapat digunakan, diganti, diedit tanpa harus membayar atau dikenakan biaya.

2.9.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. Dapat digunakan di berbagai mesin

dijalankan secara runtime melalui console serta juga dapat menjalankan perintah-perintah sistem.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. 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.9.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.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. Contoh penulisan Embedded Script dapat dilihat di bawah ini :

<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’;

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

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

2.10 Pengenalan MySQL

MySQL adalah sebuah aplikasi Relational Database Managemen Server (RDBMS). Dengan menggunakan MySQL server, maka data dapat diakses oleh banyak pemakai secara bersamaan. MySQL menggunakan bahasa SQL ( structure Query Language ) yaitu bahasa pemrograman standar yang digunakan untuk mengakses server database.

Tiap database memiliki tabel-tabel, tiap table memiliki field-field. Umumnya informasi tersimpan dalam tabel-tabel yang secara logis merupakan struktur-struktur dimensi terdiri atas baris dan kolom. Field-field tersebut dapat berupa data seperti int, real, char, date, time, dan lainnya.

MySQL memiliki keunggulan, diantaranya :

a. Bekerja pada berbagai plat form ( tersedia berbagai versi untuk berbagai sistem operasi ).

b. Pengaksesan database dapat dilakukan dengan mudah.

c. Memiliki jenis kolom yang cukup banyak sehingga memudahkan konfigurasi sistem database.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

d. Mendukung record yang memiliki kolom dengan panjang tetap atau panjang bervariasi, dan masih banyak keunggulan lainnya.

e. MySQL dan PHP saling terintegrasi , maksudnya adalah pembuatan data base dengan menggunakan sintak PHP dapat dibuat. Sedangkan input yang dimasukkan melalui aplikasi web yang menggunakan skrip server side seperti PHP dapat langsung dimasukkan ke data base MySQL yang ada di server dan tentunya web tersebut berada di sebuah web server.

Pemakaian Dasar SQL

Pemakaian dasar SQL adalah sebagai berikut:

1. Mendefinisikan Tabel

CREATE TABLE NAMA_TABLE (DEFINISI_TABLE);

Contoh: CREATE TABLE MAHASISWA ( NAMA VARCHAR(20),

ALAMAT VARCHAR(255), PASSWORD VARCHAR(10) );

2. Menyimpan data

INSERT INTO NAMA_TABLE (DAFTAR_FIELD) VALUES (DAFTAR_NILAI);

Contoh: INSERT INTO MAHASISWA (NAMA, ALAMAT, PASSWORD) VALUES ('ade, 'jl. Ar. Gg. Seto no. 12', '20216');

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. 3. Mengambil data

SELECT DAFTAR_FIELD FROM NAMA_TABLE KONDISI;

Contoh: SELECT NAMA FROM MAHASISWA;

4. Mengubah data

UPDATE NAMA_TABEL SET DATA_FIELD_LAMA WHERE DATA_FIELD_BARU;

Contoh:UPDATE MAHASISWA SET nama = 'ade' WHERE nama = 'delia';

5. Menghapus data

DELETE FROM NAMA_TABLE KONDISI

Contoh: DELETE FROM MAHASISWA WHERE NAMA='ade';

2.11 Pengenalan CSS (Cascading Style Sheet)

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.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

2.12 Pengenalan Macromedia Dreamweaver 8

Macromedia Dreamweaver adalah sebuah editor HTML profesional untuk mendesain secara visual dan mengelola situs Web maupaun halaman Web.Saat ini Dreamweaver merupakan software utama yang digunakan oleh web desainer maupun web programmer dalam membangun suatu situs web. Dreamweaver memberikan kemudahan bagi penggunanya dalam menentukan ruang kerja yang diinginkan.Tipe ruang kerja ditentukan berdasarkan kebutuhan maupun kebiasaan pemakainya. Ruang kerja, fasilitas dan kemampuan Dreamweaver mampu meningkatkan produktivitas dan efektifitas dalam desaian maupun dalam membangun sebuah situs web (Isak

Rickyanto, 2002).

Macromedia Dreamweaver 8 telah mengalami banyak perbaikan dan peningkatan dari versi sebelumnya, yang mana user interface yang lebih baik dari versi 4, kerena adanya peningkatan kemampuan toolbar sehingga dapat memakai toolbar yang sudah ada atau menambahkan fungsi baru.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

BAB 3

SEKILAS TENTANG SMA NEGERI 5 MEDAN

3.1 Profil SMA Negeri 5 Medan

SMA Negeri 5 Medan berada di Jalan Pelajar No.17 Medan. Sekolah ini didirikan pada tahun 1963. Seperti sekolah-sekolah lain pada umumnya memiliki ruang kelas untuk kegiatan belajar mengajar siswa-siswanya serta dukungan laboratorium untuk pelaksanaan praktikum. Untuk pelaksanaan kegiatan olah raga sekolah ini sudah dilengkapi dengan lapangan basket, lapangan volley dan lapangan futsal, serta lapangan untuk lompat jauh. Untuk mendukung kegiatan siswa dalam belajar terdapat perpustakaan, laboratorium komputer, laboratorium bahasa dan laboratorium IPA serta fasilitas lainnya untuk menunjang kegiatan belajar siswa dengan tidak mengesampingkan moral dan ahlak siswa dengan adanya tempat ibadah seperti mushola dan kegiatan-kegiatan keagamaan seperti pesantren kilat dan kebangkitan rohani yang diharapkan mampu meningkatkan akhlak dan moral siswa.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

3.2 Struktur Organisasi

Gambar 3.1 Struktur Organisasi SMA Negeri 5 Medan

Kepala Sekolah

Drs. Salmi Effendi, M.Pd

Tata Usaha

Drs. L. Hasibuan

Komite Sekolah

H. Firdaus Nasution

Bidang Kurikulum

Drs. M. Nainggolan

Bidang HUMAS

Drs. Zulkifli Lbs

Siswa / i Wali Kelas

Bidang Kesiswaan

Drs. H. Simamora

Bidang SAR / PRA

H. Nilam Cahaya, Spd

BP / BK

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

3.3 Uraian Tugas dan Fungsi Organisasi

3.3.1 Kepala Sekolah

Kepala Sekolah berfungsi dan bertugas sebagai edukator, manejer, administrator, supervisor serta 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. 5. Mengatur dan mengawasi penyelenggaraan program pendidikan. 6. Mengatur mutasi siswa.

7. Menyusun program kegiatan ekstrakurikuler.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

3.3.3 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.3.4 Komite Sekolah

Membantu sekolah dalam hal:

1. Peningkatan kegiatan sekolah.

2. Peningkatan kesejahteraan guru dan pegawai.

3.3.5 Bidang Sarana dan Prasarana

Tugas yang dilakukan disini adalah:

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. 2. Pengawasan dalam hal sarana dan prasarana yang ada.

3.3.6 Bidang Kurikulum

Membantu Kepala Sekolah dalam hal:

1. Pelaksanaan kur ikulum. 2. Pemberian tugas guru.

3. Mengawas jadwal pelaksanaan KBM. 4. Administrasi kurikulum dan penelitian. 5. Konsultasi dengan Kepala Sekolah.

3.3.7 Bidang Kesiswaan

Membantu Kepala Sekolah dalam bidang:

1. Pembinaan disiplin sekolah. 2. Koordinator pembinaan siswa.

3. Koordinator pelaksana kegiatan intra / ekstrakulikuler. 4. Koordinator kegiatan sekolah.

3.3.8 Bidang Humas (Hubungan Masyarakat)

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. 1. Hubungan sekolah, masyarakat , dan pemerintah.

2. Hubungan sekolah dengan perguruan tinggi. 3. Penelusuran tamatan.

4. Penelitian

5. Konsultasi dengan Kepala Sekolah.

3.3.9 Guru

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

3.3.10 Wali Kelas

Membantu kepala sekolah dalam kegiatan:

1. Pengelolaan kelas.

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

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

3.3.11 Guru Pembimbing dan Konseling (BP / BK)

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

3.4 Visi, Misi, dan Motto Sekolah

3.4.1 Visi Sekolah

Mempersiapkan lulusan sebagai calon pemimpin yang memiliki wawasan iman dan taqwa (IMTAK) serta IPTEK yang handal, berbudi pekerti luhur, daya juang kuat, integritas tinggi, berwawasan lingkungan mandiri serta mempunyai kemampuan intelektual (IQ), kemampuan emosional (EQ) dan kemampuan spiritual (SQ) yang tinggi serta kepribadian utuh dan kokoh.

3.4.2 Misi Sekolah

1. Mewujudkan kultur lingkungan belajar yang aman, tentram, nyaman dan kondisif. 2. Menyiapkan para lulusan terampil dan mampu berkomunikasi bahasa inggris dan

mengoperasikan komputer secara maksimal.

3. Mewujudkan sekolah yang efektif, yang memiliki profil kuat, mandiri, kreatif, krisis dan inofatif.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

4. Menyiapkan lulusan yang potensial, sehingga mampu meraih kursi di perguruan tinggi negeri yang favorit sesuai dengan apa yang didambakan oleh setiap siswa. 5. Memepersiapkan lulusan yang memiliki skil (keterampilan) bagi yang ingin terjun

ke dunia kerja.

3.4.3 Motto Sekolah

R : Rapi E : Elok F : Familiar O : Orangnya R : Ramah

M : Menyenangkan A : Aman

S : Serasi I : Indah

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

BAB 4

PERANCANGAN SISTEM

4.1 Perancangan Sistem

Tahap perancangan merupakan tahap awal yang dilakukan penulis dalam membangun situs web. Pada tahap ini penulis akan menjabarkan awal perancangan sistem, diagram alur, tujuan dan isi yang akan dibangun. Situs ini sendiri dirancang dengan menggunakan PHP sebagai bahasa pemogramannya, MySQL sebagai databasenya serta Dreamweaver 8 sebagai media untuk membuat layoutn dari situs yang telah dirancang.

Sebelum membangun sebuah situs, ada beberapa pertanyaan sebagai identifikasi awal yang perlu dilakukan,antara lain:

1. Website apa yang akan dibuat?

2. Siapa saja pengunjung yang diharapkan berkunjung ke website tersebut? 3. Kegiatan apa saja yang dapat pengunjung lakukan didalam website tersebut? 4. Apa target yang ingin dicapai dari pembuatan website tersebut?

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Dengan menjawab pertanyaan-pertanyaan di atas, maka akan semakin memperjelas dan mempermudah dalam membangun situs website tersebut. Sesuai dengan website yang akan dibuat, maka jawaban untuk pertanyaan-pertanyaan di atas sebagai berikut:

1. Situs akan dibuat adalah sistem informasi berbasis web yang menyediakan segala informasi-informasi tentang sekolah tersebut, artikel mengenai pendidikan dan kegiatan yang dilakukan sekolah.

2. Pengunjung dari website tersebut diharapkan adalah para siswa siswi, guru, pegawai dan alumni dari SMA Negeri 5 Medan serta masyarakat luas yang ingin tahu mengenai segala sesuatu tentang sekolah ini.

3. Aktivitas yang akan dijumpai di dalam situs tersebut adalah pengunjung dapat mengetahui segala informasi mengenai SMA Negeri 5 Medan, informasi tentang dunia pendidikan ataupun berita terkini, mengetahui nilai siswa.data siswa,serta informasi penting lainnya.

4. Target yang ingin dicapai dari situs tersebut adalah dapat memberikan kemudahan bagi para siswa dalam memperoleh informasi yang dibutuhkan serta dapat membantu sekolah dalam mempromosikan sekolahnya.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

4.2 Perancangan Struktur Menu Utama

Tahap selanjutnya adalah pembuatan struktur menu yamg meliputi dari situs tersebut, sebagai gambaran yang menampilkan struktur hirarki dan isi halaman perhalaman dan membantu dalam menggambarkan isi dari setiap halaman dan link atau navigasi antara halaman-halaman didalam situs website tersebut.

Adapun bentuk struktur menu utama dari situs sekolah yang penulis buat ditunjukkan pada gambar dibawah ini:

Menu Pengunjung

Akses guestbook

Lihat guestbook

Menu Administrator Menu Siswa Menu Guru

Lihat news

Lihat visi misi

Lihat profil

Lihat data siswa dan data guru

Lihat absen siswa dan absen guru

Lihat data kelas

Lihat data nilai

Lihat data jadwal

Lihat data profil

Lihat data agenda

Lihat data visi dan misi

Lihat data berita

Tambah data siswa dan data guru

Tambah absen siswa dan absen guru

Tambah data kelas

Tambah data nilai

Tambah data jadwal

Tambah data profil

Tambah data agenda

Tambah data visi dan misi

Tambah data berita

Lihat absensi Lihat nilai Lihat jadwal Lihat Profil Lihat absensi Lihat nilai Lihat jadwal Lihat Profil Sistem web Sma Negeri 5

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 4.1 Struktur Menu Utama

Struktur menu untuk aplikasi ini meliputi 4 user yaitu : Administrator, Pengunjung, Guru, dan Siswa, masing – masing user tersebut memiliki tugas sebagai berikut :

a. Administrator mempunyai tugas untuk mengelola nilai siswa, jadwal dan absensi siswa dan guru, tidak hanya itu admin juga dapat melihat apakah sistem yang di buat dapat berjalan dengan ketentuan.

b. Pengunjung yang penulis maksud disini selain para siswa-siswi dan juga guru tapi juga terdapat pengunjung umum yang hannya dapat memperoleh informasi yang disajikan pada website tersebut.Pengunjung umum hannya dapat melihat isi dari website tersebut tanpa dapat mengubah,menambah, dan menghapus isi dari website tersebut.

c. Guru mempunyai tugas memberikan nilai kepada siswa, mengabsen siswa, memberikan penilaian ujian siswa. Data- data ini diberikan kepada tata usaha untuk diinputkan kedalam database yang nantinya berguna untuk siswa untuk melihat data- data tersebut

d. Siswa dapat melihat data nilai siswa yang telah diberikan guru kepada tata usaha (yang berperan sebagai admin), melihat data absensi siswa, melihat

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

profil siswa dan melihat jadwal pelajaran yang akan dilaksanakan sehari- hari.

4.3 Perancangan Halaman Website

Adapun halaman - halaman yang dibangun oleh penulis adalah:

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

b. Halaman home merupakan halaman yang berisikan tentang kata sambutan dari pihak sekolah serta link-link menuju halaman berikutnya.

c. Halaman profil merupakan halaman yang berisikan tentang sejarah singkat dan motto SMA Negeri 5 Medan.

d. Halaman berita merupakan halaman yang berisikan informasi, diantaranya mengenai pendidikan ataupun berita terkini.

e. Halaman visi misi merupakan halaman berisikan tentang visi dan misi SMA Negeri 5 Medan.

f. Halaman Guestbook merupakan halaman dikhususkan bagi pengunjung yang ingin memberikan komentar mengenai situs website tersebut.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

g. Halaman admin merupakan halaman yang hanya dapat diakses oleh admin yang mempunyai tugas untuk mengola nilai siswa, jadwal, absensi, dan tidak hanya itu admin juga dapat melihat apakah sistem yang di buat dapat berjalan dengan ketentuan atau tidak.

h. Halaman Guru merupakan halaman yang hannya diakses oleh guru yang memiliki username dan password, dan disini guru mempunyai tugas memberikan nilai kepada siswa, mengabsen siswa, memberikan penilaian ujian siswa. Data- data ini diberikan kepada tata usaha atau yang berperan untuk diinputkan kedalam database yang nantinya berguna untuk siswa untuk melihat data- data tersebut.

i. Halaman Siswa hannya dapat diakses oleh siswa yang memiliki username dan password. Halaman ini siswa dapat melihat data nilai siswa yang telah diberikan guru kepada tata usaha tersebut, melihat data absensi siswa, melihat profil siswa dan melihat jadwal pelajaran yang akan dilaksanakan sehari- hari.

4.4 Perancangan User Interface

Tampilan utama situs ini dirancang dengan bantuan software dreamweaver 8. Perancangan tampilan utama pada situs ini dibagi menjadi dua bagian yaitu header dan isi halaman. Header adalah merupakan dari halaman yang terletak pada bagian

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

atas yang berisikan logo, sedangkan bagian isi adalah bagian terpenting karena merupakan tempat menampilkan informasi yang akan disampaikan.

4.4.1 Perancangan Halaman Utama Website

NNNN

Gambar 4.2 Perancangan Halaman Utama Website

a. Penjelasan Rancangan Halaman Utama Website

Tabel 4.1 Penjelasan Peancangan Halaman Utama Website

Item Keterangan

Logo Bagian yang berisi bagian gambar dan logo tutwuri handayani

Menu Link Button yang apabila di klik akan mengelink ke website yang Header Administrator Logo Guestbook News

Visi dan Misi Profil HALAMAN UTAMA Sumber Inspirasi Agenda Kegiatan Polling Pengunjung Home Guestbook News Visi dan Misi

Profil

Login Gambar

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. dituju

Home Button yang apabila di klik akan mengelink ke halaman home pada web

Guestbook Button yang apabila di klik akan mengelink ke halaman guestbook

Tabel 4.1 Penjelasan Perancangan Halaman Utama Website (Sambungan)

News Button yang apabila di klik akan mengelink ke halaman berita

Visi dan Misi Button yang apabila di klik akan mengelink ke halaman visi misi

Profil Text box yang berisi informasi mengenai profil SMA Negeri 5 Medan

Gambar Bagian gambar sekolah, laboraturium komputer dan perpustakaan.

Pengunjung Text yang bertuliskan jumlah pengunjung dan pengunjung ke berapa.

Halaman Utama Text yang menampilkan menu- menu utama yang berada di tengah- tengah web ini

Login Bagian untuk masuk sebagai admin, guru, dan siswa.

Sumber inspirasi Text yang menampilkan inspirasi- inspirasi mengenai sumber acuan kehidupan

Agenda kegiatan Berisi agenda kegiatan yang akan diadakan oleh SMA Negeri 5 Medan.

Polling Berisi polling yang memuat seberapa besar web ini. Footer Teks yang berisi copyrigth pembuat web

b. Algoritma Umum Halaman Utama Website

Tabel 4.2 Algoritma Umum Halaman Utama Website

Proses Data in Data out Logika Proses

Guestbook Data guestbook Informasi Data guestbook If (login=halaman utama)and (pilihan=guestbook) then Tampilan halaman guestbook

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

News Data news Informasi data news If (login=halaman utama) and (pilihan=news) then Tampilan halaman news

Tabel 4.2 Algoritma Umum Halaman Utama Website (Sambungan)

Visi dan Misi Data Visi dan Misi Informasi Visi dan Misi

If (login=halaman utama) and (pilihan=visi dan misi) then

Tampilan halaman visi dan misi Profil Data profil Informasi profil If (login=halaman

utama)

and(pilihan=profil) then

Tampilan halaman profil

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 4. 3 Perancangan Halaman Utama Admin

a. Penjelasan Peancangan Halaman Utama Admin

Tabel 4.3 Penjelasan Perancangan Halaman Utama Admin

Item Keterangan

Header Bagian yang berisi bagian nama dan logo sma negeri 5 medan

Lihat tabel Button yang apabila di klik akan mengelink ke halaman lihat tabel, terdapat beberapa menu di lihat tabel ini

Tambah data Button yang apabila di klik akan mengelink ke halaman tambah data, didalamnya terdapat beberapa menu untuk tambah data

Menu utama Button yang apabila di klik akan mengelink ke halaman home admin

Tulisan berjalan Teks yang berisi tulisan berjalan.

Logout Button yang apabila di klik akan keluar dari halaman Admin dan akan kembali kemenu utama

Tulisan berjalan

M

mmkmkm

MM

HEADER

MENU UTAMA ADMINISTRATOR

Created By Ade Yulia Sari Menu Utama >>

Lihat Tabel >> >> Tambah Data

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

b. Algoritma Umum Halaman Utama Admin

Tabel 4.4 Algoritma Halaman Utama Admin

Proses Data in Data out Logika Proses

Lihat table - Hak akses admin - Lihat tabel

-Data lihat table If (login=admin) and (pilihan= lihat tabel) then

Tampilan halaman Lihat tabel

Tambah data -Hak akses admin - Tambah Data

-Informasi

Pengolahan tambah data

If (login=admin) and(pilihan=tambah data) then

Tampilan halaman tambah data

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 4.4 Perancangan Halaman Utama Siswa

a. Penjelasan Perancangan Halaman Utama Siswa

Tabel 4.5 Penjelasan Perancangan Halaman Utama Siswa

Item Keterangan

Header Bagian yang berisi bagian nama dan logo sma negeri 5 medan Logout Button yang apabila di klik akan keluar dari halaman siswa dan

akan kembali ke menu utama

Home Button yang apabila di klik akan mengelink ke halaman utama siswa

Absensi Button yang apabila di klik akan mengelink ke halaman absensi siswa

Nilai Button yang apabila di klik akan mengelink ke halama nilai siswa Jadwal Button yang apabila di klik akan mengelink ke halama jadwal

mata pelajaran siswa

Profil Button yang apabila di klik akan mengelink ke halama profil siswa

b. Algoritma Umum Halaman Utama Siswa

Tulisan berjalan M

mmkmkm

MM P HEADER MENU UTAMA SISWA

Created By Ade Yulia Sari Menu LOGOUT Home Absensi Jadwal Menu Nilai Profil

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Tabel 4.6 Algoritma Umum Halaman Utama Siswa

Proses Data in Data out Logika Proses

Absensi -Hak akses admin - lihat absensi

- informasi Pengolahan data absensi

If (login=guru) and (pilihan= lihat tabel) then Tampilan halaman Lihat absensi Nilai -Hak akses admin

- lihat nilai

-informasi Pengolahan data nilai

If (login= guru) and (pilihan=tambah data) then

Tampilan halaman lihat nilai

Jadwal -Hak akses admin - lihat jadwal

-informasi Pengolahan data jadwal pelajaran

If (login= guru) and (pilihan=tambah data) then

Tampilan halaman lihat jadwal pelajaran

Profil -Hak akses admin - lihat profil

-informasi Pengolahan data profil

If (login= guru) and (pilihan=tambah data) then

Tampilan halaman lihat profil

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Tabel 4.6 Algoritma Umum halaman guru

Gambar 4.5 Perancangan Halaman Utama Guru

a. Penjelasan Perancangan Halaman Utama Guru

Tabel 4.7 Penjelasan Perancangan Halaman Utama Guru

Item Keterangan

Header Bagian yang berisi bagian nama dan logo sma negeri 5 medan Logout Button yang apabila di klik akan keluar dari halaman guru dan

akan kembali ke menu utama

Home Button yang apabila di klik akan mengelink ke halaman utama guru

Absensi Button yang apabila di klik akan mengelink ke halama absensi guru

Nilai Button yang apabila di klik akan mengelink ke halama nilai guru Jadwal Button yang apabila di klik akan mengelink ke halaman jadwal

mata pelajaran siswa

Profil Button yang apabila di klik akan mengelink ke halaman profil siswa

b. Algoritma Umum Halaman Utama Guru

Tulisan berjalan

Created By Ade Yulia Sari Header Menu LOGOUT Menu Home Absensi Nilai Jadwal Profil HALAMAN UTAMA GURU

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Tabel 4.8 Algoritma Umum Halaman Utama Guru

Proses Data in Data out Logika Proses

Absensi -Hak akses admin - lihat absensi

- informasi Pengolahan data absensi

If (login=guru) and (pilihan= lihat tabel) then

Tampilan halaman Lihat absensi Nilai -Hak akses admin

- lihat nilai

-informasi Pengolahan data nilai

If (login= guru) and (pilihan=tambah data) then

Tampilan halaman lihat nilai

Jadwal -Hak akses admin - lihat jadwal

-informasi Pengolahan data jadwal pelajaran

If (login= guru) and (pilihan=tambah data) then

Tampilan halaman lihat jadwal pelajaran Profil -Hak akses admin

- lihat profil

-informasi Pengolahan data profil

If (login= guru) and (pilihan=tambah data) then

Tampilan halaman lihat profil

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Modul Deskripsi

Login Administrator Sistem melakukan validasi atas user yang masuk ke dalam sistem dengan mencocokkan id dan password dari inputan dengan id dan password serta hak akses pada database

Algoritma Mulai

Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman administrator Else

Muncul pesan “Login Gagal,username dan password tidak benar”

Kembali ke halaman login Endif

Selesai

Tabel 4.10 Algoritma Login Guru

Nama Modul Deskripsi

Login Guru Sistem melakukan validasi atas user yang masuk ke dalam sistem dengan mencocokkan id dan password dari inputan dengan id dan password serta hak akses pada database

Algoritma Mulai

Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman guru Else

Muncul pesan “Login Gagal,username dan password tidak benar”

Kembali ke halaman login Endif

Selesai

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Modul Deskripsi

Login Siswa Sistem melakukan validasi atas user yang masuk ke dalam sistem dengan mencocokkan id dan password dari inputan dengan id dan password serta hak akses pada database

Algoritma Mulai

Masukkan id dan password Identifikasi id dan password If id dan password valid then Masuk ke halaman siswa Else

Muncul pesan “Login Gagal,username dan password tidak benar”

Kembali ke halaman login Endif

Selesai

Tabel 4.12 Algoritma Pengolahan Jadwal

Nama Modul Deskripsi

Pengolahan Data User Dalam proses ini Administrator dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai user.

Algoritma Mulai

Masukkan id dan password Identifikasi id dan password If id dan password valid then

Masuk ke halaman Administrator Pilih menu Tambah data

Klik link jadwal

Masukkan id kelas, nama mata

pelajaran,nama guru,hari, jam,id semester If input valid then

Muncul pesan “input data berhasil”

Kembali ke halaman Daftar User

endif Else

Kembali ke halaman admin Endif

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Modul Deskripsi

Pengolahan Absensi Siswa Dalam proses ini admin dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai absensi siswa.

Algoritma Mulai

Masukkan id dan password Identifikasi id dan password If id dan password valid then

Masuk ke halaman Absensi siswa Pilih menu Tambah data

Klik link data absensi siswa

Masukkan nis,tahun, hari, id kelas, semester, id matpel, keterangan.

If input valid then

Muncul pesan “input data berhasil”

Kembali ke halaman Daftar Absensi siswa

endif Else

Kembali ke halaman admin Endif

Selesai

Tabel 4.14 Algoritma Pengolahan Nilai Siswa

Nama Modul Deskripsi

Pengolahan Nilai siswa Dalam proses ini admin dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai nilai siswa.

Algoritma Mulai

Masukkan id dan password Identifikasi id dan password If id dan password valid then

Masuk ke halaman Administrator Pilih menu Daftar Tambah data Klik link data nilai

Masukkan nis, id matpel, id semester, tahun, uas, uts, uh.

If input valid then

Muncul pesan “input data

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009. berhasil”

Kembali ke halaman Daftar nilai siswa

endif Else

Kembali ke halaman admin Endif

Selesai

Tabel 4.15 Algoritma Pengolahan Absensi Guru

Nama Modul Deskripsi

Pengolahan Absensi Guru Dalam proses ini admin dapat melakukan penambahan, pengubahan, dan penghapusan data mengenai absensi guru

Algoritma Mulai

Masukkan id dan password Identifikasi id dan password If id dan password valid then

Masuk ke halaman Absensi siswa Pilih menu Tambah data

Klik link data absensi guru

Masukkan nis,tahun, hari, id kelas, semester, id matpel, keterangan.

If input valid then

Muncul pesan “input data berhasil”

Kembali ke halaman Daftar Absensi guru

endif Else

Kembali ke halaman admin Endif

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

4.5 Mempersiapkan Database Server

Pada tahapan ini dipersiapkan tempat untuk menampung data di server, 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.

Adapun database yang dibuat oleh penulis adalah database db_proyek dengan tabel-tabel sebagai berikut:

Tabel 4.16 Jajak

Nama Field Type Size Keterangan

NO VARCHAR 5 Primary key

TOPIK VARCHAR 25

PIL1 VARCHAR 2

PIL2 VARCHAR 2

PIL3 VARCHAR 2

VOTE1 CHAR 2

VOTE2 CHAR 2

VOTE3 CHAR 2

Tabel 4.17 Halaman Berita

Nama Field Type Size Keterangan

ID_BERITA INTEGER 5 primary key

JUDUL_BERITA VARCHAR 100

DETAIL_BERITA TEXT

TANGGAL DATE AND TIME

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Field Type Size Keterangan

NIS VARCHAR 10 Primary key

ID_KELAS VARCHAR 10

USER_NAME VARCHAR 30

AGAMA VARCHAR 15

JENIS_KELAMIN CHAR 2

TAHUN_MASUK VARCHAR 5

TEMPAT_LAHIR VARCHAR 50

TGL_LAHIR VARCHAR 50

KOTA VARCHAR 25

CONTACT VARCHAR 15

ALAMAT VARCHAR 50

ID_SEMESTER INT 4

PHOTO VARCHAR 100

Tabel 4.19 Absen Siswa

Nama Field Type Size Keterangan

NIS VARCHAR 8 primary key

TAHUN VARCHAR 4

HARI VARCHAR 8

ID_KELAS VARCHAR 5 Foreign Key

SEMESTER INT 1

ID_MATPEL VARCHAR 8 Foreign Key

TANGGAL DATE

KETERANGAN VARCHAR 15

Tabel 4.20 Absen Guru

Nama Field Type Size Keterangan

NIP VARCHAR 12 primary key

TAHUN VARCHAR 12

KELAS VARCHAR 12 Foreign Key

SEMESTER VARCHAR 12

ID_MATPEL VARCHAR 4 Foreign Key

TANGGAL DATE

KETERANGAN VARCHAR 12

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Field Type Size Keterangan

NIP VARCHAR 6 Primary key

USER_NAME VARCHAR 30

AGAMA VARCHAR 15

JENIS_KELAMIN CHAR 2

TAHUN_MASUK VARCHAR 7

KOTA VARCHAR 15

CONTACT VARCHAR 16

GOLONGAN VARCHAR 20

ALAMAT VARCHAR 50

PHOTO IMAGE 100

Tabel 4.22 Mata Pelajaran

Nama Field Type Size Keterangan

ID_MATPEL CHAR 5 primary key

NAMA_MATPEL VARCHAR 25

Tabel 4.23 Nilai

Nama Field Type Size Keterangan

NIS VARCHAR 8 Primary key

ID_MATPEL VARCHAR 8 Foreign Key

ID_SEMESTER CHAR 2 Foreign Key

TAHUN VARCHAR 4

UAS VARCHAR 4

UTS VARCHAR 4

NH VARCHAR 4

NILAI VARCHAR 4

NM CHAR 1

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Field Type Size Keterangan

ID_AGENDA INT 11 Primary key

ISI_AGENDA VARCHAR 100

TANGGAL VARCHAR 20

Tabel 4.25 Jadwal

Nama Field Type Size Keterangan

ID_KELAS VARCHAR 8 Primary key

ID_MATPEL VARCHAR 8 Primary key

NIP VARCHAR 8

HARI VARCHAR 8

JAM VARCHAR 10

SEMESTER VARCHAR 4

Tebel 4.26 Kelas

Nama Field Type Size Keterangan

ID_KELAS CHAR 5 primary key

NAMA_KELAS VARCHAR 25

Tabel 4.27Profil

Nama Field Type Size Keterangan

ID_PROFIL INT 11 Primary key

ISI_PROFIL TEXT

Tabel 4.28 Semester

Nama Field Type Size Keterangan

ID_SEMESTER INT 11 Primary key

SEMESTER VARCHAR 4

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Nama Field Type Size Keterangan

ID_USER VARCHAR 10 Primary key

KETERANGAN VARCHAR 10

PASSWORD VARCHAR 10

Tabel 4.30 Buku Tamu

Nama Field Type Size Keterangan

NO INTEGER 410 Primary key

NAMA VARCHAR 50 Nama pengisi buku

tamu

EMAIL VARCHAR 25 Alamt email dari

pengisi buku tamu

ISI TEXT Komentar dari pengisi

buku tamu

TGL DATE TIME Tanggal pengisian

buku tamu

Tabel 4.31 Visi Misi

Nama Field Type Size Keterangan

ID_VISI_MISI VARCHAR 10 Primary key

TAHUN YEAR

VISI VARCHAR 500

MISI VARCHAR 500

STATUS VARCHAR 100

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

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.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Dalam operasionalnya aplikasi ini menggunakan perangkat lunak, perangkat keras dan antarmuka komunikasi sebagai berikut :

a. Perangkat Lunak (software) meliput i:

1.Sistem Operasi : Windows XP SP.2

2. Editor Teks : Macromedia Dreamweaver 8 3. Editor Grafik : Adobe Photoshop CS2 4. Server side script language : PHP 5.0

5. Web Server : Apache 2.0 6. Database server : MySQL versi 5

7. Client Application : Mozilla Firefox 3.0/ Internet Explorer

b. Kebutuhan Perangkat Keras

1. Prosesor : Pentium Dual Core Inside (1.60 GHz) 2. Memori : 1024 MB

3. Monitor : Plug and Play 14” 4. Keyboard : Standar

5. Mouse : Standar

6. Printer : Canon IP 1700

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

5.4.1 Halaman Utama Website

Gambar 5.1 Halaman Utama Website

Pada halaman utama terdapat beberapa menu diantaranya yaitu : Home, Guestbook, News, Visi dan Misi, Profil, Login, Polling, Menu link Website. Sebelum kita menggunakan aplikasi ini terlebih dahulu kita mengakses hak kita, klil menu login di klik akan menampilkan halaman yang dituju misalnya siswa atau guru.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.2 Halaman Guestbook

5.4.3 Halaman News

Gambar 5.3 Halaman News 5.4.4 Halaman Visi Misi

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.4 Halaman Visi Misi 5.4.5 Halaman Profil

Gambar 5.5 Halaman Profil 5.4.6 Halaman Utama Siswa

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.6 Halaman Utama Siswa

5.4.7 Halaman Absensi siswa

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

5.4.8 Halaman Nilai Siswa

Gambar 5.8 Halaman Nilai Siswa

5.4.9 Halaman Jadwal Siswa

Gambar 5.9 Halaman Jadwal Siswa

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.10 Halaman Profil Siswa

5.4.11 Halaman Utama Guru

Gambar 5.11 Halaman Utama Guru

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.12 Halaman Absensi Guru

5.4.13 Halaman Jadwal Guru Mengajar

Gambar 5.13 Halaman Jadwal Guru Mengajar

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.14 Halaman Profil Guru

5.4.15 Halaman Utama Admin

Gambar 5.15 Halaman Utama Admin

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.16 Halaman Data Kelas

5.4.16 Halaman Created

Gambar 5.17 Halaman Created

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.18 Halaman Edit Absensi Guru

5.4.19 Halaman Edit Berita

Gambar 5.19 Halaman Edit Berita

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.20 Halaman Input Data Jadwal

5.4.21 Halaman Input Data Guru

5..21 Halaman Input DataGuru

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Gambar 5.22 Halaman Input Data Nilai Siswa

5.5 Petunjuk Instalasi

Sistem Infromasi SMA Negeri 5 Medan adalah sistem informasi berbasis web, sehingga untuk pemakaiannya hampir sama dengan aplikasi-aplikasi berbasis web lainnya. Berikut adalah petunjuk pemakaiannya :

1. Instalasi Web Server

a. Instalasi apache 2.2.4

Lakukan Double pada installer Apache, maka akan tampil jendela seperti berikut :

• Kemudian pilih Next >

• Tampilan selanjutnya adalah License Agrement, kemudian pilih I

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

• Pada tampilan berikutnya merupakan keterangan mengenai licensi Apache, kemudian klik Next >

• Berikutnya ada beberapa baris yang harus diisi

Gambar 5.23 Pemilihan Instalasi

Kemudian klik Next >

• Tahap selanjutnya kita diminta untuk memilih tipe atau cara menginstall Apache, untuk saat ini kita pilih Typical saja. Kemudian klik Next >.

• Pada Tahapan selanjutnya kemana program apache akan kita install. Disini kita tidak akan melakukan perubahan tempat penginstallan, Kemudian klik Next >

• Setelah pengaturan selesai saatnya proses instalasinya, klik tombol

Install.

• maka akan tampil jendela yang menandakan proses installasi apache telah selesai. Klik Finish.

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

• Untuk menguji apakah Apache telah terinstall dengan benar, bukalah internet explorer. Pada baris isian alamat, ketikkan http://localhost atau http://127.0.0.1, dan kemudian tekan ENTER.

• Apabila muncul seperti tampilan dibawah yang anda dapatkan maka apache telah terinstall dengan baik.

Gambar 5.24 Instalasi Apache Sukses

b. Instalasi PHP 5.2.0

• Double click file installer PHP, maka akan tampilan Welcome dari

PHP, Klik Next >

• Selanjutnya beri tanda centang pada pernyataan I accept the terms in

the license Agreement. Kemudian klik Next.

• Pada pilihan tempat dimana PHP akan diinstall, Klik Next untuk memilih trempat default dari installasi PHP.

• Pilih web server sesuai dengan apache yang diinstall, yaitu Apache

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

<tr>

<td colspan="2"><div align="center"></div></td> </tr> </table> </form> </body> </html> 8. input_nilai_siswa.php <? include"inc/inc.connect.php"; $thn = date("Y");

?> <html> <head>

<title>KELOLA DATA NILAI /title>

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

</head>

<body bgcolor="#FFFFFF" text="#000000"> <script language="javascript">

function validasi() {

if ((form_input.NIS.value)==""){ alert("Nis masih kosong !"); form_input.NIS.focus(); return false;

}

else if ((form_input.UAS.value)=="") { alert("uas harus diisi !"); form_input.UAS.focus(); return false;

}

else if ((form_input.UTS.value)=="") { alert("uts harus diisi !");

form_input.UTS.focus(); return false;

}

else if ((form_input.UH.value)=="") { alert("Ujian Harian harus diisi !");

form_input.UH.focus(); return false; } else { return true; } } </script> <div align="center">

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

<p><font color="#FF6600" size="4"><strong>INPUT DATA NILAI</strong></font> </p>

</div>

<form method="post" action="menu_admin.php?id=52" name="form_input" onSubmit="return validasi()">

<table border="0" align="center"> <tr>

<td><font color="#000000">NIS</font></td> <td><font color="#FFFFFF">

<input type="text" name="NIS"> </font></td>

</tr> <tr>

<td><font color="#000000">MATAPELAJARAN</font></td> <td><SELECT name="id_matpel" size=1>

<?

$perintah ="select * from t_matpel"; $query =mysql_query($perintah);

while ($baris=mysql_fetch_array($query)) {?> <option value='<? echo"$baris[id_matpel]";?>' > <? echo"$baris[nama_matpel]";?> <? }?> </select></td> </tr> <tr> <td><font color="#000000">SEMESTER</font></td> <td><SELECT name="id_semester" size=1>

<?

$perintah ="select * from t_semester"; $query =mysql_query($perintah);

while ($baris=mysql_fetch_array($query)) {?> <option value='<? echo"$baris[id_semester]";?>' > <? echo"$baris[id_semester]";?> <? }?> </select></td> </tr> <tr> <td><font color="#000000">KELAS</font></td> <td><SELECT name="id_kelas" size=1>

<?

$perintah ="select * from t_kelas"; $query =mysql_query($perintah);

while ($baris=mysql_fetch_array($query)) {?> <option value='<? echo"$baris[id_kelas]";?>' > <? echo"$baris[kelas]";?> <? }?> </select></td> </tr> <tr> <td width="145">TAHUN</td>

<td width="170"><select name="tahun"> <? if(isset($semester)) { ?> <option value="<?=$tahun;?>"> <?=$tahun;?>

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

</option> <?

}

for($x=2005; $x<=$thn; $x++) { ?> <option value="<?=$x;?>"> <?=$x;?> </option> <? } ?> </select></td> </tr> <tr> <td><font color="#000000">UAS</font></td> <td><font color="#FFFFFF">

<input type="text" name="UAS"> </font></td>

</tr> <tr>

<td><font color="#000000">UTS</font></td> <td><font color="#FFFFFF">

<input type="text" name="UTS"> </font></td>

</tr> <tr>

<td><font color="#000000">UH</font></td> <td><font color="#FFFFFF">

<input type="text" name="UH"> </font></td>

</tr> <tr>

<td height="55" colspan="2"> <div align="center"> <font color="#FFFFFF">

<input name="simpan" type="submit" value="simpan"> <input name="batal" type="reset" value="batal"> </font></div></td>

</tr> <tr>

<td colspan="2"><div align="center"><font color="#000000">Lihat Data Nilai <a href="lihat_data_nilai.php">Disini</a></font></div></td> </tr> </table> </form> </body> </html> 9. hapus_data_guru.php <? include"inc/inc.connect.php";

$perintah="delete from t_guru where nip='$ac'";

$jalankan_perintah=mysql_query($perintah)or die(mysql_error()); if($jalankan_perintah)

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

echo"<font color=#000000>Data guru dengan kode".$ac." telah dihapus.</font></br>";

echo "<font color=#000000>untuk melihat data guru klik<a href=index.php?id=26>disini</a>.</font>";

} ?>

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.

Dra. Normalina Napitupulu

SURAT KETERANGAN

Hasil Uji Program Tugas Akhir

Yang bertanda tangan dibawah ini, menerangkan bahwa Mahasiswa Tugas Akhir

Program Diploma III Ilmu Komputer :

Nama

:

ADE YULIA SARI

NIM

:

062406117

Prog. Studi

:

Ilmu Komputer

Judul TA :

PERANCANGAN SISTEM INFORMASI SMA NEGERI 5

MEDAN BERBASIS WEB

Telah melaksanakan test program Tugas Akhir Mahasiswa tersebut di atas pada

tanggal……….

Dengan Hasil : Sukses / Gagal

Demikian diterangkan untuk digunakan melengkapi syarat pendaftaran Ujian Meja Hijau

Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU Medan.

Medan, Mei 2009

Dosen Pembimbing/Kepala Lab. Komputer

Program Studi D3 Ilmu Komputer/Statistika,

Ade Yulia Sari : Perancangan Sistem Informasi Sma Negeri 5 Medan Berbasis Web, 2009.