WEBSITE

SEJARAH PERKEMBANGAN WEBSITE

Sejarah perkembangan WEB 1.0

Web 1.0 merupakan teknologi awal dari sebuah website, teknologi ini masih statis dimana antara pembuat website dan penikmat website hanya tejadi komunikasi 1 arah dimana pembuat sebagai pemberi informasi dan peikmat hanya sebagai pembaca, ya layaknya seperti membaca Koran bedanya ini membaca lewat computer, aktifitas ini hanya sebatas searching.  Halaman pada web ini masih terkesan “hampa” bahasa yang digunakan juga masih bahasa HTML saja.

Sejarah perkembangan WEB 2.0

Pada  tahun 2003 atau 2004 datanglah Web 2.0 , fasilitas yang diberikan sangat memanjakan pengguna web, kita bisa berkomunikasi 2 arah, tidak hanya dengan webmaster namun dengna orang lain dei belahan dunia yang lain, kita dapat membuat suatu komunitas tanpa harus bertemu secara fisik, informs semakin mudah didapat dengan halaman web yang menarik, sehingga kita tidak bosan dan masih banayak lagi.

Menurut O’Reilly media, ada beberapa karakteristik dari web 2.0, yaitu : The Web as Platform Website dalam aplikasi web 2.0 kini adalah platform, jadi kita dapat mengerjakan semuanya dengan menggunakan media internet, biasanya kita menggunkan media deskstop untuk mengerjakan penulisan, penghitungan maupun presntasi namun kita dapat langsung mengrjaaknnya melalui internet jadi tidak usah lewat windows lagi, bisa langsung dipkai tanpa harus lama menginstall.

Harnessing Collective Intelligence Wah ini menarik, maksud dari pernyataan diatasweb 2.0 memiliki keinerja yang unik dia memanfaatkan orang tulisan orang untuk mengisi kontennya secara kolektif, jadi udah ga jaman webmaster mengisi sendiri konten webnya, contohnya seperti youtube.com, youtube hanya sebagai media tetapi yang mengisi video yang ada di dalamnya ya orang lain yang inget mempublikasi film atau video yang dinilikinya, wah ternyata begitu tho ??

Data is the Next Intel Inside Slogan “Intel Inside” telah melambungkan nama prosesor Intel di kalangan pengguna komputer. Trademark tersebut telah menjadi suatu garansi kepercayaan dari pengguna akan kemampuan komputer yang akan ataupun sudah dibelinya. Nah, hal ini juga yang dipraktekan para penyuplai data kepada para pemilik website untuk memberikan garansi kepercayaan, jadi padaera web 2.0 data sangatlah penting dan harus di update setiap waktu.

End of the Software Release Cycle Nah lho, para pembuat software harus merubah cara penjualan nih, soalnya di era web 2.0 kalau mau pakai software ga usaha capek capek menginstall, sekarang aolikasi sudah dapat digunakan langsung, sekaran jamanya software tidak dijual “bungkusan” lagi tapi sudah jdi layanan di internet soalnya swebsite sudah dapat menjadi platform untuk menjalankan program, kalau dulu software keluar tiap 3 blan sekali sekarang jamannya software keluar tiap hari alias selalu di update setiap waktu jadi produsen yang lambat akan ketinggalan soalnya software software aplikasi sudah jadi layanan di internet.

Lightweight Programming Models Kalau yang ini maksudnya web 2.0 pembuatannya menggunakan bahas ayang “ringan”, jadi suatu aplikasi bisa kita buat jadi aplikasi baru, seperti google map bisa dibuat untuk program aplikasi HousingMap.

Sejarah perkembangan WEB 3.0

Tadi kita sudah dipukau oleh penampilan web 2.0 dengan lagu yang berjudul “The Web as Platform”, “Hernessing collective intelligence”, “Data is the next intel inside”, “End of the software release cycle”, dan “Lightweight Programming models”, kini kita akan dipukau oleh web 3.0.

Kalau dilihat dari sejarahnya saya bingung sebenrnya siapa yang emunculkan ide pertama kali soalnya saya dapet informasi kalau Tim burners-lee yang pertama kali mencetukan ide pada tahun 2001 tapi ada lagi yang mengklaim Jhon Markoff yang pertama kali memunculkan ide pada tahun 2006, mana yang bene kita gau asah pusing, soalnya kit age butuh siapa yang menciptakan tapi kita butuh sesuatu yang mereka ciptakan heheheh… ( Kaya prinsip orang kita yang bajakan atau yang asli sama – sama bisa dipakai hehehehe… ) Belum ditemukan definisi yang jelas dariweb 3.0 ( ya yang jelas lebih baik dari 2.0 bener ga ? ), saya mengutip beberapa karakteristik dari web 3.0 dari PC magazine dan Sramana yaitu :

Menurut PC magazine karakteristik dari web 3.0 adalah : Semantic Web. Sebuah web dengan kemampuan membaca situs semudah manusia membacanya. Satu informasi yang dibutuhkan oleh manusia dapat dengan mudah tersajikan dengan korelasi informasi yang tepat dan cepat.  The 3D Web. Nuansa Web semakin menarik dengan adanya kemampuan visual 3D. Tanpa harus meninggalkan rumah maka kita dapat mengunjungi berbagai tempat di dunia lain secara virtual dengan kemampuan akses data dan interaksi secara realtime.
The Media-Centric Web. Keyword bukan lagi satu-satunya cara untuk mendapatkan informasi yang dituju. Photo, audio, video akan menjadi cara lain untuk mencari informasi yang kita inginkan. .

The Pervasive Web. Web akan dengan mudah diakses dengan berbagai cara dan alat berbeda. Intinya everywhere, anytime dapat akses web. Sementara kemudahan koneksi akan semakin berkembang, berbagai alat-alat elektronika akan mendukung upaya kemudahan koneksi internet. Maka koneksi internet tidak hanya sebatas di kantor, kampus saja, bahkan di kereta, bis,pasar, kamar tidur dll.
Sedangakan menurut Sramana web 3.0 dapat di formulasikan sebagai berikut :
Web 3.0 = (4C + P + VS)

dimana :

4 C : Content, Commerce, Community, Context

P : Personality

VS : Virtual Search

 Dengan formulasi tersebut, maka Web 3.0 adalah : a personal assistant who knows practically everything about you and can access all the information on the Internet to answer any question.

Teknologi web generasi ketiga ini merupakan perkembangan lebih maju dari Web 2.0 dimana disini web seolah-olah sudah seperti kehidupan di alam nyata. Pada generasi web 3.0 sudah seperti asisten pribadi kita. Web mulai mengerti kebutuhan kita dengan bisa memberi saran atau nasehat kita, menyediakan apa yang kita butuhkan.

Web ini dapat menggunakan teknologi 3D animasi, kita bisa membuat profil avatar yang sesuai dengan karakter, kemudian melakukan aktivitas di dunia maya seperti layaknya di dunia nyata. Kita bisa berjalan-jalan, pergi ke mall, bercakap-cakap dengan teman yang lain. Ya, Web 3.0 adalah dunia virtual kita.

PENGERTIAN WEB STATIS dan DINAMIS

Website merupakan salah satu fasilitas yang dapat diakses oleh jaringan internet dengan menggunakan web browser, seperti Internet Explorer, Mozilla Firefox, Opera, Safari, dan lain sebagainya. Website berdasarkan perubahan isi atau jenis kontennya, dapat dibagi dua, yaitu web statis dan web dinamis.Web statis (static website), merupakan jenis web yang kontennya berisikan informasi yang bersifat statis atau tetap. Web statis umumnya ‘hanya’ bertujuan untuk menampilkan informasi di internet, sehingga kontennya jarang sekali berubah. Biasanya web jenis ini dibuat menggunakan teknologi HTML yang isinya tidak dapat dirubah kecuali bila file web page aslinya diubah. 

Halaman web statis biasanya berisikan teks, hyperlink, yang menghubungkan halaman-halamannya, foto, dan grafik. Contoh web statis yang sering kita temukan di internet antara lain, website-website profil perusahaan, profil orang, atau website-website lain yang memiliki komunikasi yang bersifat satu arah antara pemilik dengan pengunjung website. Akibat sifatnya yang memberi informasi satu arah, tanpa adanya interaksi dengan pengunjung website tersebut, web statis biasanya menonjolkan tampilan yang mengandung banyak grafik. Oleh karena itu, untuk merancang sebuah web statis, tidak terlalu membutuhkan pemrograman yang handal, cukup dengan kemampuan desain grafik untuk membuat web terlihat menarik.

Sementara itu, web dinamis (dynamic site) merupakan jenis web dengan konten berisikan informasi yang dapat berubah-ubah (dinamis). Konten dalam web dinamis bisa berasal dari pengunjung dan lebih sering di update, dibandingkan web statis yang kontennya hanya berasal dari pemilik web dan jarang diupdate. Contoh web dinamis yang biasa kita temui seperti, blog, portal berita, web e-commerce, situs jejaring social, dan lain sebagainya. Web dinamis juga memungkinkan adanya interaksi antara pemilik dengan pengunjung web, seperti berkomentar, bertransaksi, aktif di forum, dan lain-lain.

Untuk merancang sebuah web dinamis, dibutuhkan kemampuan di bidang pemrograman web, karena dalam web dinamis banyak data yang harus diolah dan konten website yang berubah dalam jangka waktu tertentu, sehingga diperlukan adanya program yang berjalan dari server untuk mengatur perubahan data yang ditampilkan. Tidak seperti web statis yang hanya menggunakan HTML sebagai script languagenya, web statis menggunakan bahasa pemrograman web seperti PHP atau ASP. Selain itu, web dinamis juga menggunakan database seperti oracle, mysql, dan lain-lain untuk memproses dan menyimpan data, sedangkan web statis tidak membutuhkan data base karena tidak ada data yang perlu diproses atau disimpan, sehingga dibutuhkan perancang yang benar-benar mengerti bahasa pemrograman untuk dapat membuat sebuah web dinamis yang menarik, terutama bagi web yang ditujukan untuk pemasaran, agar pengunjung tertarik mengunjungi web tersebut dan melakukan transaksi.

Dalam pemrograman web, diperlukan beberapa komponen penting yang harus ada dalam komputer, yaitu web browser, web server, database server, web editor, dan image editor. Web browser merupakan perangkat lunak yang harus dimiliki untuk menjalankan aplikasi web, sedangkan web server merupakan perangkat yang harus dimiliki untuk membuat web dinamis, seperti IIS (Internet Information Services) untuk Windows NT/XP/2000, PWS (Personal Web Server) untuk Windows 98, dan Apache web server yang dapat diinstall di semua operation system. Database server merupakan tempat penyimpanan data dalam web. Web editor merupakan software yang digunakan untuk mengetikkan perintah-perintah script yang digunakan, seperti Notepad, Macromedia Dreamweaver, Adobe Go Live, dan NetBean. Sedangkan image editor merupakan software yang digunakan untuk mengatur gambar dan animasi yang akan digunakan dalam halaman web, seperti Adobe Photoshop, Macromedia Flash, dan Correl Draw. Image editor sangat penting untuk membuat grafik yang menarik dalam web statis, yang mengandalkan keindahan grafik.

Web sendiri secara umum dibagi menjadi dua, berdasarkan bagaimana script diproses dan program sintaks yang digunakan, yaitu Client Side Scripting (CSS) dan Server Side Scripting (SSS). 

Untuk membuat halaman web statis, script yang digunakan merupakan Client Side Scripting atau CSS. Client Side Scripting merupakan jenis script di mana semua sintaks dan perintah pemrograman diproses atau diterjemahkan di sisi client dengan menggunakan web browser. Di dalam web browser terdapar sebuah komponen yang memiliki daftar untuk dapat mengenali semua perintah-perintah yang terdapat pada kategori Client Side Scripting tersebut, sehingga script dapat diterjemahkan. Contoh CSS misalnya HTML (Hypertext Markup Language), Java Script, XML (eXtensible Markup Language), dan CSS (Cascading Style Sheet).

Di sisi lain, Server Side Scripting merupakan jenis script di mana semua sintaks dan perintah pemorgraman yang diberikan diproses di server (web server). Web server ini terintegrasikan dengan sebuah komponen atau engine yang memiliki daftar pustaka untuk menerjemahkan script tersebut. Engine yang digunakan oleh web server tadi harus diinstall terlebih dahulu karena setiap script yang digunakan memiliki karakteristik atau bahasa pemrograman yang berbeda-beda. Setelah diterjemahkan di server, kemudian script ini dikirim ke client, yaitu web browser dalam format HTML, sehingga pengguna tidak dapat melihat kode asli yang ditulis di server. Contoh Server Side Scripting adalah PHP, ASP (Active Server Pages), JSP (Java Server Pages), ColdFussion, dan lain-lain. Server Side Scripting digunakan untuk membuat web dinamis, karena beberapa kelebihan yang dimilikinya, antara lain dapat berinteraksi dengan banyak software database, dapat mengelola sumber daya yang ada dalam operation system dan software komputer, dan mampu dijalankan di semua operation system (multi-platform). SSS juga aman karena scriptnya diolah oleh server, sehingga tidak dapat dilihat dari sisi client. 

PERBEDAAN WEB SATIS dan DINAMIS

1.      Interaksi antara pengunjung dengan 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.      Adanya script language yang digunakan
Web statis hanya menggunakan HTML saja, sedangkan web dinamis menggunakan bahasa pemrograman web seperti PHP atau ASP.

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 memproses data.

4.      Content
Content dalam web statis hanya diberikan oleh pemilik web dan jarang diupdate, sementara contentdalam web dinamis bisa berasal dari pengunjung dan lebih sering diupdate. Content dalam web dinamis bisa diambil dari database sehiNgga isinya pun bisa berbeda-beda walaupun kita membuka web yang sama.

5.      Contoh
Contoh web statis adalah web yang berisi profil perusahaan. Di sana hanya ada beberapa halaman saja dan contentnya hampir tidak pernah berubah karena content langsung diletakkan dalam file HTML saja.
Contoh web dinamis adalah blog, portal berita, social networking. Lihat saja isi web tersebut, isinya selalu diupdate oleh pemiliknya. Bahkan untuk social networking selalu update tiap detik

6.      Web statis adalah web yang isinya tidak dapat dirubah-rubah karena tidak memiliki database sebagai tempat penyimpanan contentnya. Sedangkan Web dinamis adalah sebuah web yang isinya dapat dirubah sewaktu-waktu dengan mudah tanpa harus melakukan perubahan code-code seperti yang harus dilakukan pada web statis.

CONTOH PROGRAM WEBSITE

Adapun perintah perintah dasar dari HTML adalah sebagai berikut:

1.      <H1> sampai <H6>
<H1>  </H1>font ukuran besar
<H2>  </H2>
 ....         ....
<H6>   </H6>font semakin kecil

2.      <HR> 
Fungsi : perintah untuk membuat garis horizontal penuh layar 
cth :

---

 

3.      <I> 
Fungsi : membuat teks miring

4.      <B> 
Fungsi : membuat teks tebal

5.      <U> 
Fungsi : membuat teks bergaris bawah

6.      <CENTER> 
Fungsi : membuat text ke tengah layar

7.      <ALIGN> 
Fungsi : Membuat teks rata kiri dan rata kanan 
Sintak
<P ALIGN=right>untuk rata kanan
<P ALIGN=left>untuk rata kiri
<P ALIGN=center>untuk rata tengah
<P ALIGN=justify>untuk rata kiri dan rata kanan

atau

<H?ALIGN=right>
<H?ALIGN=left>
<H?ALIGN=center>
<H?ALIGN=justify>

Contoh pemakaian:
<H2 Align=right>Selamat Datang Ke Website Kami <H2>

8.      <BR> 
Fungsi : memasukkan fungsi enter 
Cth : Jika perintah <BR> diberikan di awal atau diakhir baris, maka kalimat berikutnya akan dicetak pada baris berikutnya

9.      <!-> 
Fungsi : membuat komentar 
Semua teks atau perintah yang diapit oleh perintah ini tidak akan dijalankan

10.  <P> 
Fungsi : memisahkan paragraph yang satu dengan paragraph yang lain

11.  <DD> 
Fungsi : membuat teks atau sebuah paragraph agak masuk ke dalam

12.  <BASEFONT> 
Fungsi : Mengubah ukuran font 
Contoh : 
<BASEFONT SIZE=6> 
WELCOME TO MY WEBSITE 
<B>WELCOME TO MY WEBSITE DAN TEBAL</B>

13.  <FONT> 
Fungsi : mengubah ukuran font, tetapi angka yang terdapat dalam size yang merupakan ukuran font harus diberi tanda kutib

14.  <FACE> 
Fungsi : mengubah jenis font

15.  <SUP> 
Fungsi : membuat cetak naik suatu teks 
Contoh : 
Kami adalah yang pertama:1^stin the world

16.  <SUB> 
Fungsi : membuat suatu teks cetak turun 
Contoh : 
contoh-contoh teks cetak turun : 
H₂O (Disebut Air) dan 
C₂₁27No (Disebut Methadon)

17.  <UL> atau Unorder List 
Fungsi : membuat bullet

18.  <LI> 
Fungsi : juga untuk membuat bullet 
Catatan : perintah <LI> harus berada dalam perintah OL,UL,DIR,Menu 
Contoh : 
<UL> 
<LI> 
<H2> Jawa Timur </H2> 
<UL> 
<LI> SURABAYA </LI> 
<LI> MALANG </LI> 
<LI> GRESIK </LI> 
</UL> 
</LI> 
</BR> 
<LI> 
<H2> Jawa Barat </H2> 
<UL> 
<LI> Bandung </LI> 
<LI> Sukabumi </LI> 
<LI> Bogor </LI> 
</UL> 
</LI> 
</UL>

19.  <IMGSRC> 
Fungsi : memasukkan gambar ke dalam Website 
Anda dapat juga memasukkan gambar berakhiran *.Jpg, *.Gif, *.Bmp dll 
Sintak :<IMG BORDER="5"> 
"5" merupakan ukuran border(Bingkai), ganti angka ini sesuai keinginan anda

20.  <BGSOUND> 
Fungsi : memasukkan suara atau musik ke dalam Website 
Sintak : <BGSOUND loop=infite Src="d:/Selamat datang.WAV">

Contoh 1 “Memberi warna, ukuran, jenis font, dll”

<HTML>
<HEAD>
<TITLE> </TITLE>
<META Name="description"Content=" ">
<META Name="keywords"Content=" ">
<META Name="generator"Content="Cute HTML">
</HEAD>
<BODY BG Color="#FFFFFF"Text="#000000="#"0000FF"VLink="#800080">
<Center>
<A href=" "target=main on mouse over="Window.open('c:/html/keterangan.html'):">
<Font Size=3 FACE=Arial Color=#804000> Keterangan </FONT> </e>
</CENTER>
</BODY>
</HTML>

Contoh 2 “Membuat Link”

Buatlah link dengan nama:
tentang_kami.html
produk_kami.html
cara_memesan.html

< HTML >
< HEAD >
< TITLE > </TITLE>
< META name="description"Content=" ">
< META name="keywords"Content=" ">
< META name="generator"Content="Cute HTML">
< /HEAD >
< BODY BGCOLOR="#FFFFFF"Text="#000000"Vlink="#800080" >
< Center >
< h1 > PT.OCTA >
< Input Type="button"value="Tentang Kami"
on click="parent.location="c:/website/tentang_kami.html'" >
< Input Type="button"value="Produk Kami"
on click="parent.location="c:/gambar/produk_kami.html'" >
< Input Type="button"value="cara memesan"
on click="parent.location="c:/gambar/cara_memesan.html'" >
< /Center >
< /Body >
< /HTML >

Contoh 3 “Membuat Kolom”

< tr > adalah perintah untuk membuat kolom pada notepad

Berikut adalah contoh perintah cara membuat kolom pada notepad
< html >
< head >
< title > Belajar membuat kolom < /title >
< /head >
< H3 Align="Center" > DAFTAR MAHASISWA < H3 >
< table border="3" border color="red"
< tr >
< td > No
< td > Nama
< td > Alamat
< td > No. Phone
< td > Gambar
< /tr >
< tr >
< td > 1
< td > Octa
< td > Padang Bulan
< td > 8214773
< td > < Img src="C:\Documents and Settings\XP\My Documents\My Webs\octa_pic1.JPG" >< /tr >

GAMBAR

"Be different from the other, trust yourself"

"We can change the world with Jesus"

-sifracindy-