BAB II LANDASAN TEORI

BAB II
LANDASAN TEORI
2.1.
Pengertian Visualisasi
Visualisasi adalah tampilan pada layar monitor baik dalam bentuk gambar
yang bergerak ataupun tidak, serta dapat pula gambar yang disertai dengan suara.
2.1.1. Internet
Internet adalah kependekan dari International Networking, yang artinya
jaringan computer berskala international/global yang dapat membuat masingmasing komputer saling berkomunikasi.
2.1.2. WWW
WWW adalah kependekan dari World Wide Web, atau lebih dikenal
dengan nama web. Web adalah sebuah layanan yang dapat dibuat oleh pemakai
komputer
apabila komputernya tersambung dengan internet. Dengan Web,
pengguna computer diseluruh dunia dapat saling berinteraksi dengan pengguna
internet lainnya tanpa harus beranjak dari tempat dimana internet tersebut diakses.
2.1.3. HTML
HTML adalah kependekan dari Hyper Text Markup Language, yang
artinya tatacara penulisan yang digunakan dalam dokumen web. Dokumen HTML
adalah sebuah dokumen teks murni yang dapat dibuat dengan editor web
sembarang seperti Notepad. Dokumen ini akan dieksekusi oleh sebuah browser
(misal Internet Explorer), sehingga browser mampu menghasilkan suatu dokumen
yang sesuai dengan keinginan seorang designer atau programmer web.
4
5
2.1.4. Website
Website adalah sekumpulan halaman web yang bisa diakses melalui
browser web. Satu halaman disebut homepage, halaman ini adalah halaman yang
pertama kali dilihat ketika seseorang mengunjungi website. Dari homepage
pengunjung dapat mengklik teks atau gambar untuk berpindah kehalaman lain
dalam website tersebut atau kehalaman lain diwebsite lain. Homepage berada
pada posisi teratas dengan halaman-halaman terkait berada dibawahnya.
2.1.5. TCP/IP
TCP/IP adalah kependekan dari Transmission Control Protocol/Internet
Protocol, artinya protokol yang terdiri dari sub-protokol, yang beroperasi pada
lapisan yang berbeda. Ini merupakan standar protokol internet. Protokol ini
memberikan nomor Unix pada setiap komputer yang terkoneksi.
2.2.
Peta Navigasi
Navigasi merupakan unsur penting dalam banyak halaman web.
Tujuannya adalah agar seseorang merasa mudah mengemudikan suatu halaman
web. Program web browser sendiri seprti Internet Explorer dan Netscape
Navigator, dilengkapi fasilitas navigasi untuk mempermudah seseorang dalam
menjelajahi dunia internet.
Komponen navigasi biasanya berupa fasilitas yang berfungsi untuk
berpindah kehalaman web lainnya, yang diwujudkan dalam berbagai macam cara.
2.2.1. Navigasi Linier
Struktur navigasi yang hanya mempunyai suatu rangkaian cerita terurut.
Struktur ini menampilkan satu demi satu tampilan layar secara berurut menurut
aturannya. Tampilan yang ditampilkan pada struktur jenis ini adalah satu halaman
sebelumnya atau satu halaman sesudahnya.
Gambar 2.1 Struktur navigasi model linear
6
2.2.2. Navigasi Hirarki
Struktur navigasi yang menghandalkan percabangan untuk menampilkan
data berdasarkan kriteria tertentu. Tampilan pada menu pertamanya disebut
sebagai master page (halaman uatama ke-1), halaman utama ini akan mempunyai
halaman percabangan yang disebut slash page (halaman pendukung).
Gambar 2.2 Struktur navigasi hirarki
2.2.3. Navigasi Non Linier
Struktur navigasi yang tidak memperhatikan batasan rute dengan kata lain
pemakai dapat menelusuri program sesudahnya. Tampilan pada menu pertamanya
disebut sebagai master page (halaman utama ke-1), halaman utama ini akan
mempunyai halaman percabangan yang disebut slash page (halaman pendukung).
Gambar 2.3 Struktur navigasi model non linear
7
2.2.4. Navigasi campuran
Struktur navigasi yang merupakan gabungan demi struktur navigasi non
linear dan hirarki.
Gambar 2.4 Struktur navigasi model campuran
2.3.
Pengenalan Macromedia Dreamweaver 8
Dreamweaver
adalah software yang digunakan oleh Web desainer
ataupun Web programmer untuk mengembangkan situs web. Ruang kerja, fasilitas
dan kemampuan Dreamweaver mampu meningkatkan produktivitas dan
efektivitas dalam mendesain ataupun membangun situs web. Dreamweaver juga
dilengkapi dengan fasilitas yang cukup lengkap.
Maka dari itu aplikasi yang akan dibuat ini menggunakan Macromedia
Dreamweaver 8.
2.3.1. Ruang Kerja Dreamweaver 8
Pada saat pertama kali anda memulai Dreamweaver 8, sebuah kotak dialog
Workspace akan muncul, memberikan penawaran kepada anda untuk memilih
tampilan ruang kerja yang ingin anda gunakan.
Dreamweaver 8 Workspace adalah ruang kerja yang semua jendela
dokumen dan panel integrasi pada satu jendela besar, dengan panel group yang
berada disisi kanan. Pilihan ini dipakai oleh banyak pengguna. Dreamweaver
8
Workspace adalah tampilan lama seperti pada Dreamweaver. Setiap
dokumen akan berada pada jendela yang terpisah.
Ruang kerja pada Draemweaver 8 memiliki komponen yang memberikan
fasilitas dan ruang untuk menuangkan kreasi dalam bekerja, seperti yang terlihat
pada Gambar 2.5. Komponen yang disediakan oleh Dreamweaver 8 antara lain
adalah Insert bar, Document toolbar, Document window, Panel groups, Site panel,
Property inspector.
Perhatikan Gambar 2.5 dibawah ini. Berikut bagian-bagian yang terdapat pada
jendela kerja dari Dreamweaver 8.
A
D
B
C
Gambar 2.5 Jendela Kerja Dreamweaver 8
A.
Insert Bar
Insert Bar merupakan kumpulan menu yang digunakan untuk memasukkan
sebuah objek atau fungsi lainnya ke dalam jendela dokumen. Contoh:
image, Layer, Tabel dan lain-lain.
Insert Bar juga mempunyai tujuh menu didalamnya yaitu Common,
Layout, Forms, Text, HTML, Application dan Flash Elements.
Untuk menampilkan dan menggunakan menu yang terdapat pada Insert
Bar, Anda dapat meng-klik tombol drop down yang berada di sebelah kiri
Insert Bar. Perhatikan Gambar 2.6 pada halaman berikut.
9
Gambar 2.6 Menu Insert Bar
B.
Document Toolbar
Document Toolbar digunakan sebagai penempatan file-file yang telah
dibuka dan sekaligus untuk menampilkan nama dari file tersebut.
Document Toolbar juga mempunyai tiga buah tab yang dapat membantu
Anda mendesain web dengan mengubah tampilan dari jendela dokumen,
diantaranya Code, Split, Design.
Gambar 2.7 Tampilan Document Toolbar
 Code
: merupakan kumpulan kode program yang telah disusun, dan
berfungsi untuk mengedit listing dari program.
 Split
: digunakan untuk menampilkan tab dari code view dan design
view secara bersamaan.
 Design : digunakan sebagai tempat untuk meletakkan objek-objek ke
dalam jendela dokumen, seperti Tabel, Form, dan lainnya.
Perhatikan Gambar 2.8 di bawah ini mengenai contoh dari tab Code,
Split, dan Design.
10
Split
View
Code
View
Design
View
Gambar 2.8 Tab-tab View
C.
Document Window
Document Window atau biasa disebut dengan jendela dokumen,
merupakan tempat untuk menampilkan objek-objek atau kode program dari
tab code, split, dan design.
D.
Panel Groups
Panel Group berfungsi untuk mengatur halaman web yang telah Anda buat.
Contoh : Panel File, berfungsi untuk mencari dan mengetahui letak
halaman file-file yang telah di buat.
E.
Property Inspector
Property Inspector berfungsi untuk mengetahui atau mengubah property
dari sebuah objek. Contoh : untuk penulisan sebuah teks, Anda dapat
mengubah font, color, dan size dari teks tersebut dengan menggunakan
Property Inspector.
Gambar 2.9 Tampilan Property Inspector
11
2.3.2. Komponen Ruang Kerja
Di dalam ruang kerja Dreamweaver 8 terdapat beberapa komponen utama
yang membentuk suatu ruang kerja. Berikut ini keterangan singkat tentang menu
yang ada pada Dreamweaver 8. Menu berisi submenu yang biasanya ditampilkan
sebagai dropdown menu yang akan muncul ketika anda menekan tombol menu
utama.
Gambar 2.10 Menu pada Dreamweaver 8
Di dalam sistem menu Dreamweaver 8 terdapat beberapa komponen yang
dapat digunakan, yaitu :
1. File Menu
Berisi menu standar seperti New, Open, Save, Cut, Copy, dan Paste. Fole
menu juga berisi beberapa perintah tambahan, seperti Preview in Browser dan
Print Code.
2. Edit Menu
Berisi perintah seleksi dan pencarian, seperti Select Parent Tag dan Find and
Replace, dan menyediakan akses ke Keyboard Shortcut Editor dan Tag
Library Editor.
3. View Menu
Mengijinkan anda melihat tampilan dokumen dengan beberapa cara (seperti
Design view dan Code view) dan untuk menampilkan atau menyembunyikan
beberapa elemen pada dokumen dan peralatan yang dimiliki Dreamweaver 8.
4. Insert Menu
Menyediakan alternatif untuk memasukkan objek pada dokumen.
5. Modify Menu
Untuk mengubah properti elemen halaman web atau item lainnya yang dipilih.
Menggunakan menu ini dapat mengedit tag, mengubah table dan elemen tabel
dan menampilkan beberapa tindakan yang dapat dilakukkan untuk item pada
library da template.
12
6. Text Menu
Menyediakan perintah yang dibutuhkan untuk melakukan pemformatan pada
teks.
7. Commands Menu
Menyediakan akses untuk beberapa macam perintah, termasuk untuk membuat
album foto dengan cepat dan melakukan optimasi gambar dengan
menggunakan program lain.
8. Site Menu
Menyediakan item menu untuk membuat, membuka, mengedit site.
9. Window Menu
Menyediakan
akses
kesemua
panel,
inspectors,
dan
jendela
pada
Dreamweaver.
10. Help Menu
Menyediakan akses ke dokumentasi yang dimiliki oleh Dreamweaver 8,
termasuk cara penggunaan Dreamweaver 8, membuat ekstensi dan material
lainnya yang dapat membantu anda menggunakan Dreamweaver 8 dengan
lebih baik.
2.4.
Pengenalan Macromedia Flash 8
Macromedia Flash 8 adalah program grafis animasi standar professional
untuk menghasilkan halaman web yang menarik. Movie Flash terdiri atas grafik,
teks, animasi dan aplikasi untuk situs web. Macromedia Flash 8 juga mempunyai
kemampuan untuk mengimpor video, gambar dan suara dari aplikasi diluarnya.
Movie Flash juga bisa memasukkan unsur interaktif dalam movienya
menggunakan action script, yaitu bahasa pemrograman berorientasi objek, yang
nantinya user bisa berinteraksi dengan movie, menggunakan keyboard atau mouse
untuk berpindah kebagian-bagian yang berbeda dari suatu movie, mengontrol
movie, memindahkan objek-objek, memasukkan informasi melalui form dan
operasi-operasi lainnya.
13
Kemampuan flash lainnya adalah membuat animasi logo, pengaturan
navigasi halaman web, pembuatan animasi form, dan lainnya sesuai kreativitas
dan imajinasi dalam menggunakan kemampuan Flash yang ada.
2.5.
Perangkat Pendukung
Perangkat pendukung utama dalam pembuatan website yakni :
Macromedia Dreamweaver 8, dan software pendukung Macromedia Flash 8,
untuk pembuatan animasi teks dan gambar. Spesifikasi Hardware yang digunakan
:
a. Processor Intel Pentium II dengan 300 Mhz atau yang lebih tinggi.
b. Sistem Windows 98, Windows 2000, Windows NT, Windows ME atau
Windows XP.
c. Menggunakan browser Netscape Navigator versi 4 atau yang lebih tinggi dan
menggunakan Internet Explorer.
d. Minimal 98 MB RAM (Random Access Memory) atau menggunakan 128 MB
RAM yang direkomendasikan.
e. Ruangan yang tersisa pada Harddisk minimal 275 MB.
f. CD-ROM.