Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar...

17

Transcript of Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar...

Page 1: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...
Page 2: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

Bikin Website Bernilai Jutaan

Page 3: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

Bikin Website Bernilai Jutaan

Su Rahman

PENERBIT PT ELEX MEDIA KOMPUTINDO

Page 4: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

Bikin Website Bernilai Jutaan

Su Rahman 2017, PT Elex Media Komputindo, Jakarta Hak cipta dilindungi undang-undang Diterbitkan pertama kali oleh Penerbit PT Elex Media Komputindo Kelompok Gramedia, Anggota IKAPI, Jakarta 2017

[email protected]

ID: 717050249

ISBN: 978-602-04-0084-6

Dilarang keras menerjemahkan, memfotokopi, atau memperbanyak sebagian atau seluruh isi buku ini tanpa izin tertulis dari penerbit.

Dicetak oleh Percetakan PT Gramedia, Jakarta

Isi di luar tanggung jawab percetakan

Page 5: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

Thanks to my wife Love you always

Page 6: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

xi

Daftar Isi Apresiasi Pembaca ........................................................................... vi

Kata Pengantar ................................................................................ ix

Daftar Isi ......................................................................................... xi

BAB 1 Peluang Bisnis Web Design Instan ........................ 1

1.1 Kenapa Web Design Instan? ....................................................... 2

1.2 Penggunaan Hosting .................................................................. 4

1.3 Penggunaan SSL ........................................................................ 6

1.4 Pemberian Design Website yang Sesuai dengan Kebutuhan

dan Data .................................................................................. 8

1.5 Percantik dengan Elemen-Elemen Website ................................... 9

1.6 Berikan Layanan SEO .............................................................. 10

BAB 2 Membuat Website HTML..................................... 13

2.1 Yang Dibutuhkan ..................................................................... 14

2.2 Instalasi LocalHost ................................................................... 15

2.3 Mengoneksikan Dreamweaver dengan LocalHost ....................... 23

2.4 Mendapatkan Template HTML .................................................. 30

Page 7: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

xii

2.5 Mendesain Header Website ...................................................... 37

2.6 Mendesain Konten Informasi Front Page .................................... 49

2.7 Membuat Menu Navigasi ......................................................... 63

2.8 Mendesain Konten Informasi Formal ......................................... 66

2.9 Mendesain Informasi Contact ................................................... 77

2.10 Mengganti Copyright Footer .................................................. 86

2.11 Mengganti Text pada Bar Browser .......................................... 89

BAB 3 Proses Upload Website ...................................... 93

3.1 Instalasi FTP ............................................................................ 96

3.2 Penyetingan FTP .................................................................... 100

3.3 Mulai Upload File Website ke dalam Server ............................. 100

3.4 Mengedit PHP Email Prosesor Melalui File Manager cPanel ....... 109

BAB 4 Elemen Website Slider ...................................... 111

4.1 Instalasi Software ................................................................... 112

4.2 Membuat Slider ..................................................................... 114

4.3 Memilih Template dan Slider .................................................. 116

4.4 General Setting ..................................................................... 118

4.5 Mengubah Caption ................................................................ 119

4.6 Publikasi ............................................................................... 121

4.7 Menyisipkan Slider ke dalam Website ...................................... 122

Page 8: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

xiii

BAB 5 Elemen Website Multimedia ............................. 133

5.1 Mulai Membuat Gallery Video ................................................ 134

5.2 Melakukan Penyetingan ......................................................... 137

5.3 Melakukan Publikasi .............................................................. 140

5.4 Menyisipkan Gallery Video pada Halaman Website .................. 144

BAB 6 Membuat Menu Navigasi Gaya ....................... 151

6.1 Menginstal Software ............................................................... 152

6.2 Mulai Membuat Menu ............................................................ 152

6.3 Melakukan Penyetingan ......................................................... 157

6.4 Memasang Menu di Halaman Website .................................... 160

BAB 7 Elemen Tambahan Lain .................................... 163

7.1 Social Share .......................................................................... 164

7.2 Google Maps ........................................................................ 170

7.3 Form Email ........................................................................... 171

7.4 Google Form ........................................................................ 177

BAB 8 Elemen Website untuk WordPress agar Bisa Dijual

dengan Harga Mahal ...................................... 187

8.1 Page Builder .......................................................................... 189

8.1.1 Pengalaman Mengelola WP Asia ......................................... 190

8.1.2 Site Origin Page Builder Gratis Terbaik Bagi Pengguna

WordPress ......................................................................... 193

Page 9: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

xiv

8.2 ShortCode ............................................................................ 195

8.3 Slider .................................................................................... 196

8.4 Gallery Photo ........................................................................ 197

BAB 9 Elemen Website untuk Joomla agar Bisa Dijual

dengan Harga Mahal ...................................... 199

Penutup ........................................................................................ 201

Biodata Singkat Penulis .................................................................. 203

Page 10: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

1

Bab 1

Peluang Bisnis Web Design Instan

Kemajuan teknologi internet yang begitu pesat telah memberikan arti

tersendiri di dalam kehidupan, teknologi internet juga mendorong gerak

laju bisnis ke arah yang berbeda. Banyak peluang yang bisa dimanfaatkan

dan banyak potensi bisnis yang bisa dikembangkan di dunia maya.

Siapa saja bisa memanfaatkannya, siapa saja bisa meraih sukses dari

internet. Asalkan, yup, asalkan! “Mau bekerja keras memanfaatkan

internet.”

Tidak akan pernah ada pengganti dari kerja keras untuk mencapai

kesuksesan dalam bentuk apa pun di dunia ini. Jadi, jika sekarang ini bisnis

Anda kurang bagus, silakan evaluasi letak kekurangannya dan perbaiki

dengan bekerja lebih keras lagi.

Peluang Bisnis Web Design Instan

Salah satu peluang bisnis yang terbuka lebar dan masih terus berpotensi

untuk tumbuh subur adalah web designer. Jangan berkecil hati jika Anda

bukan termasuk orang yang bisa meng-koding. Koding bukan lagi masalah

di dalam dunia web designer, koding dibutuhkan bagi web developer,

sementara bagi web designer tidak harus.

Page 11: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

2

Tentu, web developer membutuhkan keahlian meracik kode-kode untuk

menghasilkan suatu perintah tertentu yang nantinya akan diimplemen-

tasikan ke dalam website. Misalnya, di dalam e-commerce dibutuhkan

search engine yang memudahkan pengunjung dalam mencari produk.

Maka, tugas seorang web developer adalah membuat search engine yang

sesuai dengan kebutuhan website. Dan, untuk melakukan hal tersebut,

tentunya dibutuhkan kemampuan meng-koding yang tinggi.

Sementara itu, seorang web designer tidak perlu mengerti pemograman.

Dengan memanfaatkan teknologi CMS atau template HTML, maka sebuah

website profesional bisa tercipta. Untuk kebutuhan pembahasan

pembuatan website dengan CMS, Anda bisa membaca buku-buku saya

yang lain. Saya sudah banyak memberikan pembahasan detail dan

mendalam dari banyak sisi yang bisa Anda manfaatkan untuk membuat

website profesional secara instan.

Saya juga menyediakan program e-learning yang bisa Anda ikuti, silakan

kunjungi website-website berikut:

• http://www.kursus-online.asia

• http://www.kursusweb.info

• http://www.buatwebsitesekolah.com

• http://www.belajar-joomla.net

• http://www.kursusblogpro.web.id

• http://www.surahman.co

Dan masih banyak lagi. Silakan lihat link lainnya pada website-website di

atas.

1.1 Kenapa Web Design Instan?

Seperti yang sudah saya singgung di atas, bahwa untuk menjadi web

designer Anda tidak perlu mengerti bahasa pemograman. Yang Anda

Page 12: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

3

butuhkan adalah pengetahuan dalam menggunakan aneka tool, mulai

dari CMS hingga software generate.

Hasilnya adalah sebuah website profesional yang bisa Anda ciptakan, dan

asyiknya tidak dibutuhkan waktu yang panjang untuk menghasilkan

website tersebut. Dalam hitungan puluhan menit, Anda sudah bisa

menghasilkan sebuah website dengan tampilan profesional.

Berbeda dengan menggunakan koding, di mana Anda harus menggarap

website dari nol dan menuliskan bait demi bait kode pemograman untuk

menghasilkan sebuah website sesuai dengan kebutuhan klien.

Harga Adalah Ilusi

Biasanya dari sisi harga akan berbeda, untuk website kustom yang meng-

gunakan pemograman tentu harganya lebih mahal karena sebanding

dengan tingkat kesulitan yang harus dikerjakan oleh si web developer-nya.

Meskipun demikian, tidak menutup kemungkinan jika website yang dibuat

dengan tool, seperti CMS atau generate, juga bisa mahal tergantung dari

bagaimana Anda selaku web designer menegosiasikan harga.

Tidak ada patokan harga di dalam bisnis web designer. Harga merupakan

ilusi di dalam bisnis yang satu ini. Mulai dari harga yang murahnya tidak

masuk akal hingga harga mahal yang amat tidak masuk akal, bisa terjadi di

dalam bisnis web design. Tidak akan pernah ada patokan harga yang bisa

distandarkan dalam binis web design dan ini merupakan sebuah

keuntungan tersendiri bagi web master untuk bisa mengeruk keuntungan

yang lebih tinggi.

Kuncinya adalah pada kemampuan negosiasi agar bisa lebih mudah dalam

menjual website Anda dengan harga mahal. Saya memberikan beberapa

parameter yang bisa Anda jadikan rujukan dan Anda kembangkan untuk

menjual website dengan harga semahal-mahalnya. Tidak menjadi soal

apakah itu adalah jasa layanan web design instan atau web design kustom

dengan pemograman koding.

Page 13: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

4

Lima parameter di bawah ini merupakan pengalaman saya dalam

melakukan penjualan, dan saya bagikan khusus bagi pembaca buku ini.

Silakan nanti Anda kembangkan kembali ke dalam bisnis web design

Anda.

1.2 Penggunaan Hosting

Pengalaman saya penggunaan hosting menjadi unsur penting di dalam

dunia web design, terutama kecepatannya. Banyak yang beranggapan jika

hosting-nya berada di local, website menjadi lebih cepat diakses.

Pengalaman saya tidak selalu demikian. Kecepatan akses akan sangat

bergantung pada spesifikasi server dan jaringan yang digunakan oleh

hosting tersebut. Jadi, untuk pastinya, silakan Anda lakukan tes kecepatan

terhadap website yang berada di dalam hosting tersebut.

Pastikan akses website cukup cepat loading sewaktu diakses via mobile,

karena sekarang ini akses mobile mendominasi sehingga menjadi penting

bagi sebuah website untuk tampil cepat pada perangkat mobile.

Fitur Space Besar Hingga Unlimited

Pertanyaan awal yang diajukan oleh calon klien terkait dengan hosting

adalah bukan berada di mana hosting yang akan digunakan, melainkan

pada berapa space yang didapat oleh klien nantinya.

Ingat, ini penting!

Space bagi klien menjadi penting, karena yang klien tahu space berfungsi

untuk menyimpan file-file website dan juga untuk kebutuhan email di

mana besaran penyimpanan inbox email akan bergantung pada space

hosting yang didapat. Untuk itu, silakan gunakan space hosting yang besar

hingga unlimited. Nah, dari sini Anda bisa memainkan harga.

Untuk kebutuhan hosting dengan space besar hingga unlimited, namun

tetap terjangkau dari sisi harga, sementara dari sisi server Anda juga

mendapatkan fitur-fitur modern yang sesuai untuk kebutuhan website

profesional, silakan kunjungi situs https://www.dvipantarahosting.com.

Page 14: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

5

https://www.dvipantarahosting.com – hosting murah dengan banyak pilihan

paket bagi profesional

Fitur Email 5 GB

Salah satu fitur yang saya gunakan untuk menjual website dengan harga

mahal adalah fitur email 5 GB. Dalam fitur ini, klien akan mendapatkan 24

akun email. Artinya, klien bisa membuat 24 akun email dengan nama

domain, misalnya [email protected] atau

[email protected] dan seterusnya sebanyak 24 buah

akun email dengan nama domain.

Asyiknya, setiap akun yang dibuat akan mendapatkan space penyimpanan

sebesar 5 GB untuk kebutuhan email. Sehingga, kuota space hosting 100%

terpakai untuk kebutuhan website. Jika menggunakan space 1 GB, maka

klien dapat menggunakan space 1 GB untuk kebutuhan file-file website.

Trik ini terbukti ampuh untuk meningkatkan penjualan website dan juga

untuk menarik perhatian klien, sehingga mereka berkenan merogoh

koceknya lebih dalam lagi untuk membayar jasa pembuatan website yang

saya berikan.

Jika Anda tertarik, Anda bisa menggunakan layanan ini pada website

https://www.dvipantarahosting.com. Silakan Anda lihat spesifikasi paket

Page 15: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

6

hosting pada server USA. Paket email 5 GB ini hanya berlaku untuk paket

server USA.

Contohnya adalah paket Promosi Space 1 GB (Promo terbatas)

https://www.dvipantarahosting.com/promo-terbatas-hosting-ssd-

murah-server-usa/ di mana Anda bisa mendapatkan space hosting

sebesar 1 GB dan BW 5G hanya seharga Rp150 ribu/tahun. Plus, sudah

mendapatkan fitur email 5 GB, sehingga space hosting yang 1 GB ini bisa

dipergunakan 100% untuk kebutuhan website.

1.3 Penggunaan SSL

SSL adalah kependekan dari Secure Socket Layer yang merupakan suatu

protocol layer transport yang digunakan dalam koneksi internet secara

aman. Jika Anda menginginkan suatu koneksi komunikasi lewat internet

dengan cara yang secure, maka gunakan koneksi SSL.

SSL menawarkan tiga tingkat keamanan, yaitu:

Authentication: memastikan bahwa message yang diterima berasal dari

seseorang yang tersurat.

Confidentiality: melindungi pesan dari suatu usaha pembacaan oleh

penerima yang tidak berhak di sepanjang perjalanannya.

Integrity: memastikan bahwa pesan asli, tidak mengalami perubahan

dalam perjalanannya.

Jika Anda pernah memerhatikan di browser internet yang menggunakan

HTTPS, maka koneksi internet ini menggunakan SSL yang umum dipakai

pada suatu transaksi online. Jadi, HTTPS adalah suatu protocol untuk

melakukan transfer data yang terinkripsi melalui web. Beberapa tahun lalu,

penggunaan SSL didominasi oleh website-website berbasis e-commerce

atau website yang menggunakan fitur transaksi online. Namun, sekarang

ceritanya berbeda. Untuk kebutuhan SEO dan branding, SSL dipergunakan

oleh para web master untuk website company profile yang tidak

memerlukan transaksi online.

Page 16: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

B

H

Pe

In

E-

Simpsudut

Bioda

osting & P

enjualan &

n-House Tra

-learning

le C adalah t pandang

ata S

endaftaran

& Pengemb

aining

sebuah carayang berbe

Singk

Pada tahudibantumendirikasebuah pwebsite dlebih dike Seiringpengalamdalam mKemudian2013, SuperusahaaSimple Clayanan y

Word

SEO &

n Domain

bangan The

dalam memeda di man

kat P

un 2007, Soleh co-fo

n Cipta Kperusahaandan SEO, enal dengan

denganan, terjadi

memandang, pada b

u Rahman mannya tersC yang mang mencak

Press Deve

& Internet M

eme WordP

mandang duna sekarang

Penul

u Rahman younder HaKarya Manjasa pembuyang kemunama C de

bertambaperluasan dunia on

ulan Novemmengubah nsebut menemberikan up:

elopment

Marketing

Press

ia online denini masyar

203

is

yang arny, ndiri, uatan udian sign.

hnya visi

nline. mber nama njadi jasa

ngan rakat

Page 17: Bikin Website Bernilai Jutaan file2.4 Mendapatkan Template HTML ... 2.11 Mengganti Text pada Bar Browser ..... 89 BAB 3 Proses Upload Website ...

204

memadeng‘ribet’derunbatasPadaonlinenamikkan yang

Banyaberladulanluar onlineduniahanyadunia

Begitsemupeluamend

Berbebebepelatijudul merameny

andang dunan persep’, sehingga angan untuk s dengan duhal tidak jue penuh dka yang mdan tidaklahdibayangka

ak orangbelkan ‘gap

ng kesuksesbiasa da

e, karena a online memalah sebuaha online itu se

u menggunala bak rana

ang tanpa badapatkan keu

ekal pengalarapa media ihan seputar

bukunya mbah, mem

yukseskan bis

nia online psi yang ada kecen-

menjaga nia online. ga! Dunia engan di-

menyenang-h ‘se-ribet’

an.

g yang ptek’ men-san yang ari dunia

memang mberikan peluh sudut pandendiri.

akan kacamaah entah di atas yang dauntungan selu

aman pribadiini berbagi

r Web Desigtelah meng

manfaatkan,snis masing-m

uang yang tadang yang b

ata ke-simpel-mana, aka

apat dimanfauas-luasnya.

i, Su Rahmanpengalaman

gn, SEO, danginspirasi b

dan mengmasing.

ak terbatas.berbeda dal

-an, maka dan berubahaatkan oleh

n yang pernan dalam lemn Internet Maanyak oranggeluti dun

Yang dibutulam memand

unia online ymenjadi sebsiapa saja u

ah diwawancmbaran buku arketing. Pulung untuk mia maya u

hkan dang

yang buah untuk

carai dan

uhan mulai untuk