02 Teknologi Web
-
Upload
herman-tolle -
Category
Education
-
view
2.412 -
download
37
description
Transcript of 02 Teknologi Web
Teknologi Web Disain & Pemrograman WebTeknik Elektro Universitas Brawijaya
Herman Tolle, ST., MT - ([email protected])
Introduksi
World Wide Web adalah layanan internet yang paling populer saat ini
Internet mulai dikenal dan digunakan secara luas setelah adanya layanan WWW
WWW adalah halaman-halaman website yang dapat saling terkoneksi satu dengan lainnya (hyperlink) yang membentuk samudra belantara informasi
WWW berjalan dengan protokol HyperText Transfer Protokol (HTTP)
Halaman Web merupakan file teks murni (plain text) yang berisi sintaks-sintaks HTML yang dapat dibuka/ dilihat/ diterjemahkan dengan Internet Browser
Sintaks HTML mampu memuat konten gambar, audio, video dan animasi
Browser adalah sebuah program aplikasi atau software yang me-request dokumen-dokumen dari komputer-komputer yg terkoneksi internet (server) di seluruh dunia, dan menampilkan informasi dari dokumen tersebut pd window browser.
Browser menampilkan sesuai instruksi (format) HTML yg dibuat pd dokumen tsb.
Internet Web Browsers
Sejarah World Wide Web
hypertext [Bush 1945, Nelson 1960’s] Awal 90’-an, Tim Berners-Lee, sarjana
fisika pd riset Nuklir Swiss (CERN) menciptakan HyperText Markup Language (HTML) dan
Browser teks pertama: Lynx Berners-Lee saat ini memimpin WWW
Consorsium (W3C) lembaga yang menyusun standarisasi HTML dan dokumen web.
1993: Browser grafis pertama: Mosaic dibuat oleh Andressen dan Eric Bina (mhs University of Illinois)
1994: Andressen kemudian bekerja untuk Netscape, dan membuat Netscape Navigator, browser grafis populer pertama
1995: Microsoft membuat Internet Explorer
Browser saat ini: Mozilla FireFox, Opera, dll
Trend : Fakta
Browsing / Surfing sudah merupakan aktifitas rutin sehari-hari
Internet menjadi sumber informasi yang tak terhingga! (apalagi dengan adanya Om Yahoo! dan Mas Google)
Jutaan halaman web baru bermunculan setiap hari
Konten web semakin bervariasi dan dapat dikontribusi oleh siapa saja dimana saja
Trend: Killer Application
Internet: Email Online Games Chat (mIRC, Yahoo Messenger) Google EarthWeb based: Search Engine (Yahoo!, Google) Web Blog Web Komunitas: Friendster, MySpace,
Multiply, Hi5, Yahoo 360°, YouTube
Web growth
Stats from Internet Valley,
Inc.
recent estimates suggest 40-50 M Web sites, with 4-5 B Web pages!
Dates Hosts Domains Web Sites
Sites/Hosts
July 01 126,000,000 30,000,000 28,200,000 22.381%
July 98 37,000,000 4,300,000 4,270,000 12.000%
July 97 19,540,000 1,301,000 1,200,000 6.200%
July 96 12,881,000 488,000 300,000 2.300%
July 95 6,642,000 120,000 25,000 0.400%
July 94 3,212,000 46,000 3,000 0.100%
July 93 1,776,000 26,000 150 0.010%
July 92 992,000 16,300 50 0.005%
July 89 130,000 3,900
July 81 210
1969 4
Mosaic
NetscapeIE
Kategori Web
Berdasarkan keter-update-an isi web:1. Web Statis : website yang isi
tampilannya selalu sama dan tidak akan pernah berubah kapan pun kita melihatnya. (jika tidak di-update)
2. Web Dinamis: website yang isi tampilannya tidak statis
1. Web Statis HTML (only)2. Web Dinamis HTML plus plus + Pemrograman Web (Scripting) + Animasi Interaktif (Mis: Flash, Java
Applet)
HTML & XHTML
HTML juga mengalami perkembangan Versi terakhir: HTML 4.1
XHTML adalah standar baru untuk HTML yang bertujuan:
memungkinkan sebuah dokumen web dapat dibaca oleh divais baru seperti PDA, ponsel, dll
Crossbrowser: ditampilkan sama untuk semua jenis browser
Versi terakhir: XHTML 1.1
HTML
Walaupun membuat website sangat mudah dengan menggunakan tools, tetapi sintaks HTML harus dikuasai dengan baik.
Membantu dalam mengembangkan fitur yang dinamis: script, applet, konten multimedia, dll.
may want low-level control may care about size/readability of pages may want to "steal" page components and
integrate into existing pages
Pemrograman Web
Client Side Script : Script yang ditambahkan dalam dokumen
html, dieksekusi oleh browser client. Javascript, VBScriptServer Side Script: Script yang ditambahkan dalam dokumen
html, dieksekusi oleh server, hasilnya dalam bentuk html yang dikirim ke client.
ASP/ASP.Net, PHP, CGI, JSP, dll
Cara Kerja Web
Pemrosesan Script
Web Browser
(Client side processing)
HTML JavaScript
Java Applets
Web
Server
CGI SSI
Servlet PHP JSP ASP
Databases
HTTP
Server Side Processing
Client Side Script Script yang ditambahkan (embedded) pada
halaman web yang sebelumnya hanya disusun dengan sintaks HTML.
Penambahan script ini mempunyai tujuan tertentu. Misalnya:
menampilkan jam dan tanggal yang up- to-date,
menu yang dinamis (mis: pull down menu), kontrol terhadap sebuah window, animasi sederhana, animasi mouse maupun untuk validasi form, dll
Client Side Script
Advantage: Waktu proses relatif cepat karena langsung
dieksekusi oleh browser client Tidak memerlukan web server untuk hosting Dapat dieksekusi langsung oleh berbagai browser
Disadvantage: Script bisa dilihat oleh pengguna Script dapat di copy-paste Tidak cocok untuk akses data atau database
Tips Client Side Script:
Gunakan untuk proses-proses sisi client
Script Javascript mudah untuk “dibajak”
Pelajari bagaimana cara “menambahkan” ke website kita
Source:http://www.dynamicdrive.comhttp://www.javascriptsource.com
Server Side Script Digunakan untuk membuat aplikasi web atau
konten-konten dinamis: news, buku tamu, dll PHP: open source dan banyak digunakan luas Active Server Pages (ASP) dan ASP.Net,
teknologi yang dikembangkan oleh Microsoft ColdFusion (CFM), dikembangkan oleh
Macromedia Java Server Pages dan Servlet dikembangkan
oleh Sun Microsystem Common Gateway Interface (CGI), yang dibuat
dengan bahasa pemrograman C++ atau Perl Server Side Include (SSI), seperti misalnya
Frontpage Server Extension
Server Side Script
Advantage: Script tidak bisa dilihat oleh pengguna, sehingga
tidak dapat di-copy-paste Cocok untuk akses data atau aplikasi database Untuk membuat fitur-fitur tertentu yang berguna,
misalnya: hit counter, user manajemen, disain yang dinamis, CMS, dll
Disadvantage: Waktu proses relatif lebih lambat karena
dieksekusi oleh server Memerlukan web server untuk hosting
CSS (Cascading stylesheet)
CSS adalah bagian dari sebuah website yang khusus dibuat untuk mengatur tampilan sebuah website.
Kita dapat mengontrol isi (konten) dan tampilan secara terpisah.
Perubahan konten tidak mengharuskan kita melakukan perubahan tampilan, demikian juga sebaliknya.
CSS
Teknologi CSS dimaksudkan untuk mempermudah perancangan web yang indah dan fleksibel.
Fleksibilitas adalah hal yang tidak akan diperoleh jika menggunakan HTML saja.
Satu file CSS (*.css) dapat digunakan untuk banyak halaman. Sehingga perubahan disain visual untuk banyak halaman dapat dilakukan hanya melalui modifikasi satu file CSS
Penggunaan CSS saat ini
Kontrol aspek visual keseluruhan halaman website
Membuat Layout yang standart (kolaborasi dengan XHTML)
Teknik membuat layout HTML:Frame cara lama, jarang digunakanTabel disukai oleh designerCSS metode baru, menjadi standar
Referensi HTML & CSS
CSS-1: http://www.w3.org/TR/CSS1 CSS-2: http://www.w3.org/TR/CSS2 HTML: http://www.w3.org/TR/html41 XHTML: http://www.w3.org/TR/xhtml11
Teknologi & Aplikasi Web
ActiveX ActiveX adalah sebuah teknologi integrasi bukan
sebuah bahasa pemrograman. ActiveX dapat disebut sebagai lem yang menyatukan
berbagai macam kode bahasa pemrograman sehingga dapat bekerja sama menjadi sebuah aplikasi Internet.
ActiveX mirip dengan OLE (Object Linking and Embedding).
Ditandai dengan tag <OBJECT> pada html Java Applet Flash (Shockwafe) Komponen ActiveX (develop dg VBScript) dll
Aplikasi berbasis Web
E-Commerce: describes the concept of conducting transactions between a buyer and a seller over an electronic network (Internet)
E-Business: describes all aspects of doing business on/with/through the Internet. E-Business includes all aspects of E-commerce
E-Learning, E-Government, dan E-E yang lainnya …
Web Developer
Secara garis besar dapat dipisahkan:
1. Web Designer: membuat disain web
2. Web Programmer: membuat script untuk halaman web
3. Web Administrator: sebagai administrator web
Tahapan Pengembangan Website
Sebuah website dikembangkan dalam 2 proses besar:
1. Web Developing: proses hingga jadi halaman-halaman web secara lengkap dan siap tayang
2. Web Deploying: proses untuk membuat website terpasang pada server internet dan dapat diakses orang lain
Peluang
Hadirnya internet dan layanan WWW memberikan sejumlah peluang bagi kita, sebagai:
Developer WebContent Updater/KontributorNetwork/Web AdministratorE-Commerce / Online BusinessInteraksi Bisnisdll
Fenomena
AmazonE-BayAnne Ahira