6

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

A. Website

Menurut Sibero (2013:12): “Web browser adalah aplikasi perangkat lunak

yang digunakan untuk mengambil dan menyajikan sumber informasi web”.

Sumber informasi web diidentifikasikan dengan Uniform Resource Identifier

(URI) yang dapat terdiri dari halaman web, video, gambar, ataupun konten

lainnnya. Sejarah web browser dimulai pada tahun 1991 saat Tim Berners-Lee

membuat aplikasi web browser pertama pada komputer Next dengan nama World

Wide Web Browser, kemudian di tahun 1993 NSCA (National Center

Supercomputing Application) mengembangkan web browser grafis bernama

NSCA Mosaic, yang kemudian dilanjutkan pada tahun 1994 merilis Netscape

Navigator dan pada tahun 1998 berubah menjadi Mozilla Firefox

Menurut Sibero (2013:11): “Web Server adalah Sebuah komputer yang terdiri

dari perangkat keras dan perangkat lunak. Secara bentuk fisik dan cara kerjanya,

perangkat keras web server tidak berbeda dengan komputer rumah atau PC, yang

membedakan adalah kapasitas dan kapabilitasnya. Perbedaannya tersebut

dikarenakan web server bekerja sebagai penyedia layanan yang dapat diakses oleh

banyak pengguna, sehingga dibutuhkan kapasitasnya dan kapabilitas yang besar

dibanding PC. Dukungan perangkat lunak sangat dibutuhkan agar web server

7

dapat berjalan secara optimal. Setiap perangkat lunak web server memiliki

karakteristik dan teknologi yang digunakan untuk mengatur kerja sistemnya

B. Bahasa Pemrograman

1. PHP

Menurut Nugroho (2013:155). “PHP adalah Bahasa pemrograman, dalam

membuat website ataupun aplikasi berbasis web, bukan hanya kode PHP saja

yang kita butuhkan, tapi juga akan menggunakan kode HTML (Hyper Text

Markup Language) untuk desain tampilan, yaitu untuk mengatur text, tabel

dan juga membuat form. Selain itu, kita juga akan butuh CSS (Cascading

Style Sheet) sebagai kode pemanis web, juga bisa jadi pengganti HTML, jadi

dalam membuat Web, kita pasti akan menggunakan kode HTML dan PHP”.

2. HTML

Menurut Sibero (20013:19) “Hyper Text Markup Laguage atau HTML adalah

bahasa yang digunakan pada dokumen web sebagai bahasa untuk pertukaran

dokumen web. Struktur dokumen HTML terdiri dari tag penutup. HTML versi

1.0 dibangun oleh W3C, dan terus mengalami perkembangan. Sampai saat ini

HTML terlahir adalah versi 5.0. Struktur dokumen HTML”

3. CSS (Cascading Style Sheet)

Menurut Wismakarma (2011:2) “CSS (Cascading Style Sheet) merupakan

salah satu bahasa style web yang sekarang sedang populer dipakai pada

berbagai aplikasi web. CSS dibuat untuk membuat style pada web agar lebih

bervariasi dan mudah digunakan. Seiring dengan pertumbuhan bahasa HTML

di Internet, tampilan yang ditawarkan CSS makin bervariasi dan makin

8

memudahkan para pengembang web untuk memperindah tampilan web

mereka”.

4. JavaScript

Menurut Kadir (2011:13) “JavaScipt adalah kode untuk menyusun halaman

web yang memungkinkan dijalankan disisi klien (pada browser yang

digunakan pemakai). Karena dijalankan disisi klien, maka JavaScript dapat

digunakan untuk membuat tampilan lebih bersifat dinamis. Menampilkan jam

lokal secara terus-menerus, melakukan perhitungan terhadap data dalam

formulir, mengubah-ubah warna pada baris tertentu dalam suatu label dapat

dikerjakan dengan menggunakan JavaScript”.

C. Basis Data

Menurut Kustiyaningsih (2011:146) “Database adalah Struktur penyimpanan

data. Untuk menambah, mengakses dan memproses data yang disimpan dalam

sebuah database komputer, diperlukan sistem manajemen database seperti

MYSQL Server”

Intinya database dalam dunia programming difungsikan untuk menyimpan

seluruh data/informasi yang dihasilkan dari proses interaksi didalam aplikasi, baik

itu desktop ataupun interner programming. Dan biasanya pembangunan database

akan dilakukan terlebih dahulu sebelum membangun aplikasi. Berikut penjelasan

database yang penulis gunakan dalam membangun sistem ini.

1. MySQL

Menurut Wahana Komputer (2010:5) “MySQL adalah program database yang

mampu mengirim dan menerima data dengan cepat dan multi user”.

2. XAMPP

9

Menurut Aditya (2011:16) “Xampp adalah perangkat lunak bebas, yang

mendukung banyak sistem operasi, merupakan kompilasi dari beberapa

program.

Gambar II.1 Tampilan XAMPP

3. Adobe Dreamweaver

Menurut Sadeli (2011:2) “Dreamweaver merupakan suatu perangkat lunak

web editor adobe sistem yang digunakan untuk membangun dan mendesign

suatu website dengan fitur-fitur yang menarik dan kemudahan dalam

penggunaanya”

http://id.wikipedia.org/wiki/Perangkat_lunak_bebashttp://id.wikipedia.org/wiki/Sistem_operasihttp://id.wikipedia.org/wiki/Program

10

Gambar II.2 Tampilan Adobe Dreamweaver CS5

D. Model Pengembangan Perangkat lunak

Menurut Sukamto dan M.Salahuddin, (2013:29) “Model SDLC air terjun

(waterfall) sering juga disebut model sekuensial linier (Sequential Linear) atau

alur hidup klasik (classic life cycle). Model air terjun menyediakan pendekatan

alur hidup perangkat lunak secara sekuensial atau terurut dimulai dari analisis,

desain, pengodean, pengujian, dan tahap pendukung (support)”. Berikut adalah

gambar model air terjun :

Gambar II.3 Ilustrasi Model Waterfall

11

1. Analisis kebutuhan perangkat lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk

mespesifikasikan kebutuhan perangkat lunak agar dapat dipahami perangkat

lunak seperti apa yang dibutuhkan oleh user. Spesifikasi kebutuhan perangkat

lunak pada tahap ini perlu untuk didokumentasikan.

2. Desain

Desain perangkat lunak adalah proses multi langkah yang fokus pada desain

pembuatan program perangkat lunak termasuk struktur data, arsitektur

perangkat lunak, representasi antarmuka, dan prosedur pengodean. Tahap ini

mentranslasi kebutuhan perangkat lunak dari tahap analisis kebutuhan ke

representasi desain agar dapat diimplementasikan menjadi program pada tahap

selanjutnya. Desain perangkat lunak yang dihasilkan pada tahap ini juga perlu

didokumentasikan.

3. Pembuatan kode program

Desain harus ditranslasikan ke dalam program perangkat lunak. Hasil dari

tahap ini adalah program komputer sesuai dengan desain yang telah dibuat

pada tahap desain.

4. Pengujian

Pengujian fokus pada perangkat lunak secara segi lojik dan fungsional dan

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan

sesuai dengan yang diinginkan.

12

5. Pendukung (support) atau pemeliharaan (maintenance)

tidak menutup kemungkinan sebuah perangkat lunak mengalami perubahan

ketika sudah dikirimkan ke user. Perubahan bisa terjadi karena adanya

kesalahan yang muncul dan tidak terdeteksi saat pengujian atau perangkat

lunak harus beradaptasi dengan lingkungan baru. Tahap pendukung atau

pemeliharaan dapat mengulangi proses pengembangan mulai dari tahap

analisis spesifikasi untuk perubahan perangkat lunak baru.

2.2. Teori Pendukung

A. Struktur Navigasi

Menurut Puspitosari (2010:280) Struktur navigasi adalah “susunan menu atau

hirarki dari suatu situs yang menggambarkan isi dari setiap halaman dan link atau

navigasi tiap halaman pada situs web”. Struktur navigasi situs web sangat

dipengaruhi oleh tujuan dari situs web yang akan dibuat. Struktur navigasi dapat

digolongkan menurut kebutuhan akan objek, kemudahan pemakai dan kemudahan

membuatnya yang berpengaruh terhadap waktu pembuatan suatu situs web.

Bentuk dasar dari struktur navigasi adalah :

1. Satu alur (linier)

Linier merupakan struktur yang hanya mempunyai satu rangkaian cerita yang

berurut. Dengan kata lain struktur ini hanya dapat menampilkan satu demi satu

tampilan layar secara berurut menurut urutannya. Tampilan yang ada

ditampilan pada struktur jenis ini adalah satu halaman sebelumnya atau satu

halaman sesudahnya dan tidak dapat menampilkan dua halaman sebelumnya

atau dua halaman sesudahnya.

13

Salah satu yang terpenting dari strujtur ini adalah tidak diperkenankan

terjadinya percabangan.

Gambar II.4 Struktur Navigasi Linier

2. Hirarki (hierarchical)

Struktur hirarki ini percabangan untuk menampilkan data berdasarkan kriteria

tertentu. Tampilan pada menu pertama akan disebut sebagai master page

(halaman utama kesatu), halaman utama ini akan mempunyai halaman

percabangan yang dikatakan slave page (halaman pendukung). Jika salah satu

halaman pendukung dipilih atau diaktifkan, maka tampilan tersebut akan

bernama master page (halaman utama kedua), dan seterusnya. Yang

terpenting dari struktur penjejakan ini tidak diperkenankan adanya tampilan

linier.

Gambar II.5 Struktur Navigasi Hierarchical

14

3. Campuran (composite)

Campuran (composite) atau disebut juga struktur penjejakan bebas merupakan

gabungan dari ketiga struktur sebelumnya yaitu linier, non linier dan

hierarchical. Jika suatu tampilan membutuhkan percabangan, maka dapat

dibuat percabangan, dan bila dalam percabangan tersebut terdapat suatu

tampilan yang sama kedudukannya maka dapat dibuat struktur linier dalam

percabangan tersebut. Setiap struktur peta penjejakan seperti yang dibahas

mempunyai fungsi dan tujuan tersendiri, tidak ada yang lebih baik atau lebih

buruk. Penggunaan peta penjejakan bergantung kepada kebutuhan dan tujuan

dari web yang hendak dibuat. Semakin kompleks peta penjejakan yang

digunakan, maka semakin sulit pula pembuatan page dari peta penjejakan

tersebut.

Gambar II.6 Struktur Navigasi Campuran

4. Tidak Berurut (non linier)

Struktur penjejakan non linier (tidak berurut) merupakan pengembangan dari

struktur penjejakan linier. Pada struktur ini diperkenankan membuat

penjejakan bercabang. Pemakai bebas menelusuri website tanpa dibatasi oleh

suatu rute dimana kontrol navigasi dapat mengakses ke semua halaman

manapun. Percabangan yang dibuat pada struktur non linier ini berbeda

15

dengan percabangan struktur hirarki, karena pada percabangan non linier ini

walaupun terdapat percabangan, tetapi tiap-tiap tampilan mempunyai

kedudukan yang sama tidak ada master page dan slave page.

Gambar II.7 Struktur Navigasi Non Linier

B. Enterprise Relationship Diagram

1. Enterprise Relationship Diagram

Menurut Simartmata (2010:3) mengemukakan bahwa “Enterprise

Relationship Diagram

adalah alat pemodelan data utama dan akan membantu mengorganisasi data

dalam suatu proyek kedalam entitas-entitas dan menentukan hubungan antara

entitas”

Dalam ERD terdapat beberapa komponen seperti:

a. Entitas (entity)

Entitas adalah suatu yang nyata atau abstrak dimana kita akan menyimpan

data. Ada 4 kelas entitas, yaitu msal pegawai, pembayaran, kampus, dan

buku

16

b. Relasi (relationship)

Adalah hubungan alamiah yang terdiri antara satu atau lebih entitas.

Kardinalitas menentukan kejadian suatu entitas untuk satu kejadian pada

entitas yang berhubungan. Misalnya, mahasiswa bisa mengambil banyak

mata kuliah.

c. Atribut (attribute)

Adalah ciri umum semua atau sebagian besar instansi pada entitas tertentu.

Sebutan lain atribut adalah property, elemen data, dan field.

d. Garis

Garis menghubungkan atribut dengan kumpulan entitas dan kumpulan

entitas dengan relasi.

2. Derajat Relationship

Derajat relasi adalah sejumlah entitas yang berhubungan dengan hubungan.

Hubungan n-ary adalah format yang umum untuk derajat n. Kasus khusus

adalah seperti biner dan ternary, dimana derajatnya adalah 2 dan 3 ecara

berturut-turut.

Hubungan biner mengasosiasikan dua entitas dan itu merupakan jenis yang

paling umum didalam dunia nyata. Suatu hubungan biner yang berulang

terjadi ketika suatu entitas dihubungkan dengan dirinya sendiri. Sebagai

contoh, mungkin “beberapa karyawan menikah dengan karyawan lain”

3. Logical Record Structure (LRS)

Menurut Hasugian dan Shidiq (2012:608) memberikan batasan bahwa LRS

adalah “sebuah model sistem yang digambarkan dengan sebuah diagram-ER

17

akan mengikuti pola atau aturan permodelan tertentu dalam kaitanya dengan

konvensi ke LRS”. Perubahan yang terjadi yaitu mengikuti aturan-aturan

sebagai berikut:

a. Setiap entitas akan diubah kebentuk kotak.

b. Sebuah atribut relasi disatukan dalam sebuah kotak bersama entitas

jika hubungan yang terjadi pada diagram-ER 1:M (relasi bersatu

dengan cardinality M) atau tingkat hubungan 1:1 (relasi bersatu

dengan cardinality yang paling membutuhkan referensi).

c. Sebuah relasi dipisah dalam sebuah kotak tersendiri (menjadi entitas

baru) jika tingkat hubunganya M:M (many to many) dan memiliki

foreign key sebagai primary key yang diambil dari kedua entitas yang

sebelumnya saling berhubungan.

C. Pengujian Web

Menurut Rizky (2011:261) “Black box testing adalah tipe testing yang

memperlakukan perangkat lunak yang tidak diketahui kinerja internalnya.

Sehingga para tester memandang perangkat lunak seperti layaknya sebuah “Kotak

hitam” yang tidak penting dilihat isinya, tapi cukup dikenai proses testing

dibagian luar”. Beberapa keuntungan yang diperoleh dari jenis testing ini antara

lain:

1. Anggota tim tester tidak harus dari seseorang yang meiliki kemampuan teknis

dibidang pemograman.

2. Kesalahan dari perangkat lunak ataupun bug seringkali ditemukan oleh

komponen tester yang berasal dari pengguna.

18

3. Hasil dari black box testing dapat memperjelas kontradiksi ataupun kerancuan

yang mungkin timbul dari eksekusi sebuah perangkat lunak.

4. Proses testing dapat dilakukan lebih cepat dibandingkan white box testing.

Beberapa teknik testing yang tergolong dalam type ini antara lain :

a. Equivalence Partitioning

Pada tekhnik ini, tiap inputan data dikelompokkan ke dalam grup tertentu,

yang kemudian dibandingkan outputnya.

b. Boundary Value Analysis

Pada tekhnik Boundary Value Analysis, dilakukkan inputan yang melebihi

dari batasan sebuah data. Sebagai contoh, untuk sebuah inputan harga

barang, maka dapat dilakukan testing dengan menggunakan angka negatif

(yang tidak diperbolehkan dalam sebuah harga). Jika perangkat lunak

berhasil mengatasi inputan yang salah tersebut, maka dapat dikatakan

tekhnik ini telah selesai dilakukan.

c. Cause Effect Graph

Dalam tekhnik ini, dilakukan proses testing yang menghubungkan sebab

dari sebuah inputan dan akibatnya pada output yang dihasilkan.

d. Random Data Selection

Seperti namanya, tekhnik ini berusaha melakukan proses inputan data

dengan menggunakan nilai acak. Dari hasil inputan tersebut kemudian

dibuat sebuah tabel yang menyatakan validitas dari output yang dihaslikan.

e. Feature Test

Pada tekhnik ini, dilakukan proses testing terhadap spesifikasi dari

perangkat lunak yang telah selesai dikerjakan. Misalkan, pada perangkat

19

lunak sistem informasi akademik. Dapat dicek apakah fitur untuk

melakukan entri nilai telah tersedia, begitu dengan fitur entri data siswa

maupun entri data guru yang akan melakukan entri nilai.