pengalaman dan pembelajaran bina website sendiri

zafreena1984 · 11th June 2009, 02:14 AM

Pengenalan - bina website dari sifar (bhg 1)

Panduan ini ditulis berdasarkan pengalaman penulis yang membina laman web sendiri daripada 'tidak tahu langsung' kepada akhirnya siap sebuah website yang diingini. Penulis berharap pengalaman dan ilmu yang tidak seberapa ini dapat dimanfaatkan oleh sesiapa sahaja yang ingin belajar mengenai pembinaan website. Panduan ini khusus ditulis di dalam bahasa Malaysia kerana pada pandangan penulis, panduan seumpama ini(dalam bahasa Malaysia) amatlah jarang ditemui. Dan untuk makluman, sudah diletak panduan membina website dalam bahasa english di bahagian 'FREE ebooks'. Penulis juga tidak mempunyai latar belakang IT, oleh itu segala cadangan dan pandangan daripada pakar-pakar diluar sana amatlah dihargai.

Baiklah, perkara PERTAMA yang perlu anda sedar adalah TUJUAN anda memiliki website?

Jika anda hanya mahu 'suka-suka' dan belum masa lagi bagi anda untuk mengeluarkan sedikit modal, maka saya cadangkan anda boleh mulakan dengan membina blog menggunakan 'Blogger' atau 'Wordpress'. Saya juga bermula dengan blogger dan sambil belajar pelbagai ilmu dalam internet yang serba luas ini. Ringkasnya, jika anda sanggup untuk mengeluarkan sedikit modal dan masa, bolehlah anda memiliki website sendiri kerana perkara pertama sebelum anda boleh membina website, anda perlu mempunyai nama domain dan hosting untuk website.

Mengenai Domain dan Hosting

Bagi yang sememangnya baru dalam dunia website/blog dan sebagainya ini mungkin sedikit keliru dengan istilah 'domain' dan 'hosting' ini. Saya juga begitu di awal penglibatan. Baiklah, 'domain' adalah alamat website anda seperti www.zafreenapublication.com. Anda boleh mendaftar dengan mana-mana syarikat yang menawarkan pendaftaran nama domain ini dengan apa-apa sahaja nama yang anda mahu dengan syarat ia tidak lagi dimiliki oleh sesiapa. Mengenai sambungan dibahagian belakang .com .com.my .net .us dan sebagainya, ia juga bergantung pada pilihan anda dan pilihan yang ada pada syarikat untuk pendaftaran domain. Untuk memudahkan kefahaman anda nanti, saya andaikan satu nama domain anda yang baru sahaja didaftar iaitu; www.namawebanda.com Ohya, sebenarnya tiada harga tetap dalam pendaftaran domain ini, tetapi, kebiasaanya sekitar RM 30-RM 50. Ada juga syarikat yang menawarkan pendaftaran domain percuma jika kita membeli perkhidmatan hosting dengan mereka.

Mengenai Hosting pula, ia boleh diibaratkan sebagai tapak (server) untuk meletak website anda nanti supaya boleh dikunjungi pelawat-pelawat dari serata dunia. Mengapa pula perlu 'tapak' ini? tidak bolehkah ia dilawati daripada komputer anda sahaja? Hehe, satu ketika dahulu, inilah soalan yang saya pernah tertanya-tanya. Ringkasnya, bukan semua komputer boleh dijadikan 'tapak' kerana atas fakta 'kecanggihan' atau 'power' sesuatu komputer itu. Untuk kefahaman lagi, hanya komputer-komputer yang canggih ini mampu memikul tugas berat sebagai tapak yang dilawati beribu orang dari pelbagai tempat serata dunia. (nak faham lagi, boleh pergi library)

Balik kepada bagaimana mendapatkan hosting, sama juga seperti anda mendapatkan nama domain tadi. Anda perlu mendapatkan syarikat yang menawarkan perkhidmatan Hosting kepada anda. Bagaimana memilih syarikat Hosting? Semua pilihan adalah bergantung kepada anda, buatlah sedikit research atau bertanya kepada ahli-ahli di forum berkaitan juga bagus untuk anda lebih mengenali bakal syarikat hostinga anda. Pada pandangan saya, PERKHIDMATAN atau BANTUAN TEKNIKAL yang bakal diberikan AMAT PENTING berbanding harga hosting kerana saya boleh merujuk kepada mereka apabila saya mempunyai masalah dengan website saya.

saya mengakhiri panduan bhg 1 ini disini, insyAllah, saya akan sambung Bhg 2 dimasa akan datang.

dicopy dan paste dari --> zafreena PUBLICATION blog

zafreena1984 · 12th June 2009, 12:38 AM

Terdapat pelbagai cara untuk anda bina website, antaranya;

1. cara yang paling mudah

Upah web designer atau mengambil mane2 pakej design web yang sesuai dengan kehendak dan kemampuan anda. Antara pakej web design yang menarik pada pandangan saya adalah dari LittleKittle.com (Powered by CubeCart) .

Hanya RM299 untuk web design + hosting + domain!

2. cara yang sedikit adventure

Menggunakan perisian membina web yang sedia ada. Berikut saya senaraikan beberapa perisian yang saya biasa dengar dan ianya hanyalah penerangan secara umum;

CMS (Content Management System) (PERCUMA)

Sistem Pengurusan Kandungan (content management system (CMS)) ialah sebuah perisian komputerpengurusan kandungan. Sebuah CMS menguruskan pelbagai dokumen dan kandungan yang lain seperti imej dan sumber-sumber multimedia. Sebuah sistem pengurusan kandungan laman web ialah sebuah sistem pengurusan kandungan dengan ciri-ciri tambahan untuk mempermudahkan langkah-langkah untuk menerbitkan kandungan web ke dalam laman web.

Dipetik dari Komuniti Pengguna Joomla Malaysia - Utama

Jomla (PERCUMA)

Joomla! ialah sebuah sistem pengurusan kandungan sumber terbuka yang diedarkan secara percuma. Ciri-ciri unik Joomla! termasuklah laman cache untuk meningkatkan prestasi, RSS, laman boleh cetak, berita terkini, blog, undian, carian laman, dan bahasa-bahasa.

Joomla! dibebaskan di bawah Lesen Dokumentasi Bebas GNU. Kelebihan Joomla adalah lebih banyak dokumentasi mahupun komuniti yang menggunakan bahasa Malaysia.

Dipetik dari Komuniti Pengguna Joomla Malaysia - Utama

ecommerce website - Zencart (PERCUMA)

Merupakan sebuah perisian sistem kedai online yang menggunakan sumber terbuka dan boleh digunakan secara PERCUMA. Cara-cara installation, setup dan sebagainya boleh didapati di dalam website zencart sendiri, di dalam bahasa inggeris. Walaubagaimanapun, panduan installation, setup dan menggunakannya di dalam bahasa Malaysia boleh dibeli dari di Kursus Dari Rumah Panduan Langkah Demi Langkah Membina Kedai Online Anda Sendiri.
Berpandukan panduan yang diberikan, sebuah laman web ecommerce menggunakan zencart mudah dibina.

Boleh download perisian dan panduan zencart di ecommerce shopping cart software by Zen Cart ecommerce solution

ecommerce website - osCommerce (PERCUMA)

Merupakan sebuah perisian sistem kedai online yang menggunakan sumber terbuka (open source) dan boleh digunakan secara PERCUMA (GNU). Cara-cara installation, setup dan sebagainya boleh didapati di dalam website osCommerce sendiri, di dalam bahasa inggeris.

Boleh download perisian dan panduan osCommerce di osCommerce, Open Source Online Shop E-Commerce Solutions

ecommerce website - Cubecart (PERCUMA & BERBAYAR)

Sebuah persian kedai online yang memberi pilihan kepada pengguna untuk memilih ciri-ciri ataupun kemampuan perisian yang dimiliki. Ringkasnya, boleh digunakan secara PERCUMA tetapi ciri-cirinya adalah terhad berbanding yang berbayar. Boleh analisa dengan lebih lanjut di website CubeCart sendiri.

Sila rujuk CubeCart - Free & Commercial Online Shopping Cart Solutions

3. cara yang agak memeningkan kepala

Download, edit sendiri kod2 programming seperti HTML, PHP dan sebagainya. Kerjanya agak panjang, tetapi memuaskan bagi saya. Jika anda mahu web anda disiapkan dalam masa yang singkat, cara ini tidak sesuai buat anda. Untuk bina sebuah web yang memuaskan hati anda, anda perlukan ilmu dan kosistensi dalam proses pembelajaran anda. Dan semua ini perlukan masa dan komitmen dari anda. Saya akan cuba menerangkan sebaik mungkin cara2 bina web menggunakan cara ini.

Saya akan sambung lagi proses ini di bahagian ke-3.

Sekian.Terima kasih.

ohya, anda boleh dapatkan panduan 'create your first website' secara PERCUMA dari blog saya. Panduan membina website langkah demi langkah ini amat sesuai buat beginner stage.

diva.aroma · 15th June 2009, 05:43 PM

tq.
very good info, zaf...

RahaAisy · 26th June 2009, 12:54 AM

bagus ni...saya ni tgh belajar wat website sendiri

zafreena1984 · 30th June 2009, 01:28 AM

tq 4 ur support.. insyallah soon akan continue bhg 3..

muhdsuhaily · 30th June 2009, 09:49 PM

Quote:

Originally Posted by zafreena1984

tq 4 ur support.. insyallah soon akan continue bhg 3..

Salam,

Satu info yang baik bagi yang zero dalam rekabentuk laman web. Keep it up..

zafreena1984 · 10th July 2009, 11:42 PM

Salam sejahtera kepada semua pembaca, baru kini saya dapat meluangkan sedikit masa untuk menyambung bahagian ke-3 siri belajar bina website dari sifar ini.

Baiklah, tanpa membuang masa, bahagian 3 ini akan menerangkan cara-cara untuk menggunakan web template PERCUMA yang boleh dicari dan download di 'google'. saya sendiri telah download pelbagai jenis web template PERCUMA ini buat koleksi dan proses pembelajaran. Disini saya senaraikan beberapa website yang memberi web template PERCUMA yang lawa-lawa dan comel-comel... anda boleh search dan pilih yang mana suka

1. Free Web Templates - Get free website templates and page layouts, flash templates, business templates, css templates, wordpress themes, joomla templates
2. Free Website Templates
3. Web Templates - Flash Website Templates - Logo Design - Templates Box

Untuk memudahkan tutorial kita ini, saya akan menggunakan satu web template contoh yang boleh download di website saya zafreena PUBLICATION blog. Disini anda akan jumpa bahagian 'FREE download web template (colorvoid-website-template)', klik pada link tersebut dan proses download akan bermula. Apabila proses download selesai (UNZIP dahulu untuk dapatkan isi kandungannya), anda boleh buka file tersebut dan isi kandungannya adalah seperti dalam rajah di bawah;

Anda boleh double klik pada 'index' untuk preview rekabentuk website yang bakal anda bina nanti. Baiklah, mari kita mulakan pengembaraan kita ke alam 'html'. Jika tadi anda klik pada 'index' yang keluar adalah sebuah website yang seperti anda biasa lihat di internet. Sekarang, kita akan lihat 'rangka' dalaman yang membina website tersebut. Bagaimana? Mudah sahaja, klik pada 'index' juga, cuma kali ini gunakan 'right klik' pada mouse anda dan pilih 'open with' dan seterusnya 'notepad' seperti dalam rajah di bawah.

Jeng-jeng-jeng... keluarlah segala kod-kod html yang memeningkan kepala anda. Jangan risau, anda tidak perlu faham semua kod yang ada tue, tapi kalau tahu lebih bagus.

saya bermula dari tidak kenal langsung kod-kod html, dan dari sikit-sikit saya belajar dari 'google' dan akhirnya semakin mengenal kod-kod html ini.

Sebelum kita mulakan 'pembedahan' kita ini, sila simpan satu set file web template ini sebagai backup di bahagian lain. Tujuannya, supaya apabila anda dah terlajak atau terlampau dalam edit kod-kod html nanti, dan anda pun dah pening tak tau mana silapnya, anda boleh guna simpanan yang masih suci dan bersih ini dan bermula semula.

Saya akan tunjukkan 1 contoh edit kod-kod html yang kita buka tadi. Cari perkataan 'Website name' pada kod tadi seperti gambar di bawah. Tukarkan kepada nama website yang anda ingini. Saya telah tukarkan kepada 'zafreena publication' untuk tutorial ini. Setelah selesai, sila save. (JANGAN UBAH NAMA FILE) Seterusnya, untuk melihat perubahan pada website sebenar, double klik pada 'index' sekali lagi dan anda boleh lihat perubahan pada bahagian atas website seperti rajah di bawah.

Tahniah, ini adalah kejayaan pertama anda mengubah isi kandungan di dalam web template tersebut. Saranan saya adalah, jangan takut untuk cuba edit kod-kod html yang ada di bahagian lain. Setiap kali siap edit, save, lepas tue preview samada perubahan yang dilakukan berjaya atau sebaliknya. Saya akan berikan lagi contoh-contoh edit kod-kod html ini dibahagian 4 nanti dan kita juga akan mula belajar definisi-definisi kod-kod html dari asas.

Semoga berjaya!

Hairudy · 11th July 2009, 07:46 PM

Thanks for the info zafreena