Panduan Cara Membuat Website Sendiri

monzaaulia@outlook.com (1 Juni 2016) - Halo kawan, apa kabar? hari ini saya pikir saya ingin berbagi sesuatu yang berhubungan dengan website. Lebih tepatnya, hari ini saya ingin membuka sebuah jalan, bagaimana orang-orang membangun sebuah website atau blog.

Artikel ini sebenarnya saya peruntukkan bagi mereka yang masih awam di dunia website, atau siapa saja yang kira-kira membutuhkan pelajaran ini.

Kenapa kita wajib mempelajari ilmu tentang website?

Mau tidak mau, suka tidak suka, kita hampir memasuki era pasar bebas global. Artinya, tiap orang dari belahan dunia manapun, bisa berjualan atau menjalani profesinya di negara manapun, termasuk negara kita Indonesia.

Dengan dibukanya pasar bebas global, berarti kita harus siap ikut persaingan dengan orang-orang asing. Nah, supaya kita mampu bersaing, berarti kita harus cukup hebat menguasai berbagai disiplin ilmu, supaya nilai jual kita bisa bertambah.

Dengan mempelajari website, artinya anda ikut mencoba untuk berinovasi terhadap diri anda sendiri. Anda turut meng-upgrade kemampuan diri. Sehingga kemampuan itu mampu mendukung profesi utama anda.

Siapa saja yang harus memiliki skill membangun website?

Semua orang, semua profesi. Apapun pekerjaan anda, anda wajib memiliki kemampuan dalam membangun sebuah website. Saat ini, ini adalah ilmu wajib setelah ilmu Microsoft Office.

Oke, saya ambil contoh diri saya sendiri. Saya berprofesi sebagai dokter, profesi yang seharusnya berinteraksi dengan orang sakit ataupun orang sehat yang membutuhkan nasihat kesehatan, namun kenapa saya mempelajari ilmu website? Alasannya karena saya butuh.

Saya dan beberapa sejawat dokter, memiliki tingkatan ilmu yang sama. Sama-sama memiliki ilmu medis untuk mengobati pasien-pasien. Namun, jika ditimbang dari kemampuan personal, saya berada satu lengkah didepan sejawat dokter lainnya. Kenapa? Ya karena selain saya memiliki keilmuan medis (sama seperti dokter lainnya), saya juga memiliki kemampuan lainnya, mampu membangun sebuah website.

Bukan hanya kemampuan dibidang pemprograman web, saya juga mengasah diri saya agar mampu menguasai teknik bertahan hidup di alam bebas (survival) . Hal itu saya dapat dari hobi saya yang suka mendaki gunung.

Nah, yang mau saya ceritakan sebenarnya tidak harus bidang website sih. Kalau anda mampu menguasai sklill lain, anda juga dianggap berada satu langkah di depan teman seprofesi anda lainnya. Misalnya, kemampuan bahasa asing, menari, melukis, memperbaiki mesin, ilmu bela diri, dan lainnya.

Manfaat mempunyai website

Tidak harus web ya, blog juga memiliki manfaat yang sama. Beberapa manfaat jika anda memiliki web atau blog:

Dapat duit. Dengan memiliki website atau blog, anda berkesempatan untuk mendapatkan uang tambahan dari internet. Ada beberapa cara menghasilkan uang dari internet kalau anda memiliki website atau blog:

  • Google Adsense, program periklanan yang bekerja sama antara google dan pemilik web atau blog. Sistem kerjanya, anda memasang kode iklan di web lalu iklan akan muncul. Anda akan dibayar jika ada yang meng-klik iklan dari google adsense tersebut.
  • Jualan (toko online), anda bisa menggunakan website atau blog untuk jualan di internet. Meski tempat jualan sudah ada bukalapak atau tokopedia, penjual internet akan lebih kelihatan professional jika ia memiliki web atau blog.
  • Mereview produk, jika memiliki web atau blog yang banyak dikunjungi orang, anda mungkin bisa mendapatkan kesempatan untuk bekerja sama dengan produsen sebuah produk untuk me-review produk-produk mereka, tentu anda akan dibayar.
  • Dan masih banyak cara lainnya jika anda memiliki blog atau website

Personal branding. Biarkan semua orang tahu apa keahlian anda, apa profesi anda. Dengan begitu bisa jadi anda diajak kerjasama dengan orang yang mengenal anda dari website atau blog.

Membantu instansi. Ketika anda bekerja disebuah instansi, dan tempat kerja anda membutuhkan website, tentu anda bisa mengajukan diri untuk membuatkan web bagi instansi anda. Dengan begitu bisa dipastikan anda akan mendapatkan point lebih dari atasan anda.

Sudah siap untuk memulai belajar membuat website?

Yuk pelajari secara bertahap (jangan loncat-loncat), jika ada yang tidak dimengerti silahkan tulis di kolom komentar.

DASAR-DASAR WEBSITE

Ada beberapa komposisi dalam pembuatan website, ada baiknya anda harus tahu komposisi apa saja yang menjadikan sebuah website itu ada dan aktif. Lihatlah bagan dibawah ini:


Secara garis besar, website tersusun dari 3 komponen utama, yaitu files, domain dan hosting.

1. Files


File yang membentuk sebuah website itu ada beberapa dan memiliki beragam fungsi yang saling berhubungan. File-file yang membentuk sebuah website adalah:

a. HTML 

HTML adalah file yang membangun struktur dasar dari sebuah website. Anda bisa melihat beragam contoh HTML di setiap halaman website. Coba saja tekan CTRL+U, maka disana akan muncul rangkaian kode yang sangat banyak. Itulah yang dinamakan HTML.

Halaman yang baru anda buka disebut dengan laman sumber (source). Setelah anda melihat kode-kode itu, apakah anda masih ingin mempelajari HTML? Hehe… Jangan khawatir, itu hanya ketakutan sementara saja, jika anda belajar secara bertahap step by step, saya yakin anda akan menguasai HTML dalam waktu singkat.

File HTML selalu diawali dengan perintah <HTML> dan ditutup dengan </HTML>. Jadi, struktur website selalu berada diantara kedua perintah tersebut. Sebagai contoh, silahkan buka aplikasi notepad pada komputer anda! Lalu ketikkan perintah dibawah ini:
<html></html> Setelah itu simpan file tersebut dengan nama: “belajar.html”. Gunakan tanda petik supaya file berubah menjadi file HTML. Nah itulah contoh file HTML.

Diantara perintah <html> </html>, ada perintah <head> </head> yang menandakan itu bagian atas struktur HTML. Diantara <head></head>, ada perintah <title></title> yang fungsinya sebagai tempat judul dari sebuah website.

Setelah <head></head>, ada perintah <body></body> yang fungsinya menampilkan apapun yang ada di website, misalkan konten. Kalau begitu, coba bukan kembali file belajar.html dengan cara klik kanan > open with > notepad. Ketik perintah seperti ini:
<html>
<head>
<title>judul website saya</title>
</head>
<body>Konten website saya</body>
</html>
Ilmu tentang HTML akan saya bagikan setelah saya menyelesaikan artikel ini. Untuk sementara, baiknya anda pahami dulu artikel ini, dan jika ada yang kurang dipahami, boleh bertanya langsung ke saya via email atau komentar, bertanya kepada teman anda yang sudah duluan mengerti, atau coba-coba searching di Google.

Fungsi HTML adalah sebagai rangka dasar dari sebuah website. Ibaratnya manusia, HTML merupakan tulang-tulang yang membentuk rangka tubuh kita. Maka HTML jelas merupakan hal paling dasar dari sebuah website. Jika anda ingin menjadi webmaster professional, maka anda wajib mempelajari HTML.

b. CSS

Ibarat HTML adalah rangka, maka CSS berperan sebagai kulit. Jangan Tanya juga apa kepanjangan CSS, karena saya sama sekali tidak tahu, yang penting kan saya bisa membuat dan membaca struktur untaian kode-kode CSS.

Makanya kebanyakan teman saya yang dulunya lulusa IT, mereka tahu apa definisi CSS, tapi saat dipraktekkan mereka sama sekali tidak mengerti cara penggunaan CSS. Adakalanya kita yang belajar otodidak lebih baik dari mereka yang belajar di bangku kuliah, tahu teori namun sulit mempraktekannya.

Contoh kode-kode CSS seperti ini: <style type="text/css">
<!--
.body  {
font-family: Arial, Helvetica, sans-serif;
color: #000000;
background-color: #CCFF00;
text-align: center;
}
-->
</style>
Kode CSS selalu diawali dengan <style type="text/css"> dan diakhiri dengan </style>. Kode ini diletakkan di bagian kepala (diantara <head> dan </head>). Kode diatas merupakan CSS tipe Class.
Di CSS, kita mengenal 3 tipe, yaitu Tag, Class, Div. Disini tiap masing-masing tipe memiliki fungsinya tersendiri. Mari kita lihat contoh Tag dibawah ini: <style type="text/css">
<!--
body {
font-family: Arial, Helvetica, sans-serif;
color: #000000;
background-color: #CCFF00;
text-align: center;
}
-->
</style>
Tampak perbedaan antara Tag dan Class, bedanya terletak di tanda titik sebelum body, yang Tag tidak ada tanda titik sedangkan class ada tanda titiknya. Fungsi Tag ini digunakan untuk menentukan desain web disetiap aspek. Rumit cara menjelaskannya, tapi jika anda mencoba sendiri, nanti anda akan paham sendiri fungsi dari Tag.

Sedangkan Div fungsinya untuk mengatur layout sebuah web. Dulunya sebelum tahun 2010, website membuat layout dengan menggunakan metode table HTML. Tapi semenjak kedatangan CSS, semuanya jadi berubah. Saat ini Div menjadi perintah pokok untuk membuat layout website. Contoh Div begini:<style type="text/css">
<!--
#body {
font-family: Arial, Helvetica, sans-serif;
margin: 20px;
padding: 20px;
height: auto;
width: auto;
}
-->
</style>
Div selalu diawali dengan “#” (tanda kres).

Jika anda benar-benar ingin menjadi developer handal, maka anda wajib mempelajari HTML dan CSS sepenuhnya.

c. PHP

PHP itu bukan pemberi harapan palsu, tapi ini merupakan bahasa pemprograman website yang paling banyak digunakan didunia, termasuk situs sekelas facebook juga menggunakan PHP. Selain PHP, dunia programming juga mengenal JSP dan ASP.net yang fungsinya sama dengan PHP.

Ibarat HTML sebagai rangka manusia dan CSS sebagai kulitnya, maka PHP bisa dikatakan sebagai organ tubuh yang berfungsi untuk mengatur sebagai system metabolisme manusia.
Contoh PHP: <? php the_content();  ?> Yang diatas merupakan salah satu bentuk kode PHP, nanti kita kupas apa sebenarnya maksud dari kode diatas.

Mempelajari PHP memang penting, tapi saat ini kita diperkenalkan dengan era open source, dimana CMS mulai banyak bertebaran dimana-mana. Loh, apa itu open source dan CMS?

Menurut Wikipedia, open source adalah sistem pengembangan yang tidak dikoordinasi oleh suatu individu / lembaga pusat, tetapi oleh para pelaku yang bekerja sama dengan memanfaatkan kode sumber (source-code) yang tersebar dan tersedia bebas (biasanya menggunakan fasilitas komunikasi internet).

Singkatnya, open source ini dikembangkan oleh developer secara individu atau komunitas, agar dapat dimanfaatkan oleh orang banyak secara gratis.

Sedangkan CMS adalah perangkat lunak yang digunakan untuk menambahkan atau memanipulasi (mengubah) isi dari suatu situs web. Sumber Wikipedia.

Apa saja CMS yang sifatnya open source? Mari kita cek beberapa yang popular saja.

1. WordPress
WordPress merupakan CMS yang paling banyak dipakai di seluruh dunia untuk membangun sebuah blog ataupun website. WordPress menggunakan bahasa pemrograman PHP dan database mysql. CMS sangat cepat pengembangannya, hal ini didukung oleh ribuan developer yang saling membahu mengembangkan CMS ini.

2. Joomla
CMS joomla ini merupakan cms yang powerful. Karena itu, para webmaster menggunakannya untuk website yang sedikit rumit dan kompleks seperti company profile perusahaan, web sekolah maupun toko online. Namun untuk perkembangannya, Joomla sepertinya kalah dengan WordPress dari segi fitur dan keamanannya.

3. Drupal.
Drupal sempat menjadi CMS terbaik pada tahun 2008, dan Runer UP pada tahun 2010. Sayang pada tahun-tahun berikutnya kalah dengan Joomla dan WordPress. Namun begitu, ada beberapa kelebihan dari Drupal dari CMS yang lain yaitu File size-nya yang ringan hanya 1 M dan 3,3M saat di extract, Instalasi yang mudah serta dukungan database selain MySQL. CMS ini cocok untuk situs-situs portal berita.

Dan masih banyak CMS lain yang sifatnya open source, ada Prado, PHPNuke, dan lainnya.

Maka dari itu, saya ingin bilang mempelajari PHP tidaklah begitu urgent, artinya anda dapat membangun sebuah website hanya dengan mengandalkan ilmu HTML, CSS, dan sedikit pengetahuan tentang salah satu dari sekian banyak CMS. Jadi, mempelejari PHP cukup seperlunya saja, tidak perlu begitu mendalam.

Saya sarankan anda untuk mempelajari satu CMS saja, yaitu WordPress. Kenapa harus WordPress? Itu karena WordPress didukung oleh komunitas developer terbesar didunia, sehingga mengembangankan WordPress tidaklah begitu sulit.

Di tulisan selanjutnya saya akan membahas lebih detil mengenai segala apapun yang berhubungan denga WordPress.

2. Hosting


Menurut idebagus.com, hosting adalah tempat untuk menampung data-data yang diperlukan oleh sebuah website dan sehingga dapat diakses lewat Internet. Data disini dapat berupa file, gambar, email, aplikasi/program/script dan database.

Jadi, untuk meng-online kan sebuah website, kita wajib memiliki hosting yang terhubungan dengan internet. Dengan begitu, semua orang dapat mengakses ke website kita. Hosting ini bisa di-ibaratkan sebuah rumah, dan files adalah penghuninya.

Hosting ini ada dua, ada yang tidak terhubung dengan internet (localhost) dan ada yang terhubung dengan internet. Nah, yang terhubung dengan internet ini terbagi tiga lagi, yaitu Shared Hosting, VPS, dan Dedicated Server. Apa beda ketiganya?

Menurut kimsariwarto.com,shared hosting merupakan layanan hosting di mana sebuah account hosting ditaruh bersama-sama beberapa account hosting lain dalam satu server yang sama, dan memakai services bersama-sama. Keuntungan shared hosting adalah harganya yang murah, namun kerugiannya adalah tingkat privasi dan performa yang tidak sebaik VPS dan VDS.

Sedangkan VPS (Virtual Private Server) adalah salah satu teknologi terbaru dari Server Virtualization Technology dimana pada teknologi ini sebuah server dibagi-bagi menjadi beberapa virtual server, masing-masing virtual server tersebut bisa berlaku seperti server yang sebenarnya seperti pengaturan user, process, file system dan sebagainya, resource VPS lebih besar daripada share hosting.

Salah satu kekurangan VPS adalah di dalam VPS terdapat Operating System yang masih kosong sehingga anda harus men-setupnya agar menjadi sebuah website atau web server yang dapat anda gunakan untuk kebutuhan anda.

Berbeda dengan hosting anda disana sudah disajikan sebuah system website yang bisa anda wujudkan dalam bentuk sebuah website akan tetapi di VPS anda diharuskan mempunyai kemampuan dalam mengolah sebuah OS dari nol oleh sebab itu dibutuhkan pengalaman dari sebuah pembelajaran untuk mengelola VPS, apakah semua orang bisa mengelola VPS? BISA asalkan berkeinginan untuk belajar.

Dedicated Server adalah tipe hosting dimana anda menyewa satu server secara utuh tanpa dibagi dengan user yang lain. Hanya anda sendiri yang menempati server tersebut. Anda berkuasa penuh atas server tersebut termasuk pemilihan sistem operasi, hardware, dan sebagainya.

Biasanya dedicated server juga dilengkapi dengan dedicated bandwidth, jika perusahaan penyedia DS mengatakan bandwidth yang anda dapatkan adalah sebesar 100Mbps maka anda dapat menggunakannya penuh untuk kebutuhan anda.

3. Domain


Jika hosting di ibaratkan rumah dan files adalah penghuninya, maka domain bisa kita ibaratkan sebagai alamat rumah, penghubung antara pengunjung dengan website. Artinya, domain itu adalah alamat website kita.

Domain itu terdiri dari 2 unsur, yaitu nama domain dan extension. Contoh yang kita ambil adalah YAHOO.COM, nah dari YAHOO.COM yang menjadi nama domain adalah YAHOO dan extensionnya adalah .COM (baca –dot com)

Domain itu sifatnya unik, hanya bisa dimiliki oleh satu orang saja, tidak ada nama domain yang sama dalam satu extension. Dan penamaan domain hanya bisa menggunakan karakter huruf dan angka saja, tidak boleh karakter lainnya.

Extension sendiri dibagi menjadi beberapa golongan:

  • infrastructure top-level domain (ARPA)
  • generic top-level domains (gTLD)
  • restricted generic top-level domains (grTLD)
  • sponsored top-level domains (sTLD)
  • country code top-level domains (ccTLD)
  • test top-level domains (tTLD)

List lengkap extension bisa kita temukan di http://en.wikipedia.org/wiki/List_of_Internet_top-level_domains

generic Top-Level Domains (gTLD)
Ini merupakan tipe domain yang paling umum digunakan. Untuk mendaftarkan domain jenis ini sering kali anda tidak perlu membutuhkan syarat apapun. Contoh extension domain ini adalah .com, .net, dan .org.

country code Top-Level Domains (ccTLD)
Nah, kalau yang ini adalah domain local, contohnya kalau di Indonesia seperti co.id, ac.id, my.id dan lainnya. Untuk mendaftarkan domain jenis ini anda perlu mempersiapkan syarat-syarat khusus.

MULAI BELAJAR

Setelah anda memahami dasar-dasar dalam pembuatan website, maka giliran anda untuk mempelajarinya satu persatu jika memang anda benar-benar ingin menjadi webmaster.

Mulai lah secara bertahap, jangan melangkah jika anda benar-benar masih dari nol, kecuali anda sudah memahami ilmu dasarnya baru boleh anda melangkah ke pembahasan selanjutnya.

Seri pertama: Cara Efektif Belajar HTML dengan Praktek Langsung Seri kedua: Belajar Desain Web dengan CSS (Praktek Langsung) Seri ketiga: Teknik Memilih Domain agar Berhasil Memenangkan Halaman 1 Google Seri keempat: Rekomendasi WebHosting Lokal dan Luar Negeri Terbaik Seri kelima: Panduan Lengkap Membuat Website dengan Platform WordPress

Artikel ini bermanfaat? Share ke Jejaring Sosial Anda.

Artikel lain:

1 Komentar untuk "Panduan Cara Membuat Website Sendiri"

  1. Mas, artikelnya ada disertai langkah-langkah tidak ya, mulai membangun http://berkahkhair.com dari nol hinggga jadi

    ReplyDelete