16466789 Cara Membuat Website Menggunakan Program

1

Bagaimana Cara Membuat Website Dengan Tangan Anda Sendiri Dan Upload Ke Hosting!

Oleh: Kusuma Putra

Copyright 2009 www.caramembuatwebsite.com

2Hak Cipta 2009, www.caramembuatwebsite.com by. Kusuma Putra Dilarang keras memproduksi, memperbanyak dan mendistribusikan baik keseluruhan maupun sedikit maupun bagian dari panduan belajar ini dalam bentuk apapun, tanpa izin tertulis dari www.caramembuatwebsite.com atau dari penulis. Jika Anda mendapatkan panduan belajar ini dari orang lain ataupun situs lain tanpa disertai rekomendasi kami, berarti Anda telah mendapatkan salinan, hasil bajakan ataupun malah copy asli produk ini. Untuk itu, mohon bantuan Anda dalam menghentikan pelanggaran hak cipta dengan menghubungi kami melalui: http://caramembuatwebsite.com/support Petunjuk Penggunaan Semua materi ni didapat dari hasil rangkuman pembelajaran saya selama ini. Baik ketika mengalami trial anda error, masukan dari rekan-rekan saya, dan juga dari hasil yang saya peroleh di Internet. Sehingga inilah modul yang akan menjelaskan kepada Anda bukan pada teori tapi langsung praktek dengan tujuan Anda bisa mempraktekkan apa yang diajarkan setelah membaca panduan ini. Demi kenyamanan belajar sebaiknya Anda men-download dulu dan mencetak panduan belajar ini sebelum membacanya. Namun anda dilarang keras memproduksi, memperbanyak dan atau mengedarkan panduan ini dalam bentuk hardcopy maupun softcopy tanpa ijin tertulis dari www.caramembuatwebsite.com

Mantap! Kusuma Putra Internet Marketer Owner: www.caramembuatwebsite.com


3

Sebelum Anda MulaiKetika Anda membuat sebuah website, anda akan menggunakan gambar-gambar Anda juga akan menambahkan link ke halaman yang lain. Untuk memudahkan anda mengelola website anda, maka anda perlu membuat sebuah folder di komputer anda, dan meletakkan file-file gambar dan file website yang anda buat (html) didalam satu tempat. Anda bisa melihatnya pada gambar di bawah ini, begitulah kira-kira struktur file yang ada di satu folder bernama website. Pada gambar di sebelah kanan, adalah gambar file yang ada di server. Bila anda lihat kedua gambar dibawah, maka baik di komputer anda ataupun di server hosting maka begitulah seharusnya file-file diletakkan. Jadi antara di komputer dengan di server hosting anda bisa meletakkan file-file secara mirip sama.

Pada contoh diatas, path/jalur file berikut akan dibuat: /index.html /otherpage.html /images/image1.jpg /images/image2.jpg Catatan: Nama folder dan nama file harus dengan huruf kecil semuanya. (case sensitif)


4 Langkah pertama: Anda perlu membuat sebuah folder di komputer anda, klik Make a new folder (1). Anda bisa membuatnya di my documents seperti contoh dibawah ini. Lalu Berilah Nama Website (2). Pada folder Website inilah nantinya anda akan meletakkan file-file website anda.

Setelah folder website selesai dibuat, klik dua kali untuk masuk kedalamnya, lalu buat sebuah folder lagi (1). Kali ini namakan folder tadi sesuai dengan nama domain yang akan anda pergunakan untuk membuat website anda yang pertama. Karena saya sudah menyiapkan sebuah domain: caramembuatwebsite.com maka saya menamakannya sesuai nama itu. (2)


5

Lalu, didalam website folder anda, buatlah sebuah folder baru (1) dengan nama images (2) dimana nantinya anda akan meletakkan file-file gambar yang diperlukan untuk mempercantik website anda.

Mendownload Web Editor AndaSebuah web editor yang mudah digunakan dan sangat sederhana dan juga gratis yang akan kita pergunakan adalah NVU. Untuk mendownloadnya silahkan ke: http://www.nvudev.com/download.php Klik pada link yang sesuai dengan operator komputer anda. Dalam hal ini, karena saya menggunakan Windows XP maka saya klik pada bagian itu. Jika link diatas tidak bisa, maka silahkan download melalui server saya: http://www.caramembuatwebsite.com/bonus/nvu-1.0-win32-installerfull.exe


6

Muncul sebuah kotak, dan Nvu siap didownload. Klik Save File

Pilih sebuah folder di komputer anda untuk menyimpan installer file ini. Dalam gambar dibawah, saya meletakkannya di folder Website Di Tempat Folder Domain Yang diatas saya buat. Lalu klik Save.


7

Catatan: Ada baiknya anda meletakkan installer file seperti ini di folder khusus di komputer anda. Installer ini hanya dipergunakan sekali saja. Untuk penggunaan lain kali, anda dapat enyimpannya. Setelah file selesai didownload maka klik open untuk mulai menginstallnya.


8

Komputer anda kemudian akan memberitahu anda bahwa anda akan menginstall Excutable File. Klik Ok, karena ini adalah file yang aman.

Executable File: Adalah file yang akan anda install (terpasang) di komputer anda. Jika anda mendownload sebuah Executable File dari website yang tidak jelas reputasinya, maka anda tidak tahu apa yang ada didalamnya, ini menjadi sebuah resiko bagi anda, karena bisa saja berisi file yang dapat merugikan komputer anda. Jaminan Keamanan: Baik Installer Nvu dan WS_FTP yang nantinya anda akan pergunakan, keduanya adalah aman. Lalu Klik: Next.


9

Setelah klik pada tombol I accept the agreement (1), klik Next (2)

Lalu proses selanjutnya adalah memilih dimana program akan terinstall. Secara otomatis akan terpilih di program files komputer anda. Anda bisa memilih folder yang lain. Namun, anda bisa langsung melanjutkan, klik Next.


10 Start menunya akan diberi nama Nvu. Anda nantinya dapat menemukan icon untuk meluncurkan Nvu ini pada start menu komputer anda dengan nama Nvu. Lanjutkan: Next

Lalu anda dapat memberi centang pada Create a desktop icon, kemudian klik: Next.


11 Lalu anda klik: Install

Nah Nvu sekarang sudah terinstall di komputer anda dan siap dipergunakan. Anda bisa meluncurkannya melalui start menu anda. Namun, anda bisa langsung meluncurkannya sekarang juga karena Launch Nvu dalam posisi terpilih. Klik Finish untuk meluncurkan Nvu.


12 Saat pertama kali diluncurkan, maka akan keluar jendela Nvu Tips Anda bisa klik Next Tip untuk membaca Tips yang ada (1), Atau Klik Tanda silang di ujung sebelah kanan atas untuk menutup jendela Nvu Tip ini. (2)


13

Nah setelah itu anda dapat mengklik tombol x yang ada sesuai gambar dibawah unuk membuat jendela utama Nvu lebar sepenuhnya.

Membuat Tabel UtamaHalaman Nvu yang sedang terbuka adalah tempat dimana anda akan mulai membuat halaman website anda. Untuk membuat halaman website supaya tidak terlalu lebar sehingga orang sulit membacanya anda bisa membuat tabel utama dimana semua file gambar dan tulisan akan ada di dalam tabel utama ini. Tabel akan membantu anda mengontrol bagaimana website anda akan kelihatan di Internet. Pastikan cursor anda letakkan di dalam editor Nvu (1). Lalu klik tab menu Insert dan akan tampil berbagai pilihan kebawah (drop down menu). Lalu klik Table (2).


14

Lalu Kotak Insert Table akan muncul. Anda bisa memilih berapa banyak baris dan kolom yang anda perlukan. Untuk tabel utama anda hanya memerlukan 1 baris dan 1 kolom saja, maka posisikan cursor anda pada 1 kotak, lalu klik kotak tersebut.

Klik Pada Menu Tab Tabel dan Pada Drop Down Menu Klik Table Properties.


15 Isikan lebar tabel 700 (1) dan pilih Pixels dari pilihan yang ada pada kotak dengan panah kebawah di sebelah kanan width (2). Untuk menghilangkan border tebal di sekeliling tabel, isikan Border dengan 0 pixels (3). Tentukan padding dengan 20 pixels (4), ini untuk memberikan jarak antara text dan pinggir dari tabel. Untuk meletakkan tabel di bagian tengah dari halaman browser anda, pilih Center dari menu drop down. (5) Pada langkah selanjutnya, anda akan mengisikan warna background yang akan mengisi tabel anda. Untuk mengisikan background warna di dalam tabel, maka anda perlu tentukan background tabel menjadi putih. Klik Tombol Background Color (6).

Klik kotak putih pada palete warna. (1) Lalu Klik Ok (2).


16

Klik Ok maka tabel anda sudah selesai dibuat.

Save File AndaSebelum memasukkan gambar-gambar, anda harus mensave halaman web. Hal ini membuat Nvu tahu hubungan website anda dengan gambar dengan menemukan dimana keduanya diletakkan di folder untuk website anda. Pada menu File drop down menu, click Save As.


17

Kotak yang menanyakan Judul halaman (title) Anda akan muncul, isikan dengan kalimat yang menggambarkan tentang website anda. Isikan secukupnya saja, maksimal 65 karakter panjangnya. (1) Lalu Klik Ok.

Secara Otomatis, anda akan ditawarkan untuk simpan dengan nama yang sama dengan judul halaman, namun anda tidak perlu menerimanya, jika tidak nama file anda akan panjang sekali.


18

Rubah nama file menjadi index (1). Lalu klik Save (2).

Catatan: Nama file untuk website adalah case sensitive, jadi seharusnya menggunakan huruf kecil semuanya. File index.html harus huruf kecil semuanya.

Menentukan Warna Dasar ( Background ) Website AndaNah sekarang anda tentukan warna dasar dari halaman website yang akan mengelilingi tabel. Dari Menu Tab Format lihat drop down menu klik: Page Colors and Background


19

Pilih Use custom colors: (1) dan klik pada kotak di sebelah kanan tulisan Background (2)

Pilih warna yang anda inginkan pada palete warna (1). Lalu Klik Ok (2).


20

Maka warna dasar background website anda sudah ditentukan. Dan Klik Ok.

Membuat Headline Website AndaUntuk mencegah supaya halaman website tetap bagus, dan memberikan keleluasaan bekerja didalam tabel, silahkan klik enter 3 - 4 kali di dalam tabel. Maka tabel akan memanjang ke bawah.


21

Ketikkan headline website anda. Headline adalah judul atau kalimat penarik perhatian. Semua website penjualan yang baik selalu dimulai dengan headline yang menarik perhatian pengunjung.

Meletakkan Gambar Dan Teks BersebelahanUntuk membuat gambar dan teks dalam website, maka anda perlu membuat sebuah tabel dengan dua kolom. Di tab menu Insert lihat pada drop down, klik Table.


22

Untuk tabel ini, pilih dua kotak (kolom). Kolom adalah pada sumbu horisontal, sedangkan baris pada sumbu vertikal.

Anda perlu memperbaiki tabel yang tercipta, untuk menghilangkan garis pinggir (border), juga untuk meletakkan gambar secara pas, terutama jika lebar gambar lebih kecil dari lebar kolom tabel. Klik cursor didalam cell dari tabel dimana anda ingin meletakkan gambar.


23

Pada tab menu Table klik pada drop down menu Table Properties.

Biarkan Width dengan 100 (1), dan pada pilihan kebawah di % of cell (2). Lalu tentukan Border 0 pixels (3), dan padding isikan 5 pixels (4) untuk memberikan jarak antara gambar dengan teks. Lalu, klik tab Cells di sebelah kanan tab Table.


24

Tentukan Width atau lebar cell (1) sama dengan lebar gambar (image) yang anda akan letakkan pada cell ini. Kemudian Klik Ok.

Menyisipkan GambarLetakkan cursor anda di dalam cell dimana gambar akan disisipkan, dan pada menu tab Insert pada drop down menu, klik Image.


25

Kotak Image Properties muncul. Klik Choose File.

Dari folder images yang sudah ditentukan diawal tadi, pilih gambar yang anda inginkan dan klik dua kali. Bisa juga dengan klik gambar yang anda pilih sekali, lalu klik tombol Open.


26

Gambar dengan jalur/pathnya akan ditampilkan di Image Location (1). Ketikkan alternative teks/keterangan mengenai gambar anda di kotak isian Alternate text (2). Dan Klik Ok. (3).

Tuliskan Sebuah Keterangan Dibawah Gambar AndaKeterangan di bawah gambar adalah cara yang baik untuk mendapatkan perhatian pembaca, sama seperti kita selalu membaca keterangan di bawah gambar pada majalah. Setelah menyisipkan gambar, cursor anda akan ada di belakangnya (1). Klik Enter pada keyboard dan tuliskan sebuah keterangan gambar. (2)


27

Tuliskan Teks Di Body Halaman Website AndaUntuk mengisikan teks di halaman utama website cerita anda letakkan cursor di dalam cell dimana anda ingin teks diletakkan dan mulai menulis.


28

Membuat Kalimat Berupa Order List ( Daftar )Untuk menunjukkan manfaat atau point-point utama, sebuah daftar urutan adalah cara yang sangat baik untuk mendapatkan perhatian dari pembaca. Menggunakan gambar seperti tanda checkmark menarik perhatian lebih besar lagi ke daftar anda. Gambar checkmark sudah saya sertakan di Bonus: Gambar Instan. Untuk mengontrol letak dari gambar dan kalimat dan menjaganya tetap rapi sebuah tabel dengan dua kolom dan banyak baris sangat diperlukan. Letakkan kursor dimana anda ingin meletakkan daftar manfaat (1), lalu klik table pada tab menu Insert. (2). Pilih dua kolom dan sejumlah baris sesuai dengan banyaknya manfaat yang anda miliki. (3).


29

Letakkan kursor di sebelah kiri cell paling atas (1) dan klik Table Properties di menu tab Table drop down menu. (2

Seperti sebelumnya, biarkan Width dengan 100 (1), dan pada pilihan kebawah di % of cell (2). Lalu tentukan Border 0 pixels (3), dan padding isikan 5 pixels (4) untuk memberikan jarak antara gambar dengan teks. Lalu, klik tab Cells di sebelah kanan tab Table.


30

Tentukan lebar dari gambar checkmark Width adalah: 63 pixels (1). Klik Ok (2).

Dengan kursor masih di sebelah kiri atas cell, klik Image di tab menu Insert drop down menu.


31 Pilih gambar checkmark yang anda inginkan, berikan keterangan alternative pada Alternate text, lalu klik Ok.

Untuk mempercepat proses memasukkan gambar checkmark kedalam setiap cell, anda bisa melakukan copy dan paste. Caranya, klik kanan pada gambar checkmark yang ada di cell pertama, kemudian klik Copy.


32 Letakkan kursor anda di cell dibawah cell berisi gambar checkmark (1). Klik kanan dan klik Paste (2). Ulangi proses ini sampai semua cell kiri terisi gambar.

Di cell sebelah kanan dari tabel, anda hanya perlu mengisikan kalimat daftar manfaat tentang produk/jasa anda.


33

Mengisikan Tombol Order di Tengah WebsiteTombol order kelihatan bagus bila ada di tengah-tengah halaman website. Untuk membuatnya cukup mudah, hanya dengan sebuah tabel. Letakkan kursor anda di bagian halaman dimana anda ingin meletakkan tombol order.

Kali ini anda hanya perlu menggunakan 1 kotak saja.


34

Dengan kursor diletakkan di dalam tabel (1), Klik Table Properties dari menu drop down Table (2).

Untuk Tabel ini, tentukan Width 10 (1), pada bagian unit biarkan % off cell (2), tentukan border 0 pixels (3), Table align Center (4). Klik Ok (5).


35

Untuk mempermudah meletakkan kode tombol order anda, maka tuliskan ORDER atau KLIK ORDER UNTUK PEMESANAN -Semuanya dengan huruf besar.


36

Tanda TanganDengan menggunakan scanner dari tanda tangan asli anda, anda dapat mempunyai gambar tanda tangan elektronik yang dapat dipergunakan untuk website anda secara online. Selain menggunakan Scanner, anda juga dapat membuat tanda tangan secara gratis di: http://www.mylivesignature.com Tanda tangan yang saya pergunakan pada panduan ini, saya buat di mylivesignature.com itu. Anda tidak perlu mendaftar atau membeli apapun. Anda langsung dapat membuat tanda tangan online anda, seperti saya. Karena gambar tanda tangan ini akan diletakkan di sebelah kiri, anda tidak membutuhkan tabel untuk mengontrol posisinya. Anda tinggal meletakkan kursor anda di halaman website dimana anda ingin meletakkan gambar tanda tangan anda tadi (1), lalu klik Insert kemudian pada menu drop down klik Image (2).


37

Pilih Gambar Tanda Tangan yang akan anda pergunakan, isikan Alternate text lalu klik Ok.

Memformat Font Website Anda HeadlineHeadline dari website anda perlu perhatian lebih supaya ia kelihatan berbeda dan menarik perhatian pengunjung website anda. Pilih (blok) teks dari headline anda.


38

Pada tab menu Format drop down menu Paragraph (1), lalu geser ke sebelah kanan akan tampil drop down menu lainnya, klik Heading 1 (2).

Lalu Tentukan Jenis Huruf (Font). Untuk Headline, jenis huruf san-serif seperti Tahoma adalah paling bagus. Pada Format drop down menu, pilih Font (1), lalu geser ke kanan pada drop down menu, cari dan klik Tahoma. (2).


39

Untuk merubah warna teks header, pada menu tab Format klik pada menu drop down Text Color

Lalu pada kotak palete warna pilih dan klik warna yang anda inginkan (1), kemudian klik ok (2). Oyah untuk warna header yang paling bagus, menggunakan merah tua.


40 Lalu buat Headline anda rata tengah dengan klik Align Center pada icon di toolbar sesuai gambar di bawah ini. Pastikan teks headline masih terseleksi.

Jika Headline anda terlalu dekat dengan tabel di bawahnya, maka klik enter untuk menambah jarak.


41

Body TeksBody teks lebih mudah dibaca jika anda menggunakan jenis huruf seperti Georgia. Anda tidak dapat merubah jenis huruf dari semua tulisan yang ada di body website sekaligus, namun anda dapat merubah jenis huruf di masing-masing cell terlebih dahulu. Pilih hanya body teks saja, tidak termasuk Sub Heading.


42

Pada menu tab Format lalu drop down menu -- Font (1), dan geser ke kanan akan keluar drop down menu pilih Georgia (2). Ulangi hal diatas untuk semua body teks di halaman website anda.

Caption (tulisan dibawah gambar)Caption harus kelihatan sedikit berbeda dengan teks body lainnya, anda bisa menggunakan jenis huruf sans-seriff seperti Verdana atau Tahoma. Caranya, sorot (blok) tulisan pada caption.


43 Catatan: Untuk desain website yang baik, sebaiknya anda tidak menggunakan lebih dari 3 jenis huruf. Dalam contoh kali ini, saya menggunakan Tahoma untuk Heading dan Sub-heading, Georgia untuk body teks dan Verdana untuk Caption. Ini akan memberikan tampilan website yang profesional. Pada menu tab Format, sorot Font (1), geser ke kiri, pada menu drop down yang muncul klik Verdana (2).

Secara default besarnya huruf agak kebesaran untuk caption, untuk itu buat 1 ukuran lebih kecil, dari menu tab Format, sorot Size (1), lalu geser ke kanan pada drop down menu yang keluar, pilih small (2).


44

Sub-HeadingUntuk keseragaman yang akan membuat pembaca website anda mengerti dengan mudah struktur dari website anda sub-heading seharusnya menggunakan jenis huruf yang sama dengan Heading. Sorot sub heading anda.

Catatan: Bila diibaratkan sebagai tubuh, maka Heading adalah kepala kalimat dan sub-heading leher atau bahu. Pada Heading anda bisa menampilkan manfaat terbesar dari produk/jasa atau kenapa mereka harus membaca lebih jauh website anda. Sedang pada Sub-heading, anda bisa meletakkan pokok-pokok kalimat, atau sub topik, berisi manfaat yang lain yang akan mereka dapatkan dari produk/jasa anda.


45

Pada menu tab Format sorot Font (1), lalu geser ke kanan, pada drop down menu, cari dan klik Tahoma (2).

Buat Sub-heading anda satu ukuran lebih besar, dari menu tab Format sorot Size (1), geser ke kanan, pada drop down menu, cari dan klik large (2).


46

Dengan Sub-heading masih tersorot, tebalkan Sub-heading anda dengan mengklik tombol B pada toolbar.

Lalu, pada menu tab Format klik Text Color.


47

Karena sebelumnya anda sudah memilih warna untuk Heading yang sama, maka pada palete warna akan tampak warna terakhir yang anda pilih sebelumnya. Klik tombol Last-picked color (1), lalu klik Ok (2).

Mengkombinasikan Warna HurufAnda bisa menggunakan beberapa warna pada sebuah kalimat. Dalam contoh dibawah, sorot tulisan PS lalu ulangi proses untuk merubah jenis huruf menjadi Tahoma lalu tebalkan (Bold) dan buat warnanya menjadi merah. Untuk teks berikutnya, gunakan jenis huruf Georgia sama seperti body teks lain.


48

Bagian-bagian kalimat ditebalkanDi sepanjang website anda, anda mungkin ingin menekankan poin tertentu untuk memastikan pengunjung anda mengetahuinya, anda bisa menebalkan bagian-bagian kalimat tertentu. Pilih teks yang akan ditebalkan, sorot (2), dan klik Bold (1).


49

Menyeimbangkan Posisi Cell Dalam TabelPada tabel yang mempunyai beberapa kolom, cell dengan lebih sedikit teks atau gambar yang lebih kecil, isi cell yang lebih sedikit akan turun agak kebawah. Letakkan kursor anda di cell yang isinya agak turun itu (1), kemudian pada menu tab klik Table kemudian pada drop down menu klik Table Properties (2).

Klik tab Cells (1), pada Content Aligment Vertical pilih Top dari menu pilihan dengan panah kebawah (2), lalu klik Ok.


50

Dan sekarang, anda mempunyai website yang lengkap, siap di upload.


51

Tehnik Website Yang Lebih AdvanceSeringkali anda perlu melakukan beberapa hal yang lebih sulit (advance) dalam pembuatan website. Inilah beberapa tehnik perancangan web yang lebih advance.

Membuat Teks LinkUntuk membuat link ke website yang lain, atau ke halaman yang lain dalam web anda sendiri, anda perlu merubah beberapa teks menjadi link. Sorotlah teks yang ingin dirubah menjadi link (1), dan klik icon Link pada toolbar (2).


52

Link Ke Website Yang LainUntuk me-link (link yang diklik akan menuju ke website lain di Internet), masukkan alamat URL selengkapnya (termasuk awalan http://) untuk Link Location (1). Ketika membuat link ke website yang lain, anda biasanya ingin website lain itu terbuka di jendela yang lain untuk menjaga website anda tetap terbuka di depan pengunjung. Untuk melakukannya, dibawah Target klik tanda centang: Link To Be Opened (2). Dan pilih pada pilihan dengan tombol kebawah In a new window (3). Lalu Klik Ok (4). Tombol Fewer/More Properties (5), dapat di klik untuk membuka atau menutup menu-menu lanjutan yang ada.


53

Nah kini jika anda mendekatkan mouse anda diatas teks link ini, maka URL selengkapnya akan tampak.


54

Link Menuju Halaman Pada Website Yang SamaUntuk membuat link menuju ke halaman yang berbeda di website anda sendiri, anda perlu membuat link sederhana menuju ke file lain yang dituju. Klik Choose File


55

Temukan file (halaman web) yang anda ingin membuat link kesana, klik dua kali file itu.

Catatan: Anda dapat membuat halaman website yang lain selain halaman depan (index.html) seperti yang anda buat diatas ini. Anda bisa menyimpan dan menamakan file yang baru sesuai yang anda inginkan. Seperti pada contoh diatas, saya membuat sebuah file dengan nama tentang.html dan saya membuat link dari halaman index.html ke halaman tentang.html


56

Maka jalur path dari file yang anda link akan muncul di Link Location (1). Anda bisa memutuskan apakah anda ingin halaman yang dilink akan terbuka di jendela yang baru, atau tidak. Jika anda memilih tidak, maka tinggalkan Link Is To Be Opened tidak terpilih apa adanya (2). Klik Ok. (3)


57

Jika anda mendekatkan mouse diatas link maka kini keluar tulisan nama halaman lain dari website anda sendiri.


58

Menyisipkan CodeSeringkali, Anda perlu memasukkan kode tertentu di halaman website anda. Misalnya anda ingin menyisipkan kode form, kode adsense (pay per klik program yang lain), atau kode java script untuk pop up, atau kode lainnya. Jika aplikasi tertentu mengharuskan anda memasukkan kode tertentu untuk dipaste kedalam halaman website anda, maka anda bisa melakukannya dengan tiga langkah mudah. Untuk memudahkan anda menemukan lokasi dimana kode hendak diletakkan pada bagian html website anda ketikkan beberapa kata dengan huruf besar semuanya, misalnya:CODE HERE (1). Lalu, klik Source tab di bagian bawah Nvu editor anda (2).


59

Turunkan kebawah (scroll) kode yang ada sampai anda menemukan tulisan dengan huruf besar tadi. Sorot tulisan itu.


60

Copy code yang anda dapatkan dan paste disitu.

Catatan: Ketika anda kembalikan ke tab Normal untuk melihat code yang anda sisipkan, anda seringkali tidak melihat apapun di tempat anda memasukkan kode anda. Kode itu baru akan tampil hanya ketika anda sudah mengupload website anda ke Internet. Hal ini karena kode itu bekerja berdasarkan informasi yang diambil pada saat online. Jika saat ini anda belum bekerja dengan sebuah kode apapun untuk website anda, maka abaikan sementara langkah memasukkan code ini.


61

Upload File Website Anda Dengan FTP Menentukan Connection AndaUntuk setiap website yang anda bangun, anda perlu melakukan setup connection sekali saja. Setelah anda melakukan setup connection, anda dapat dengan mudah connect (terhubung) ke domain hosting kapan saja anda mau. Anda membutuhkan informasi berikut yang anda terima melalui email dari perusahaan hosting yang anda gunakan. Host address User Name Password Ketiga data diatas, anda bisa dapatkan dengan membeli hosting, jika anda belum mempunyai nama domain, maka anda bisa sekaligus membeli hosting+domain. Anda dapat mencari perusahaan hosting yang bagus di Indonesia melalui search engine. Ketikkan: hosting dan domain murah di kotak pencarian google.com, salah satu yang saya tahu cukup baik: http://www.webiihost.com/ Jika anda membeli hosting ( atau + domain ), pastikan membeli di perusahaan penyedia host dan domain yang mempunyai support yang mudah dihubungi, baik lewat email atau telpon, bahkan sms. Superbighosting diatas, sangat saya rekomendasikan, karena kualitasnya sangat baik, support okay, dan harganya cukup terjangkau.


62

Download Software FTP AndaUntuk mengupload website anda dengan mudah dan dapat merubahnya lagi belakangan anda perlu sebuah software FTP. FTP: File Transfer Protocol adalah metode untuk mengirimkan file ke internet dalam hal ini, mengupload file-file ke hosting server milik perusahaan hosting. WS_FTP adalah software yang mudah digunakan dan gratis yang akan kita pergunakan untuk upload file website anda ke hosting server. Kunjungi untuk download: http://caramembuatwebsite.com/download/ws_ftple.zip Anda sudah harus mempunyai winzip terinstall di komputer anda untuk melakukan unzip file tersebut. Jika anda tidak mempunyai winzip terinstall di komputer anda, maka anda bisa download file berupa exe disini: http://caramembuatwebsite.com/bonus/ws_ftple.exe Selesai download file exe dari link diatas, carilah dimana anda meletakkannya, dan anda akan menemukan sesuai gambar dibawah ini:

Untuk mulai installasi, klik dua kali.


63

Kemudian, sesuai contoh diatas, beri tanda Install WS_FTPLE lalu lanjutkan dengan continue.

Kemudian beri tanda centang pada pilihan A student dstnya Ini maksudnya bahwa anda masih mahasiswa, dengan demikian anda bisa menggunakan program ini secara gratis. Jika tidak, maka anda harus membeli program versi pronya.


64 Saran saya, diawal anda memulai bisnis online, jika dana terbatas, maka gunakan saja yang gratis terlebih dahulu. Jika anda sudah mulai mendapatkan keuntungan anda bisa membeli yang pro. Jika anda tertarik membeli yang pro langsung, maka ini alamatnya: http://www.ipswitch.com/purchase/index.asp

beri tanda pada location anda bisa pilih at home, atau at school. Kemudian klik next.

Kemudian Klik Accept.


65

Kemudian Klik Ok.

Selanjutnya anda akan menemukan seperti gambar diatas, dimana WS_FTP siap dipergunakan. Selanjutnya kita akan isikan data dari host server untuk melakukan upload, sesuai dengan yang diberikan oleh perusahaan hosting dimana anda membeli hosting.


66

Pada profile name isikan nama domain anda contoh: BisnisLewatInternet, dalam hal ini anda bisa menyebut proyek website anda ini apa saja. Pada kolom isian ini hanya berfungsi untuk memberi nama saja. Jadi tidak harus berisi akhiran .com. Selanjutnya pada host name/address, isikan nama host name/alamat ftp yang diberikan oleh perusahaan hosting di tempat anda membeli hosting. Host name ini biasanya sama dengan alamat domain anda. Misalnya: bisnislewatinternet.com. (Untuk lebih pastinya, lihat di email yang dikirimkan oleh perusahaan hosting pada saat anda membeli hosting). Pada user id, isikan username yang diberikan oleh perusahaan hosting. Pada password isikan password yang diberikan. Kemudian beri tanda centang pada Save Pwd (2), pada Anonymous jangan diberi centang. Kemudian klik Apply (3), Lalu klik OK (4).


67

Kemudian anda akan terhubung ke hosting (kotak sebelah kanan), biasanya anda akan melihat seperti gambar diatas (tergantung dimana anda membeli hosting). Klik dua kali pada public_html. PENTING: Pastikan anda meletakkan file-file website anda pada public_html.

Selanjutnya anda akan menemukan seperti diatas, dimana kotak dengan dua bagian, pada sebelah kanan adalah hosting server tempat anda meletakkan file dari website yang anda buat. Sedangkan sebelah kiri adalah computer anda. Selanjutnya anda akan memindahkan file website yang ada di computer anda dan menguploadnya, atau memindahkannya ke hosting. Carilah dimana anda meletakkan file-file website anda. Copyright 2009 www.caramembuatwebsite.com

68

Anda bisa mengklik tanda panah berwarna hijau yang menghadap keatas untuk mencari dimana anda meletakkan file-file html anda. Klik terus tanda panah sampai anda menemukan folder dimana anda meletakkannya. Setelah ketemu, anda tinggal klik kemudian tahan dan geser ke kanan. Atau anda bisa klik file index.html kemudian klik tanda panah kekanan, maka proses upload akan berjalan.


69 Perhatikan gambar diatas baik-baik. Gambar panah yang saya lingkari adalah untuk memindahkan file yang ada di computer ( kotak sebelah kiri ) ke hosting ( kotak sebelah kanan ). Jika proses upload index.html selesai, maka file index.html tersebut akan ada di sebelah kanan (hosting). Selanjutnya, anda ingin mengupload gambar-gambar yang ada di website anda. Ada dua cara yang bisa anda lakukan. Pertama, dengan membuat folder terlebih dahulu, namakan: images Penting: Dalam membuat nama folder, ataupun nama file, pastikan menggunakan huruf kecil semuanya. Perhatikan gambar diatas, untuk membuat folder saya klik MkDir (1).

Lalu beri nama folder yang anda buat dengan nama: images kemudian klik Ok. Nama folder images jika pada saat membuat website dengan NVU dengan meletakkan file-file gambar anda di folder bernama images. Jika nama folder dimana anda meletakkan gambar-gambar anda bukan bernama images maka anda bisa membuat nama folder di hosting dengan nama yang sama seperti nama folder anda meletakkan file gambar di computer anda. Paham yah? J Proses penamaan folder dan pemberian nama file ini sangat penting. Jika anda salah memberikan nama, maka kemungkinan website anda tidak terbuka dengan sempurna. Misalnya: gambar yang ada tidak terbuka, hal ini disebabkan dari penamaan folder yang salah, atau meletakkan file gambar ke hosting tidak pada tempat yang tepat.


70 Jika anda memperhatikan dengan baik, apa yang saya tekankan diatas, maka seharusnya anda tidak menemukan ada masalah.

Kemudian, folder images yang anda buat sudah tampil, dengan nama yang sesuai dengan apa yang diisikan tadi, kini kita siap untuk mengupload gambar-gambar dari computer kedalam folder images. Caranya, klik dua kali folder images diatas.

Anda kemudian akan menemukan gambar diatas, pada kotak sebelah kanan adalah isi dari folder images yang anda buat, karena belum ada gambar yang anda upload isinya masih kosong.


71 Sedangkan sebelah kanan, adalah folder images yang ada di computer anda. Klik juga folder images itu dua kali.

Anda kemudian menemukan file-file yang ada dalam folder images yang akan anda upload. Untuk memilih semua file, anda bisa klik CTRL pada keyboard dan klik setiap file yang anda ingin upload sampai semua file terseleksi (1). Selanjutnya klik tanda panah (2).

Lihatlah, setelah upload gambar selesai, maka antara kotak sebelah kiri dan kanan mempunyai kesamaan satu sama lain. Mulai dari nama folder dimana anda meletakkan gambar (saya beri tanda lingkaran),


72 dengan nama file gambar (1 ) dan gambar yang anda upload ke hosting (2). Jadi pastikan, apa yang ada di computer anda, letak dan namanya sama dengan apa yang anda letakkan di hosting. Jika itu yang anda lakukan, maka anda sudah melakukan hal yang benar. Selanjutnya, pada kotak sebelah kanan, anda dapat klik tanda panah berwarna hijau yang menghadap keatas, untuk kembali ke bagian depan dari hosting anda.

Akhirnya, setelah upload file selesai, anda dapat melihat file index.html dan folder images beserta isinya sekarang sudah ada di sebelah kanan. Dan lihatlah, antara file yang ada di computer anda dengan yang ada di server hosting posisinya hamper sama, dimana sama-sama mempunyai folder images dengan isi, dan file bernama index.html. Itu artinya proses upload sudah benar dan website anda sudah siap dibuka di browser. Selanjutnya luncurkan browser favourite anda dan bukalah alamat website anda disana. Dengan demikian proses upload file website anda dengan menggunakan WS_FTP sudah selesai. Untuk menutup jendela WS_FTP yang terbuka klik Exit.


73

Website Anda Kini OnlineSekarang, ketikkan URL website anda di browser anda, dan lihatlah website anda yang baru kini online.


74

Kali BerikutnyaUntuk kali berikutnya, bila anda ingin memperbaiki halaman website anda, maka anda bisa luncurkan kembali Nvu program yang sudah terinstall di komputer anda. Edit file halaman yang ingin anda edit. Simpan kembali. Lalu luncurkan FTP program WS_FTP, dan upload ulang file yang anda edit. Selamat! Anda kini sudah bisa membuat website anda sendiri dengan menggunakan sebuah program editor yang bagus namun sederhana dan gratis. Anda juga sudah belajar mengupload semua file-file website anda ke hosting server anda, sehingga seluruh dunia kini dapat mengakses website anda, yang artinya, siapapun yang tahu alamat website anda, mereka dapat membukanya dan membaca mengenai produk/jasa yang anda miliki. Anda juga bisa membuat website tentang anda, bila anda belum mempunyai produk untuk dijual. Tanpa produk/jasa sendiri, anda juga dapat mempromosikan produk/jasa orang lain, dan menjadi affiliate marketer. Apapun pilihan anda dengan website anda sendiri, kemungkinannya menjadi tidak terbatas. Setelah anda berhasil membuat dan mengonlinekan sebuah website, anda dapat mengulanginya untuk website-website yang lain. Batasnya adalah IMPIAN dan KERJA KERAS anda sendiri. Sampai disini, Salam DAHSYAT!


75

TestimonialJika anda merasa Ebook ini membantu anda, saya akan sangat berterima kasih jika anda dapat mengirimkan Testimonial Anda ke http://caramembuatwebsite.com/support, dan jika testimonial anda menarik, maka saya akan sertakan testimonial anda di website caramembuatwebsite.com lengkap beserta nama dan alamat website anda (Jika Anda sudah memiliki website). Berikut contoh salah seorang yang sudah menggunakan panduan yang anda juga miliki ini. Dalam 2 jam setelah memiliki panduan ini ia sudah berhasil membuat websitenya yang pertama. Ia sama sekali belum pernah membuat website sebelumnya. :)

Pastikan anda menyelesaikan website pertama anda, dan berikanlah testimonial anda sekaligus anda bisa memajang alamat website anda di bagian bawah testimonial. Sebagian dari pengunjung website caramembuatwebsite.com akan juga mengunjungi URL website anda, jika anda memberikan testimonial yang menarik. Jadi, jangan sia-siakan kesempatan ini. Bila testimonial yang saya dapatkan sudah cukup, maka saya akan menghapus kesempatan memberikan testimonial pada akhir panduan ini. Untuk menjadi semakin mahir dengan NVU, seringlah berlatih dan jadikan NVU favourite web editor anda. Jika anda terlatih, maka kali berikutnya anda ingin membuat website kembali, anda dapat melakukannya dengan lebih mudah dan cepat.


76

Resourceshttp://menulissalesletter.com Temukan Bagaimana Caranya Menulis Surat Penawaran Yang Ampuh Dan Tidak Bisa Ditolak Untuk Menjual Segudang Produk-Produk Anda di Internet. http://rahasiasearchengine.com Rahasia Bagaimana Mendapatkan sampai 750 kunjungan perhari dengan membuat website Anda berada pada urutan atas Google dan Yahoo. http://membuatweb.com Ribuan Gambar Instant, Template, Dan pernak-Pernik Tools Pelengkap Pembuatan Website Yang Anda Perlukan Untuk Mendesain Website Yang Profesional. http://kerjakeras.com Tips Dan Trik Bisnis Online Dari Kusuma. Anda Ingin Membaca Lebih Banyak Mengenai Pengalaman Bisnis Online Saya? Kunjungi Blog Ini. http://www.dreamstime.com/ Adalah tempat untuk mendapatkan gambar-gambar atau foto dengan royalty free. Royalty Free artinya, anda bisa menggunakan foto gambar yang ada untuk dipergunakan di website anda, ecover, untuk header, dlsbnya sesuka anda. Walaupun yang menjual pada website anda bukan hanya gambar, melainkan kata-kata, namun penggunaan gambar yang professional dapat sangat meningkatkan trust dan kepercayaan diri mereka untuk membeli. Saya menggunakan gambar pada website dan cover panduan ini dengan membeli dari dreamstime.com. Anda bisa daftar gratis dan mendownload gambar gratis disana. Namun untuk kualitas gambar yang sangat bagus, anda perlu membeli credit dengan credit card atau paypal, selanjutnya anda bisa mendownload gambar yang anda inginkan ke komputer anda. Gambar dibawah adalah contoh gambar yang saya beli di dreamstime hanya dengan 1 kredit. (setara dengan hampir $1). Copyright 2009 www.caramembuatwebsite.com

77

http://rumahweb.com Tempat membeli domain dan hosting di Indonesia.

http://webiihost.com Tempat Membeli Hosting + Domain Yang Lain, Di Indonesia. Layanannya Baik. Sangat saya rekomendasikan.


78 Kedua perusahaan hosting dan domain diatas menyediakan baik domain dan hosting. Anda bisa membelinya secara terpisah, atau sekaligus jadi satu. ( Domain + Hosting). Jika anda merasa masih pemula, maka saya sarankan membelinya di satu perusahaan, sehingga anda tidak dipusingkan dengan urusan merubah name server, jika anda membelinya terpisah. Tips dalam memilih perusahaan domain + hosting yang baik adalah: Support dan Uptimenya. Anda bisa mencoba bertanya-tanya dulu ke perusahaan untuk menguji bagaimana kualitas dan keramahan mereka. Bila sampai pada memilih hosting, maka harga benar-benar bukan yang terpenting. Layanan/support lah yang terpenting. Uptime adalah kata untuk mengukur presentase sering atau tidaknya server mereka tidak bisa diakses atau down. Domain yang paling baik adalah yang berakhiran .com dan tanpa tanda penghubung. Domain yang berisi kata kunci, sangat disarankan untuk kepentingan promosi di search engine. Lengkapnya silahkan pelajari juga rahasia search engine di http://rahasiasearchengine.com http://kerjakeras.com/hostgator/ Hosting luar negeri, saya sangat merekomendasikan hostgator ini. Namun jika anda baru memulai dengan sebuah website maka saya sarankan membeli di perusahaan hosting lokal saja terlebih dahulu. Karena, hostgator memberikan kapasitas sangat besar, dan bisa meletakkan sangat banyak domain sekaligus dalam sebuah hosting.


79

http://cheapdomain.com Adalah tempat membeli domain murah di luar negeri. Baik Hostgator maupun cheapdomain, pembayaran biasanya dapat dilakukan menggunakan paypal dan credit card. Jika anda tidak mempunyai credit card, anda masih bisa sukses menjalankan bisnis online, dengan membeli segala keperluan online di perusahaan local di Indonesia dengan menggunakan transfer bank. Namun untuk memudahkan Anda kedepannya, jika mungkin, miliki minimal sebuah Credit Card untuk transaksi di Internet.


16466789 Cara Membuat Website Menggunakan Program

Documents

Transcript of 16466789 Cara Membuat Website Menggunakan Program