2.2world wide web (www) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan...

41
2.2 World Wide Web (WWW) Awalnya informasi dapat dicari pada internet dengan menggunakan fasilitas Information Services berbasis Archie, Gopher dan WAIS (Wide Area Information) dan output yang dihasilkan berbasis text. Saat ini dengan teknologi World Wide Web (WWW), dimungkinkan untuk mengakses informasi secara interaktif, dan bentuk informasinya berupa tampilan grafis maupun text. Hal ini dimungkinkan dengan adanya Hypertext Transfer Protocol (HTTP) yang digunakan untuk mengakses suatu informasi yang disimpan pada suatu situs web (Website). Dengan teknologi hypertext akan menggabungkan beberapa jenis representasi dengan metode pengaksesan informasi dan menyajikannya dalam beragam bentuk informasi seperti text, grafik, suara, animasi, video, dan sebagainya. Untuk menggunakan sarana ini dibutuhkan aplikasi Web Browser. Dengan adanya fasilitas ini menjadikan web sebagai salah satu aplikasi yang paling luwes untuk menjelajahi internet. World Wide Web (WWW), sering disebut sebagai The Web adalah alat hipertext yang memberi kesempatan pada anda mencari dan menampilkan data berdasarkan kata-kata kunci. Apa yang membuat web sangat handal adalah ide dari hypertext; data yang berisi hubungan ke data lain. Sebagai contoh, sementara anda membaca informasi, anda mungkin memperhatikan bahwa beberapa kata atau frase ditandai dengan kata yang khusus misalnya Bold, Italic, Underline . Anda dapat meminta web untuk meloncat ke satu dari kata-kata atau frase-frase tersebut. Selanjutnya, web menelusuri hubungan, menemukan informasi yang relevan, dan menampilkanya. Dengan cara ini, anda dapat meloncat dari satu tempat ketempat-tempat yang lain, mengikuti hubungan logis yang ada. 5

Upload: doduong

Post on 06-Feb-2018

217 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.2 World Wide Web (WWW)

Awalnya informasi dapat dicari pada internet dengan menggunakan

fasilitas Information Services berbasis Archie, Gopher dan WAIS (Wide Area

Information) dan output yang dihasilkan berbasis text. Saat ini dengan teknologi

World Wide Web (WWW), dimungkinkan untuk mengakses informasi secara

interaktif, dan bentuk informasinya berupa tampilan grafis maupun text. Hal ini

dimungkinkan dengan adanya Hypertext Transfer Protocol (HTTP) yang

digunakan untuk mengakses suatu informasi yang disimpan pada suatu situs web

(Website). Dengan teknologi hypertext akan menggabungkan beberapa jenis

representasi dengan metode pengaksesan informasi dan menyajikannya dalam

beragam bentuk informasi seperti text, grafik, suara, animasi, video, dan

sebagainya. Untuk menggunakan sarana ini dibutuhkan aplikasi Web Browser.

Dengan adanya fasilitas ini menjadikan web sebagai salah satu aplikasi yang

paling luwes untuk menjelajahi internet.

World Wide Web (WWW), sering disebut sebagai The Web adalah alat

hipertext yang memberi kesempatan pada anda mencari dan menampilkan data

berdasarkan kata-kata kunci. Apa yang membuat web sangat handal adalah ide

dari hypertext; data yang berisi hubungan ke data lain.

Sebagai contoh, sementara anda membaca informasi, anda mungkin

memperhatikan bahwa beberapa kata atau frase ditandai dengan kata yang khusus

misalnya Bold, Italic, Underline. Anda dapat meminta web untuk meloncat ke

satu dari kata-kata atau frase-frase tersebut. Selanjutnya, web menelusuri

hubungan, menemukan informasi yang relevan, dan menampilkanya. Dengan cara

ini, anda dapat meloncat dari satu tempat ketempat-tempat yang lain, mengikuti

hubungan logis yang ada.

5

Page 2: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.3 Elemen-Elemen Web

Dalam web terdapat elemen-elemen yang mendukung suatu homepage.

Elemen ini dapat berupa web browser, protocol dan lain-lain. (Steve Browne,

1995, Hal 45-46).

2.3.1 Web Browser

Dalam mengakses web, diperlukan suatu program yang disebut Web

Browser atau yang biasa disebut browser saja. Browser merupakan suatu

program yang dirancang untuk mengambil informasi-informasi dari suatu

server komputer pada jaringan internet. Informasi-infomasi tersebut

biasanya dikemas dalam bentuk page (halaman), dimana setiap page

memiliki beberapa link yang menghubungkan webpage tersebut ke sumber

informasi lainnya.

Dulu browser hanya dapat menampilkan informasi dalam bentuk

teks saja. Pada tahun 1993, NSCA membuat browser Mosaic yang

mempunyai kemampuan yang lebih baik dari browser-browser lain dan

dapat menampilkan gambar. Setelah NCSA Mosaic, perkembangan

browser amat pesat sekali terbukti dengan munculnya browser Netscape

Navigator yang dibuat oleh Netscape Communicator. Netscape Navigator

dapat menampilkan teks ataupun gambar lebih baik dibandingkan

menggunakan Mosaic. Selain Netscape Navigator ada juga Internet Explorer

(IE) yang dikeluarkan oleh Microsoft.

2.4 Hypertext Markup Language (HTML)

Hypertext Markup Language (HTML) merupakan suatu script dimana kita

bisa menampilkan informasi dan daya kreasi kita lewat internet. HTML sendiri

adalah suatu dokumen teks biasa yang mudah dimengerti dibandingkan bahasa

pemrograman lainnya. Walaupun berbentuk dokumen text biasa, HTML memiliki

perbedaan dengan dokumen lain seperti dokumen word, misalnya perbedaan yang

paling mencolok adalah pada dokumen word, banyaknya karakter akan terbatasi

6

Page 3: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

oleh besarnya kertas sehingga jika teks yang ada di dalamnya banyak ia akan

terdiri dari banyak halaman pula. Sedangkan HTML tidak memiliki batas teks,

sehingga tidak ada pemisah halaman 1, 2, dan seterusnya.

HTML merupakan bahasa pemrograman fleksibel di mana kita bisa

meletakkan skrip dari bahasa pemrograman lain seperti JAVA, Visual Basic, dan

lain-lain, jika HTML tersebut tidak dapat mendukung suatu perintah

pemrograman tertentu. Browser tidak akan menampilkan kotak dialog ‘Syntax

Error’ jika terdapat penulisan kode yang keliru pada skrip HTML sepanjang

kode-kode yang dituliskan merupakan kode-kode.

Hypertext dalam HTML berarti bahwa kita dapat menuju ke suatu tempat,

misalnya website atau halaman homepage lain, dengan cara memilih suatu link

yang biasanya digaris bawahi atau diwakili oleh suatu gambar. Selain link ke

website atau homepage halaman lain, hypertext ini juga memungkinkan kita

menuju ke salah satu bagian dalam satu teks itu sendiri.

Sedangkan Markup Language menunjukkan suatu fasilitas yang berupa

tanda tertentu dalam skrip HTML dimana kita bisa men-set judul, garis, tabel,

gambar dan lain-lain, dengan perintah khusus.

2.4.1 Elemen-Elemen HTML

Elemen pada HTML akan memisahkan dokumen menjadi beberapa

bagian, antara lain:

a.Elemen <HEAD>…</HEAD> : merupakan bagian untuk menuliskan

keterangan mengenai judul dokumen, nama pengarang, dan lain-lain.

b. Elemen <BODY>…</BODY> : merupakan bagian untuk

menuliskan kode-kode layout untuk tampilan homepage.

c.Elemen <FRAMESET>…</FRAMESET> : merupakan bagian

untuk meletakkan kode-kode frame.

7

Page 4: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Sedangkan tag hanyalah bagian dari elemen. Tag adalah kode-kode

yang digunakan untuk men-setting dokumen HTML. (Steve Browne, 1995,

Hal 32).

2.5 Pengertian PHP

PHP adalah sebuah bahasa scripting yang menyatu dengan tag-tag HTML

dieksekusi di server, dan digunakan untuk membuat halaman web yang dinamis

seperti halnya Active Server Pages (ASP) atau Java Server Page (JSP).

PHP pertama kali dibuat oleh Rasmus Lerdorf pada tahun 1995, versi

pertama ini berupa sekumpulan script PERL yang digunakan untuk membuat

halaman web yang dinamis disitus pribadinya. Kemudian ia menulis ulang sript-

script PERL tersebut menggunakan Bahasa C, kemudian ditambah fasilitas untuk

Form HTML, Koneksi MySQL maka meluncurlah PHP versi kedua yang diberi

nama PHP/F1 pada tahun 1996. Versi ketiga dirilis pada pertengahan 1997,

kemudian versi terakhir (PHP 4.0) dirillis pada oktober 2000 yang merupakan

penyempurnaan dari PHP Scripting Engine.

2.5.1 Struktur Penulisan Script PHP

Ada beberapa cara untuk penulisan script PHP, yaitu :

a. <?php

...Script PHP

?>

b. <?

...Script PHP

?>

8

Page 5: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

c. <script language=”php”>

...Script PHP

</script>

d. <%

...Script PHP

%>

Setiap baris dari kode PHP ditutup dengan tanda titik koma (;). Kode

program PHP menyatu dengan tag-tag HTML dalam satu file, kode PHP

diawali dengan tag <? dan ditutup dengan ?>.

File yang berisi tag HTML dan kode PHP ini diberi ekstensi (*.php),

berdasarkan ekstensi ini pada saat file diakses, server akan tahu bahwa file

tersebut mengandung kode PHP kemudian server akan mengeksekusi file

tersebut.

Kemudian output yang dihasilkan dalam bentuk HTML akan dikirim

ke Browser Client yang mengakses file tersebut.

2.5.2 Penggunaan Spasi

Spasi tidak berpengaruh pada penulisan baris perintah pada PHP, hal

ini memudahkan dalam penulisan program agar program dapat lebih mudah

dibaca.

9

Page 6: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.5.3 Komentar Program

Ada tiga macam style penulisan komentar program yang dapat

digunakan, yaitu :

a.C Style, komentar diawali dengan tag /* dan diakhiri dengan */, style

ini digunakan untuk komentar yang lebih dari satu baris.

b. C++ Style, komentar ini diawali dengan tag // dan hanya

berlaku utuk satu baris komentar, untuk baris berikutnya harus diawali

tag // lagi.

c.Bourne Shell Style, diawali dengan tag # untuk satu baris komentar.

2.5.4 Keistimewaan PHP

Sejak dikembangkan sampai versi 4.0, PHP memiliki keistimewaan,

diantaranya :

1. Life Cycle yang singkat, sehingga PHP selalu Up To Date

mengikuti perkembangan teknologi-teknologi internet.

2. Cross Platform, PHP dapat digunakan di hampir semua web

server yang ada di pasaran (Apache, Microsoft IIS, PWS, AOLserver,

phttpd, fhttpd, dan Xitami) yang dijalankan pada berbagai sistem

operasi (Linux, FreeBSD, Unix, Solaris, Windows). Dengan demikian,

proses developing dapat dilakukan menggunakan sistem operasi yang

berbeda dengan sistem operasi yang digunakan setelah publish

(misalnya, developing di Windows kemudian dipasang di web server

yang menggunakan sistem operasi Linux).

3. PHP mendukung banyak paket database baik yang komersil

maupun nonkomersil, seperti PosgreSQL, MySQL, mSQL, Oracle,

SQL, Informix, MicrosoftSQL Server, dan banyak lagi.

4. PHP memiliki tingkat akses yang lebih cepat.

5. PHP memiliki tingkat keamanan yang tinggi.

6. PHP diterbitkan secara free atau gratis.

10

Page 7: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.5.5 Tipe data pada PHP

PHP mengenal lima tipe data, yaitu Integer, Floating Point, String,

Array dan Objects. Tipe data dari sebuah variabel akan ditentukan otomatis

oleh PHP bergantung pada operasi yang sedang dilakukan menggunakan

variabel tersebut.

2.5.5.1 Tipe Data Integer

Tipe data integer meliputi semua bilangan bulat, besarnya

range data integer pada PHP, yaitu antara –2,147,483,648 sampai

+2,147,483,647 pada platform 32-bit. PHP akan secara otomatis

mengkonversi data integer menjadi floating point jika berada di luar

range diatas. Integer dapat dinyatakan dalam bentuk octal (basis –

8), desimal (basis – 10) atau heksadesimal (basis – 16).

2.5.5.2 Tipe Data Floating Point

Floating Point merepresentasikan bilangan pecahan atau

bilangan desimal. Range tipe data floating sama dengan range tipe

data double pada bahasa C, yaitu antara 1.7E-308 sampai 1.7E+308.

Floating Point dapat dinyatakan dalam bentuk desimal dan dalam

bentuk pangkat.

2.5.5.3 Tipe Data String

Sebuah data dengan String dinyatakan dengan mengapitnya

menggunakan tanda petik tunggal ( ‘ ‘ ) maupun tanda kutip ganda

( “ “ ).

2.5.5.4 Tipe Data Array

Array adalah sebuah data yang mengandung satu atau lebih

data dan dapat diindeks berdasarkan numerik maupun string

11

Page 8: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

(Associative Array). Data yang dikandung oleh sebuah data array

dapat dari tipe data lainnya bahkan dapat juga bertipe array

(Multiple Array).

2.5.5.5 Tipe Data Object

Object adalah sebuah tipe data yang dapat berupa sebuah

bilangan, variabel atau bahkan sebuah fungsi. Object dibuat dengan

tujuan untuk membantu programmer yang terbiasa dengan Object

Oriented Programming, meskipun fasilitas OOP yang disediakan

oleh PHP masih sangat kurang.

2.5.6 Variabel Dalam PHP

Variabel adalah sebuah tempat di memori untuk menyimpan data

yang nilainya dapat berubah-ubah. Namun tidak seperti pada bahasa

pemrograman lain yang mengharuskan kita untuk mendeklarasikan variabel

terlebih dahulu, variabel dalam PHP tidak harus dideklarasikan sebelum

variabel tersebut digunakan. Variabel diwakili oleh kata tertentu dengan

aturan penulisan sebagai berikut :

a.Variabel dimulai dengan tanda dollar ($).

b. Harus dimulai dengan huruf atau underscore ( _ ).

c.Tidak boleh menggunakan tanda baca.

d. Case Sensitive atau penulisan nama variabel membedakan

bentuk penulisan antara huruf kecil dan huruf besar..

2.5.7 Struktur Kendali

Struktur kendali merupakan pengatur aliran program, mempunyai

rangkaian perintah yang harus ditulis untuk memenuhi beberapa keadaan,

yaitu :

a.Mengulang suatu perintah pernyataan bila kondisi terpenuhi.

12

Page 9: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

b. Melanjutkan sebuah pernyataan bila kondisi terpenuhi.

c.Memilih sebuah pilihan dari beberapa alternatif bila kondisi terpenuhi.

Struktur kendali dapat dibagi menjadi dua jenis, yaitu struktur

kendali percabangan (pengambilan keputusan) dan pengulangan (looping).

2.5.8 Percabangan

Struktur kendali percabangan adalah struktur kendali yang

memungkinkan pemilihan atas perintah yang akan dijalankan sesuai dengan

kondisi tertentu. Ada tiga perintah percabangan dalam PHP, yaitu If,

If..Else, dan Switch.

2.5.8.1 If

Perintah ini digunakan untuk menjalankan satu atau lebih

perintah yang menyatakan keadaan. Sintaks penulisannya adalah

sebagai berikut :

<?

If (Kondisi)

{

Operasi Program;

}

?>

If...Else

Perintah ini mirip dengan kondisi if, hanya dapat digunakan

untuk banyak pernyataan berkondisi. Fungsi ini menyatakan bahwa

jika Kondisi terpenuhi, maka Operasi I dilaksanakan. Akan tetapi,

jika Kondisi tidak terpenuhi, maka Operasi I diabaikan dan

menjalankan Operasi II. Sintaks penulisannya sebagai berikut :

13

Page 10: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

<?

If (Kondisi)

{

Operasi I;

}

else

{

Operasi II;

}

?>

2.5.8.2 Switch

Perintah ini digunakan sebagai alternatif pengganti dari

sintaks If...Else dengan Else lebih dari satu. Dengan perintah ini

program percabangan akan semakin mudah dibuat dan dipelajari.

Sintaks penulisannya adalah sebagai berikut :

<?

Switch (Kondisi)

{

Case“Konstanta1”;

Pernyataan 1;

Break;

Case“Konstanta2”;

Pernyataan 2;

Break;

Default;

Pernyataan Default;

}

14

Page 11: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

?>

2.5.9 Pengulangan

Digunakan untuk mengulang suatu perintah sebanyak yang

diinginkan tanpa harus menulis ulang. Bahasa PHP mengenal tiga jenis

perintah pengulangan, yaitu :

2.5.9.1 For

Digunakan untuk mengulangi perintah dalam jumlah

pengulangan yang sudah diketahui. Pada perintah ini tidak perlu

menuliskan suatu kondisi untuk diuji. Sintaks penulisannya adalah

sebagai berikut :

<?

For (Nilai_Awal;Nilai_Akhir;Penambahan/Pengurangan)

{

Operasi Program;

}

?>

2.5.9.2 While

Perintah ini digunakan bila mengulangi suatu perintah

sejumlah yang belum bisa ditentukan. Pengulangan akan terus

berjalan selama kondisi masih bernilai benar. Sintaks penulisannya

adalah sebagai berikut :

<?

While (Kondisi)

{

Operasi Program;

}

?>

15

Page 12: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.5.9.3 Do

Proses pengulangan akan berjalan jika kondisi yang diperiksa

di while masih bernilai benar dan dihentikan jika kondisinya sudah

bernilai salah. Sintaks penulisannya adalah :

<?

Do

{

Operasi;

}

While (Kondisi)

?>

2.5.10 Operator

Operator adalah simbol yang digunakan untuk memanipulasi data,

seperti penambahan dan pengurangan. Ada operator yang menggunakan

satu operand, ada juga yang menggunakan dua operand. Operator dapat

dikelompokkan dalam empat kategori, yaitu :

a. Operator Aritmatika adalah operator yang berhubungan

dengan fungsi matematika.

b. Operator Logika adalah operator yang membandingkan TRUE

dan FALSE.

c. Operator Bitwise adalah operator yang membandingkan

binary.

d. Ada juga operator yang sering digunakan namun tidak

termasuk dalam kelompok diatas.

16

Page 13: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Tabel 2.1 Operator Aritmatika

Tabel 2.2 Operator Logika

Operator Operasi= = Sama dengan!= Tidak sama dengan< Lebih kecil> Lebih besar

<= Lebih kecil sama dengan

Operator Operasi

+ Penambahan

- Pengurangan

* Perkalian

/ Pembagi

% Sisa Pembagian

++ Penambahan dengan 1

-- Pengurangan dengan 1

17

Page 14: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

>= Lebih besar sama denganAND atau && Logika ANDOR atau ││ Logika OR

XOR Logika XOR! Logika NOT

Tabel 2.3 Tabel Lain

2.5.11 Sekilas Tentang Apache

Apache adalah program kecil yang menjadikan sebuah komputer

PC mempunyai web server pribadi. Meskipun kecil namun ketika

seseorang membuat PHP, Apache akan banyak sekali membantu

meskipun tidak secara keseluruhan, khususnya ketika seseorang

mengerjakan script-script yang mengharuskan user untuk memakai

Internet Information Server atau IIS secara utuh seperti script-script yang

mengandung Server Component dan PHP mail.

Apache merupakan web server yang paling banyak dipergunakan

diinternet. Program ini pertama kali didesain untuk sistem operasi

Operator Arti. Penggabungan String= Penugasan/pengisian nilai$ Mengacu pada variabel

18

Page 15: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

lingkungan UNIX. Namun demikian, pada beberapa versi berikutnya

Apache mengeluarkan programnya yang dapat dijalankan di windows NT.

Saat ini Apache digunakan secara luas. Hal ini disebabkan karena

programnya yang gratis, dengan kinerja relatif stabil. Dalam

pengembangannya pun mempergunakan sistem bazar, yakni tiap orang

dibuka kesempatan seluas-luasnya untuk dapat memberikan kontribusi

dalam mengembangkan program.

2.6 MySQL

MySQL Bersifat Relational Database Management System (RDBMS)

yang didistribusikan secara gratis dibawah lisensi GPL (General Public License).

PHP mendukung MySQL sebagai database yang dapat digunakan dalam PHP.

MySQL merupakan turunan dari konsep utama dalam database, yaitu SQL

(Structured Query Language). SQL adalah sebuah konsep pengoperasian database

terutama untuk pemilihan dan pemasukkan data, yang memungkinkan

pengoperasian data dikerjakan dengan mudah secara otomatis. Pemilihan MySQL

sebagai program berbasis data didasarkan atas mudah dikoneksikan dengan PHP

dan mempunyai program tambahan yang disebut PHPMyAdmin, yang

memudahkan pembuatan basis data dengan menggunakan table PHPMyAdmin

dapat dijalankan dengan cara mengetikan alamat sebagai berikut

http://localhost/phpmyadmin/.

PHPMyAdmin merupakan sistem administrasi database MySQL berbasis

web. Segala administrasi dan manajemen dapat dilakukan dalam tampilan web

yang interaktif. Administrasi-administrasi yang dapat dilakukan dengan

PHPMyAdmin, antara lain :

19

Page 16: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

a. Create dan drop database

b. Create, copy, dan alter table

c. Delete, edit, dan menambah field

d. Mengeksekusi pernyataan SQL

e. Me-manage keys pada field, dan lain-lain

MySQL mempunyai banyak keistimewaan (menurut buku Administrasi

Database Server MySQL karangan Didik Dwi Prasetyo) yaitu, MySQL dapat

berjalan stabil pada berbagai sistem operasi diantaranya adalah Windows, Linux,

FreeBSD, Solaris, dan lainnya. MySQL didistribusikan secara Open Source.

MySQL mempunyai tipe kolom yang sangat kompleks seperti Integer, Float,

Double, Char, Varchar, Text dan lainnya. MySQL dapat digunakan oleh beberapa

user dalam waktu yang bersamaan tanpa mengalami masalah atau konflik (Multi

User). MySQL mempunyai beberapa level sekuritas seperti Level SubnetMask,

nama user, izin akses user dengan sistem perizinan yang detail serta password

terenkripsi. Secara umum akses ke database melalui tiga tahapan yaitu :

1. Koneksi ke database (tahap persiapan)

2. Query atau Permintaan data (tahap operasi)

3. Pemutusan koneksi (tahap selesai)

Untuk mengaktifkan MySQL dilingkungan Windows maka harus

dijalankan software server MySQL. Untuk Windows XP 2003 yang merupakan

software servernya adalah mysql. Program ini terletak pada direktori

c:\mysql\bin.

2.6.1 Beberapa Perintah Dasar MySQL

1. Statement CREATE

Statement ini digunakan untuk membuat database atau table dalam suatu

database.

Sintaks untuk membuat database sebagai berikut :

20

Page 17: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

a. CREATE DATABASE nama_database;

Sedangkan sintaks untuk membuat table adalah sebagai berikut :

b. CREATE TABLE nama_table (nama_kolom tipe_data

panjang_kolom);

2. Statement SELECT

Statement ini digunakan untuk menampilkan data didalam table,

perintah ini memiliki cakupan yang sangat luas. Pada statement ini ada

beberapa perintah yang dapat digunakan dan fungsi sebagai syarat dalam

menampilkan data.

Sintaksnya adalah sebagai berikut :

SELECT nama_kolom FROM nama_tabel WHERE syarat1,syarat2;

3. Statement INSERT

Statement ini digunakan untuk memasukkan data dalam kolom pada

suatu table.

Sintaksnya adalah sebagai berikut :

INSERT INTO nama_table VALUES (kolom_1,kolom_2,kolom_n);

4. Statement UPDATE

Statement ini digunakan untuk merubah atau memperbaharui data yang

terdapat pada suatu table.

Sintaksnya adalah sebagai berikut :

UPDATE nama_table SET nama field1=nilai_baru WHERE syarat1,

syarat2;

5. Statement RENAME

Statement RENAME TABLE ini dapat digunakan untuk mengganti

nama suatu table.

6. Statement DROP

21

Page 18: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Statement ini dapat digunakan untuk menghapus database, table, index,

dan fungsi secara permanen.

7. Statement GRANT dan REVOKE

Kedua statement ini digunakan untuk memberikan suatu hak kepada

user ataupun mencabut hak tersebut. Untuk memberikan suatu hak pada

user digunakan perintah GRANT. Sedangkan untuk mencabutnya

digunakan perintah REVOKE.

8. Statement DELETE

Digunakan untuk menghapus suatu baris dari suatu table. Jika

menggunakan perintah ini tanpa perintah Where, semua baris akan di

hapus dan mengakibatkan table menjadi kosong.

9. Statement ALTER TABLE

Statement ini digunakan untuk memodifikasi struktur table. Statement

ini dapat digunakan untuk menambah kolom, menghapus kolom,

mengubah kolom, mengubah tipe data dan lain sebagainya.

2.6.2 Tool Administrasi

MySQL memiliki banyak tool yang dapat digunakan untuk

memudahkan administrasi. Salah satu tool yang akan dijelaskan yaitu

WinMySQLadmin.

WinMySQLadmin

WinMySQLadmin merupakan tool khusus pada sistem operasi

Windows. Tool ini akan di boot secara otomatis ketika masuk pada

sistem Windows. Administrasi-administrasi yang dapat dilakukan

dengan tool ini antara lain :

1. Mengontrol MySQL server

2. Konfigurasi file my.ini

22

Page 19: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

3. Administrasi Database

2.6.3 Fungsi API MySQL

Agar dapat menampilkan hasil query pada browser klien, PHP

memerlukan fungsi API (Aplication Programming Interface). Berikut ini

beberapa fungsi API My SQL yang didukung oleh PHP.

Tabel 2.4 Fungsi API PHP ke MySQL

Nama Fungsi KegunaanMysql_affected_rows Untuk menampilkan nomor dari baris pada

operasi sebelumnya.Mysql_close Untuk menutup koneksi MySQL Server.Mysql_connect Untuk melakukan koneksi dengan MySQL

Server.Mysql_create_db Untuk membuat database baru pada MySQL.Mysql_data_seek Untuk memindahkan hasil internal.Mysql_db_name Untuk menampilkan data.Mysql_db_query Untuk mengirim perintah SQL ke Server

MySQL.Mysql_drop_db Untuk menghapus sebuah database pada

database MySQL.Mysql_error Untuk menampilkan pesan error berupa teks dari

operasi yang terakhir dilakukan.Mysql_escape_string Untuk memasukkan string pada perintah query.Mysql_fetch_array Untuk menampilkan baris hasil dalam bentuk

array asosiatif, array angka.Mysql_fetch_field Untuk mendapatkan informasi kolom dari hasil

23

Page 20: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

dan ditampilkan sebagai objek. Mysql_fetch_length Untuk menampilkan panjang pada beberapa

kolom baris terakhir.Mysql_fetch_row Untuk menampilkan baris hasil dalam bentuk

array satu persatu.Mysql_field_len Untuk mendapatkan panjang ukuran dari

spesifikasi kolom.

Mysql_field_name Untuk menampilkan spesifikasi nama pada

kolom.Mysql_field_seek Untuk menghasilkan field atau kolom tertentu.Mysql_field_table Untuk menghasilkan nama table tertentu.Mysql_field_type Untuk menghasilkan tipe pada kolom tertentu.Mysql_free_result Untuk membebaskan memori.Mysql_get_client_info Untuk mendapatkan informasi Client MySQL.Mysql_get_host_info Untuk mendapatkan informasi Host MySQL.Mysql_get_server_info Untuk mendapatkan informasi server pada

MySQL.Mysql_insert_id Untuk mendapatkan ID dari operasi insert yang

dilakukan sebelumnya.Mysql_list_dbs Untuk menampilkan semua database yang ada

pada MySQL Server.Mysql_list_fields Untuk menampilkan semua kolom yang ada pada

MySQL Server.Mysql_list_tables Untuk menampilkan daftar table yang ada pada

MySQL Server.Mysql_num_fields Untuk menampilkan nomor pada hasil.Mysql_num_rows Untuk menampilkan nomor baris pada hasil.Mysql_connect Untuk membuka koneksi (hubungan) secara

permanen atau tetap dengan MySQL Server.Mysql_query Untuk mengirimkan perintah SQL ke server

MySQL.Mysql_result Untuk menampilkan hasil data.Mysql_select_db Untuk memilih sebuah database sebagai database

sebagai database aktif.

24

Page 21: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Mysql_tablename Untuk mendapatkan nama table suatu database.2.7 HomePage

Setiap informasi disimpan pada suatu file yang berbeda-beda. File ini

disebut halaman web (Web Page). Di dalam web page inilah tersimpan berbagai

informasi dan link yang menghubungkan suatu informasi ke informasi lainnya,

baik itu di dalam satu web page yang sama ataupun dalam web page lain pada

website yang berbeda.

Sebelum mengakses berbagai macam informasi pada suatu website, kita

akan menemui suatu web pembuka yang disebut sebagai homepage. Page ini

merupakan halaman pertama dari suatu web. Pada dasarnya Homepage adalah

suatu sarana untuk memperkenalkan secara singkat tentang apa yang menjadi isi

dari keseluruhan suatu website. (Isak Rickyanto, 2002, Hal 39).

2.8 Struktur Navigasi

Penjejakan termasuk struktur terpenting dalam pembuatan suatu website

dan gambarannya harus sudah ada pada tahap perencanaan. Peta penjejakan

merupakan rancangan hubungan dan rantai kerja dari beberapa area yang berbeda

dan dapat membantu mengorganisasikan seluruh elemen pages. Peta penjejakan

juga memberikan kemudahan dalam menganalisa keinteraktifan seluruh pages

dalam web dan bagaimana pengaruh keinteraktifannya terhadap pengguna.

Ciri khas peta penjajakan yaitu dapat digolongkan menurut kebutuhan

akan obyek, kemudahan pemakaian, keinteraktifitasannya, dan kemudahan

membuatnya yang berpengaruh terhadap waktu pembuatan suatu multimedia.

25

Page 22: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.8.1 Linear

Gambar 2.1 Navigasi Linear

Linear (satu alur) 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 dapat di tampilkan pada struktur jenis ini adalah

satu halaman sebelumnya atau satu halaman sesudahnya dan tidak dapat

menampilkan dua halaman sebelumnya atau dua halaman sesudahnya. Salah

satu yang terpenting dari struktur ini adalah tidak diperkenankan terjadinya

percabangan.

2.8.2 Hierarchical (Hirarki)

Gambar 2.2 Hirarki

26

Page 23: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Struktur Hierarchi (bercabang) 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 secara linear.

2.8.3 Non Linear

Gambar 2.3 Non Linear

Struktur penjejakan Non Linear (tidak berurut) merupakan

pengembangan dari struktur penjejakan Linear. Pada struktur ini

diperkenankan membuat penjejakan bercabang. Percabangan yang dibuat

pada struktur Non Linear ini berbeda dengan percabangan pada struktur

Hierarchi, karena pada percabangan Non Linear ini walaupun terdapat

percabangan, tetapi tiap-tiap tampilan mempunyai kedudukan yang sama

tidak ada Master Page dan Slave Page.

27

Page 24: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.8.4 Composite

Gambar 2.4 Composite

Composite (campuran) atau disebut juga struktur penjejakan bebas

merupakan gabungan dari ketiga struktur sebelumnya yaitu Linear, Non

Linear dan Hierarchi. Jika suatu tampilan membutuhkan percabangan, maka

dapat dibuat percabangan, dan bila dalam percabangan tersebut terdapat

suatu tampilan yang sama kedudukannya maka dapat dibuat struktur Linear

dalam percabangan tersebut.

Setiap struktur peta penjejakan seperti yang baru 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.

28

Page 25: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.9 Macromedia Dreamweaver MX 2004

2.9.1 Memulai Macromedia Dreamweaver MX 2004

Ada beberapa cara untuk memulai Macromedia Dreamweaver MX

2004, salah satunya dengan menggunakan tombol Start. Caranya yaitu klik

tombol Start arahkan ke Program lalu pilih folder Macromedia

Dreamweaver MX 2004 dan klik, seperti Gambar 2.5.

Gambar 2.5 Macromedia Dreamweaver MX 2004

Seperti dikutip dari (Zak Ruvalcaba, 2002, Hal 2) Macromedia

Dreamweaver MX 2004 yang sedang terbuka akan menampilkan sebuah

bidang kerja yang membuka sebuah lembar kerja yang bernama Untitled

Document [Untitled-1] seperti Gambar 2.6

29

Page 26: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

.

Gambar 2.6 Bidang Kerja Dreamweaver MX 2004

Sebelum kita membuat web maka kita harus mengenal dulu fungsi-

fungsi dasar yang terdapat pada Dreamweaver seperti Properti, Objek,

Behaviors. (Isak Rickyanto, 2002, Hal 4-13)

2.9.1.1 Property

Properti berfungsi untuk menyeleksi suatu objek seperti

untuk mengatur font, mengatur lurus kiri, tengah atau lurus kanan,

dan juga untuk menge-link objek tersebut jika diingin menge-link

nya, seperti Gambar 2.7.

Gambar 2.7 Properti

30

Page 27: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

a.Format : Mengatur style paragraph, seperti paragraph, heading

1, heading 2, dan lain-lain.

b. Link : Untuk menge-Link suatu page.

c.Default Font : Mengubah bentuk font / tulisan.

d. Size : Mengubah ukuran tulisan.

e.B : Bold / tebal

2.9.1.2 Object

Dengan menggunakan Object kita dapat membuat berbagai

macam objek seperti membuat objek, table, layer, dan sebagainya.

Dengan menggunakan objek ini kita dapat mempermudah dan

mempercepat kita dalam membuat Web. Karena Object ini dengan

kata lain seperti shortcut kita. Seperti Gambar 2.8

Gambar 2.8 Object

2.9.1.3 Behaviors

Behaviors berguna untuk menyisipkan suara pada suatu

objek, menyisipkan gambar pada gambar yang sudah ada,

memanggil JavaSrcipt, memberikan Popup Massage dan lain-lain

dengan mengklik symbol “+“ pada sebelah kiri dan untuk

menghapus perintah yang telah dibuat klik simbol “ - “. Seperti pada

Gambar 2.9

31

Page 28: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Gambar 2.9 Behaviors

2.9.1.4 Membuat Web Dengan Dreamweaver

Ketika membuka Dreamweaver akan terbuka lembar kerja

yang sudah siap pakai, setelah itu kita dapat menyisipkan gambar,

text, ataupun warna dasar web. Setelah itu kita dapat menyimpannya

dengan cara klik menu File lalu pilih Save As ketik nama file yang

kita inginkan dan kemudian tekan tombol OK, harus disimpan dalam

bentuk (*.html). (Zak Ruvalcaba, 2002, Hal 29)

2.9.1.5 Menulis Di Dalam Dreamweaver

Salah satu fungsi suatu web adalah untuk memberi informasi

kepada masyarakat. Agar para pemakai web tersebut tertarik untuk

membaca isi dari suatu web tersebut maka web tersebut harus

memberikan informasi yang bagus. Selain itu web tersebut juga

harus mempunyai tampilan yang bagus, salah satunya adalah bentuk

huruf dan tata letaknya. Dalam Dreamweaver, telah disediakan

fasilitas untuk mengatur tulisan yang telah ditulis melalui tekan

menu Text, kemudian dari menu tersebut paragraph format, font,

besar tulisan, warna dan sebagainya dapat disesuaikan. Atau kalau

ingin cepat, dapat mengaturnya melalui shortcut Properties. Cara

mengatur tulisan didalam Dreamweaver sama seperti kalau mengatur

tulisan didalam Microsoft Word. Selain menulis langsung didalam

32

Page 29: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Dreamweaver, dapat juga menulis dengan bantuan program lain

seperti Adobe Photoshop. Karena didalam Adobe Photoshop

terdapat fasilitas untuk memperbagus bentuk tulisan seperti yang di

inginkan.

2.9.1.6 Memberi Warna Dasar

Dalam membuat web tentu web tersebut harus mempunyai

tampilan yang menarik Agar web itu menarik maka web itu harus di

beri dengan warna-warna yang menarik, gambar-gambar yang lucu,

atau dapat pula isi dari web itu. Pertama-tama yang akan dibahas

adalah cara memberi warna pada web. Klik menu Modify lalu pilih

Page Properties seperti pada Gambar 2.10.

Gambar 2.10 Modify

33

Page 30: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Setelah di klik maka dalam menu Page Properties akan

muncul menu lagi seperti

Gambar 2.11 Page Properties

a. Title : Untuk memberi nama background.

b. Background Image : Untuk memasukkan warna backgrond

sendiri maka dapat mencarinya dan

memasukannya dengan menekan

tombol Browse.

c. Background : Memuat warna-warna yang telah

disediakan.

d. Text : Warna untuk text yang akan digunakan

e. Left Margin : Memberi batas kiri.

f. Top Margin : Memberi batas atas.

g. Margin Width : Lebar margin.

h. Margin Height : Panjang margin.

i. Image Transparency : Mengatur transparansi gambar.

34

Page 31: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Setelah memilih warna yang akan digunakan maka tekan

Apply dan tekan tombol OK. Atau kalau mau memberi Transparansi

pada warna maka dapat juga mengaturnya di Page Properties tadi.

2.9.1.7 Memberi Images

Tentu saja di dalam sebuah web akan terdapat banyak

gambar-gambar yang menarik perhatian dan akan lebih menarik jika

gambar tersebut mengandung unsur yang berbau multimedia.

Jika ingin memasukkan gambar di dalam Dreamweaver,

pertama-tama tekan menu Insert lalu pilih Images seperti Gambar

2.12.

Gambar 2.12 Menu Insert Image

Selain dari menu Insert dapat juga menekan shortcut dari

menu Objek seperti yang telah di jelaskan diatas. Setelah di klik

menu Images tadi maka akan muncul menu seperti Gambar 2.13.

35

Page 32: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Gambar 2.13 Select Image Source

a. Look In : Untuk mencari letak file image.

b. File name : Nama file image.

c. File of type : Jenis extension file.

Setelah gambar dipilih, sisipkan gambar tersebut kedalam

homepage lalu tekan Select. Maka gambar tersebut akan muncul di

dalam lembar kerja. Untuk mengatur besar kecilnya gambar yang di

inginkan dapat diatur melalui menu Property seperti yang sudah

dibahas diatas, tentunya setelah gambar tersebut telah dipilih.

2.9.1.8 Link

Dalam membuat web tentu saja terdapat banyak page atau

halaman, untuk menghubungkan halaman-halaman tersebut gunakan

perintah Link (sambung / penyambung) yang terdapat pada

Property. Dalam menge-Link tentu saja harus terdapat banyak

halaman yang harus terkait satu sama lain. Suatu gambar atau suatu

kalimat dapat dijadikan penghubung ke suatu halaman lain.

Contohnya, jika mempunyai suatu gambar yang diinginkan menjadi

36

Page 33: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

tombol penyambung maka pertama-tama pilih gambar tersebut dan

kemudian dengan menu Property yang terdapat fasilitas Link maka

gambar tersebut dapat dijadikan penghubung ke halaman lain. (Zak

Ruvalcaba, 2002, Hal 47-53).

Gambar 2.14 Cara Link

Seperti contoh diatas dimana tombol yang telah dipilih dan

pada menu Property akan memunculkan menu Link. Lalu cari

halaman yang ingin di Link dengan menu Browse (yang berbentuk

folder disebelah Link). Jika telah memilih halaman mana yang akan

di Link maka tombol tersebut telah menjadi suatu penghubung.

2.9.1.9 Menjalankan Pages Yang telah Selesai

Jika web yang dibuat telah selesai dan jika ingin

menjalankannya maka tekan tombol F12 pada keyboard dan web

yang telah dibuat akan ditampilkan dalam bentuk site-site yang biasa

dilihat di Internet. Tentu saja sebelum menjalankannya harus

disimpan terlebih dahulu.

37

Page 34: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.10 Sistem Hardware Yang Di Perlukan

Untuk menginstal Macromedia Dreamweaver MX 2004, suatu komputer

harus memenuhi persyaratan agar dapat menginstalnya. Persyaratan minimal

yang diperlukan adalah sebagai berikut :

a. Sistem operasi Windows XP 2003

b. Intel Pentium 4

c. RAM 128 MegaByte DDR

d. Diperlukan kapasitas hardisk minimal 40 GigaByte

2.11 Sistem Sofware Yang Di Perlukan

Sedangkan sistem software yang diperlukan antara lain :

a. Macromedia Dreamweaver MX 2004

b. Macromedia Flash MX 2004

c. Macromedia Fireworks MX 2004

d. Browser : Internet Explorer, Netscape Communicator, dan lain-lain.

2.12 Software Pendukung

Selain menggunakan Macromedia Dreamweaver MX 2004, penulis juga

menggunakan software-software pendukung seperti :

2.12.1Macromedia Flash MX 2004

Macromedia Flash MX 2004 adalah perangkat lunak aplikasi

untuk pembuatan animasi yang diinginkan pada web, Macromedia Flash

MX 2004 mampu melengkapi situs web dengan beberapa macam

animasi, suara, animasi interaktif, dan lain-lain. Gambar Macromedia

Flash dapat diubah kedalam format lain untuk digunakan pada

pembuatan desain yang tidak langsung mengadaptasi Flash.

Dapat dibayangkan bila suatu halaman web yang berisi gambar

statis, dan pengunjung membuka halaman-halaman lain dengan tampilan

38

Page 35: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

yang monoton. Pengunjung akan bosan dan pada akhirnya berpindah

dengan membuka situs yang lebih menarik, kini situs-situs web telah

banyak menampilkan animasi yang menarik dengan Flash, sehingga

lama-kelamaan menjadi hal yang biasa. Namun penyajian yang dinamis

dengan kreatifitas yang meningkat akan membuat situs tetap menarik

bagi para pengunjung.

Pada saat ini, multimedia mempunyai arti tak hanya integrasi

antara teks dan grafik sederhana saja, tetapi dilengkapi dengan suara dan

animasi, sambil mendengarkan penjelasan dalam bentuk teks.

Flash dilengkapi dengan alat-alat untuk menggambarkan (tool)

seperti garis, lingkaran, kotak, dan lain-lain. Fungsi dari icon yang

terdapat dalam tool yang ada pada perangkat lunak aplikasi grafik

lainya.

2.12.1.1 ToolBox

ToolBox berisi gambar alat-alat dengan icon untuk

masing-masing fungsi. ToolBox terdiri dari empat bagian yaitu

tools, view, color, dan option seperti pada gambar dibawah ini:

a. Pensil Tool – Untuk menggambar garis seperti menggunakan

pensil.

b. Pens Tool – Untuk menggambarkan path seperti garis lurus

dan grafik lurus.

c. Line Tool – Untuk menggambar garis lurus.

d. Oval Tool – Untuk menggambar lingkaran dan elips.

e. Rectangle Tool – Untuk menggambar kotak.

f. Brush Tool – Untuk menggambar menggunakan brush.

g. Zoom Tool – Untuk memperbesar dan memperkecil gambar.

h. Hand Tool – Untuk menggeser gambar.

i. Stroke Color – Untuk menentukan warna outline pada gambar.

39

Page 36: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

j. Fill Color – Untuk mewarnai gambar.

Gambar 2.15 Tool Box pada Flash MX

2.12.1.2 Stage

Seperti film, Flash movie mempunyai panjang yang

terdiri dari sejumlah frame. Stage merupakan bidang yang

berwarna putih, diman semua objek seperti gambar, teks, dan

foto ditempatkan dan diatur didalamnya.

Gambar 2.16 Stage pada Flash MX

40

Page 37: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2.12.1.3 Panel

Panel berfungsi untuk menampilkan serta mengubah

informasi objek yang berada di stage. terdapat beberapa macam

panel dalam Flash, dan setiap panel menampilkan informasi

dari suatu objek yang kita kehendaki.

2.12.1.4 Timeline

Digunakan untuk mengatur semua jalan cerita, dimana

aktor ditampilkan dan menghilang. Suatu objek yang muncul

diatur dalam timeline tersebut, komponen utama timeline

adalah layer, frame, dan paly head.

2.12.1.5 Frame

Didalam timeline, anda dapat bekerja dengan frame dan

keyframe. Keyframe adalah frame dimana anda mendefinisikan

perubahan animasi termasuk frame action untuk memodifikasi

movie. Keyframe ini adalah merupakan bagian yang sangat

penting didalam animasi. Anda dapat mengubah panjang

animasi keyframe dengan menggunakan drag keyframe

didalam timeline.

2.12.2Macromedia Fireworks MX 2004

Apabila anda berhasil menginstal program, maka akan terdapat

shortcut pada start menu, dan pada display. Untuk menjalankannya, ikuti

langkah berikut:

1. Klik Start pada taskbar, Program │ Macromedia │ Fireworks

MX

41

Page 38: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

2. Aplikasi akan ditampilkan dalam keadaan tools tidak aktif

(Disable).

3. Untuk membuka dokumen baru, pilih menu File │ New, maka

akan muncul dialog box seperti berikut:

Gambar 2.17 Tampilan pengatur ukuran dan warna kanvas

4. Masukan lebar, tinggi dan resolusi untuk halaman kerja anda.

Secara default lebar dan tinggi kanvas (halaman kerja) adalah 800 x

600 pixel. Dengan resolusi 72 ppi (pixel per inci).

5. Pilih warna kanvas anda. Putih, transparan dan custom. Warna

custom dapat anda ubah dengan warna yang lain dengan memilih

pada kotak warna

6. Pilih OK.

Ketika interface program ditampilkan, maka halaman kerja akan

ditampilkan dengan ukuran sesuai setting anda. Tool, panels serta

property inspector juga ditampilkan. Tool panels secara default akan

ditampilkan di sebelah kiri halaman kerja, sedangkan property inspector

akan terlihat di bawah stage, dan di sebelah kanan halaman kerja

terdapat tab-tab panel. Apabila anda tidak ingin menampilkan tab-tab

dan panel tool, tekan tombol TAB pada keyboard.

42

Page 39: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Gambar 2.18 Tampilan halaman kerja

2.12.2.1 Toolbars

Toolbars terdiri dari dua macam yaitu toolbar main dan

toolbar modify. Apabila toolbar tersebut belum aktif, Anda

dapat menampilkanya dari menu Windows │ Toolbar │ Main

Toolbar ini mengandung perintah yang terdapat pada menu

File dan menu Edit.

43

Page 40: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

Gambar 2.19 Tampilan Toolbar

Berikut ini masing-masing fungsi setiap tools :

a. Tools Pemilih (select tools), digunakan untuk memilih sebuah obyek

yang akan digerakan, diubah skalanya, dirotasi. Diskew, atau dicrop,

berfungsi juga untuk menghapus obyek diluar obyek yang dicrop.

b. Tools Bitmap (Bitmap Tools), ini digunakan untuk membuat,

mengedit, dan mewarnai gambar bitmap.

c. Tools Vector (Vector Tools), objek yang dibuat menggunakan tool ini

akan mempunyai mode vector.

d. Tools Web (Web Tools), kelebihan Macromedia Fireworks MX

2004 ini adalah kita dapat membuat obyek interaktif untuk aplikasi

web menggunakan tool ini yaitu slice ataupun hotspot.dengan memilih

pada obyek yang akan menjadi obyek interaktif seperti rollover

ataupun peng-link-an.

e. Tools Warna (Color Tools), tools ini terbagi dalam beberapa

tool yaitu fill color, yang digunakan untuk mengatur warna dari obyek.

Stroke color, digunakan untuk memberi warna pada outline obyek.

Default stroke / fill color, memilih warna default yaitu hitam untuk

warna stroke dan putih untuk warna stroke. No stroke / fill color dan

swap brus / fill color, membuat obyek tidak mempunyai warna pada

garis batas obyek dan warna obyek

f. Tools Tampilan (View Tools), terdapat beberapa tool untuk

mengatur tampilan halaman kerja. Full screen mode untuk

menampilkan halaman kerja maximize tanpa menampilkan menu dan

toolbar. Full screen with menu mode, untuk menampilkan halaman

kerja maximize dengan menu bar. Standar screen mode, menampilkan

44

Page 41: 2.2World Wide Web (WWW) - storage.jak-stik.ac.idstorage.jak-stik.ac.id/students/paper/penulisan ilmiah/10403171/BAB... · 2.2World Wide Web (WWW) Awalnya informasi dapat dicari pada

halaman kerja secara default, yaitu terdapat toolbar dan menu

windows. Zoom, untuk memperbesar tampilan obyek terpilih.

Sedangkan hand tool, digunakan untuk menggerakan tampilan

windows. Tool ini digunakan ketika bekerja dengan halaman kerja

yang besar.

45