Tampilan Website SMK N 1 Singkil Utara (BAB III)

BAB III

PEMBAHASAN

 

  1. Desain Dan Perancangan Website

        Perancangan merupakan proses yang kita lakukan terhadap suatu proyek yang akan kita kerjakan, mulai dari rancangan kerja, rangkain, hingga hasil jadi yang akan difungsikan. Perancangan sebagai kerangka, desain dan pembangunan database merupakan bagian yang terpenting dari seluruh pembatasan pembuatan laporan Kuliah Kerja Praktek ini. Pada prinsipnya perancangan dan sistematika yang baik akan memberikan kemudahan dalam proses pembuatan hingga menjadi suatu program yang benar-benar berfungsi sebagaimana mestinya.

    3.2.1 Pembuatan Database

        Untuk membuat database dan tabel, langkah-langkahnya adalah :

    1. Memastikan program Apache (PHP) sudah terinstall didalam komputer.
    2. Membuka dan menjalankan file yang ada di folder yang sudah dibuat.
    3. Membuka dan menjalankan program Apache di XAMPP.
    4. Masuk pada Internet Explorer atau Mozilla kemudian ketikkan alamat server misalnya localhost/phpmyadmin/ atau 127.0.0.1/phpmyadmin/.
    5. Maka akan muncul tampilan seperti dibawah ini.


    6. Langkah selanjutnya adalah pembuatan database. Buat nama database misalnya “data” setelah itu klik tombol “create”.


    7. Setelah itu ketikkan nama tabel dan jumlah field yang akan kita buat pada tabel. Pengisian nama tabel dan jumlah ditandai oleh tanda elips. Setelah pengisian selesai klik tanda go.


    8. Isikan bagian field untuk nama kolom, type untuk menentukan ukuran berapa panjang karakter yang dapat termuat dalam field.
    9. Setelah mengisikan semua criteria tabel field dan tabel klik simpan.

    3.2.2 Tabel pada Database

        Dalam Pembuatan website SMK N 1 Singkil Utara ini, halaman yang menggunakan database hanyalah pada tampilan halaman Buku Tamu. Setiap pengunjung yang berkomentar pada website ini akan tersimpan didalam datebase yang telah dibuat. Tabel database pada tampilan halaman Buku Tamu adalah sebagai berikut.

    Field

    Type

    Null

    Nama

    Varchar(50)

    No

    Email

    Varchar(25)

    No

    Komentar

    Text

    No

     

  2. Tampilan Halaman Web

        Untuk tahap awal pembuatan website ini digunakan Macromedia Dreamweaver CS5 dengan membuat rancangan output untuk aplikasi yang akan dibuat nantinya. Perancangan output ini sendiri diperlukan untuk mempermudah dalam mengambil langkah apa yang akan dibuat dalam menyelasaikan program ini nantinya. Rancangan yang akan dibuat terdiri dari halaman Home, Hubungi Kami, Fasilitas, Siswa, Program Studi, Profil, Alumni, Buku Tamu, Gallery Sekolah, Info Sekolah (terdiri dari submenu Sejarah, Visi Misi, Photo, Video, Mars dan Hymne, Penghargaan), Ekstakurikuler (terdiri dari submenu Pramuka, Olahraga, OSIS, Rohis) dan Link Blog.

  3. Tampilan Halaman Home

        Rancangan halaman home adalah halaman awal dari program website ini. Berisikan link-link ke halaman yang ingin dituju. Halaman ini juga halaman pembuka, karena pada saat pertama website dibuka halaman inilah yang tampil sebelum kehalaman yang lainnya. Halaman Home ini berisikan informasi mengenai SMKN 1 Singkil Utara, seperti perkembangan sekolah saat ini, berita terbaru saat ini dan sebagainya.


  4. Tampilan Halaman Hubungi Kami

        Halaman ini berisikan tentang data admin yang bisa dihubungi melalui email, sosial media atau handphone.


  5. Tampilan Halaman Fasilitas

        Halaman ini berisikan tentang informasi fasilitas yang ada di SMK N 1 Singkil Utara, baik fasilitas lengkap maupun fasilitas yang belum lengkap.


  6. Tampilan Halaman Siswa

        Halaman ini berisikan tentang informasi siswa, seperti jumlah siswa yang ada pada setiap angkatan, peningkatan dan penurunan jumlah siswa pertahunnya. Selain itu terdapat juga informasi tentang angka kelulusan setiap tahunnya. Jumlah siswa perkelas dan jumlah siswa yang berminat memilih setiap jurusan yang disediakan.

     

     

     

     


  7. Tampilan Halaman Program Studi

        Halaman ini berisikan tentang informasi jurusan, peralatan yang dimiliki setiap jurusan dan wadah atau tempat praktek yang dimiliki SMK N 1 Singkil Utara. Selain itu juga dilengkapi dengan photo setiap jurusan.


     

  8. Tampilan Halaman Profil

        Halaman ini berisikan tentang informasi awal sejarah sekolah, daftar kepala sekolah yang dari pertama sampai saat ini yang pernah menjabat sebagai kepala sekolah di SMK N 1 Singkil Utara.


  9. Tampilan Halaman Alumni

        Halaman ini berisikan tentang informasi alumni, prestasi alumni dan kegiatan sebagian alumni.


  10. Halaman Tampilan Buku Tamu

        Halaman ini berisikan tentang pengunjung website yang berkomentar. Pada halaman ini menggunakan database yang terdiri dari form-form pengisian nama, email dan isi komentar.


        Setelah pengunjung yakin dengan tulisan komentarnya dan menyimpannya, maka pengunjung dibawa kehalaman tabel yang berisikan seluruh isi komentar dari pengunjung.


  11. Halaman Tampilan Gallery Sekolah

        Halaman ini hanya berisi photo-photo sekolah SMKN 1 Singkil Utara dalam bentuk gmabar bergerak menggunakan Flash.


     

    1. Halaman Tampilan Info Sekolah

        Halaman ini berisikan tentang informasi sejarah sekolah, visi dan misi sekolah dan sebagainya. Pada menu Info sekolah terdapat 6 kategori menu yaitu Kategori menu Sejarah, Visi Misi, Photo, Video, Mars dan Hymne dan Penghargaan.


     

    1. Halaman Tampilan Ekstrakurikuler

        Halaman ini berisi tentang informasi kegiatan ekstrakurikuler yang ada di SMKN 1 Singkil Utara, pada Ekstrakurikuler terdapat 4 kategori menu yaitu Pramuka, Olahraga, OSIS dan Rohis.


    1. Halaman Tampilan Link Blog

    Halaman ini berisikan tentang link blog yang dimiliki setiap alumni, guru dan link blog kerja sama SMK N 1 Singkil Utara. Jika diklik link gambar maka akan tampil nama-nama link blog yang dimaksud.



     

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s