7

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Pengguna internet mendominasi pemakaian komputer pribadi seluruh dunia,

termasuk Indonesia. Akses yang dapat dilakukan dari seluruh pelosok dunia membuat

pemakaian internet dimanfaatkan semua masyarakat. Berikut konsep dasar

pembuatan web adalah sebagai berikut:

2.1.1. Website

1. Internet

Menurut Sibero (2013:10) “Internet(Interconnected Network) adalah

jaringan komputer yang menghubungkan antar jaringan secara global, internet

dapat juga disebut jaringan dalam suatu jaringan yang luas”. Seperti jaringan

komputer area, internet juga menggunakan protokol komunikasi yang sama

yaitu TFC/IP (Transmission Control Protocol / Internet Protocol). Struktur

protokol internet RFC-1122 terdiri dari 4 lapisan (layer) yaitu:

a. Application Layer

Lapisan Aplikasi (Application Layer) adalah lapisan yang berisi semua

protokol dan metode yang mengatur komunikasi.

b. Transport Layer

Lapisan Transport (Transport Layer) adalah lapisan yang mengatur lalu

lintas pengiriman maupun penerimaan data.

8

c. Internet Layer

Lapisan Internet (Internet Layer) adalah lapisan yang berfungsi untuk

mengatur proses fragmentasi dan defragmentasi paket bergantung pada jenis

protokol lapisan internet.

d. Link Layer

Penghubung (Link Layer) adalah lapisan yang mengatur hubungan antara

host dengan node. Host sebagai pengirim dan node adalah lokasi tujuan dari

host.

2. Website

Menurut Ardhana (2012:3) menyimpulkan bahwa “World Wide Web atau

lebih sering dikenal sebagai Web adalah suatu layanan sajian informasi yang

menggunakan konsep hyperlink (tautan), yang memudahkan surfer (sebutan para

pemakai komputer yang melakukan browsing atau penelusuran informasi melalui

internet)”.

Website dapat dikategorikan menjadi dua yaitu website statis dan website

dinamis. Website statis adalah website yang menampilkan informasi-informasi

yang sifatnya statis (tetap), disebut dengan statis karena pengguna tidak dapat

berinteraksi dengan website tersebut. Dengan demikian untuk mengetahui website

tersebut bersifat statis atau dinamis dapat dilihat dari tampilannya. Jika suatu

website hanya berhubungan dengan halaman website lain dan berisi suatu

informasi yang tetap maka website tersebut bersifat statis. Website dinamis adalah

website yang menampilkan informasi serta dapat berinteraksi dengan pengguna.

Website dinamis memungkinkan pengguna untuk berinteraksi menggunak form

9

sehingga dapat mengolah informasi yang ditampilkan, website dinamis bersifat

interaktif, tidak kaku dan terlihat lebih indah. Suatu website akan lebih menarik

pengunjung dan lebih dikenal dengan cepat dari semua kalangan pengguna

internet apabila website yang dibuat selalu up to date artinya website yang dibuat

selalu diperbaharui setiap saat dengan informasi yang lengkap sehingga

pengunjung website tidak bosan.

3. E-Commerce

Menurut Wong (2010:33) pengertian dari electronic commerce adalah

pembelian, penjualan dan pemasaran barang serta jasa melalui sistem elektronik.

Seperti radio, televisi dan jaringan komputer atau internet.

4. Web Browser

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

yang digunakan untuk mengambil dan menyajikan sumber informasi web.

Sumber informasi web di indentifikasi dengan Uniform Resource Identifier (URL)

yang dapat terdiri dari halaman web, video, gambar ataupun konten lainnya”.

5. Web Server

Menurut Sibero (2013:11) “Web server adalah sebuah komputer yang terdiri

dari sekumpulan perangkat keras dan perangkat lunak”. Secara bentuk fisik dan

cara kerjanya, perangkat kerja web server tidak berbeda dengan komputer rumah

atau PC, yang membedakan adalah kapasitas dan kapabilitasnya. Perbedaan

tersebut dikarenakan web server bekerja sebagai penyedia layanan yang dapat

diakses oleh banyak pengguna, sehingga dapat dibutuhkan kapasitas dan

10

kapabilitas dibandingkan PC. Dukungan perangkat lunak sangat dibutuhkan agar

web server dapat secara optimal.

2.1.2. Bahasa Pemrograman

1. PHP(PreHyptertext Preprocessor)

Menurut Prasetio (2012:122) “PHP (PHP Hypertext Preprocessor)adalah

bahasa script yang ditanam disisi server”.

2. HTML (Hypertext Markup Language)

Menurut Saputra dan Agustin (2012:1) “HTML mempunyai kepanjangan

Hyper Text Markup Language, yaitu suatu Bahasa pemrograman hyper text”.

HTML ini memiliki fungsi untuk membangun kerangka ataupun format web

berbasis html.

3. JQuery

Menurut Hakim (2014:3) “JQuery adalah Javascript library yang berupa

kumpulan kode fungsi javascript yang siap pakai, sehingga memudahkan dan

mempercepat kita dalam membuat kode javascript.

4. Javascript

Menurut Sidik (2011:1) “Javascript adalah bahasa yang digunakan untuk

membuat program yang digunakan agar dokumen HTML yang ditampilkan dalam

browser menjadi lebih interaktif, tidak sekedar indah saja”.

11

5. CSS (Cascading Style Sheet)

Menurut Prasetio (2012:260) mengemukakan bahwa “CSS adalah suatu

teknologi yang digunakan untuk memperindah tampilah halaman website

(statis)”.

2.1.3. Basis Data

Menurut Sukamto dan Shalahudin (2013:43), “Sistem basis data adalah sistem

terkomputerisasi yang tujuan utamanya adalah memelihara data yang sudah diolah

atau informasi dan membuat informasi yang tersedia saat dibutuhkan”. Pada intinya

basis data adalah media untuk menyimpan data agar dapat diakses dengan mudah dan

cepat.

1. MySQL

Menurut Saputra dan Agustin (2012:8) “MySQL merupakan salah satu

database populer dan mendunia”. Intinya MySQL bekerja menggunakan SQL

Language (Structure Query Language).

2. XAMPP

Menurut Yudhanto dan Purbayu (2014:11) “XAMPP merupakan program

paket PHP dan MySQL berbasis open source yang saat ini merupakan andalan

para programming dalam melakukan testing hasil programnya.

3. PHPMyAdmin

Menurut Sibero (2013:376) PhpMyAdmin adalah aplikasi web yang dibuat

oleh phpmyadmin.net. PhpMyAdmin digunakan untuk administrasi database

MySQL. Program ini digunakan untuk mengakses database MySQL. Perintah

12

untuk membuat tabel dapat menggunakan form yang sudah tersedia pada

PhpMyAdmin atau dapat langsung menuliskan script pada menu SQL.

PhpMyadmin dijalankan dengan cara mengetik http://localhost/phpmyadmin pada

web browser.

2.1.4. Model Pengembangan Perangkat Lunak

Menurut Sukamto dan Salahuddin (2013:28) menjelaskan bahwa “Model air terjun

(waterfall) menyediakan pendekatan alur hidup perangkat lunak secara sekuensial

atau terurut dimulai dari analisis, desain, pengodean, dan pengujian”. Model SDLC

air terjun (waterfall) sering juga disebut model sekuensial linier (sequential linier)

atau alur hidup klasik (classic life cycle). Berikut adalah gambar model air terjun

(waterfall):

Sumber: Sukamto dan Salahuddin(2013:29)

Gambar II.I

Ilustrasi Model Waterfall

13

a. Analisis Kebutuhan Perangkat Lunak (System Planning/Analysis)

Proses pengumpulan kebutuhan dilakukan secara intensif untuk

menspesifikasikan kebutuhan perangkat lunak agar dapat dipahami, perangkat

lunak seperti apa yang dibutuhkan oleh pengguna. Spesifikasi kebutuhan

perangkat lunak pada tahap ini perlu untuk di dokumentasikan.

b. Desain (Designing)

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

c. Pembuatan Kode Program (Coding)

Desain harus ditranslasikan ke dalam program perangkat lunak. Hasil dari tahap

ini adalah program komputer sesuai dengan desain yang telah dibuat pada tahap

desain.

d. Pengujian (Testing)

Pengujian fokus pada perangkat lunak secara dari 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.

14

2.1.5. Aplikasi/Software Pendukung

1. Adobe Photoshop

Menurut Komputer (2012:2) “Adobe Photoshop merupakan salah satu aplikasi

yang digunakan untuk mengolah gambar”. Dengan Adobe Photoshop pengguna

bisa membuat sebuah gambar yang menarik dan juga membuat sebuah template

website. Adobe Photoshop memudahkan pengguna dalam membuat desain

template pada website, karena sudah tersedia tool pemotongan gambar untuk

memisahkan bagian-bagian gambar hingga menjadi sebuah template.

2. Adobe Dreamweaver

Menurut Komputer (2012:18) “Dreamweaver merupakan aplikasi visual

terbaik dalam membangun website”. Adobe Dreamweaver memiliki banyak tool-

tool yang memudahkan seorang web design untuk mengedit dan membuat kode-

kode dalam halaman web. Fasilitas yang terdapat didalamnya antara lain:

Referensi HTML, CSS dan Javascript, Javascript debugger, dan editor code.

2.2. Teori Pendukung

2.2.1. Struktur Navigasi

Menurut Binanto (2010:269) menjelaskan bahwa “Struktur navigasi adalah

susunan menu atau hierarki dari suatu situs yang menggambarkan isi dari setiap

halaman dan link atau navigasi tiap halaman pada suatu situs web”. Struktur navigasi

merupakan suatu hal yang tidak kalah pentingnya pada saat pembentukan suatu

website.

15

Struktur navigasi dapat digolongkan menurut kebutuhan dan objek,

kemudahan pemakaian, keinteraktifitasannya, dan kemudahan membuatnya yang

berpengaruh terhadap waktu pembuatan suatu situs web. Bentuk dari struktur navigasi

adalah sebagai berikut:

1. Struktur Navigasi Linear

Pengguna akan melakukan navigasi secara berurutan dan frame atau byte

informasi yang satu ke yang lainnya.

Sumber: Binanto (2010:269)

Gambar II.2.

Struktur Navigasi Linear

2. Struktur Navigasi Hierarkis

Struktur dasar ini disebut juga struktur “linieari dengan percabangan” karena

pengguna melakukan navigasi disepanjang cabang pohon struktur yang terbentuk

oleh logika isi.

16

Sumber: Binanto (2010:269)

Gambar II.3.

Struktur Navigasi Hierarkis

3. Struktur Navigasi Non Linear

Pengguna akan melakukan navigasi dengan bebas melalui isi proyek dengan

tidak terikat dengan jalur yang sudah ditentukan sebelumnya.

Sumber: Binanto (2010:269)

Gambar II.4.

Struktur Navigasi Non Linear

17

3. Struktur Navigasi Komposit

Pengguna akan melakukan navigasi dengan bebas (secara non-linear), tetapi

terkadang dibatasi presentasi linear film atau informasi penting pada data yang

paling terorganisasi secara logis pada suatu hierarki.

Sumber: Binanto (2010:270)

Gambar II.5.

Struktur Navigasi Komposit

2.2.2. ERD (Entity Relationship Diagram)

Menurut Yasin (2012:276) “ERD (Entity Relationship Diagram) adalah suatu

rancangan atau bentuk hubungan suatu kegiatan yang berkaitan langsung dan

mempunyai fungsi didalam proses tersebut”.

Dengan ERD kita berusaha untuk mentransformasikan keadaan dari dunia

nyata ke dalam bentuk basic data. Dalam pembentukan ERD terdapat 3 (tiga)

komponen yang akan dibentuk, yaitu:

18

a. Entitas (Entity)

Entitas merupakan mengenai basis data yaitu suatu objek yang dapat dibedakan

dari lainnya yang dapat diwujudkan dalam basis data. Simbol dari entitas ini biasanya

digambarkan dengan persegi panjang.

b. Hubungan/Relasi (Relationship)

Suatu hubungan adalah hubungan antara dua jenis entitas dan direpresentasikan

sebagai garis lurus yang menghubungkan dua entitas.

c. Atribut

Atribut adalah suatu yang memberikan informasi lebih rinci tentang jenis entitas.

Atribut memiliki struktur internal berupa tipe data.

Jenis-jenis atribut:

1. Atribut Key adalah satu atau gabungan dari beberapa atribut yang dapat

membedakan semua baris data (Row/Record) dalam tabel secara unik.

2. Atribut Simple adalah atribut yang bersifat atomic, tidak dapat dipecah atau

dipilah lagi. Contoh : alamat, penerbit, tahun penerbit, judul buku.

3. Atribut Multivalue adalah nilai dari suatu atribut yang mempunyai lebih dari

satu (multivalue) nilai dari atribut yang bersangkutan. Contoh : dari sebuah

buku, yaitu terdapat bebagai pengarang.

4. Atribut Composite adalah suatu atribut yang terdiri dari beberapa atribut yang

lebih kecil yang mempunyai arti tertentu yang masih bisa dipecah lagi atau

mempunyai sub atribut. Contoh : dari entitas nama yaitu nama depan, nama

tengah, dan nama belakang.

19

5. Atribut Derivatif adalah atribut yang tidak harus disimpan dalam database

total atau atribut yang dihasilkan dari atribut lain atau dari suatu relationship.

Atribut ini dilambangkan dengan bentuk oval yang bergaris putus-putus.

2.2.3. LRS (Logical Record Structure)

Menurut Priyadi (2014:15) “Logical Record Structure (LRS) representasi dari

struktur record-record pada tabel-tabel yang terbentuk dari hasil relasi antar

himpunan entitas”. Beberapa tipe record digambarkan oleh kotak empat persegi

panjang dan dengan nama yang unik. Beda LRS dengan diagram entity relationship

diagram nama tipe record berada diluar kotak field tipe record ditempatkan.

Perbedaan LRS dan ERD adalah nama dan tipe record berada diluar kotak

field tipe record ditempatkan. LRS terdiri dari link-link diantara tipe record. Link ini

menunjukkan arah dari satu tipe record lainnya. Banyak link dari LRS yang diberi

tanda field-field yang kelihatan pada kedua link tipe record. Penggambaran LRS

dimulai dengan menggunakan model yang dimengerti.

2.2.4. Black Box Testing atau Spesification Testing

Menurut Rizky (2011:256), “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 di bagian luar”.

20

Beberapa Black Box Testing yang tergolong dalam tipe ini antara lain:

1. Equivalence Partitioning

Pada teknik ini, tia inputan data dikelompokan ke dalm grup tertentu, yang

kemudian dibandingkan output nya.

2. Boundary Value

Analysis merupakan teknik yang sangat umum digunakan pada saat awal

sebuah perangkat lunak selesai dikerjakan. Pada teknik ini, dilakukan inputan

yang melibihi dari batasan sebuah data.

3. Random Data Selection

Teknik ini berusaha melakukan proses inputan data dengan menggunakan

nilai acak

4. Cause Effect Graph

Proses testing yang menghubungkan sebab dari sebuah input-an dan akibatnya

pada output yang dihasilkan

5. Feature Test

Prorses testing terhadap spesifikasi dari perangkat lunak yang telah selesai

dikerjakan.

21