Teknologi Web Internet

A.  Teknologi Web internet

Ini seperti suatu hal yang mustahil bahwa jaringan informasi yang begitu besar ini yang dikenal sebagai World Wide Web adalah hasil berpikir dari seseorang yang bernama Tim Berners-Lee. Ia adalah seorang ilmuwan dengan latarbelakang pendidikan pengolahan teks, komunikasi dan real-time software. Ia yang bekerja pada CERN ketika menemukan ide tersebut. CERN sendiri adalah Centre Européenne Recherche Nucleaire, yang juga dikenal sebagai European Laboratory for Particle Physics.

Sebelumnya pada tahun 1980 di pusat penelitian tersebut ia sudah membangun sebuah alat dan model perangkat lunak yang disebut Enquire. Enquire adalah sebuah database halaman-halaman data dan informasi yang satu sama lain saling terkoneksi atau dikenal dengan istilah linked.

Pada tahun 1984 permasalahan pun muncul ketika Tim Berners-Lee menyadari bagaimana cara bagi para ilmuwan untuk dapat mengakses berbagai macam data dan informasi yang dibutuhkan yang tersimpan pada masing-masing komputer yang ada di laboratorium.

Pada tahun 1989 Tim Berners-Lee menulis sebuah proposal Information Management untuk diedarkan dan dikomentari oleh CERN. Kemudian setelah itu Tim Berners-Lee mendapatkan bantuan dari ilmuwan lainnya yang juga bekerja di CERN yang bernama Robert Cailliau.

Pada tahun 1990 Tim Berners-Lee dan obert Cailliau kemudian bersama-sama membuat proposal lainnya yang lebih disempurnakan yang akhirnya disetujui oleh bos dari Tim Berners-Lee yaitu Mike Sendall. Mereka pun memulai pengembangan untuk HyperText Markup Language yang pertama pada lingkungan komputer NeXT dan pada akhir tahun 1990 akhirnya web browser pertama yang diberi nama WorldWideWeb dipublikasikan secara umum untuk pertama kalinya.

Setelah dipublikasikan pertama kali pada akhir tahun 1990, tahun-tahun berikutnya diisi dengan berbagai macam konferensi dan pertemuan-pertemuan para ahli untuk membahas mengenai teknologi web ini dan juga pertama kalinya diaktifkannya sebuah web server yang berada di luar Eropa tepatnya di Universitas Standford di Amerika Serikat.

Pada tahun 1993 jumlah web browser semakin banyak bermunculan seperti Midas, Erwise, Viola, and Samba. Pada tahun ini pula CERN setuju untuk membolehkan siapa saja untuk menggunakan web protocol dan juga kode-kode bebas royalti.

Pada tahun 1994 banyak terjadi seminar dan konferensi para ahli akan teknologi web yang terus berkembang. Pada tahun ini pun sistem internet dial-up mulai berkembang yang juga menunjang perkembangan dari teknologi web. Pada tahun ini para ahli mulai membicarakan akan pentingnya dibentuk sebuah konsorsium yang akan menangani perkembangan teknologi web ini . Pada bulan Oktober 1994 akhirnya dibentuklah sebuah konsorsium dengan nama World Wide Web Consortium atau disingkat W3C.

Teknologi web pun terus berkembang dan mulai dirasakan oleh hampir setiap orang dari berbagai bidang. Teknologi internet dan web pun sekarang sudah menjadi bagian hidup hampir setiap orang. Ia mempengaruhi bagaimana cara seseorang hidup, belajar, bekerja, bermain dan bersosialisasi.

 B. Konsep kerja web

1.User                                                                                                                                                                     pengguna/user adalah orang yang melakukan permintaan/request sebuah alamat sebuah situs.

2.Client Server                                                                                                                                                    Client server merupakan sebuah aplikasi yang berfungsi sebagai sebuah mesin pencari(browser)dimana sebuah situs atau informasi berada disana.

3.TCP/IP

IP adalah kode atau sebuah alamat yang dapat membantu agar sebuah permintaan akan mendapatkan jawaban yang sesuai
server(otark)adalah pusat dari semuanya,disinilah pusat dari semuanya,tempat penyimpanan server lah data dan disini data diolah dan dikirim kembali sesuai permintaan atau request.
-misalkan saya adalah seorang USER dan ingin membuka sebuah situs ,dalam hal ini misalnya metroNews.com
dari sebuah komputer yang berda d sebuah warnet,URL atau REQUEST yang saya ketik melalui aplikasi browser yang kali ini dipakai adalah Mozilla firefox 3.0,maka URL/alamat yang saya tadi ingin masukkakn di klik di kolom (www)atau world wide web yang merupakan sebuah arsitektur krja untuk memasuki dokumen yang saling berhubungan.
URL file (FTP : File Transfer Protocol) :
Protocol ini dirancang untuk memungkinkan pemakai mentransfer file dalam format teks atau biner dalam server komputer di internet. Contoh :ftp.usma.edu/pub/msdos/
URL Gopher :
Protocol ini dirancang untuk mengakses server gopher. Server gopher lebih rumit untuk diakses dari pada server FTP. Beberapa server gopher dapat berada
Contoh : gopher://wiretrap.spies.com/
URL News (Network News Transfer Protocol) :
Merupakan protocol untuk mendistribusikan berita di usenet. Usenet adalah system yang dirancang sebagai forum diskusi dengan didasarkan pada topik-topik yang disebut newsgroup.
Contoh : news:comp.infosystems.www.announce
Telnet
Adalah protocol yang digunakan untuk login ke suatu server komputer.
URL HTTP (Hypertext Transfer Protocol) :
HTTP adalah suatu protocol internet yang digunakan oleh World Wide Web. Dengan protocol ini sebuah web client (browser) seperti Internet Explorer atau netscape dapat melakukan pertukaran data hypermedia, seperti teks, gambar, suara, bahkan video dengan web server.

4.server

Cara kerja Web Server :

1. Cara kerja Web Server Web server merupakan mesin dimana tempat aplikasi atau software beroperasi dalam medistribusikan web page ke user, tentu saja sesuai dengan permintaan user.

2. Hubungan antara Web Server dan Browser Internet merupakan gabungan atau jaringan Komputer yg ada di seluruh dunia. Setelah terhubung secara fisik, Protocol TCP/IP (networking protocol) yg memungkinkan semua komputer dapat berkomunikasi satu dengan yg lainnya. Pada saat browser meminta data web page ke server maka instruksi permintaan data oleh browser tersebut di kemas di dalam TCP yg merupakan protocol transport dan dikirim ke alamat yg dalam hal ini merupakan protocol berikutnya yaitu Hyper Text Transfer Protocol (HTTP). HTTP ini merupakan protocol yg digunakan dalam World Wide Web (WWW) antar komputer yg terhubung dalam jaringan di dunia ini. Untuk mengenal protocol ini jelas sangan mudah sekali dimana setiap kali anda mengetik http://… anda telah menggunakannya, dan membawa anda ke dunia internet. Data yg di passing dari browser ke Web server disebut sebagai HTTP request yg meminta web page dan kemudian web server akan mencari data HTML yg ada dan di kemas dalam TCP protocol dan di kirim kembali ke browser. Data yg dikirim dari server ke browser disebut sebagai HTTP response. Jika data yg diminta oleh browser tidak ditemukan oleh si Web server maka akan meninbulkan error yg sering kita lihat di web page yaitu Error : 404 Page Not Found.

Gambar Cara Keja Web ‘

dilihat dari gambar dapat saya jelaskan :

Setelah URL atau nama situs itu dimasukkan di mesin pencari(mozilla) maka akan secara otomatis “jika komputer terkoneksi”DATA/URL akan terkirim dan akan memasuli wlayah kerja TCP/IP disini data akan diperiksa sesuai alamat da permintaan nya.Dan server akan mengambil header/judul sebagai patokan pencarian sehingga jelas dan tidak rumit setelah itu body akan di sesuaikan dan server akan memberikan data yang minta melalui alamat ip asal request tersebut jika data ada dan tidak valid ke client server sebelum akhirnya kembali lagi ke user.

C. Halaman web berbasis HTML

1.       Bagian Head

Tentang jenis halaman,isi,dan judul halaman.

2.       BagianBody

Bagian body yang akan diproses oleh web browser.

·         Diawali tag pembuka dan diakhiri dengan tag penutup

<!—isi kumentar-- >

·         Besar kecil huruf tidak berpengaruh ,non-case          

3.       Beberapa versi HTML

1.       HTML 1.0

2.       HTML 2.0

3.       HTML 3.0

4.       HTML 3.2

5.       HTML 4.0

D. Halaman web berbasis ASP

Konsep kerja dari ASP adalah sebagai berikut

1.       Ketika ada permintaan dari web browser client untuk membuka sebuahn halaman ASP ,request tsb akan dikirimkan ke server.

2.       Oleh server ,request tsb diterjemahkan menjadi sebuah perintah untuk mencari dan memanggil sebuah file ASP

3.       File ASP tsb oleh server dibaca dan dieksekusi scriptnya

4.       Setelah berhasil server akan mengirimkan hasilnya kepada web browser client berupa file HTML murni.

E. Halaman web berbasis PHP

Perkembangan dari bahasa pemrograman PHP

1.       PHP/FI

2.       PHP VERSI 2.0

3.       PHP VERSI 3.0

4.       PHP VERSI 4.0

5.       PHP VERSI 5.0

F. Web server

1.       APACHE

KELEBIHAN:

a.       Mendukung database connection relasional database untuk autentikasi jaringan dengan login

b.      Pengaturan mode kesalahan atau error

c.       Kebebasan pengaturan file konfigurasi server bahkan pada kode program CGI

d.      Memiliki kemampuan secara otomatis melayani request webpage dengan berbagi format

e.      Virtual host

f.        Pengguna diberikan kebebasan untuk mengonfigurasi jenis log file pada web server apache

2.       NGINX

3.       IIS

4.       LITESPEED WEB SERVER

5.       GOOGLE WEB SERVER

6.       LIGHTTPD

G. Web browser

Browser adalah Sebuat program atau software yang digunakan untuk menjelajah dunia maya internet dalam konteks komputer. Browser diambil dari kata browse (bahasa inggris) yang berarti Membaca atau Melihat – lihat. Browser juga dibagi lagi menjadi sebagai berikut:

1.    Microsoft Internet Explorer

2.    Mozilla Firefox

3.    Google Chrome

4.    Opera

5.    Safari

6.    Netscape Communications

7.    Flock

8.    Wyzo

9.    iCab

H. Web programing

1.Web Statik adalah web yang tidak selalu update dan tidak ada interaksi antara web dengan user. Editor yang digunakan untuk membangun web statik yaitu Notepad,Microsoft FrontPage,macromedia Dreamweaver . Umumnya web statik mengunakan murni kode HTML.

2.Web Dinamis adalah web yang selalu update, berisi informasi terbaru, dan terdapat interaksi antar web dengan user secara real time. Software editor untuk membangun web dinamis adalah ColdFusion (CFM), Active Server Pages (ASP), Java Server Pages (JSP) dan PHP, bahasa pemprograman yang mampu untuk membuat web menjadi dinamis. Umumnya Web dinamis mengunakan HTML yang telah di embed oleh bahasa pemrograman lain yaitu PHP . PHP sangat cocok digunakan dalam membangun web karena PHP bersifat open source dan mudah di mengerti.

Perbedaan Web Statis dan Web Dinamis

1.    Interaksi antara pengunjung dan pemilik web
Dalam web statis tidak dimungkinkan terjadinya interaksi antara pengunjung dengan pemilik web. Sementara dalam web dinamis terdapat interaksi antara pengunjung dengan pemilik web seperti memberikan komentar, transaksi online, forum, dll.

2.    Bahasa Script yang digunakan
Web statis hanya menggunakan HTML saja, atau paling tidak bisa ditambah dengan CSS. Sedangkan web dinamis menggunakan bahasa pemrograman web yang lebih kompleks seperti PHP, ASP dan JavaScript.

Client-side Web Programming

o    HTML,

o    XHTML, 

o    CSS, 

o    JavaScript, 

o    XML. 

o    JQUERY

Server-side Web Programming

o    Active server pages (ASP), 

o    PHP : Hypertext preprocessor (PHP), 

o    Java sever pages (JSP).

o    ColdFusion 

o    ASP (Active Server Page)

o    JSP (Java Server Page)

o    Lasso 

o    SSI

Client side scripting merupakan salah satu jenis bahasa pemrograman web yang proses pengolahannya dilakukan di sisi client.

Proses penerjemahan atau pengolahannya dilakukan oleh web browser sebagai client-nya, didalam web browser sudah terdapat library yang mampu menerjemahkan semua perintah dihalaman web yang menggunakan client side scripting.

Library ini juga disebut web engine yang dimiliki setiap web browser, namun web engine yang berbeda-beda terkadang membuat ampilan layout web sering berbeda disetiap browser, untuk menghindari itu sebaiknya gunakan web browser yang telah disertifikasi oleh world wide web consortium(W3C).

Contoh dari client side scripting ini antara lain

Server side scripting merupakan bahasa pemrograman web yang pengolahannya dilakukan dalam server, maksudnya ialah web server yang sudah telah terintegrasi oleh web engine.

Disini peran web engine ialah memproses semua script yang ada termasuk kategori client side scripting. Web engine biasanya harus diinstal dalam komputer terlebih dahulu dari bagian terpisah web server.

Contoh dari server side scripting ialah

3.    Penggunaan Database
Web statis tidak menggunakan database karena tidak ada data yang perlu disimpan dan diproses. Sedangkan web dinamis menggunakan database seperti MySQL, Oracle, dll untuk menyimpan dan memroses data.

4.    Konten
Konten dalam web statis hanya diberikan oleh pemilik web dan jarang di-update, sementara konten dalam web dinamis bisa berasal dari pengunjung dan lebih sering di-update. Konten dalam web dinamis bisa diambil dari database sehingga isinya pun bisa berbeda-beda walaupun kita membuka web yang sama.

Objek multimedia

Objek multimedia

A.      Objek Multimedia
Multimedia pada halaman web memiliki pengertian penggunaan external file yang berisi data dengan format tertetu pada web. Agar penggunaan objek-objek multimedia dapat dilihat hasilnya, maka aplikasi web browser yang digunakan pada computer klien harus mendukung. Terdapat beberapa fungsi dalam pemrograman web yang harus didukung web browser, yaitu:
1.       Fungsi dukungan terhadap scripting, agar web browser mampu menjalankan dan menerjemahkan kode yang dituliskan dalam badan program HTML, seperti JavaScript dan VBScript.
2.       Applet
Merupakan program aplikasi yang dijalankan pada broser untuk mengeksekusi objek multimedia yang disertakan pada halaman web agar berfungsi dan bekerja semestinya. Syarat utama sebuah web browser dapat menjalankan kode applet pada halaman web adalah harus memilki Java Virtual Machine (JVM) yang berfungsi menerjemahkan kode program Java (interpreter java).
Kode program applet menggunakan tag <applet>…</applet>Contoh pada penggunaan web:
<applet code=”sound.class” width=”200”Height=”150”><param name=”suara” value=”welcome.au”></applet>Kode program penulisan rogram untuk memasukkan fungsi standar applet harus digunakan pada web browser model lama yang belum menerapkan standar HTML 4.01. Pada generasi terbaru, tag <apple> tidak digunakan dan diganti dengan <object>, seperti di bawah ini:
<object code=”namaclassapplet.class”><param name=”namaparam” value=”nilaiparam”></object>3.       Plug In
program tambahan untuk menjalankan berbagai file multimedia yang disertakan pada halaman web , seperti membuka file audio, radio online, dll. Untuk mendapatkan plug in secaara berkala harus meng-update plug in pada web browser server tertentu secara online.
4.       ActiveX
Mendukung fungsi di dalam web browser khususnya Internet explorer seperti teknik menampilkan kalender. Namun tidak semua kode program ActiveX dapat dieksekusi oleh web browser.
B.      Objek Gambar
1.       JPG/JPEG
JPG ( Joint Photographic Group) dan JPEG (Joint Photographic Expert Group) merupakan jenis gambar dengan resolusi tinggi.
2.       GIF(Graphic Interchange Format)
Hanya mampu menyimpan gambar dalam format 8 bit. Format GIF biasanya digunakan untuk menampilkan animasi dua dimensi hasil kompilasi Flash.
3.       PNG (Portable Network Graphic)
Menggabungkan teknik JPG  dan GIF yang mampu menyimpan file dengan bit depth hingga 24 bit.
4.       BMP (Bitmap Image)
Jenis format file yang mampu menyimpan gambar dengan tingkat kualitas 1-24 bit.
Untuk dapat menampilkan gambar dengan ekstensi di atas adalah menggunakan tag <img src=”lokasi_file> pada halaman web.
Contoh dengan tag <img>
Penjelasan :
1.       src=”logo smkn 2.jpg”  meruju lokasi file gambar "logo smkn 2.jpg" dengan file yang berada satu folder dengan file html.
2.       width=”350”  mengatur dimensi lebar gamba sebesar 350 pixel.
3.       weight=”500” mengatur dimensi tinggi gambar sebesar 500 pixel.
Contoh dengan tag <object>

Penjelasan:
1.       data=”logo smkn 2.jpg” menunjukkan file gambar yang dipanggil.
2.       type=”image/jpg” menunjukkan jenis objek yang dipanggil.
3.       width=”600” menentukan dimensi lebar gambar.
4.       height=”400” menetukan dimensi tinggi gambar.
C.      Objek Suara
Terdapat tiga kategori format file audio:
1.       File audio tanpa kompresi, yaitu file ekstensi AIFF, AU, WAV, dan raw header-less PCM
2.       File audio dengan kompresi lossy, seperti vorbis, AAC, ATRAC, MP3, Mousepack, dan lossy Windows Media Audio(WMA)
3.       File audio dengan kompresi lossless, seperti MPEG-4 SLS, MPEG-4 ALS, MPEG-4 DST, TTA, Windows Media Audio Lossless (WMA Lossless), FLAC, dan WavPack (filename extension WV)
Tipe -tipe file audio:
1.       MPEG Player (Mp3)
Moving Picture Experts Group merupakan format file dengan ekstensi mp3 yang bekerja pada layer tiga dimensi dengan kompresi audio mencapai kualitas suara setara CD stereo, yaitu 16 bit.
2.       WAV
Waveform Audio format adalah standar file yang tidak melakukan kompresi terhadap isi audionya.
3.       AAC (Advanced Audio Coding)
File audio dengan format berbasis MPEG2 dan MPEG4 sebagai pengemban file mp3.
4.       AIFF (Audio Interchange File Format)
Format standar tanpa kompresi untuk system operasi Macintosh.
5.       Audio CD
Memiliki ekstensi file cda dan merupakan mode audio yang dapat diputar secara langsung dari CD-Drive computer tetapi ketika disalin ke dalam hardisk, file Audio CD tidak dapat dijalankan.
6.       MIDI (Music Instrument Digital Interface)
Format audio berbagai software dan  hardware
7.       WMA (Windows Media Audio)
8.       OGG
Format file audio sekaligus video dengan lisensi bebas atau open source.
Syarat untuk menjalankan audio file dengan script pemrograman HTML:
§  Web browser yang digunakan harus versi terbaru,dengan plug in dan extension sudah ter-update.
§  Pada beberapa kondisi, diperlukan koneksi internet untuk menjalankan program tersebut.
§  Sediakan file audio dengan beberapa format tertentu, sebagai contoh .mp3, .wma, .ogg, .aiff, atau format lainnya.
§  Buatlah folder yang menampung file hasil pemrograman HTML tersebut, kemudian pindahkan file audio tersebut ke dalam satu folder dengan file HTML.
Teknik memasukkan file audio ke dalam halaman web menggunakan pemrograman HTML:
1.       Menggunakan Yahoo Media Player harus konek ke internet
Contoh:

2.       Menggunakan Plug In elemen <object>
Dengan menggunakan ini, kita juga dapat memutar audio file pada halaman web, langkahnya:
a.       Persiapkan file audio yang akan disisipkan, seperti mp3
b.      Salin file tersebut ke dalam folder yang sama dengan file HTML yang akan dibuat nanti.
c.       Ubah nama file tersebut menjadi 1.mp3 (terserah) untuk memudahkan proses pemanggilannya
d.      Selanjutnya buat sript seperti berikut:


3.       Menggunakan elemen <audio>, harus menambahkan kode <!DOCTYPE HTML>Contoh:

4.       Menggunakan elemen <embed>
Jika menggunakan elemen <embed> secara otomatis file audio akan memutar tanpa control bar.
Contoh:

5.       Inline sound
Contoh:

6.       Hyperlink Sound
Untuk membuat link ke sebuah file audio, dapat menggunakan tag <a href=”namafile”>. Dengan mengeklik link tersebut, maka secara otomatis file audio akan dijalankan dengan aplikasi media player yang terdapat pada computer pengguna.
Contoh:

D.      Objek Video
Jenis format standar video yang disisipkan pada halaman web:
1.       MPEG
2.       AVI
3.       WMV
4.       MP4
5.       Real Video
6.       QuickTime
7.       3GP
8.       Flash
Teknik yang digunakan:
1.       Menggunakan Elemen <img>Untuk menjalankan file video dapat digunakan tag <img dynsrc=”namavideo”>. Namun fungsi <img> hanya dapat berjalan pada web browser Internet Explore.
Contoh:

2.       Menggunakan Elemen <embed>Contoh:

3.       Menggunakan Elemen <video>Merupakan standar baru pemrograman HTML5
Contoh:

4.       Menggunakan Hyperlink
Contoh:

5.       Menggunakan Elemen <object>
Kodenya:

6.       Menjalankan Animasi Flash
Terdapat beberapa format video animasi yang dihasilkan Macromedia Flash, untuk menjalankannya perlu aplikasi pemutar video standar seperti Windows Media Player, selama codec yang diperlukan sudah ter-install, atau dengan aplikasi khusus produk Macromedia yaitu Macromedia Flash Player.
Contoh:
<!--file animasiflash.html--><html><head><title>Memutar animasi swf flash</title></head><body><object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-44553540000” codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0” width=”170” height=”140”>
                <param name=”movie” value=”kabel.swf”>                <param name=”quality” value=”high”>                <param src=”kabel.swf” quality=”high”                <embed src=”kabel.swf” quality=”high”Pluginspage=”http://www.macrmedia.com/go/getflashplayer” type=”application/x-shockwave-flash” width=”170” height=”140”>
                </embed></object></body></html>Penjelasan:
§  <object classid=”clsid:D27CDB6E-AE6D-11cf-96B8-44553540000”codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0” width=”170” height=”140”>
Untuk menampilkan file video dalam standar flash berekstensi .swf dideskripsikan dengan atribut =”clsid:D27CDB6E-AE6D-11cf-96B8-44553540000”, jika plug in untuk menjalankan file .swf belum ter-install pada web browser, akan ditambahkan secara otomatis dengan merujuk pada nnilai yang terdapat pada codebase dengan catatan, computer harus terkoneksi internet.
§  <param name=”movie” value=”kabel.swf”>Atribut name digunakan untuk memberikan nama parameter, sedangkan atribut value untuk memanggil file .swf yang akan ditambahkan ke dalam web.
§  <param name=”quality” value=”high”>Untuk menentukan kualitas tampilan dengan pengaturan high
§  <embed src=”kabel.swf” quality=”high”
Pluginspage=”http://www.macrmedia.com/go/getflashplayer” type=”application/x-shockwave-flash” width=”170” height=”140”>
Tag <embed> untuk pengguna browser Netscape
Atribut src untuk merujuk lokasi dan nama file .swf
Atribut pluginspage berisi alamat plug in atau ActiveX ketika web browser belum di-update sehingga memerlukan komponen tambahan x-shockwave.