BAB II

LANDASAN TEORI

2.1 Konsep Dasar Web

Pada bab ini penulis mencoba mengemukakan beberapa teori yang diambil

dalam berbagai buku sebagai pembuatan desain web dan pemrograman website.

Namun teori-teori tersebut tidak dijelaskan secara keseluruhan, melainkan hanya

bagian tertentu yang ada kaitannya serta mendukung dalam pelaksanaan pembuatan

desain web dan pemrograman website ini.

A. Website

Menurut Hidayat dalam (Kusniawan, 2016) mengartikan bahwa “website atau

situs dapat diartikan sebagai kumpulan halaman-halaman yang digunakan untuk

menampilkan informasi teks, gambar diam atau gerak, animasi, suara dan atau

gabungan dari semuanya baik yang bersifat statis maupun dinamis yang membentuk

suatu rangkaian bangunan yang saling terkait. Website terbagi menjadi dua golongan,

yaitu:

1. Website Statis

Adalah website yang mempunyai halaman konten yang tidak dapat di ubah-

ubah, untuk mengubah halaman kontennya harus secara manual, misal dengan

mengedit code. Website statis ini tidak menggunakan database.

2. Website Dinamis

Adalah website yang secara terstruktur ditujukan untuk update sesering

mungkin. Biasanya selain halaman utama yang bisa di akses oleh user umum,

juga disediakan halaman backend untuk mengedit konten dari website.

6

7

3. Internet

Menurut Krisianto dalam (Puspitasari, 2016) Internet adalah salah satu bentuk

media komunikasi dan informasi interaktif. Wujud internet adalah jaringan

komputer yang terhubung di seluruh dunia. Internet digunakan untuk mengirim

informasi antar komputer di seluruh dunia.Internet diartikan sebagai “The

global public Transmission Control Protocol/Internet Protocol (TCP/IP)

internetwork”. Jadi Internet adalah gabungan dari seluruh komputer didunia

yang di satukan oleh sebuah “bahasa” yang sama, adapun bahasa yang

dimaksud adalah Transmission Control Protokol/Internet Protokol (TCP/IP).

4. Web Server

Menurut Kurniawan dalam (Sagita & Sugiarto, 2016) mengemukakan bahwa

“Server Web adalah sebuah perangkat lunak yang berfungsi menerima

permintaan http atau https dari klien yang dikenal dengan web browser dan

mengirimkan kembali hasilnya dalam bentuk halaman-halaman web yang

umumnya berbentuk dokumen html”. Server web yang terkenal diantaranya

adalah Apache dan Microsoft Internet Information Service (IIS).

5. Web Browser

Menurut Sibero dalam (Sagita & Sugiarto, 2016) mengemukakan bahwa “Web

Browser adalah aplikasi perangkat lunak yang digunakan untuk mengambil dan

menyajikan sumber informasi web”. Sumber informasi web didentifikasi

dengan Uniform Resource Identifier (URI) yang dapat terdiri dari halaman

web, video, gambar ataupun konten lainnya. Contoh Web Browser yang banyak

dipakai diantaranya: Microsoft, Internet Explorer, Google Chrome, Opera,

Nestcape Navigator dan Mozila Firefox.

8

6. Web Editor

Menurut Madcoms dalam (Isty & Afifah, 2018) “Adobe Dreamweaver CS5

adalah versi terbaru dari Dreamweaver yang merupakan bagian dari Adobe

Creative Suite 5”. Dreamweaver sendiri merupakan aplikasi yang digunakan

sebagai HTML editor prefesional untuk mendesain web secara visual. Aplikasi

ini juga biasa dikenal dengan istiah WYSIWYG (What You See Is What You

Get).

B. Bahasa Pemrograman

Menurut Nugroho dalam (Eka Wulansari Fridayanthie, 2015) Bahasapemrograman merupakan notasi untuk memberikan perintah secara tepat programkomputer. Berbeda dengan bahasa, misalkan Bahasa Indonesia dan Inggris yangmerupakan bahasa alamiah (natural language), sintaksis dan semantik bahasapemrograman komputer ditentukan secara jelas dan terstruktur, sehingga bahasapemrograman juga disebut sebagai bahasa formal (formal language).

1. Hyper Text Markup Leanguage (HTML)

Menurut Winarno dkk dalam (Kusniawan, 2016) menjelaskan bahwa “HTML

merupakan singkatan dari Hypertxt Markup Language, artinya bahasa ini

adalah bahasa markup untuk memformat konten halaman web. Atau dengan

kata lain, bahasa untuk mengatur bagaimana penampilan dan pemformatan

konten yang ada di web”.

2. Java Script

Menurut Wahana Komputer dalam (Imaniawan & Elsa, 2017) “Java Script

merupakan skrip yang paling banyak digunakan dalam pemrograman web pada

sisi client dewasa ini. Dengan adanya Java Script sebuah web akan menjadi

lebih hidup, cepat, dan tampil lebih menawan dengan sebuah animasi”.

9

3. Bootstrap

Menurut Alatas dalam (Kusniawan, 2016) bootstrap merupakan Framework

ataupun Tools untuk membuat aplikasi web ataupun situs web responsive

secara cepat, mudah dan gratis.

4. Jquery

Menurut Sibero dalam (Kusniawan, 2016) JQuery adalah salah satu framework

terbaik saat ini. JQuery dikembangkan oleh John Resig di BarCamp NYC. Pada

awal perkembanganya, JQuery pertama dibuat untuk meringkas CSS selektor

dalam suatu pustaka fungsi.

5. Casading Style Sheet (CSS)

Menurut Sibero dalam (Isty & Afifah, 2018) “Cascading Style Sheet memiliki

arti gaya menata halaman bertingkat, yang berarti setiap satu elemen yang telah

diformat dan memiliki anak yang telah diformat, maka anak dari elemen

tersebut secara otomatis mengikuti format elemen induknya”.

6. Hypertext Prepocessor (PHP)

Menurut Sibero dalam (Isty & Afifah, 2018) “PHP adalah pemrograman

interpreter yaitu penerjemahan baris kode sumber menjadi kode mesin yang

dimengerti komputer secara langsung pada saat baris kode dijalankan”.

Sedangkan menurut Kristanto dalam (Imaniawan & Elsa, 2017) “PHP adalah

bahasa pemrograman yang digunakan secara luas untuk penanganan

pembuatan dan pembangunan sebuah web dan bisa digunakan pada HTML”.

C. Basis Data

Berikut ini adalah beberapa definisi basis data menurut Fathansyah dalam

(Sagita & Sugiarto, 2016) :

10

1. Himpunan kelompok data atau arsip yang saling berhubungan yang

diorganisasi sedemikian rupa agar kelak dapat dimanfaatkan kembali dengan

cepat dan mudah.

2. Kumpulan data yang saling berhubungan yang disimpan secara bersama

dengan sedemikian rupa dan tanpa pengulangan yang tidak perlu, untuk

memenuhi berbagai kebutuhan.

3. Kumpulan file atau arsip yang saling berhubungan yang disimpan dalam media

penyimpanan elektronis.

1. MySQL dan PHP My Admin

Menurut Sadeli dalam (Isty & Afifah, 2018) “MySQL adalah database yang

menghubungkan script php menggunakan perintah query dan escaps character

yang sama dengan PHP. MySQL mempunyai tampilan client yang

mempermudah dalam mengakses database dengan kata sandi untuk

mengijinkan proses yang bisa anda lakukan”.

PhpMyadmin adalah sebuah software yang berbentuk seperti halaman situs

yang terdapat pada web server.

2. XAMPP

Menurut Riyanto dalam (Isty & Afifah, 2018) “XAMPP merupakan paket web

server berbasis open source yang dapat dipasang pada beberapa sistem operasi

yang ada (Windows, Linux, dan Mac OS)”.

D. Model Pengembangan Perangkat Lunak

Model pengembangan perangkat lunak yang akan digunkan pada perancangan

web pada penelitian ini menggunakan pengembangan perangkat lunak water fall.

Menurut Shalahuddin & Sukamto Ariani (2018:28) menjelaskan bahwa “Model

SDLC air terjun (Waterfall) sering juga disebut model sekuensial linier (sequential

11

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, pengkodean, pengujian dan tahap pendukung (Support).

Berikut adalah gambar model air terjun :

Sumber Shalahuddin & Sukamto Ariani (2018:28)

Gambar II.1

Ilustrasi Model Waterfall

Beberapa tahap dalam pengembangan model waterfall yaitu :

1. Analisa 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

12

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 dari segi logik dan fungsional untuk

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk

meminimalisir kesalahan dan memastikan keluaran yang dihasilkan sesuai

dengan apa yang diinginkan.

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 analisis

spesifikasi untuk perubahan perangkat lunak yang sudah ada, tapi tidak untuk

membuat perangkat lunak baru.

2.2 Teori Pendukung

A. Struktur Navigasi

Menurut Ardiansyah dalam (Imaniawan & Wati, 2017) “Struktur Navigasi

dapat diartikan sebagai alur dari suatu program yang menggambarkan rancangan

13

hubungan antara area yang berbeda sehingga memudahkan proses pengorganisasian

seluruh elemen-elemen website”.

Macam-macam struktur navigasi antara lain :

1. Linear Navigation Model

Linear navigation model digunakan oleh sebagian besar Website. Informasi

diberikan secara sekuensial dimulai dari satu halaman. Beberapa desainer

menggunakan satu laman untuk masuk atau keluar website.

2. Hierarki Model

Hierarki Model diadaptasi dari top-down design. Konsep navigasi ini dimulai

dari satu node yang menjadi home page. Dari home page dapat dibuat beberapa

cabang kehalam-halaman utama. Apabila di perlukan, dari tiap halaman utama

dapat dikembangkan menjadi beberapa cabang lagi. Hal ini seperti struktur

organisasi dalam perusahaan.

3. Spoke-and-hub model

Spoke and hub model hanya menggunakan satu node untuk berhubungan

dengan node lain. Pada model ini hanya terdapat dua macam link, yaitu dari

home page ke halaman tertentu, dan dari halaman tersebut kembali ke home

page

4. Full Web Model

Full web model memberikan kemampuan hyperlink yang banyak. Full web

model banyak digunakan karena user dapat mengakses semua topik dengan

sub topik dengan cepat. Namun kelemahan dari model ini, yaitu dapat

berakibat user kehilangan cara untuk kembali ke topik sebelumnya.

Menurut Binanto dalam (Isty & Afifah, 2018) Ada 4 struktur dasar yang

digunakan yaitu linear, hierarkis, nonlinear, dan composite.

14

1. Linear

Pengguna akan melakukan navigasi secara berurutan, dari frame atau byte

informasi yang satu ke yang lainnya

Sumber : (Binanto, 2013)

Gambar II.2

Struktur Navigasi Linear

2. Hierarkis.

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

pengguna melakukan navigasi di sepanjang cabang pohon struktur yang

terbentuk oleh logika isi.

Sumber : (Binanto, 2013)

Gambar II.3

Struktur Navigasi Hirarkis

3. Nonlinear

Pengguna akan melakukan navigasi dengan bebas melalui isi proyek dengan

tidak terkait dengan jalur yang sudah ditentukan sebelumnya.

15

Sumber : (Binanto, 2013)

Gambar II.4

Struktur Navigasi NonLinear

4. Composite

Pengguna akan melakukan navigasi dengan bebas (secara nonlinear), tetapi

terkadang dibatasi presentasi linier film atau informasi penting dan/atau pada

data yang paling terorganisasi secara logis pada suatu hierarki.

Sumber : (Binanto, 2013)

Gambar II.5

Struktur Navigasi Composite

B. Enterprise Relationship Diagram

Menurut Al-Bahra dalam (Mulia Rahmayu, 2016) “Entity Relationship

Diagram (ERD) adalah diagram yang menunjukkan informasi dibuat, disimpan, dan

16

digunakan dalam sistem bisnis”. Entity Relationship Diagram (ERD) merupakan

gambaran data yang dimodelkan dalam suatu diagram yang digunakan untuk

mendokumentasikan data dengan cara menentukan apa saja yang terdapat tiap entity

dan bagaimana hubungan antara entity satu dengan lainnya.

1. Komponen Penyusun ERD

Menurut Al-Bahra dalam (Mulia Rahmayu, 2016) terdapat beberapa komponen

penyusun ERD:

a. Entitas

Suatu kumpulan objek atau sesuatu yangdapat dibedakan atau dapat

didefinisikan. Pada ERD, Entitas digambarkan dengan sebuah bentuk persegi

panjang. Contoh: Tempat (ruang, bangunan, kantor, lapangan, kampus)

b. Atribut

Atribut merupakan karakteristik dari entitas atau Relationship yang

menyediakan penjelasan detail entitas atau relation. Ada dua jenis atribut:

1) Identifier (key)

digunakan untuk menentukan suatu entitas secara unik (primary key).

2) Descriptor (non key attribute)

digunakan untuk menspesifikasikan karakteristik dari suatu entitas yang tidak

unik.

Pada umumnya atribut merupakan karakteristik dari entitas untuk relasi yang

menyediakan penjelasan detail tentang entitas atau relasi tersebut.

Contoh: Atribut Pelanggan, dan No KTP/SIM, dan Nama

c. Relasi

Hubungan yang terjadi antara satu entitas atau lebih. Relasi diberi nama dengan

kata kerja dasar. Sehingga memudahkan untuk melakukan pembacaan relasinya

17

(bisa dengan kalimat aktif atau kalimat pasif). Pada ERD, Relasi digambarkan

dengan sebuah bentuk belah ketupat. Contoh: Mahasiswa mengambil Mata

Kuliah dan Orang mengendarai Mobil.

2. Derajat Relasi (Relationship Degree)

Menurut Al-Bahra dalam (Mulia Rahmayu, 2016) Relationship degree atau

derajat relasi adalah jumlah entitas yang berpartisipasi dalam satu relasi. Derajat

relasi yang sering dipakai di dalam ERD:

a. Unary Relationship

Unary Relationship adalah model relasi yang terjadi di antara entity yang

berasal dari entity set yang sama. Sering juga disebut sebagai recursive

relationship atau relective relationship.

b. Binary Relationship

Binary Relationship adalah model relasi antar instansi-instansi (istances) dari

suatu tipe entitas (dua entity yang berasal dari entity yang sama). Relationship

ini paling umum digunakan dalam pembuatan model data.

c. Ternary Relationship

Ternary Relationship merupakan relationship antara instansi-instansi dari tiga

tipe entitas secara sepihak. Masing-masing entitas mungkin berpartisipasi satu

atau banyak dalam suatu relationship ternary. Perlu dicatat bahwa relationship

ternary tidak sama dengan tiga relationship binary.

d. Atribut (Attribute)

Atribut merupakan karakteristik dari entitas atau Relationship yang

menyediakan penjelasan detail entitas atau relation. Ada dua jenis atribut:

1) Identifier (key)

digunakan untuk menentukan suatu entitas secara unik (primary key).

18

2) Descriptor (non key attribute)

digunakan untuk menspesifikasikan karakteristik dari suatu entitas yang tidak

unik. Pada umumnya atribut merupakan karakteristik dari entitas untuk relasi

yang menyediakan penjelasan detail tentang entitas atau relasi tersebut.

Contoh: Atribut Pelanggan, dan No KTP/SIM, dan Nama.

e. Kardinalitas (Kardinality)

Menurut Simarmata dalam (Mulia Rahmayu, 2016) “Kardinalitas suatu

hubungan menyatakan sejumlah kejadian terkait untuk masing-masing dua

entitas”. Kardinalitas mendefinisikan jumlah kemunculan baik minimum

maupun maksimum satu entitas yang dapat dihubungkan dengan kemunculan

tunggal entitas lain. Jenis Derajat Kardinalitas:

1) One to One (1:1)

Hubungan satu ke satu (1:1) terjadi jika sebanyak satu kejadian dari suatu

entitas A dihubungkan dengan satu kejadian entitas B.

2) One to Many (1:M)

Tingkat hubungan satu ke banyak (1:M) adalah sama dengan banyak ke-satu

(M:1). Tergantung dari arah mana hubungan tersebut dilihat. Untuk satu

kejadian pada entitas A dapat mempunyai banyak hubungan dengan kejadian

pada entitas B. Sebaliknya satu kejadian pada entitas B hanya dapat

mempunyai satu hubungan.

3) Many to Many (M:N)

Hubungan banyak ke banyak (M:N) mempunyai arti setiap entitas pada

himpunan entitas A dapat berhubungan dengan banyak entitas pada himpunan

entitas B, dan demikian juga sebaliknya, dimana setiap entitas pada himpunan

entitas B berhubungan banyak entitas pada himpunan entitas A.

19

3. LRS (Logical Relationship Structure)

Menurut Simarmata dan paryudi dalam (Eka Wida Fridayanthie, 2016)

“Logical Record Structured (LRS) adalah representasi dari struktur record-record

pada tabel-tabel yang terbentuk dari hasil relasi antar himpunan entitas”. Menentukan

kardinalitas, jumlah tabel, dan Foreign Key (FK).

Menurut ASFA dalam (Imaniawan & Elsa, 2017) “LRS merupakan

transformasi dari penggambaran ERD dalam bentuk yang lebih jelas dan mudah

untuk dipahami”. Penggambaran LRS hampir mirip dengan penggambaran

normalisasi file, hanya saja tidak digambarkan simbol asterix (*) sebagai simbol

primary key (kunci utama) dan foreign key (kunci tamu).

4. Pengkodean

Menurut Supranto dalam (Sukamaindrayana & Rahman Sidik, 2017)

mengemukakan bahwa “Pengkodean (coding) adalah suatu kegiatan pemberian kode

atau simbol pada keterangan-keterangan tertentu, kalau pengolahan akan dilakukan

dengan komputer elektronik”. Jenis pengkodean antara lain : SBCDIC (Standard

Binary Coded Decimal Intercharge Code), Kode Baudot, Unicode, BCD (Binary

Code Decimal), EBCDIC (Extended Binary Code Decimal Interchange Code),

ASCII (American Standard Code For Internation Interchange)

C. Implementasi dan Pengujian Web

Implementasi merupakan tahap menerjemahkan perancangan berdasarkan hasil

analisis. Sedangkan untuk menjamin kualitas suatu web, dibutuhkan adanya

pengujian. Pengujian ini juga dimaksudkan untuk mengidetifikasi cacat dan masalah

yang ada di web tersebut. Berikut penjelasan mengenai dua hal tersebut menurut para

ahli:

20

1. Implementasi

Menurut (Mardiani, 2014) “Tujuan implementasi adalah untuk

mengkonfirmasikan modul program perancangan pada para pelaku sistem

sehingga user dapat memberikan masukan kepada pengembang sistem”.

2. Pengujian (Black Box Testing)

Menurut Sommerville dalam (Mulyana, 2014) menulis bahwa Pengujian

fungsional atau pengujian kotak hitam (black box testing) merupakan

pendekatan pengujian yang ujinya diturunkan dari spesifikasi program atau

komponen. Sistem merupakan kotak hitam yang perilakunya hanya dapat

ditentukan dengan mempelajari input dan output yang berkaitan. Nama lain

untuk cara ini adalah pengujian fungsional karena penguji hanya

berkepentingan dengan fungsionalitas dan bukan implementasi perangkat

lunak. Penguji memberikan input kepada komponen atau sistem dan meneliti

output yang dihasilkan. Jika output bukan merupakan yang diramalkan berarti

uji tersebut telah dengan berhasil mendeteksi masalah dengan perangkat lunak

tersebut.