Quantcast
Channel: Stoepy
Viewing all articles
Browse latest Browse all 10

Analogi HTML, CSS dan JavaScript

$
0
0

Bagi teman-teman yang baru mulai belajar membuat website nih dan bingung harus belajar apa dan mulai dari mana, saya harap artikel ini dapat membantu teman-teman memahami apa saja alat-alat yang diperlukan untuk membangun sebuah website, khususnya dalam membangun antarmuka atau interface website.

Nah bagi kalian yang baru mulai belajar pemrograman website, ada 3 sahabat karib yang harus kalian kenali dan pelajari, harus ya.. ingat harus.. Yang pertama HTML, kemudian CSS, dan yang terakhir JavaScript. Nah jika kalian ingin benar-benar membuat website secara utuh, maksud saya bukan hanya bagian antarmuka, tapi juga bagian back-end yang berhubungan dengan database, maka ada satu lagi bahasa yang kalian perlu pelajari, yaitu server side programming. Jenis bahasanya ada banyak, seperti PHP, .NET, Phyton, Ruby On Rails, dan lain sebagainya. Kalian bisa pilih salah satu. Tapi kalau kalian fokus hanya di bagian antarmuka, maka server-side programming itu jadi optional, artinya kalian boleh pelajari ataupun tidak.

Pada artikel ini saya hanya akan membahas analogi dari 3 sahabat karib tadi, dan akan saya jelaskan dalam bentuk analogi sederhana agar kalian paham kegunaan masing-masing.

Kalian pernah lihat proses pembangunan rumah tidak? Pembangunan website itu ibarat pembangunan rumah, sama persis sis sis.. Dimulai dari perancangan rumah atau istilah kerennya blueprint, kemudian membangun fondasi dan kerangka rumah hingga jadi rumah yang masih terlihat jelek, kemudian mulai proses memperindah rumah dengan cat, penambahan genting, dan lain sebagainya, sampai kepada proses furnishing dan penambahan asesoris-asesoris lainnya. Demikian sama halnya pembangunan website, proses yang sama bakal terjadi.

HTML

Nah ini bahasa pemrograman yang paling basic, core-nya. Tanpa ini kalian ngga akan bisa membuat website. Kenapa? Ya karena ini ibaratnya tulang belulangnya. Setelah website dirancang dan didesain, biasanya oleh designer, maka selanjutnya adalah tugas kita untuk membangunnya. Disini kita ibarat kontraktor bangunan. Kita bangun dulu fondasinya, kita pasang satu persatu pancang-pancangnya, kemudian kita tata batu bata satu persatu dari bawah ke atas, dan mulai melapisi tembok dengan semen, dan jadilah sebuah rumah yang masih sangat sangat sangat sederhana.

analogi-html

Ketika kita membangun website, hal yang sama bakal terjadi, dengan menggunakan HTML, kita mulai bangun kerangka website kita, dimulai dari perancangan layout, penambahan header, content, footer, kemudian mulai menambahkan button, tabel, gambar, form, dan komponen-komponen lain, sehingga terbentuklah sebuah website yang masih berbentuk sangat sederhana, atau bisa dikatakan masih jelek lah.

Setelah jadi bangunan sederhana, kemudian kita mulai berpikir, siapa sih yang mau lihat website yang jelek ini. Untuk menarik orang tinggal di website kita, maka kita harus memperindah website kita, nah CSS adalah solusinya.

CSS

Untuk memperindah rumah yang paling gampang menambahkan cat dinding, ngga bagus kan kalau sebuah rumah, dindingnya hanya semen, lebih bagus jika dicat. Kemudian bisa juga dengan menambahkan genting, kemudian menambahkan frame kayu pada jendela, menempelkan wallpaper pada tembok bagian dalam rumah, dan lain sebagainya.

analogi-css

Nah pada pembangunan website, proses ini dilakukan oleh CSS. CSS dapat memperindah sebuah website, memberikan warna, wallpaper (background image), membentuk button, memberikan frame pada gambar, dan lain sebagainya. Intinya tugas dari CSS adalah untuk memperindah tampilan website. “Oke.. tau deh sekarang fungsi css untuk apa.. Lha terus kalo CSS memperindah website, JavaScript buat apaan dong?”

JavaScript

Sadar tidak bahwa hanya dengan bangunan sederhana-pun sebetulnya kita sudah bisa tinggal di dalam rumah tersebut, namun setelah diperindah dengan warna dinding yang hangat, genting yang anti air, jendela dengan teralis kayu.. Maka kita akan semakin betah tinggal di rumah tersebut. Tapi ada kalanya kita perlu fitur-fitur tambahan, contohnya.. Agar kita tau kalau di depan rumah ada tamu yang datang, maka kita pasang bel pintu. Contoh lain lagi agar ruangan terasa sejuk, kita pasang AC, dan jika kita ingin ruangan secara berkala terus berbau harum, maka kita pasang alat semprot parfum otomatis. Nah sama halnya dengan website, kadang kita perlu fitur-fitur tambahan tersebut. Solusinya adalah dengan menggunakan JavaScript.

Dengan menggunakan JavaScript kita bisa menambahkan fitur-fitur lain pada website kita, sebagai contoh: menambahkan popup, ajax, fitur tab, client side validasi form, dan lain sebagainya.

Kesimpulan

Oke, kita akan ulang ya.. Dimulai dari HTML. HTML berfungsi untuk membangun kerangka utama dan komponen-komponen utama website kita. Kemudian CSS berfungsi untuk memperindah website kita, dan yang terakhir JavaScript berfungsi untuk menambahkan fitur lain pada website kita.

HTML = Kerangka Utama, CSS = Memperindah Website, JavaScript = Fitur Tambahan

Oke, semoga membantu. :)

The post Analogi HTML, CSS dan JavaScript appeared first on Stoepy.


Viewing all articles
Browse latest Browse all 10

Trending Articles