BAB II LANDASAN TEORI

Transkripsi

1 5 BAB II LANDASAN TEORI 2.1 Pengertian Internet Internet berasal dari kata Interconnection Networking yang mempunyai arti hubungan berbagai komputer dengan berbagai tipe yang membentuk sistem jaringan yang mencakup seluruh dunia ( jaringan komputer global ) dengan melalui jalur telekomunikasi seperti telepon, satelit, leased-line, ADSL ( Asymmetric Digital Subscriber Line ), dan kabel serat optic. Atau secara umum Internet merupakan suatu jaringan global yang terbentuk dari jaringan komputer local dan regional, memungkinkan komunikasi data antar komputer-komputer yang terhubung ke jaringan tersebut dengan menggunakan berbagai macam media. Internet adalah sumber daya informasi yang menjangkau seluruh dunia. Sumber daya informasi tersebut sangat luas dan sangat besar sehingga tidak ada satu orang, satu organisasi satu negara yang dapat menanganinya sendiri. Kenyataannya, tidak ada satu orang yang mampu memahami seluruh seluk-beluk internet. Yang mengatur integrasi dan komunikasi jaringan computer ini adalah protokol-protokol yang umum disebut TCP/IP. TCP ( Transmission Control Protokol )yang memastikan bahwa semua hubungan bekerja dengan benar, sedangkan IP ( Internet Protokol ) yang mentransmisikan data dari satu komputer ke komputer lainnya. TCP/IP secara umum antara lain berfungsi untuk memilih rute terbaik transmisi data, memilih rute alternatif jika suatu rute tidak dapat digunakan, mengatur dan mengirimkan paket-paket pengiriman data. Perlu diketahui asal-usul internet berasal dari jaringan komputer yang dibentuk pada tahun 1970-an. Jaringan komputer tersebut disebut Arpanet, yaitu jaringan computer yang dibentuk oleh Departemen Pertahanan Amerika Serikat.

2 6 Selanjutnya jaringan komputer tersebut diperbaharui dan dikembangkan, dan sekarang penerusnya menjadi tulang punggung global untuk sumber daya informasi yang disebut dengan Internet. Kegunaan internet diantaranya untuk mendukung bisnis global, akademik dan komunitas yang mewakili pribadi. Kegunaan internet terbagi menjadi 4 fungsi yaitu : 1. Fungsi komunikasi Internet adalah alat komunikasi, kegunaan yang sangat penting dari internet adalah pertukaran pesan antara manusia dengan electronic mail ( ), 2. Fungsi Resource Sharing Internet menghubungkan komputer dengan fasilitas sharing resources diantara computer, 3. Fungsi Resource Discovery Penuntun untuk mencari file tertentu, dokumen, host atau orang diantara jutaan host, 4. Fungsi Komunitas Masyarakat memakai internet untuk mendapatkan software gratis, untuk berkomunikasi dengan orang lain, menggunakan komputer dan basis data atau berbagai kebutuhan. 2.2 Beberapa Istilah dalam Internet Berikut ini beberapa istilah pada umumnya sering digunakan dalam hubungannya dengan Internet, diantaranya : World Wide Web ( WWW ) Salah satu layanan aplikasi di Internet adalah World Wide Web (WWW), pelayanan yang dikembangkan di Internet dan menjadi layanan aplikasi yang paling populer digunakan pemakai jaringan Internet. WWW atau yang biasa disebut Web saja, bekerja dengan teknologi yang disebut hypertext, yang kemudian dikembangkan menjadi suatu protocol aplikasi yang disebut HTTP (

3 7 HyperText Transfer Protocol ). WWW atau Web merupakan fasilitas hypertext untuk menampilkan data berupa text, grafik atau gambar, suara, animasi, dan sebagainya. Apabila diumpamakan WWW merupakan perpustakaan besar yang menyediakan berbagai buku dengan berbagai informasi yang dibutuhkan, Web Browser Browser / Web Browser adalah sebuah program aplikasi yang digunakan untuk menjelajahi dunia maya Internet. Aplikasi ini memiliki kemampuan untuk menampilkan suatu Web Page yang ditulis dalam bentuk dokumen HTML. Perkembangan Browser ini sangat cepat terutama dengan munculnya Netscape milik Netscape corp dan Internet Explorer yang dikembangkan oleh Microsoft Corporation yang sudah mencapai versi 6.0 untuk saat ini dan akan terus berkembang, HTML ( Hypertext Markup Language ) HTML kependekan dari Hypertext Markup Language adalah bahasa perancangan atau pemrograman umum yang digunakan dalam membangun halaman web berbasiskan standar World Wide Web Consortium(W3C). Informasi yang disediakan oleh WWW (World Wide Web) adalah dalam bentuk dokumen yang disebut dengan web page. Dikatakan markup language karena HTML berfungsi untuk memformat file dokumen teks biasa untuk bisa ditampilkan pada web browser dengan bantuan tanda-tanda yang sudah ditentukan. Hal tersebut dapat dilakukan dengan menambahkan elemen atau yang sering disebut dengan tag (penanda). Elemen HTML biasanya berupa tag yang berpasangan dan setiap tag ditandai dengan symbol < dan >. Pasangan dari sebuah tag ditandai dengan tanda /. Misalkan pasangan dari tag <contoh> adalah </contoh>. Dalam hal ini <contoh> disebut sebagai elemen dan biasanya dalam satu elemen terdapat atribut-atribut untuk mengatur elemen itu. Jadi misalnya elemen <contoh> bila ditulis dengan atributnya adalah sebagai berikut : <contoh atribut= nilai_atribut1 atribut2= nilai_atribut2 >. Dalam penulisan tag HTML tidaklah case sensitive artinya penggunaan huruf kecil ataupun huruf besar tidaklah menjadi masalah. Dokumen HTML memiliki

4 8 struktur dasar atau susunan file yang harus dibungkus dengan tag <HTML>, artinya di bagian awal dokumen dituliskan <HTML> dan dibagian akhir dokumen ditutup dengan </HTML>. Selain mengandung tag pembuka dan tag penutup dokumen HTML secara umum terbagi menjadi dua bagian yaitu HEAD yang berisikan teks yang akan muncul pada title bar browser dan BODY yang merupakan informasi yang berisikan tentang teks, gambar, atau apapun yang ingin ditampilkan pada halaman web. Contoh script dari HTML adalah sebagai berikut : <HTML> <HEAD><TITLE>.: Selamat Datang :.</TITLE></HEAD> <BODY BGCOLOR= red > <H1>TEST</H1> Hallo, nama saya adalah muzay </BODY> </HTML> Script HTML dapat dibuat di notepad yang kemudian disimpan dalam file berekstension HTML secara langsung. Namun dalam penulisan ini penulis membuat script HTML dengan menggunakan Macromedia Dreamweaver MX untuk pembuatan tampilannya agar lebih menarik dan interaktif Website Website atau Situs Web merupakan tempat penyimpanan data dan informasi dengan berdasarkan topik tertentu. Diumpamakan situs web ini adalah sebuah buku yang berisi topik tertentu. Website atau Situs Web juga merupakan kumpulan dari halaman-halaman web yang saling berkaitan didalam website tersebut, Homepage Homepage merupakan sampul halaman yang berisi daftar isi atau menu dari sebuah situs web. Homepage adalah halaman pembuka dari sekian banyak web page yang terdapat pada suatu website. Halaman pertama ini berisi tentang apa

5 9 dan siapa, dari perusahaan atau organisasi mana pemilik website tersebut, dan pada halaman pertama ini juga sering memiliki link link yang akan membawa dari satu halaman ke halaman lainnya dari sebuah situs web URL (Universal Resource Locator) Melalui world wide web seorang pengguna inernet bukan hanya bisa mengakses web page yang berupa dokumen html saja, tetapi juga dapat mengakses dokumen-dokumen lainnya yang disediakan melalui FTP, Gopher, Usenet News. Dengan adanya jenis dokumen yang bermacam-macam, maka dibutuhkan suatu cara untuk menunjuk dengan tepat dan cepat ke dokumen yang diinginkan. URL adalah jawaban masalah tersebut. URL sendiri merupakan pathname untuk mengidentifikasikan sebuah dokumen di web. Di dalam URL dimuat lokasi atau nama mesin (komputer) yang menyimpan dokumen yang diminta, serta protocol yang mengaksesnya. Contoh: Bagian pertama dari URL adalah http: mengidentifikasikan protocol yang digunakan untuk mengakses dokumen yang bersangkutan. Protocol ini penting dalam menangani komunikasi antar client dan server agar bahasa yang digunakan sama. Bagian kedua dari URL adalah yang menunjukkan lokasi mesin di internet atau internet tempat dimana dokumen tersebut berada HTTP (Hyper Teks Transfer Protokol) Hyper Teks Transfer Protocol adalah suatu protocol yang menentukan aturan yang perlu diikuti oleh web browser dalam meminta atau memanggil suatu dokumen dan oleh web server dalam menyediakan dokumen yang diminta oleh web browser. Protocol ini merupakan protocol standar yang digunakan untuk mengakses dokumen HTML (Hyper Teks Markup Language). Jika kita menjelajahi web dan melihat tulisan seperti Merupakan salah satu pengguna dalam protocol HTTP dalam web.

6 Macromedia Dreamweaver MX 2004 Macromedia Dreamweaver MX 2004 (yang selanjutnya ditulis dengan Dreamweaver MX saja) adalah software professional untuk desain, pemrograman dan manajemen situs web dengan tingkat fleksibilitas yang sangat tinggi. Tingkat fleksibilitas dimaksud memungkinkan user dengan keahlian tingkat lanjut (advance) untuk membuat situs web dengan cara menulis langsung kode HTML pada tools pemrograman yang terintegrasi pada software ini atau memungkinkan user tingkat awal (beginner) membuat situs web dengan menggunakan lingkungan visual editing pada menu-menu yang sudah disediakan, seperti drag dan drop semua elemen atau asset pada dokumen situs web. Dreamweaver MX merupakan situs web development tools yang memberikan tingkat kompatibilitas yang tinggi dengan software dari Macromedia sendiri seperti Macromedia Flash dan Macromedia Fireworks, atau software lainnya seperti Adobe Photoshop. Dreamweaver MX juga mendukung lima jenis teknologi server terbaru yaitu ASP.Net, ASP, JSP, ColdFusion, dan PHP Mengenal Area Kerja Macromedia Dreamweaver MX 2004 Dreamweaver MX tampil dengan wajah yang baru dibanding versi pendahulunya. Area kerja Dreamweaver MX memiliki tampilan yang lebih bersih karena baik Property Inspector maupun Panel Groups tampil tersembunyi. Akan tetapi, baik Property Inspector maupun Panel Groups juga dapat dimunculkan kembali setiap saat, sesuai dengan kemauan kita.

7 11 Gambar 2.1 Tampilan Area Kerja Dreamweaver MX Deramweaver MX memiliki dua layout kerja: layout pertama menampilkan semua fasilitas dalam satu layout. Layout kedua adalah berupa layout mengambang. Layout ini dapat menyembunyikan panel-panel default yang terbuka ketika melakukan instalasi software Dreamweaver MX pertama kali. Antarmuka pemakai Deramweaver MX terdiri dari : A. Baris Menu Baris menu merupakan baris perintah yang terdiri dari menu pop-up yang dapat diakses dengan menekan salah satu menu pada baris menu tersebut. Sehingga akan tampil menu pop-up yang terdiri dari seluruh perintah yang ada di Macromedia Dreamweaver MX. Didalam sisem menu dreamweaver MX terdapat beberapa komponen yang kita gunakan, yaitu : - Menu File Berisi item menu standar untuk menu file. Terdiri dari beberapa macam perintah untuk menampilkan atau memperlakukan dokumen baru, seperti Priview in Browser dan Print Code. - Menu Edit

8 12 Berisi item menu standar untuk menu edit. Berisi perintah untuk pemilihan, seperti Select Parent Tag, serta Find dan Replace. - Menu View Berisi perintah untuk menampilkan beberapa macam tampilan dari dokumen yang kita buat (seperti tampilan Design View dan tampilan Code) dan untuk menampilkan serta menyembunyikan beberapa elemen halaman, tombol-tombol dreamweaver dan toolbar. - Menu Insert Berisikan alternatif baris insert untuk menyisipkan objek di dalam dokumen. - Menu Modify Berfungsi untuk melakukan perubahan property pada item atau halaman terpilih. Dengan menggunakan menu ini kita dapat mengedit atribut tag, mengganti table dan elemen table, dan bermacam bentuk aksi untuk item library dan tempelate. - Menu Text Berfungsi untuk mempermudah dalam melakukan format teks. - Menu Commands Berisi akses ke beberapa perintah, format kode yang sesuai dengan format pilihan kita, membuat foto album, dan melakukan pengeditan gambar dengan menggunakan Macromedia Fireworks. - Menu Site Berisi item menu untuk mengelola situs, upload dan download file. - Menu Window Menyediakan akses keseluruh panel, inspector, dan jendela didalam Dreamweaver. - Menu Help Menyediakan akses kedokumen Dreamweaver, membuka lembar kerja Help untuk membantu kita dalam mengguanakan Dreamweaver, dan menyediakan bahan referensi untuk beberapa bahasa.

9 13 B. Baris standar Pada saat membuka jendela Dreamweaver MX, secara default hanya menampilkan Document Bar tanpa menampilkan standar Bar. Gambar 2.2 Standar Bar Untuk menambahkan atau mengaktifkan Standar Bar, kita lakukan langkahlangkah berikut : 1. Buatlah sebuah dokumen baru 2. Pilih Menu View> Toolbars sehingga submenu Document dan standar 3. Klik pilihan Standar untuk menampilkan Standar Bar Membuat Layout Sederhana dan Menata Tabel Pembagian layout situs web lebih didasarkan pada bentuk-bentuk umum sebuah situs web, namun demikian untuk saat ini sudah sangat banyak web yang memiliki layout yang unik dan lain, bahkan aneh, namun tetap idealis dan memiliki nilai seni yang tinggi sehingga situs web tersebut terlihat lebih cantik dan menarik. Gambar 2.3 Web Layout secara umum dan sederhana

10 14 Setelah kita mengetahui bentuk layout situs web secara umum, sekarang kita akan belajar bagaimana menata tabel agar membentuk layout yang diinginkan. Cara memasukkan tabel ke dalam dokumen layout seitus web adalah segai berikut: 1. Pada menu bar, klik Insert > Tabel, sehingga akan muncul sebuah jendela. Gambar 2.4 Memasukkan tabel 2. Setelah itu, pada dokumen akan muncul sebuah tabel yang memiliki 3 baris dan 2 kolom. Gambar 2.5 Tabel Pada Dokumen

11 15 3. Lakukan penggabungan antara 2 kolom yang terletak pada baris pertama (atas) dan baris ketiga (bawah) sehingga akan membentuk seperti pada gambar berikut. Caranya, klik kanan mouse (pada baris pertama) > Tabel > Merge Cells. Lakukan hal yang sama pada baris ketiga. Gambar 2.6 Hasil Penggabungan 4. Atur panjang dan lebar tabelnya dengan meletakkan kursor mouse pada garis batas antar cells pada tabel, lalu drag mouse hingga membentuk layout seperti yang kita kehendaki.

12 16 Gambar 2.7 Layout Tabel Penggabungan Frame Penggunaan frame pada pembuatan sebuah situs web merupakan salah satu cara untuk membagi jendela web browser menjadi beberapa bagian, dimana masingmasing bagian dapat menampilkan halaman situs web yang berbeda-beda. Umumnya frame digunakan untuk menampilkan beberapa halaman situs web yang berbeda secara bersamaan, misalnya frame digunakan untuk membagi jendela web browser menjadi tiga bagian di mana pada bagian pertama digunakan untuk menampilkan bagian judul halaman situs web, bagian kedua untuk menampilkan bagian halaman situs web yang berisi navigasi, sedangkan bagian ketiga dari web browser menampilkan halaman isi situs web saja. Penggunaan frame bertujuan untuk meningkatkan kecepatan loading halaman situs web. Hal ini sangat dimungkinkan karena web browser hanya perlu melakukan satu kali loading untuk bagian judul dan bagian navigasi pada halamn situs web yang sifatnya statis untuk isi situs web yang berbeda. Berbeda dengan situs web yang tidak menggunakan frame dalam pembuatan situs web, setiap terjadi penggantian halaman situs web, web browser perlu melakukan loading bagian halaman yang berisi navigasi dan isi situs web.

13 17 Deramweaver MX menyediakan dua cara untuk membuat frame pada halaman situs web, yaitu dengan membuat sendiri desain frameset atau menggunakan beberapa desain frameset yang sudah disediakan Dreamweaver MX secara default. Langkah-langkah untuk membuat frameset: 1. Buat file situs web baru dengan mengklik menu File > New atau dengan menekan tombol Ctrl+N secara bersamaan, kemudian akan muncul kotak dialog New Dokument. Pada kotak Category pilih Framesets, kemudian muncul kotak pilihan jenis framesets, pilih jenis Fixed Top, Nested Left. Klik tombol Create untuk membuat frameset pada file tersebut. Gambar 2.8 Memasukkan Frame 2. Pada jendela dokumen terbentuk tiga frame

14 18 Gambar 2.9 Tampilan 3 Frame 2.4. Struktur Navigasi Struktur navigasi merupakan struktur alur dari suatu program yang merupakan rancangan hubungan dan rantai kerja dari beberapa area yang berbeda dan dapat membantu mengorganisasikan seluruh elemen multimedia dengan memberikan perintah dan pesan, ada empat macam bentuk dari navigasi yang biasa digunakan dalam proses pembuatan aplikasi multimedia, yaitu: Linear Linear (satu alur), merupakan struktur yang hanya mempunyai satu rangkaian cerita yang berurutan. Struktur ini menampilkan satu demi satu tampilan layer secara berurut menurut urutannya. Tampilan yang dapat ditampilkan pada struktur jenis ini adalah satu halaman sebelumnya atau dua halaman sesudahnya. Pada truktur ini tidak di perkenankan adanya percabangan. Biasanya digunakan untuk multimedia presentasi, karena tidak terlalu menuntut keinteraksian tapi hanya memerlukan keindahan dan kemudahan data sebagai informasi.

15 19 Gambar 2.10 Struktur Navigasi Linear Non Linear Struktur navigasi non-linear disebut juga dengan struktur tidak terurut. Merupakan pengembangan dari struktur linear. Pada struktur ini dapat diperkenankan adanya percabangan, pola percabangan non-linear memiliki kedudukan yang sama sehingga tidak ada master page. Gambar 2.11 Struktur Navigasi Non Linear Hirarki Struktur hirarki (bercabang), merupakan suatu struktur yang mengandalkan percabangan untuk menampilkan data berdasarkan criteria tertentu. Tampilan pada menu pertama akan di sebut sebagai master page, master page ini akan mempunyai halaman percabangan yang disebut slave page. Jika salah slave page dipilih atau diaktifkan, maka tampilan tersebut akan bernama master page (halaman utama kedua), dan seterusnya. Pada struktur penjajakana ini tidak diperkenankan adanya tampilan secara linear.

16 20 Gambar 2.12 Struktur Navigasi Hirarki Campuran Struktur campuran adalah merupakan gabungan dari ketiga struktur navigasi sebelumnya, maka struktur ini disebut juga struktur bebas, jika dari satu tampilan membutuhkan percabangan, maka dapat dibuat percabangan dan bila pada percabangan tersebut terdapat suatu tampilan yang sama kedudukannya, maka dapat dibuat struktur linear dalam percabangan tersebut. Gambar 2.13 Struktur Navigasi Campuran