Modul Ajar Disain Web Politeknik Elektronika Negeri Surabaya (PENS)


Modul Ajar Disain Web
Politeknik Elektronika Negeri Surabaya (PENS)
Bab 1
World Wide Web
1.1 Pendahuluan
WWW (World Wide Web) merupakan kumpulan informasi pada beberapa server komputer yang terhubung satu sama lain dalam jaringan Internet. Informasi dalam Web mempunyai link yang menghubungkan informasi yang satu dengan informasi yang lain dalam jaringan Internet. Link ini berupa tanda khusus yang biasanya dinyatakan dengan teks berwarna biru dan bertanda garis bawah/dalam bentuk icon maupun gambar yang dikelilingi kotak.
Untuk mengetahui apakah suatu teks/obyek merupakan suatu link, lihatlah perubahan pada petunjuk mouse. Jika petunjuk mouse berubah dari bentuk tanda panah menjadi gambar tangan yang sedang menunjuk, berarti teks/obyek tersebut merupakan suatu link yang menghubungkan Anda ke informasi lain dalam WWW. Sistem yang dapat mengubungkan informasi melalui link disebut Hypertext. Dengan semakin berkembangnya WWW, istilah Hypertext kemudian berubah menjadi Hypermedia, di mana link penghubung antar informasi bukan lagi berupa suatu teks, tetapi bisa berupa suatu file multimedia, seperti gambar, suara/video.
Bekerja dengan Web mencakup bekerja dengan software Web Browser dan software Web Server. Keduanya bekerja seperti sistem client server dengan tugas sebagai berikut:Web browser sebagai client untuk menginterpretasikan dan melihat informasi Web.
a. Web server sebagai server untuk menerima informasi yang diminta oleh browser. Untuk mengakses Web, Anda memerlukan suatu program yang disebut Web Browser.
1.2 Browser
Browser adalah suatu program yang dirancang untuk mengambil informasi dari suatu server komputer pada jaringan Internet. Informasi ini dikemas dalam page yang masing-masing memiliki beberapa link yang menghubungkan Web page ke sumber informasi lain. Jika suatu link diklik, browser akan melihat alamat dari tujuan link tersebut, kemudian mencari di Web server. Jika menemukan alamat dari tujuan link, browser akan menampilkan informasi yang ada. Jika tak menemukan alamat dari tujuan link, browser akan memberikan suatu pesan yang menyatakan bahwa alamat dari tujuan link tidak dapat ditemukan.
Ketika belum banyak komputer yang menggunakan program Windows, browser dibuat dengan berbasiskan teks, sedangkan untuk menyatakan link dapat dibuat barisan nomor yang mirip dengan suatu menu. Software ini dibuat untuk komputer yang menggunakan Unix. Setelah itu muncul browser Mosaic dari NCSA (National Center Supercomputing Applications) yang berbasiskan grafik dan mudah digunakan. Browser ini dipakai untuk komputer UNIX, NeXT, Windows dan Macintosh.
Sekitar tahun 1994, muncullah Netscape versi pertama menggantikan kepopuleran Mosaic sebagai Web browser. Sampai saat ini Netscape masih merupakan
Modul Ajar Disain Web
Politeknik Elektronika Negeri Surabaya (PENS)
browser yang paling banyak digunakan untuk melakukan navigasi di Web. Kemudian salah satu perguruan tinggi terkenal di AS, yaitu MIT, membangun standar bagi teknologi Web yang disebut World Wide Web Consortium (W3C). Teknologi terakhir yang dikembangkan oleh Microsoft adalah Internet Explorer 3.0 yang mendukung HTML 3.2.
1.3 HTTP (Hypertext Transfer Protocol)
HTTP merupakan protokol yang menentukan Web browser dalam meminta/mengambil suatu dokumen, dan menentukan Web server dalam menyediakan dokumen yang diminta oleh Web browser. Ini adalah protokol standar yang dipakai untuk mengakses dokumen HTML. HTTP digunakan untuk menjelajahi Web yang berhubungan dengan banyak protokol lain.
1.4 URL
URL (Uniform Resource Locator) adalah suatu alamat yang dipakai untuk menentukan lokasi informasi pada Web server, karena alamat ini mengambil informasi yang diminta oleh browser. Format umum dari suatu URL adalah: protokol_transfer://nama_host/path/nama_file
Contoh: http://www.macromedia.com/shockzone/info/security.html
Yaitu berisi :protokol yang digunakan, nama server dari komputer yang dicari, jalur dari informasi yang dicari, nama file dari informasi yang dicari.
DNS (Domain Name System) Untuk mempermudah pengelolaan Web server dan Web browser pada komputer di Internet, komputer di Internet menggunakan suatu format penamaan yang disebut Domain Name System (DNS). DNS membagi domain menjadi beberapa tingkat yang merupakan kelompok komputer yang terhubung ke Internet. Nama domain beserta jenis organisasinya, antara lain:
• com —> untuk komersial
• edu —> untuk pendidikan
• net —> untuk provider Internet
• id —> untuk negara Indonesia
• gov —> untuk Lembaga Pemerintahan
• int —> untuk Organisasi International
• mil —> untuk Organisasi Militer
• org —> untuk Organisasi Umum
Web browser inilah yang disebut-sebut sebagai gerbang internet dengan kemampuan untuk menangani WWW (Web Wide World) dengan protokol HTTP (HyperText Transfer Protokol) yang merupakan protokol internet yang favorit saat ini selain FTP (File Transfer Protokol) dan POP2 sebuah protokol untuk email.
Modul Ajar Disain Web
Politeknik Elektronika Negeri Surabaya (PENS)
Gambar 1.1. Contoh tampilan Internet Explorer
Gambar 1.2. Contoh tampilan Opera
Gambar 1.3. Contoh tampilan Netscape
Modul Ajar Disain Web
Politeknik Elektronika Negeri Surabaya (PENS)
1.5 Web Server
Web server adalah suatu perangkat komputer berupa software yang digunakan untuk menjadi sebuah komputer menjadi server yang dapat menangani semua kegiatan yang berhubungan dengan protokol HTTP. Komputer yang dilengkapi oleh software ini akan dapat diakses oleh komputer lain menggunakan web browser dengan cara menuliskan nama server (host name) atau dengan menuliskan nomor IP dari komputer tersebut.
Setiap pembuatan aplikasi berbasis web akan membutuhkan web server untuk meletakkan aplikasi tersebut sehingga bisa diakses menggunakan protokol HTTP. Beberapa web-server yang saat ini banyak digunakan adalah:
• Apache, web server gratis yang sangat mudah diperoleh. Awalnya apache ini berbasis UNIX, tetapi saat ini apache sudah tersedia untuk sistem operasi Windows.
• IIS (Internet Information System), web server keluar Microsoft yang banyak digunakan sebagai web server untuk aplikasi web dengan sistem operasi windows, dan bahasa pemrograman web ASP atau ASP.NET
Dalam modul ini akan digunakan web server Apache, salah satu web server gratis yang mudah diperoleh dan mendukung pemrograman PHP. Untuk melihat apakah web server Apache sudah ada atau belum di komputer yang akan digunakan adalah dengan membuka web browser dan menuliskan localhost atau no IP dari komputer. Bila di komputer ada sudah ada web server maka hasilnya adalah seperti gambar 1.4. berikut:
Gambar 1.4. Di dalam komputer ada web server Apache2 dari TRIAD
Bila tidak ada web server di komputer, maka hasilnya adalah sebagai berikut:
Modul Ajar Disain Web
Politeknik Elektronika Negeri Surabaya (PENS)
Gambar 1.5. Komputer tidak mempunyai web server.
Bila di komputer sudah ada web server, maka selanjutnya tinggal membuat aplikasi web. Dalam pembuat aplikasi web pertama kali, letakkan program aplikasi yang dibuat di dalam folder: c:\apache2triad\htdocs, dan bila menggunakan folder khusus letakkan folder tersebut dalam folder di atas. Penguabhan folder web dapat dilakukan dengan mengubah [documentRoot] pada file c:\apache2triad\conf\httpd.conf dengan cara sebagai berikut: Ubah dengan folder dimana aplikasi web dibuat
Gambar 1.6. Letak dokumen root
Modul Ajar Disain Web
Politeknik Elektronika Negeri Surabaya (PENS)
1.6 HTML (HyperText Markup Language)
HTML yang akan dibahas meliputi beberapa tahap, yaitu level HTML, HTML Extension dan program Editor HTML. HTML adalah format data yang dipakai untuk membuat dokumen HyperText. Dokumen HTML disebut Mark Language, karena berisi tanda tanda tertentu yang digunakan untuk menentukan tampilan suatu teks dan tingkat kepentingan dari teks tersebut dalam suatu dokumen. Pada sistem HyperText pada dokumen HTML, Anda tidak harus membaca dokumen secara urut dari atas ke bawah, melainkan cukup menuju pada topik tertentu secara langsung dalam dokumen. Ini dikarenakan dokumen tersebut menggunakan teks penghubung ke suatu topik/ dokumen lain secara langsung.
Sejak perkembangannya sampai sekarang ini telah tersedia bermacam-macam level HTML, antara lain HTML 1.0; HTML 2.0; HTML 3.0; HTML 3.2; dan HTML Extension.
* HTML 1.0
HTML level 1.0 adalah level pertama untuk HyperText Markup Language. Desainnya sederhana sekali, di antaranya heading, paragraph, hypertext, list dan format teks untuk tebal/ miring. Kelemahan HTML 1.0 adalah tidak ada fasilitas gambar, sehingga teks tak dapat diletakkan di sekeliling suatu image.
* HTML 2.0
HTML level 2.0 mencakup semua fasilitas level 1.0 ditambah dengan fasilitas untuk membuat form. Form ini dipakai dalam Web page untuk meminta saran dari pembaca, dan kotak penyuntingan (edit box). Dengan HTML 2.0, WWW dapat menjadi suatu media informasi dua-arah antara pemilik Web dengan pemakai Web, bukan hanya sekedar sistem penampil informasi.
* HTML 3.0
HTML level 3.0 sangat kompatibel dengan HTML level 2.0, tetapi disertai dengan beberapa fasilitas baru. Fasilitas baru tersebut antara lain penambahan fasilitas pembuatan tabel dan gambar dengan perintah FIGURE. Perintah FIGURE sendiri merupakan perkembangan dari perintah IMAGE .
* HTML 3.2
HTML 3.2 merupakan pengganti dari HTML 3.0 dengan beberapa tambahan, seperti applet Java (teks yang dapat diletakkan di sekeliling gambar), superscript, subscript, perataan pada tabel, background gambar dan warna, fasilitas frame dan sytle sheet ( pemisah layout halaman dengan isinya).
* HTML Extension
Salah satu tambahan pada HTML ini adalah tag yang membuat teks dalam tag tersebut tampil berkedip-kedip dalam Netscape Browser. Pada HTML ini terdapat bermacam-macam daya kreatif untuk mengembangkan HTML yang sangat diperlukan selama tidak mengganggu penampilan dokumen HTML pada browser.
1.7 Program Editor HTML
Untuk membuat dokumen HTML, sebaiknya Anda menggunakan program editor teks seperti Notepad, Sidekick, dan WS dalam format Non Document untuk aplikasi DOS. Program WYSIWYG, seperti Microsoft Word dan Word Perfect for Win, tidak dapat dipakai untuk membuat dokumen HTML, karena program ini dianggap sebagai dokumen biasa dan tidak dapat diterjemahkan oleh Browser. Program tambahan
Modul Ajar Disain Web
Politeknik Elektronika Negeri Surabaya (PENS)
yang dipakai untuk menyunting HTML adalah Word Internet Assistant dan WordPerfect Internet Publisher.
Selain program editor teks, Anda bisa menggunakan program editor khusus untuk membuat HTML, antara lain program editor HTML berbasis teks dan WYSIWYG yang tidak memerlukan browser lagi.
1.8 Bagaimana WWW Bekerja
(1) Informasi web disimpan dalam dokumen yang disebut dengan halaman-halaman web (web pages)
(2) web page adalah file-file yang disimpan dalam komputer yang disebut dengan server-server web (web server)
(3) Komputer-komputer membaca web page disebut sebagai web client
(4) Web client menampilkan page dengan menggunakan program yang disebut dengan browser web (web browser)

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s