Learning Path Web Programming (Pengalaman Pribadi)

Membuat website menjadi tantangan tersendiri bagi pemula. Terdorong oleh begitu banyaknya tools di dunia maya yang menawarkan cara mudah membuat website, sering kita mendapati slogan populer “Membuat website tanpa coding”, atau “Membuat website 5 menit jadi” dan lain sebagainya. Hal ini menjadi dilema pribadi untuk memutuskan apakah mau belajar semua dari NOL namun tidak paham proses dibaliknya dan memakan waktu lama, atau membuat instant yang penting bisa membuat website.

Web Programming

Saya pribadi mendapatkan ketertarikan membuat website pertama kali ketika sedang gemar-gemarnya blogging pada tahun 2009 silam. Bila ditarik lebih jauh, sebenarnya awal mula “mencicipi” programming di bidang website pada waktu masih zaman Friendster. Yup, friendster memberikan kebebasan untuk mengubah tampilan profile dengan menggunakan CSS. Modal dasar mengotak-atik CSS di friendster berlanjut ke blogger. Saya menggunakan blogger untuk uji coba membuat website yaitu dengan melihat source code di baliknya. Sering saya mencomot tampilan website lain lalu mengaplikasikannya di blogger.

Bagaimana alur pembelajaran membuat website yang benar?
Pertama kali yang perlu dicatat bahwa belajar membuat website yang dimaksud adalah membuat dari NOL, bukan dari tools yang banyak beredar saat ini.

  1. Belajar dari pemrograman yang basic terlebih dahulu
    Apa itu hal dasar yang penting untuk dipahami dalam membuat website? yaitu HTML dan CSS. HTML itu diibaratkan sebagai kerangka, rumah atau pondasi struktur. Sedangkan CSS itu diibaratkan sebagai cat rumah, pernak pernik dan hiasan rumah.

Apa itu hal dasar yang penting untuk dipahami dalam membuat website? yaitu HTML dan CSS. HTML itu diibaratkan sebagai kerangka, rumah atau pondasi struktur. Sedangkan CSS itu diibaratkan sebagai cat rumah, pernak pernik dan hiasan rumah.

HTML Cheat Sheet

2. Sering browsing dan mengamati website orang lain
Semakin sering mengamati website orang lain kita akan banyak mendapatkan ide membuat website yang enak dipandang dan juga user friendly. Trik paling ampuh untuk belajar dengan langsung praktik (otodidak) adalah dengan meng-copy paste design website orang lain yang menurut kita bagus.

Contoh Website yang ingin di pelajari HTML dan CSS-nya

3. Trial & Error dengan menggunakan inspect element
Trial & error diperlukan untuk mengkreasikan kode program yang baru saja kita copy. Misal element yang bisa dimodifikasi adalah color, background-color, padding, margin, border, font-family, list-group, dan lain sebagainya. Banyak berkunjung ke W3Schooll untuk belajar html dan css. Klik kanan pada browser Chrome lalu pilih menu paling bawah “Inspect”, maka akan muncul jendela di bawahnya yang berisi kode HTML website, beserta pengaturan style CSS-nya.

Inspect Element

4. Kenali Struktur Dasar/Layout Website
Semua website pada dasarnya disusun atas layout yang sama. Layout ini merupakan penyederhanaan design sehingga mudah dipahami. Struktur dasar website terdiri atas Header, Content, Footer serta Navigation.

Struktur Dasar Website

Last! Mulai Bereksperimen Membuat Web Design Sendiri!
Hanya butuh 2 bahasa pemrograman (HTML dan CSS) untuk bisa membuat website sendiri. Anda boleh bangga bila sudah bisa membuat web design sendiri dengan mencampurkan berbagai elemen dari website lain. Inilah yang namanya learning by doing.

Dengan memahami HTML dan CSS ibaratnya kita sudah bisa membuat rumah dengan cat warna warni yang menghiasi dindingnya. Setelah rumah jadi, tentu kita ingin mengisinya dengan berbagai perabot dan barang-barang elektronik lainnya. Nah, barang-barang elektronik dan perabot ini dalam web development saya namakan Javascript.

Javascript membuat suatu website lebih interaktif dan tidak kaku. Interaksi yang dihasilkan memungkinkan kita nyaman berlama-lama di website tersebut. Tentunya tidak perlu yang berlebihan namun pengaturan yang proporsional.

NEXT STEP kita beranjak bagaimana membuat website yang fungsional, yaitu mengintegrasikan dengan database MYSQL dan PHP. Tunggu lanjutannya…

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.