TIM PENYUSUN REVIEWER

M. Syaiful Rohman, S.Pd.I Bekti Cahyo, M.Kom

Moh. Latif, S.Pd M. Zainul Asrori, M.Si

MODUL AJAR

Internet

PROGRAM KERJASAMA ITS & MA/SMA

PROGRAM PENDIDIKAN TERAPAN
BIDANG TEKNOLOGI INFORMASI & KOMUNIKASI (PRODISTIK)
 PROGRAM PENDIDIKAN TERAPAN
BIDANG TEKNOLOGI INFORMASI & KOMUNIKASI (PRODISTIK)
Kerjasama ITS dan MA/SMA

Sekretariat :
Gedung BAAK ITS Lantai 2 Ruang PRODISTIK
Kampus ITS Sukolilo - Surabaya 60111
Telp: 082115154449 E-mail : [email protected] Website : www.prodistik.or.id
 BAB
I KONEKSI INTERNET

SASARAN:
Setelah mempelajari bab ini, anda diharapkan mampu :
A. Memahami fungsi dan manfaat internet
1. Sejarah Internet
Mungkin agak sulit dipercaya bahwa cikal bakal Internet sesungguhnya diawali dari
Unisovyet, ketika pada tahun 1957 mereka meluncurkan sebuah satelit bernama
Sputnik. Peluncuran Sputnik ini dirasakan sebagai ―ancaman‖ oleh musuh besar
mereka, yaitu Amerika Serikat. Presiden Dwight D. Eisenhower menyatakan
perlunya membangun sebuah teknologi yang membuat AS tetap sebagai negara
superior. Kemudian dibentuklah sebuah badan yang disebut Advanced Research
Projects Agency (ARPA). ARPA bernaung di bawah Departemen Pertahanan
Amerika Serikat atau Department of Defense (DoD).
Pada tahun 1969, DoD memberi tugas kepada ARPA untuk membangun sebuah mata
rantai komunikasi antara DoD dengan militer yang tidak dapat disabot oleh musuh
mereka. Jaringan komunikasi yang diciptakan ini disebut ARPAnet. Pada awalnya,
ARPAnet hanya menghubungkan empat buah situs saja, yaitu :
a. Stanford Research Institute (SRI)
b. University of California at Santa Barbara (UCSB)
c. University of California at Los Angeles (UCLA)
d. University of Utah
e. Pada tahun 1970, penelitian yang dilakukan di Stanford University menghasilkan
sebuah protokol yang disebut TCP/IP. Protokol TCP/IP inilah yang berkembang
terus hingga sekarang dan menjadi protokol standar dalam Internet

2. Pengertian Internet
Pengertian Internet adalah sebuah jaringan komputer yang saling terhubung dengan
menggunakan suatu sistem standar global transmission control protocol/internet
protocol suite (TCP/IP) yang digunakan sebagai protokol pertukaran paket dalam
melayani miliaran pengguna yang terdapat di seluruh dunia. Internet merupakan

Halaman | 1
 kependekan dari interconnected network. Internet juga dapat diartikan sebagai
jaringan komunikasi global yang terbuka dan menghubungkan jutaaan atau milyaran
jaringan komputer dengan berbagai tipe dan jenis, dengan menggunakan tipe
komunikasi misalnya telepon, satelit, dan sebagainya.
3. Fungsi Internet
Secara sederhana, fungsi internet adalah sebagai berikut :
a. Sebagai media komunikasi
b. Sebagai salah satu tempat untuk akses informasi
c. Berbagi sumber daya atau data
d. Dapat menyiarkan dan mengakses secara langsung baik itu berita dan bertukar
data dengan internet online ke seluruh dunia.
4. Keunggulan Internet
a. Komunikasi murah
b. Sumber informasi besar
c. Tantangan baru untuk berusaha
d. Keterbukaan ―tanpa sensor‖
e. Jangkauan yang tidak terbatas
5. Kegunaan Internet
a. Internet sebagai Media Komunikasi
b. Internet sebagai Media Promosi
c. Internet sebagai Media Komunikasi Interaktif
d. Internet sebagai alat Research and Development
e. Internet sebagai sarana Pertukaran Data
6. Manfaat Menggunakan Internet
Dari kemudahan mengakses internet, terdapat banyak manfaat yang dapat diperoleh
sebagai pengguna internet. Adapun manfaatdari penggunaan internet adalah sebagai
berikut :
a. Komunikasi Cepat
Perkembangan internet, membuat komunikasi antar individu mudah dan lebih
cepat baik itu di dalam negeri maupun di luar negeri dengan biaya yang relatif
murah.

Halaman | 2
 b. Internet Sebagai Wahana Liburan
Internet dapat mengisi waktu kosong anda dan dapat menghibur anda dengan
banyaknya media sosial seperti facebook, twitter, musik dan bermain game.
c. Menambah Wawasan dan Pengetahuan
Dari adanya internet kita dapat berbagi wawasan dan pengetahuan di seluruh
dunia. Manfaat ini sangat memudahkan pelajar dalam mencari informasi
mengenai pelajarannya.
d. Mudahnya Belanja di Internet
Internet juga dapat di gunakan untuk belanja yang dikenal dengan belanja online.
Belanja online memberikan kemudahan dan efisien dimana setiap orang tidak
perlu keluar dan pergi tempat tujuan dalam mencari barang atau benda apapun itu
yang tentunya dapat menyita waktu anda.
e. Internet Dalam Bisnis
Sekarang ini, banyak para kalangan yang mengetahui manfaat internet yang satu
ini yaitu bisnis. Banyak orang yang berbisnis online yang keuntungannya bukan
main banyaknya.
f. Tempat Mencari Lowongan Kerja
Dari banyak perusahaan yang menggunakan internet, membuat informasi
lowongan pekerjaan lebih mudah diterbitkan dan diketahui oleh para pencari
lowongan pekerjaan yang banyak didapatkan di situs-situs penyedia informasi
lowongan pekerjaan.

B. Memahami jenis-jenis koneksi internet

Untuk dapat melakukan koneksi ke jaringan internet, maka ada beberapa hal yang perlu
dipersiapkan antara lain :
1. Persiapkan Perangkat Personal Computer (PC)
2. Persiapkan satu unit Modem External atau Modem Internal
3. Koneksi ke internet melalui penyedia layanan akses internet atau ISP (Internet
Service Provider) misalnya Telkomnet

Halaman | 3
Ilustrasi kerja internet

Adapun Macam-Macam Metode Koneksi Internet antara lain :

1. Koneksi Dial Up
Komputer yang dilengkapi dengan modem analog dapat melakukan dial up, yaitu
menghubungi server milik ISP untuk memperoleh akses internet. Koneksi dial-up
tidak hanya menggunakan jalur telepon rumah (PSTN), tetapi juga bisa
menggunakan telepon genggam berteknologi CDMA.
Pertama-tama, komputer melalui modem melakukan pemanggilan telepon (dial-up)
ke ISP. Setelah terhubung, komputer akan memperoleh akses internet dari ISP
tersebut. Untuk mengakhiri koneksi internet, dilakukan dengan memutuskan
hubungan telepon. Pelanggan akan dibebani biaya pulsa telepon plus layanan ISP
yang jumlahnya bervariasi tergantung lamanya koneksi.
Modem dial up mengubah sinyal digital dari komputer menjadi sinyal suara (sinyal
analog) yang ditransmisikan melalui kabel telepon atau sebaliknya. Itu sebabnya,
pada saat koneksi internet berlangsung, kamu tidak bisa menerima atau melakukan
panggilan. Modem dial up umumnya diklasifikasikan berdasarkan jumlah bit data
yang dapat dikirim per detik (bps, bit per second). Dengan adanya pembatasan
interferensi sinyal suara, kecepatan modem dial up maksimum adalah 56 kbps.
Koneksi dengan metode ini paling mudah dilaksanakan, sehingga jangkauannya
cukup luas. Kekurangan paling mendasar adalah masalah kecepatan koneksi.
Kualitas jaringan telepon yang terpasang sangat berpengaruh pada kualitas koneksi.
Hal ini disebabkan karena lebar pita frekuensi yang dipakai rentan terhadap
gangguan (noise) yang ditimbulkan dari lingkungan. Meski demikian, masih banyak
orang yang mempergunakan layanan dial up karena tidak tersedia layanan hubungan
kecepatan tinggi akibat keterbatasan biaya atau karena keadaan geografis yang tidak
memungkinkan.

Halaman | 4
2. ADSL (Kecepatan Akses Internet-ADSL)
ADSL (Asymetric Digital Subscriber Line) adalah suatu teknologi modem yang
bekerja pada frekuensi antara 34 kHz sampai 1104 kHz. Inilah penyebab utama
perbedaan kecepatan transfer data antara modem ADSL dengan modem
konvensional (yang bekerja pada frekuensi di bawah 4 kHz). Keuntungan ADSL
adalah memberikan kemampuan akses internet berkecepatan tinggi dan suara/fax
secara simultan (di sisi pelanggan dengan menggunakan splitter untuk memisahkan
saluran telepon dan saluran modem).
Berapakah Bandwith maksimum yang didapat apabila kita menggunakan akses
internet menggunakan ADSL: Untuk line rate 384 kbps, bandwidth maksimum yang
didapatkan mendekati 337 kbps, Untuk line rate 384 kbps, throughput rata-rata
(kecepatan download) yang bisa didapatkan sekitar 40 Kb/s, Untuk line rate 512
kbps, bandwidth maksimum yang didapatkan mendekati 450 kbps. Untuk line rate
512 kbps, throughput rata-rata (kecepatan download) yang bisa didapatkan sekitar 52
Kb/s.

3. Koneksi dengan Jaringan Leased Line

Jaringan internet leased line artinya jaringan yang tersedia untuk mengakses internet
selama 24 jam sehari. Hal ini berbeda dengan dial up, di mana akses internet hanya
tersedia pada saat kamu melakukan hubungan ke ISP. Oleh karena itu jaringan leased
line juga sering disebut sebagai jaringan dedicated line, yaitu jaringan yang
dikhususkan untuk koneksi internet. Jaringan leased line dapat menggunakan
jaringan telepon, kabel khusus untuk internet, maupun koneksi wireless. Untuk
jaringan yang menggunakan kabel, tersedia layanan ISDN dan DSL. Perhatikan
uraian berikut ini!
ISDN merupakan komunikasi melalui jaringan telepon yang dapat memisahkan
aplikasi suara (data analog) dengan data nonsuara seperti teks, gambar, dan video
(data digital) pada jaringan yang sama. ISDN dikembangkan pada jaringan telepon.
Modem ISDN tidak mengubah data digital menjadi data analog atau sebaliknya
seperti pada modem dial up (tidak ada proses modulasi dan demodulasi). Modem
ISDN hanya memproses data digital antara komputer dengan jaringan ISDN.
Kecepatan transfer data dengan layanan ini mencapai 128 kbps, lebih cepat bila
dibandingkan dengan kecepatan koneksi dial up.

Halaman | 5
 Cara kerja koneksi jenis ini mirip dengan ISDN, yaitu dengan menumpangkan sinyal
transmisi data frekuensi tinggi yang membawa data digital di saluran telepon. Pada
bagian pelanggan dipasang pemisah sinyal (splitter) yang memisahkan sinyal
frekuensi tinggi agar tidak mengganggu sinyal pembicaraan dan sinyal fungsi
operasional pesawat telepon. Dengan demikian, kamu tetap bisa melakukan
panggilan telepon ketika sedang berinternet. Sinyal data frekuensi tinggi diproses
dalam modem DSL guna melangsungkan koneksi internet antara pelanggan dengan
ISP.
Modem DSL langsung terhubung dengan ISP dari pertama dihidupkan dan menjaga
koneksi ini tetap berlangsung. Kebanyakan modem ini mampu membagi koneksi
internet dari ISP ke beberapa komputer menggunakan port Lokal Area Network
(LAN) atau wireless LAN.
Kecepatan DSL mencapai ratusan kbps hingga beberapa Mbps. Ada dua jenis
teknologi DSL, yaitu ASDL (Asymmetric Digital Subscriber Line) dan SSDL
(Symmetric Digital Subscriber Line). Selain itu tersedia juga layanan DSL yang lebih
cepat dibandingkan DSL standar, yaitu HDSL (High data-rate DSL) dan VDSL
(Very high data-rate DSL).

4. Satelite VSAT,
Koneksi menggunakan satelite merupakan koneksi yang cukup cepat namun
termahal. Koneksi ini kita harus menggunakan sebuah payung [ parabola khusus ]
untuk menangkap signal satelit.
a. kecepatan dari 64 hingga 2mb [ berlaku hanya di Indonesia ] international lebih
dari 2mb.
b. biaya fix rate bulanan by speed for unlimited use.
c. lokasi ditentukan oleh ISP yang menyediakan fasilitas ini.

5. HANDPHONE
Menghubungkan komputer ke internet melalui sambungan jaringan handphone.
Dapat dihubungkan melalui Bluetooth maupun usb cable data. Saat online jalur
telepon juga tidak terganggu. Bisa menggunakan jaringan GSM maupun CDMA.
GSM dapat lebih cepat dengan teknologi 3G atau bahkan teknologi terbaru high
speed 3,5G. Sedangkan CDMA menggunakan teknologi CDMA 2000 1x hampir

Halaman | 6
 setara dengan 3G. Perhitungan biaya hampir sama semua yaitu menggunakan sistem
perhitungan per kilobyte. Kecepatan mulai dari 64kb – 2mb.

6. WIFI / Hotspot,
Jenis koneksi ini mulai heboh akhir-akhir ini. Dibeberapa kafe, mal berlomba-lomba
memberikan fasilitas ini bahkan gratis untuk para pengunjung / langganan mereka.
Wi-fi ini bisa terkoneksi apabila kita memiliki modem WIFI, biasanya notebook
jadul belum ada jangan sedih bisa dibeli kok slot pcmci atau colokan usb. Kalau
notebook baru biasanya sudah build in semua, dan handphone smartphone khususnya
telah memiliki wifi build in juga. sehingga bisa langsung dapat digunakan.
a. biaya GRATIS – kalo penyedianya kasi gratis. Kalo bayar maka biasanya di
hitung oleh jumlah kb yang digunakan, model seperti isi voucher hp. semua ini
tergantung kepada ISP / penyedia jasa internet.
b. kecepatan 11mb — 100mb [ semacam lan card ]
c. lokasi biasanya di mall, cafe, dan tempat yang ada memang kita telah tahu,
misalnya kantor, rumah.

7. Cable Modem
Cable Modem merupakan modem yang menyediakan dua arah komunikasi sata
melalui frekuensi radio (RF) pada infrastruktur saluran CATV (Cable TV). Kabel
modem ini terutama digunakan untuk memberikan akses internet broadband dalam
bentuk internet cable dengan mengambil bandwidth yang tinggi dari jaringan televisi
kabel.

C. Memahami cara koneksi computer ke internet

Berikut beberapa cara koneksi komputer ke jaringan internet :
1. Melalui Jaringan LAN
Bila komputer kalian terkoneksi ke dalam jaringan LAN, kalian tinggal mengatur
Local Area Connection yang berada di Control Panel. Kemudian Setting IP Address
sesuai dengan pengalamatan kelas yang ada di jaringan atau dipilih Obtain an IP
address automatically (default yang artinya biarkan jaringan memilihkan ip address
untuk komputer atau laptop kalian)

Halaman | 7
 Pada Default gateway, isikan alamat modem internet kalian, Misalkan kalian
memakai Speedy. Secara default IP Address speedy yaitu 192.168.1.1
Maka otomatis internet akan terkoneksi dengan komputer kalian

2. Melalui Jaringan WIFI

Cara lain untuk agar bisa berinternet yaitu mengkoneksikan komputer melalui
jaringan WIFI. Sobat bisa memanfaatkan WIFI apa saja, entah WIFI kampus, WIFI
sekolah, WIFI layanan umum dan lain sebagainya.
Silahkan kalian masuk ke Control Panel dan hidupkan WIFI komputer kalian, atau
bisa melalui panel wifi laptop kalian, biasanya letaknya di taksbar di bagian kanan
sehingga antara WIFI komputer kalian dan WIFI penyedia tersambung. WIFI ada
yang tidak dipassword namun ada pula yang dipassword, Kalian bisa menanyakan
password WIFI tersebut kepada pengelola.

Halaman | 8
3. Melalui Jaringan Operator Selular
Pada jaringan ini, biasanya koneksi jaringan melalui kartu selular yang biasa kita
pakai untuk berkomunikasi lewat handphone. Tinggal koneksikan internet Sobat
melalui aplikasi modem atau jalankan paket data apabila menggunakan hp untuk
mengakses GPRS, 3G atau pun 4G. Pada jarignan operator selular ini dipengaruhi
oleh paket data yang ada pada provider dan kekuatan sinyal di area Sobat.

Halaman | 9
 BAB
II
SASARAN:
WEB BROWSER DAN SEARCH ENGINE

Setelah mempelajari bab ini, anda diharapkan mampu :

A. Memahami fungsi web browser
1. Pengertian Web Browser
Web Browser adalah suatu program atau software yang digunakan untuk
menjelajahi internet atau untuk mencari informasi dari suatu web yang tersimpan
didalam komputer. Awalnya, web browser berorientasi pada teks dan belum dapat
menampilkan gambar. Namun, web browser sekarang tidak hanya menampilkan
gambar dan teks saja, tetapi juga memutar file multimedia seperti video dan suara.
Web browser juga dapat mengirim dan menerima email, mengelola HTML, sebagai
input dan menjadikan halaman web sebagai hasil output yang informative.

Dengan menggunakan web browser, para pengguna internet dapat mengakses

berbagai informasi yang terdapat di internet dengan mudah.
Beberapa contoh webrowser:
a. Flock
b. Netscape Navigator
c. Opera
d. K-Meleon
e. Google Chrome
f. Safari

Halaman | 10
 g. Internet Explorer

2. Sejarah Singkat Web Browser

Web browser adalah software yang berfungsi untuk mengambil, mencari dan
menyajikan sumber informasi di internet. Web browser ini sebenarnya tidak hanya
di gunakan untuk mengakses jaringan internet saja, tetapi juga bisa digunakan
untuk mengakses private network dan data-data atau arsip pada filesystems. Web
browser yang terkenal antar lain : Google Chrome, Internet Explorer, Mozilla
Firefox, Opera dan Safari.
Web Browser pertama bernama WorldWideWeb yang di ciptakan Tim Benners-
Lee, kemudian diubah menjadi nexus. Pada tahun 1993, Marc Andreessen
melakukan inovasi web browser dengan membuat Mosaic yang sekarang di kenal
dengan Netspace. Hal tersebut membuat sistem internet menjadi mudah untuk
digunakan dan mudah untuk di akses oleh banyak orang. Pada tahum 1994
Netspace ini menjadi browser terpopuler di dunia karena menguasasi 90% dari
seluruh pengguna web browser di dunia.
Pada tahun 1995, Microsoft menanggapi pembuatan web browser oleh Marc
Andreessen tersebut yaitu menciptakan Internet Exproler dan terjadilah perang web
browser pertama di industry internet. Internet Exproler memperoleh dominasi di
pasar web browser ini dan meraih pengguna lebih dari 95% pada tahun 2002.
Opera memulai pembuatannya pada tahun 1996, walaupun belum pernah mencapai
penggunaan secara luas tetapi versi mini Opera yaitu Opera Mini memberikan
tambahan karena pengguna web browser di ponsel bertumbuh sangat cepat. Opera
Mini terinstall pada lebih dari 40 juta ponsel.
Pada tahun 1998, Netscape meluncurkan yang kemudian menjadi Mozilla
Foundation dalam upaya menghasilkan web browser yang kompetitif. Web browser
tersebut akhirnya berkembang menajdi Firefox, hingga Agustus 2011, Firefox
memiliki pangsa pasar 28% web browser di seluruh dunia. Apple pun
mengeluarkan web browser pada Januari 2003 yaitu Safari yang menguasai lebih
dari 7% dari pasar web browser di dunia.
Pendatang baru di pasar web browser adalah Google Chrome. Pertama kali dirilis
pada September 2008. Chrome memiliki popularitas yang meningkat secara
signifikan dari tahun ke tahun, peningkatan tersebut berbanding terbalik dengan

Halaman | 11
 popularitas Internet Explorer yang cenderung menurun dari bulan ke bulan. Pada
Desember 2011, Google Chrome mengalahkan Internet Explorer 8 sebagai web
browser paling banyak digunakan tetapi Internet Explorer lebih unggul jika
dibandingkan dengan jumlah gabungan semua versi Internet Explorer yang
digunakan.

3. Kegunaan dan Manfaat Web Browser

Adapun Manfaat dan kegunaan Web Browser :
a. Mempermudah mencari Informasi baik pendidikan maupun non pendidikan.
b. mempermudah mendapatkan situs-situs yang kita cari.
c. Dapat membuat akun sepert(Twiter,Blog, Facebook dan lain-lain).
d. Dapat mengakses Informasi yang dicari.
e. Dapat menyimpan file melalui web browser.
f. Kita bisa menggunakan mesin pencari atau search engine.

4. Fungsi-Fungsi Web Browser

Adapun beberapa fungsi dari penggunaan web browser:
Berikut adalah fungsi fungsi pada web browser :
a. Caching
Bertujuan untuk mereduksi penggunaan bandwidth, mengurangi kesibukan web
server, mencegah terjadinya lag. Dengan cara menyimpan data dan instruksi
yang sering digunakan/diakses.
b. Authentication
Authentication adalah suatu proses untuk melakukan validasi terhadap identitas
user, yang ditujukan untuk menentukan apakah seorang user diperkenankan
untuk mengakses jaringan. Contoh authentication yang paling sering ditemui
adalah saat kita diharuskan untuk memasukkan username dan password.
c. State Maintenance
Sebuah mekanisme untuk memastikan bahwa web browser tetap stabil baik
untuk merequest ataupun untuk merespon.
d. Requesting supporting data item
Mekanisme yang dilakukan untuk meminta item yang mendukung data yang
diminta oleh user. Contoh: flash player plugin.

Halaman | 12
 e. Taking action in responses to other header & status code
Setiap kali mengunjungi suatu halaman web, komputer akan meminta data dari
server melalui HTTP. Bahkan sebelum halaman yang diminta akan ditampilkan
dalam browser, web server akan mengirimkan header HTTP yang memiliki
kode status. Kode status inilah yang menyediakan informasi tentang status
permintaan.
f. Rendering complex object
Proses menangkap segala sesuatu yang ada di dalam halaman web serta efek-
efek yang terdapat didalamnya. Sehingga halaman yang ditampilkan
sesempurna mungkin.
g. Dealing with error condition
Handling atau penanganan error yang terjadi.

B. Mengoptimalkan kinerja web browser (simpan alamat web dan download)

1. Menyimpan alamat web browser
Internet bukan sesuatu yang asing untuk masyarakat modern saat ini, hampir semua
orang khususnya mereka yang mengaku sebagai manusia modern pasti pernah
selama hidupnya mengakses internet baik dengan komputer/laptop ataupun
smartphone dan tablet mereka.
Namun, sayangnya sebagian dari mereka mungkin belum terlalu memahami
beragam fitur yang disediakan oleh browser yang sedang mereka gunakan tersebut,
termasuk fitur untuk menyimpan halaman web agar dapat dibaca offline.
Dengan fitur tersebut, maka anda dapat menyimpan sebuah halaman web secara
utuh agar selanjutnya anda dapat membukanya kembali tanpa harus terhubung
dengan koneksi internet, jadi selain dapat menghemat kuota internet, anda juga tak
perlu pusing memikirkan koneksi internet bila ingin kembali membuka halaman
web yang telah anda simpan.
Adapun Cara Menyimpan Halaman Web untuk Dibaca Offline
Ada beberapa cara menyimpan halaman web untuk dibaca offline pada komputer
lewat beragam jenis browser yang berbeda :
a. Google Chrome
1) Hal pertama yang harus anda lakukan adalah membuka browser Google
Chrome

Halaman | 13
 2) Kemudian, buka halaman web yang akan anda simpan
3) Selanjutnya, klik Customize and Control
4) Lalu, klik Save Page As
5) Dan untuk menyimpan halaman web tersebut simpan dalam format
Webpage Complete

Menyimpan Halaman Web

Sebenarnya Google Chrome hanya menyediakan format HTML namun
terdiri dari 2 jenis yaitu, HTML dan FULL (HTML + Image). Bila anda
ingin menyimpan halaman web secara utuh, maka simpanlah dalam
format Webpage Complete sehingga nanti ketika anda membuka kembali
halaman web tersebut maka anda akan melihat tampilan web tersebut secara
utuh lengkap dengan gambarnya.

b. Firefox
1) Buka browser Firefox
2) Tentukan halaman web yang ingin anda simpan
3) Kemudian klik Open Menu
4) Lalu klik Save Page
5) Selanjutnya pilih format penyimpanan file (Ada 2 jenis format
penyimpanan file pada Firefox, yaitu HTML dan TXT)
Namun, bila anda ingin menyimpan halaman web secara utuh lengkap dengan
gambarnya maka pilih format Webpage Complete.

Halaman | 14
 c. Opera
1) Buka browser Opera
2) Tentukan halaman web yang ingin anda simpan
3) Kemudian klik Opera
4) Lalu Page dan pilih Save As
5) Setelah itu akan muncul pilihan format penyimpanan file, pilih yang sesuai
dengan keinginan anda.
Dalam browser Opera ada 3 jenis pilihan format penyimpanan file, HTML File
yang terdiri dalam bentuk file HTML serta HTML + gambar, lalu ada juga
format Web Archive yang menyimpan halaman web dalam bentuk file MHT
(tanpa gambar dan juga file HTML) dan yang terakhir format penyimpanan file
dalam bentuk TXT.

2. Download
Download adalah proses pengambilan informasi berupa file, data atau program
yang disediakan oleh sebuah situs web dan menyimpannya ke dalam komputer
anda.
Cara download :
a. Perhatikan terlebih dahulu link atau icon dalam halaman web yang
menunjukkan bahwa itu akan mengarah pada kandungan file baik itu file data
maupun program.
b. Klik link atau icon tersebut.
c. Selanjutnya akan muncul kotak dialog file download, klik tombol Save untuk
mulai download.Salah satu link download
d. Kotak dialog Save as akan muncul, ketik nama file yang diinginkan, lalu klik
Save.

C. Memahami fungsi web search engine

Secara sederhana Search Engine adalah sebuah pemograman yang dibuat untuk
membantu orang dalam mencari serta menemukan sebuah informasi. Jadi kebutuhan
anda akan informasi yang tersedia di internet bisa lebih mudah di temukan dengan
menggunaikan search engine.

Halaman | 15
Secara bahasa pengertian Search Engine adalah mesin pencari, mesin penelusur, dan
mesin pelacak. Anda dapat mencari apa saja , seperti informasi kerja , gosip,berita dan
lain sebagainya.
Sistem kerja Search Engine adalah menyimpan database yang ada di internet untuk
kemudian di tampilkan sesuai dengan kecocok'an kata kunci yang di ketikkan pada
search engine dengan database yang ada. Tentunya akan banyak sekali data yang
dimunculkan search engine, untuk urutan yang pertama ditampilkan adalah hasil yang
paling akurat.
Pengertian Search Engine tidak berhenti sampai situ saja, bukan hanya internet yang
menggunakan search engine bahkan, komputer biasa yang digunakan secara offline
pun sudah menggunakan internet.
Misal,jika sedang menggunakan Microsoft Word, dan ingin mencari sebuah kata, maka
tinggal gunakan saja search engine yang disediaikannya kemudian ketikkan atau frasa
yang ingin ditemukan.
Ada banyak sekali nama Search Engine, misalnya Google.com, Bing.com, Altavisa,
MSN, AskJeeves, Licos, Duck-Duck go, Baidu, Yahoo.com, dan lain.lain. Namun ada
yang paling terkenal dan sudah umum kita gunakan seperti : Facebook.com yang
digunakan untuk mencari informasi sekaligus media sosial yang banyak digunakan
orang, serta Yahoo.com untuk mengirim email dan melihat informasi lainnya serta
google yang banyak digunakan orang untuk mencari semua informasi yang lenkap dan
akurat dan lain sebagainya.
Search engine merupakan sebuah situs yang memiliki database besar yang dirancang
untuk meng-index alamat-alamat internet. Informasi yang dapat dibaca bisa berupa
teks, gambar, suara, atau video. Untuk melaksanakan tugasnya ini, search engine
memiliki program khusus yang biasanya disebut spider, bot, atau crawler.
Pada saat Anda mendaftarkan sebuah alamat web (URL), spider dari search engineakan
menerima dan menganalisa URL tersebut. Dengan proses dan prosedur
tertentu,spider ini akan memutuskan apakah web yang anda daftarkan layak diterima
atau tidak. Jika layak, spider akan menambahkan alamat URL dan membaca semua isi
atau content yang ada. Rangking sebuah web ditetapkan dengan metode tertentu sesuai
dengan standar masing-masing search engine.

Contoh-Contoh Dan Perbedaan Beberapa Web Search Engine

Halaman | 16
1. Google. Merupakan pengguna terbesar didunia.
2. Yahoo. Merupakan pengguna terbanyak di malaysia. Google jatuh no2.
3. Msn.
4. Open Directory (DMOZ).
5. Altavista.
6. All the web.
7. Baidu.
8. Looksmart
9. Live.
10. AOL.
11. Bing.
12. Metacrawler dan lain-lain.

Dibawah ini perbedaan dari search engine yang lebih sering digunakan seseorang
diantara lain :
1. Google
The King of Search Engine, itulah julukan yang diberikan untuk Google. Julukan
itu memang pantas diberikan kepada Google. sebab Google memberikan tingkat
ke-akurat-an yang bisa memuaskan banyak pihak. Seperti juga Yahoo!, Google
memang memberikan berbagai fasilitas tambahan kepada mereka yang
menginginkannya. Seperti dalam pencariannya memuat foto, video dan file yang
bersangkutan, dapat menterjemahkan halaman berbahasa asing, misalkan halaman
berbahasa Inggris dapat diterjemahkan menjadi berbahasa Indonesia, dll..

Tapi sekali lagi ditekankan bahwa, fasilitas tambahan itu bukanlah penyebab utama
kepopuleran Google. Keakuratan lah yang menyebabkan Google begitu populer.

Halaman | 17
 Keakuratan ini mulai dikembangkan saat para pendesign Google mulai
menambahkan faktor link popularity kedalam teknik perangkingannya.
Kombinasi antara keyword dan link popularity ini, memberikan tingkat keakuratan
yang tinggi jika dibanding hanya menggunakan keyword saja. Namun perlu diingat
juga bahwa, link popularity dan keyword hanyalah dua dari sekian banyak faktor
yang diperhitungkan saat Google merangking tingkat relevansi dari suatu web page
terhadap suatu topik. Inilah yang membedakan google dengan search engine yang
lain.

2. Yahoo!
Yahoo! adalah sebuah search engine. Tapi selain search engine, Yahoo! juga
memiliki apa yang disebut dengan Web Directory. Jika kamu belum mengetahui
apa yang dimaksud dengan Web Directory itu, berikut gambarannya secara umum.

Web Directory adalah kumpulan dari web page yang ada di internet. Web page-
web page itu dikelompokkan kedalam beberapa kategori utama. Dari beberapa
kategori utama ini, dipecah atau dibagi-bagi lagi mencari sub katergori yang lebih
spesifik.
Web directory ini fungsinya mirip dengan search engine, yaitu untuk mencari,
mengelompokkan, kemudian merangking atau mengindex berbagai web page yang
ada di internet. Jadi kita bisa menggunakan web directory ini untuk mencari web
page berdasarkan kategori yang kita inginkan.
perbedaannya dengan search engine yang lain adalah Yahoo tidak menggunakan
robot dalam membuat direktori informasi, web ini bergantung pada jumlah web site

Halaman | 18
 yang didaftarkan di direktori mereka. Sekalipun demikian Yahoo sangat selektif
dalam menerima situs-situs yang didaftarkan. Karena Yahoo tidak mempunyai
jangkauan yang luas, maka web ini menyediakan mesin pencarian milik Google
sebagai pelengkap.

3. Bing
BING mesin pencari yang baru dari Microsoft, telah datang dan mengambil
perhatian banyak orang dengan cepat. Bing ini merupakan bentuk reinkarnasi yang
dilakukan Microsoft terhadap ketiga mesin pencari produksinya terdahulu, yakni
Live Search, Windows Live Search, dan MSN Search. Produk mesin pencari yang
baru ini secara resmi dilucurkan pada tanggal 3 Juni 2009 menggantikan mesin
pencari sebelumnya, yaitu Live Search. Bing diciptakan dengan menggunakan
suatu teknologi, yakni teknologi PowerSet.

Teknologi ini memungkinkan pengguna untuk memperoleh hasil pencarian yang

lebih akurat. Di samping itu, Bing dilengkapi dengan kemampuan untuk
menyimpan dan membagi historis pencarian melalui Windows Skydrive, Facebook,
dan e-mail. Bing mengelompokkan pencarian berdasarkan empat kategori, yaitu :
pencarian halaman situs atau website, pencarian gambar, pencarian berita,
pencarian siapa dan apa yang paling banyak dicari oleh pengguna Bing.Inilah yang
membedakan Bing dengan search engine yang lain.

Halaman | 19
4. Altavista

Alta Vista merupakan salah satu search engines yg sgt cepat dan memiliki cakupan
luas serta mampu melakukan pencarian dokumen full-text di WEB dan artikel-
artikel Usenet. Pencarian artikel atau dokumen dpt dilakukan dg kata kunci, frase
kunci atau berupa pertanyaan dibantu dg operator ―boolean‖ (AND,OR, AND
NOT, NEAR). Kelebihan lain dr altavista yang tdk dimiliki oleh search engine lain,
adl adanya fasilitas ―spelling checker‖ yg secara otomatis dpt menginformasikan
keyword pencarian yg salah dan membetulkannya tanpa melakukan pencarian
ulang. Fasilitas ―translate‖ dari beberapa bahasa ke bahasa yang lain, baik dokumen
dr hasil penelusuran maupun dokumen pribadi,menjadikan altavista search engine
yg inovatif, dan favorit.

5. Alltheweb

Alltheweb adalah metode pencarian dalam web ini menggunakan logika Boolean.
Kita dapat membatasi pencarian hanya pada judul, teks, nama link, URL, link,
bahasa dan domain. Ranking pencarian didasarkan pada relevansi, analisa link,
penempatan teks pada halaman tertentu, dan penggunaan kata kunci.

Halaman | 20
 Keunggulan Alltheweb adalah pencarian file pada FTP Server. Tidak seperti web,
FTP adalah teknologi internet yang ditujukan untuk menyimpan dan
mendistribusikan file, biasanya program, audio atau video. Web sebenarnya lebih
ditujukan untuk teks. Sejauh ini, hanya AllTheWeb yang menyediakan jasa
pencarian file.

6. MSN

Mesin pencari dari Microsoft Network ini menawarkan pencarian baik dengan kata
kunci maupun dari direktori. Pemakai Internet Explorer kemungkinan besar sudah
pernah menggunakan mesin pencari ini. Situs Searchenginewatch mencatat MSN
sebagai mesin pencari ketiga populer setelah Google dan Yahoo! Tak ada pencarian
image, atau news. Menyediakan pencarian peta, yellow pages, white pages,
pencarian pekerjaan, rumah.

Halaman | 21
7. AskJeeves

Mesin pencari yang satu ini mengunggulkan kemampuannya untuk memahami

bahasa manusia. Pengguna bisa menggunakan kalimat lengkap, bukan kata kunci.
Situs ini berguna untuk mengetahui jawaban dari pertanyaan(misal: when did world
war II end?).

8. Lycos

Salah satu mesin pencari tertua. Saat ini Lycos lebih dikenal sebagai portal,
sehingga fungsi pencarinya tidak terlalu menonjol. Lycos, selain mendukung
pencarian web, juga menyediakan pencarian file MP3, dan video pada
http://multimedia.lycos.com.

Halaman | 22
9. Duck Duck Go

Sama seperti Google, DuckDuckGo membenarkan pengiraan dan pertukaran

untuk unit atau matawang terus dari kotak carian. Menariknya dengan enjin
carian DuckDuckGo, hasil carian adalah hasil pengiraan dan pertukaran adalah
serta merta. Juga jika anda ‗bertanya‘ soalan sejarah atau fakta, hasil carian
akan dipaparkan secara pantas menggunakan enjin janaan WoframAlpha. Dan
perbedaan duckduckgo dengan yang lain adalah Zero Click Info antara yang
paling berguna, hampir setiap kali anda melakukan carian di DuckDuckGo, satu
kotak akan terpapar yang memberikan definisi, sejarah atau info berkaitan
carian anda. Google baru sahaja mula mengimplementasikan fungsi yang
hampir sama melalui Google Knowledge Graph , dan juga hasil Carian Dalam 1
Muka yaitu DuckDuckGo memahami hakikat ini dan menawarkan segala hasil
carian dalam 1 muka yang akan load secara automatik sepanjang anda scroll ke
bawah.
Duck Duck Go juga bersifat Privasi, Ringkas/Kemas/Moden, serta Sumber
Terbuka, Anti Bubble Filter yaitu DuckDuckGo langsung tidak menjejaki anda
dan tidak menyimpan log atau sebarang IP dan hasil carian adalah sama bagi
semua orang.

Halaman | 23
10. Halalgoogling

Halalgoogling menggunakan sistem web khusus yang mampu menyaring hasil

pencarian sesuai agama Islam. Mesin pencari buatan Pakistan ini pada dasarnya
mengambil hasil pencarian dari mesin pencari populer, Google dan Bing.
Namun sistem filtrasinya bisa menyaring konten non-islami dan bertentangan
dengan agama islam seperti pornografi, gay, lesbi, biseksual, perjudian dan
sejumlah konten anti-islami. Halalgoogling juga melakukan pemblokiran pada
sejumlah situs dan tautan terkait yang dianggap sebagai anti-Islam. Jadi tidak
bisa sembarang informasi yang bisa dicari di Halalgoogling , inilah yang
membedakan search engine Halalgoogling dari serch engine yang lainnya.

11. Blekko

Blekko adalah sebuah perusahaan web search engine dengan tujuan

Halaman | 24
 memberikan hasil pencarian yang lebih baik daripada yang ditawarkan oleh
Google Search. Blekko mengklaim search engine ini didesain untuk
mengeliminasi spam yang jamak muncul dalam hasil pencarian dengan
memasang tanda slashtag atau garis miring dalam setiap kata pencarian.
Misalnya saja /aikido, /beatles, /wow, /twilight maupun /zen. User juga bisa
membikin slashtag untuk dicatat dalam topik yang nantinya terdaftar di Blekko,
menjadi follower slashtag yang sudah tersedia, dan melihat statistik atas tulisan
maupun data yang sudah di crawl oleh Blekko. Tak hanya itu saja, Blekko juga
mengidentifikasi berapa banyaknya tulisan atau data yang dobel alias
terduplikasi.
Blekko memungkinkan penggunanya untuk memodifikasi kolom di sebelah kiri
sesuai dengan kebutuhan. Bahkan, terbuka bagi pengguna untuk membikin
slashtag. Hanya saja, tetap mensyaratkan untuk login terlebih dahulu.

D. Mengoptimalkan kinerja web search engine

Jika kalian memiliki sebuah bisnis dan ingin memasarkan secara online, maka salah
satu strategy pemasaran yang sangat efektif saat ini adalah dengan memanfatkan mesin
pencari, contohnya Google. Bila website/ blog kalian masuk dalam 10 besar hasil
pencarian google untuk kata kunci yang anda bidik, dapat dipastikan bahwa
pengunjung website anda akan banyak berasal dari search engine dan kemungkinan
besar mereka akan membeli produk atau menggunakan jasa yang anda jual melalui
website anda. Pemasaran melalui search engine optimization boleh dibilang sebagai
tehnik pemasaran yang paling elit dan efektif karena gratis dan konversinya biasanya
tinggi.
Untuk membantu website kalian masuk dalam 10 besar hasil pencarian google,
bukanlah hal yang mudah akan tetapi bukan hal yang terlalu sulit juga. Sudah banyak
informasi di internet yang membahas tips dan triks agar sebuah situs optimal di search
engine terutama google. Beberapa informasi ada yang memberikan tips optimasi On
Page dan ada juga yang memberikan tips optimasi Off Page.
Berikut ini adalah 8 langkah yang wajib dilakukan untuk mengoptimalkan search
engine sebuah website:
1. Kata Kunci yang Relevan.

Halaman | 25
 Dimana sebuah kata kunci yang teman-teman gunakan akan menjadi senjata awal
untuk mengalahkan kompetitor. Nah setelah kalian menemukan kata yang relevan
kemudian buatlah kalimat yang tepat untuk judul postingan kalian. Jika kalian
menargetkan kata empat frase panjang atau lebih, kemudian membuat judul yang
tepat itu adalah cara termudah untuk menyampaikan relevansi kata kunci yang bisa
memaksimalkan website teman-teman di search engine. Kalian juga bisa
melakukan riset kata kunci dengan memanfaatkan dua buah tools gratis yaitu
Google Adwords : Keyword Planner dan Ubersuggest. Dimana tools tersebut bisa
membantu teman-teman dalam menemukan kata kunci yang sesuai dan tepat.
2. URL yang Mendukung Kata Kunci Supaya Terindex oleh Robot Google.
Untuk dapat terindex oleh robot Google kalian harus mendaftarkan alamat domain
teman-teman di Google Webmaster. Kemudian teman-teman dapat membuat
permalink yang diinginkan atau sesuai dengan judul sehingga terpisah permalink
antara kata yang berbeda di dasbor karena lebih SEO friendly biasanya dianjurkan
dengan menggunakan tanda (-).
3. Membuat Konten pada Halaman Blog dan Pastikan Kata Kunci Muncul
Beberapa Kali Dalam Konten.
Blog sangat penting bagi sebuah website untuk pengaruh SEO di Google, biasakan
kalian terus mengupdate konten secara rutin setiap hari untuk mengalahkan
kompetitor. Ketika menulis sebuah konten biasakan bervariasi di awal dan akhir
paragraf dan pastikan menuliskan kata kunci tapi jangan sampai berlebihan
menuliskan kata kunci teman-teman. Supaya tidak dianggap spam oleh Robot
Google. Jika kalian sudah benar meletakann kata kunci yang tepat itu akan menjadi
jauh lebih mudah untuk di ketahuii mesin pencari bahwa kata itu akan menjadi
sangat penting. Tambahkan kata kunci atau sinonim-persamaan kata untu kata
kunci ke dalam sub-judul. Setidaknya itu membantu untuk mengoptimalkan kata
kunci dalam mencapai target.
4. Mencari Backlink yang Berkualitas.
Link yang baik adalah link yang relevan dengan website yang di buat, tetapi untuk
menemukan yang relevan itu sulit. Tapi ingat kualitas backlink adalah yang utama.
Jika kalian mendapatkan kualitas link yang tinggi maka kalian tidak membutuhkan
banyak backlink untuk menaikan peringkat. Backlink dor to dor tidak monoton
akan lebih bagus hasilnya dari pada backlink dengan cara Auto.

Halaman | 26
5. Perkuat Sosial Media.
Jangan ragu menggunakan sosial media karena saat ini signal SEO dari sosial
media bisa meningkatkan trafik yang tinggi yang tujuannya menunjang website
kalian. Ada banyak sosial media yang tersedia dan tentu diantaranya sudah kenal
bisa segera gunakan dengan gratis, seperti Facebook, Twitter, Instagram, Google
Plus, Pinterest, dan lainnya.

Halaman | 27
 BAB
III
SASARAN:
MEMBUAT & MENGGUNAKAN EMAIL

Setelah mempelajari bab ini, anda diharapkan mampu :

A. Memahami fungsi dan manfaat E-mail
1. Pengertian e-mail
E-mail (electronic mail) adalah surat dalam bentuk elektronik. E-mail merupakan
salah satu fasilitas atau aplikasi internet yang paling banyak digunakan dalam hal
surat-menyurat. Hal ini dikarenakan e-mail merupakan alat komunikasi yang
murah, cepat, dan efisien. Menggunakan e-mail memungkinkan kita untuk
mengirimkan pesan dalam bentuk surat ke seluruh dunia dalam waktu yang sangat
cepat dan biaya yang murah. E-mail yang dikirimkan akan sampai ke alamat yang
dituju sesaat e-mail tersebut dikirimkan. Biaya yang dikluarkan pun hanyalah biaya
untuk mengakses internet pada saat kita mengirimkan/membuka untuk menerima e-
mail tersebut. Komunikasi menggunakan e-mail dilakukan dengan cara
mengaktifkan pesan yang akan kita kirim pada software yang dikhususkan untuk
keperluan ini, misalnya Microsoft Outlook.
Manfaat/kegunaan e-mail
a. Media komunikasi
E-mail atau surat elektronik adalah media komunikasi yang biasa dilakukan
secara persoal atau umum (komunitas).
b. Media pengiriman
Dengan e-mail anda bisa melakukan pengiriman data ke seluruh dunia dan
tentunya pengirim dan yang dikirimi data sama-sama menggunakan alamat e-
mail, bukan alamat rumah. Tidak hanya itu, dengan menggunakan e-mail anda
bisa mengirimkan data ke banyak orang hanya dalam hitung menit bahkan
detik.
c. Efektif, efisien, dan murah
Melakukan pengiriman data melalui e-mail sangat efektif, efisien, dan murah.
Maksudnya, anda tidak perlu keluar rumah dan pergi ke kantor pos hanya untuk
mengirim foto atau lamaran pekerjaan. Cukup melalui koneksi internet dan

Halaman | 28
 alamat e-mail anda, pengiriman akan cepat sampai ke alamat tujuan dan tidak
perlu biaya mahal.
d. Media promosi
Jika anda bisa memiliki usaha di internet atau bisnis online, anda bisa
mengirimkan promosi produk ke para pelanggan anda dengan memanfaatkan
daftar e-mail pelanggan yang ada.
e. Media informasi
Melalui e-mail, anda bisa mendapatkan informasi-informasi terbaru dari seluruh
dunia yang anda inginkan dengan cara menjadi pelanggan informasi dari media
yang anda tentukan.
f. Membuat blog atau website
Dengan e-mail anda bisa membuat blog dan website.
g. Sosial media
Dengan e-mail, anda bisa menjalin hubungan dengan teman atau orang lain.
Baik menggunakan e-mail itu sendiri atau melalui jejaring sosial seperti
facebook, twitter, atau google.

B. Memahami proses pembuatan E-mail

Cara membuat email dari berbagai penyedia
1. Cara membuat Email Baru Gmail
a. Kunjungi laman Gmail.com. Langkah pertama untuk membuat akun email
dengan Gmail, layanan email gratis dariGoogle, adalah untuk mengunjungi
situs utama Gmail. Ketik ‖ gmail.com ‖ ke bar navigasi dari browser Anda, atau
sebaliknya, ketik ―Gmail‖ ke mesin pencari pilihan Anda dan klik hasil yang
relevan. Klik ―Buat akun‖ Pada layar login Gmail, lihat link pembuatan akun di
bawah form login. Klik link ini untuk melanjutkan ke proses pembuatan akun.

Halaman | 29
b. Form Login Gmail
Masukkan informasi pribadi Anda. Masukkan nama depan dan nama belakang,
tentukan sandi dan ulang tahun anda. Pada kolom berikutnya, Anda akan
diminta untuk gender, nomor telepon dan alamat email alternatif. Untuk
pengisian alamat email alternatif bersifat opsional.

Halaman | 30
c. Memasukkan Nama
Pilih alamat email dan password. Pada halaman pembuatan akun yang sama,
Anda juga akan diminta untuk menentukian alamat email dan password. Sandi
yang Anda pilih minimal delapan karakter, sedangkan alamat email Anda buat
belum pernah digunakan oleh orang lain. Masukkan informasi ini dalam kotak
yang sesuai. Anda harus mengetikkan password dua kali untuk konfirmasi
keakuratan.

Halaman | 31
d. Memasukkan Password
Gulir ke bawah sampai Anda melihat gambar yang berisi beberapa nomor.
Ketik angka-angka ini ke dalam kotak yang ditunjuk – hal ini memastikan
bahwa Anda adalah manusia dan bukan robot yang mencoba untuk mendaftar
akun email. Jika Anda tidak ingin berpartisipasi dalam proses verifikasi ini,
Anda akan diminta untuk memverifikasi melalui telepon.

Halaman | 32
e. Verifikasi Human
Centang kotak di sebelah teks yang mengatakan ―Saya menyetujui Persyaratan
Layanan Google dan Kebijakan Privasi Google.‖ Ini menandakan bahwa Anda
memahami dan menyetujui segala persyaratan, klik ―Langkah berikutnya.‖

Halaman | 33
f. Centang Persetujuan

Selamat! Kita telah berhasil membuat akun Gmail baru :). Cukup selesai disini,
silahkan Klik tombol ―Lanjutkan ke Gmail‖ untuk mengakses inbox email
anda.

Halaman | 34
 g. Halaman Inbox

2. Cara Membuat Email Baru Yahoo

a. Langkah-langkah membuat email baru menggunakan yahoo
Kalau sebelumnya kita sudah bahas untuk pembuatan akun email Google,
sekarang ini kita juga akan menjelaskan hal yang sama tapi dari provider email
yang berbeda, yakni dari Yahoo. Secara sekilas hampir mirip, tapi yang
membedakan sebenarnya pada saat mengisi form kelengkapan datanya dan
tampilannya pada saat telah masuk ke bagian dashboard untuk melihat pesan
masuk yang ada. Nah, berikut prosesnya:
1) Awalnya kunjungi dulu situs resminya di www.yahoo.com (biasanya secara
otomatis kamu akan diarahkan masuk ke layanan untuk berita
untuk Indonesia, yang biasanya di awali dengan ‗ID‘ di depannya.)
2) Setelah membuka tampilan web beritanya, nah lihat di samping kiri deretan
menunya, ada tulisan ‗Mail‗ atau di sebelah kanan atas ada tulisan Sign
In dan Email, silahkan pilih salah satunya, dan biar jelas perhatikan contoh
gambarnya:
Tampilan awal halaman yahoo:

Halaman | 35
 Tampilan kiri:

3) Setelah mengklik tulisan yang dilingkari merah di atas, anda selanjutnya

akan masuk ke halaman berikutnya yang meminta anda mengklik tulisan
―Create Account‖ sebagai proses awal dalam membuat akun baru yahoo
anda:

Halaman | 36
4) Muncul halaman baru, tinggal isi semua data yang diminta sesuai
keterangan di bawah, tapi bagusnya pakai data sesuai KTP agar dapat
digunakan untuk tujuan bisnis nantinya.

Halaman | 37
Keterangan: (sesuaikan dengan angka di gambar)
a) Isi dengan nama depan resmi kamu
b) Nama belakang, jika ada, tapi bila tidak gunakan nama orang tua saat ini
atau pun yang sudah meninggal/
c) Pilih alamat email yang kamu suka (tanpa perlu ditambahkan
@yahoo.com di belakangnya karena di sampingnya sudah ada yang
tertera, tinggal pilih mau pakai yang .com atau .co.id untuk alamat email
Indonesia.
d) Ketik kata sandi yang mudah kamu hafal, jika perlu catat dikertas atau
dalam file notepad agar jika sewaktu-waktu lupa bisa langsung
melihatnya. Di sampingnya juga ada pilihan apakah ingin
menampilkannya saat mengetik atau hanya dalam bentuk tanda bintang,
tapi bila tidak ada orang di sampingmu maka tampilkan saja.
e) Sertakan nomor HP yang kamu pakai saat ini, kalau bisa yang masih
aktif agar nanti bisa dijadikan alat untuk verifikasi jika passwordnya
lupa.
Halaman | 38
 f) Isi secara berurut, tanggal > bulan > tahun. Khusus untuk pengisian
tanggal silahkan isi sendiri, sedang lainnya tinggal pilih.
g) Jenis kelaminmu apa, apakah Pria atau Wanita.
h) Anda diminta mengimput nomor telepon lain, baiknya teman atau
keluarga terdekat. Di sampingnya anda juga diminta menyebutkan
hubungan anda dengan pemilik nomor HP tersebut.
i) Akhiri dengan mengklik tombol ungu bertuliskan ―Buat Account‖ dan
prosesnya pun selesai.
5) Berikutnya akan muncul halaman yang meminta anda melakukan verifikasi
sebagai bukti bahwa anda adalah manusia dan bukan robot.

Cara memasukkan kode:

Usahakan mengetik sesuai dengan angka yang naik turun dan jangan yang
berjalan ke arah kanan. Pastikan juga antara huruf besar dan kecil
dibedakan, demikian juga pada angkanya!
6) Tededdd.. jika berhasil akan muncul pesan bahwa anda sukses membuat
email ymail anda kali ini sebagaimana screenshot yang ditampilkan.
Selamat! Tinggal klik tombol ―Persiapan Awal‖ untuk masuk ke dashboard
surat elektronik anda.

Halaman | 39
 7) Selanjutnya akan muncul pesan bahwa anda diminta memilih jenis tema
yang anda sukai, bagusnya pilih yang simple dan putih agar tidak
mengganggu mata. Tapi bila belum punya niat merubahnya tinggal pilih
―jangan sekarang‖ atau kalau sudah dipilih tinggal ―Simpan Tema‖. Dan
tinggal belajar teknik lainnya di bawah ini.

3. Cara Membuat Email Baru Hotmail

Membuat email itu mudah. Anda hanya memasukan data lalu verifikasi dan selesai.
Untuk pertama kali, anda harus masuk ke situs hotmail di login.live.com.
Kemudian anda akan diarahkan ke halaman login sebagai berikut.

Halaman | 40
Tahap ini merupakan tahap login jika anda sudah mempunyai alamat atau akun
email di hotmail. Jika belum punya, klik Daftar Sekarang yang berada di paling
bawah. Setelah anda mengklik link tersebut, anda akan di hadapkan dengan
tampilan pendaftaran dengan form-form pendaftaran yang anda isi sesuai data
pribadi anda. Lihat gambar dibawah.

Adapun langkah-langkah membuat email di hotmail adalah sebagai berikut :

Halaman | 41
Pada tahap ini, masukkan data anda seperti nama dan lain-lain. Untuk penjelasan
tiap form baca ulasan berikut.
a. Nama : Masukkan nama depan dan nama belakang anda. Pastikan nama yang
anda masukkan sesuai dengan nama asli.
b. Nama Pengguna : Ketikkan nama email yang ingin anda buat. Kemudian pada
tulisan Outlook.com, anda bisa menggantinya dengan 3 pilihan. Silahkan
dicoba. Contoh : [email protected]. Pastikan alamat email yang akan
anda buat belum pernah didaftarkan sebelumnya oleh orang lain.
c. Sandi : Masukkan kata sandi bar. Buat kode yang tidak mudah orang tebak.
Misalnya gabungan antara angka, huruf kecil, huruf kapital, dan simbol.
d. Masukkan Ulang Sandi : Masukkan ulang sandi yang telah anda masukkan tadi.
Sandi disini harus sama agar memastikan sandi yang anda ketik sudah benar
sesuai keinginan anda.

Halaman | 42
e. Negara/Kawasan : Pilih Negara Indonesia.
f. Tanggal Lahir : Masukkan tanggal, bulan, dan tahun kelahiran anda. Pastikan
Sesuai dengan data asli anda.
g. Jenis Kelamin : Pilih jenis kelamin anda
h. Kode Negara : Pilih kode negara indonesia (+62)
i. Nomer Telepon : Masukkan Nomer HP anda
j. Alamat email alternatif : (Kosongkan saja). Boleh di isi jika sebelumnya anda
sudah memiliki email.
k. Masukkan karakter yang anda lihat : Anda harus mengetikkan tulisan/code yang
berada diatas. Huruf kecil dan huruf besar harus sesuai. Hal ini ditujukan agar
situs memastikan anda bukan robot.
Jika anda telah memasukkan data-data yang diperlukan, klik centang
dan kemudian klik tombol link Buat Account . Setelah itu tunggu beberapa saat
anda akan dialihkan ke halaman baru.

Kemudian anda klik saja tombol Lanjut ke kotak masuk. Kemudian anda akan
dibawa ke halaman email anda.

Halaman | 43
C. MEMAHAMI PROSES PENGGUNAAN E-MAIL
1. Cara Mengirim Email di Google Mail
a) Awali dengan login dulu ke https://mail.google.com/ (ketik alamat email dan
sandinya)
b) Jika telah masuk maka akan terlihat tampilan seperti gambar nomor di atas. Nah
untuk mengirim email maka yang harus dilakukan adalah dengan mengklik
tombol merah ―Tulis‖ yang ada di samping kiri.
c) Selanjutnya akan ada halaman kecil melayang yang muncul, silahkan isi sesuai
dengan penjelsannya dibawah:

Halaman | 44
Keterangan :
1. Kepada: isi dengan alamat email orang yang akan kamu kirimi pesan.
Pastikan tidak ada yang salah penulisan titknya, dan juga huruf pada
alamatnya, kalau besar maka ditulis demikian juga.
2. Subjek: ini adalah judul yang akan tampil di akun penerimanya agar mudah
dikenali jika seandainya ada banyak email yang masuk.
3. Tanda panah angka 3 ini adalah tempat menulis pesan yang akan dikirim,
usahakan sebelumnya sertakan ucapan pembuka sebagai bentuk kesopanan
dan juga kata penutup di akhirnya, walaupun sebenarnya hanya ingin
menyampaikan file yang disertakan dalam pesan tersebut.
4. Kirim: kalau semua sudah siap maka silahkan diklik
5. Nomor 5 ini adalah icon ‗Lampiran file‘. gunanya kalau misalnya kita mau
mengirim berkas yang sudah diketik di Microsoft Word atau baik itu berupa
gambar, maka silahkan diklik dan selanjutnya kamu akan diminta memilih
filenya di dalam komputermu. Ini istilahnya ―Attachment‘ kalau
tampilannya dalam bahasa Inggris.
Halaman | 45
2. Menggunakan Yahoo Mail
a. Cara Mengirim Email di Yahoo Mail
Berikut ini adalah tampilan halaman ketika kita telah mengklik ―Tulis‖ atau
―Post‖ yang ada di samping kiri. Sebenarnya hanya ada 3 hal yang wajib kita isi
di dalamnya dan plus 1 lagi sebagai lampiran jika memang kita ingin mengirim
file yang sudah jadi dari Word, file gambar dan lain sebagainya. 3 pertama yang
disebut adalah alamat email tujuan pengiriman, judul pesannnya, dan juga isi
dari pesan itu sendiri. Terkadang yang terakhir hanya berisi penyampaian
singkat saja dan isi sebenarnya ada pada ―Attachment‖ atau lampirannya.

Keterangan:
1) Kata ―Tulis‖ yang dilingkari merah yang berada paling atas adalah tombol
yang pertama kali diklik jika ingin mengirim email melalui akun Yahoo
anda. Dan setelah diklik maka akan mucul halaman putih yang berisi kolom
pengetikan dan juga alamat email yang dituju serta judul dari pesan yang
akan dikirim, sebagaimana terlihat pada gambar di atas.
2) Lingkaran kotak yang berada di bawah tombol Tulis tersebut adalah menu
yang pertama kali dilihat saat membukan account anda. “Email
Masuk” adalah menu yang diklik jika ingin melihat pesan baru yang masuk

Halaman | 46
 atau istilahnya ―Inbox―. Sedang “Draft” adalah email yang telah ditulis
tapi belum dikirim. Dan adapun dengan “Email Keluar” merupakan menu
untuk melihat email apa saja yang pernah kita kirim, dan ini juga bisa
digunakan untuk mengirim email dengan pesan yang sama hanya dengan
membukanya lalu mengklik ‗Forward‖ yang ada di bawahnya.
3) Lingkaran yang bertuliskan “Ke” dan “Judul” pada lingkaran di samping
kanan adalah masing-masing pada kolom ―ke‖ untuk menuliskan alamat
email yang dituju dan ―judul‖ adalah untuk memberi apa tema atau judul
dari pesan yang akan kita sampaikan.
4) “Emailnya tuh…. diketik di sini!” adalah kolom untuk menuliskan isi
pesan kita. Jika isinya tidak terlalu panjang maka cukup diketik semua di
situ, tapi bila terlalu panjang maka baiknya ketik di Microsoft Word dulu
baru kemudian diupload ke dalamnya dengan cara mengklik tombol icon
kecil seperti penjepit kertas yang ditunjuk dengan tanda panah hitam di atas
yang diberi keterangan ―Lampiran‖ atau ―Attachment‖ jika ditampilkan
dalam bahasa Inggris.
5) Lingkaran panjang yang juga ditujuk dengan keterangan Lampiran tersebut
adalah berbagai icon yang digunakan saat sedang menulis pesan, di
antaranya adalah untuk melakukan bold, italic atau tulsan miring, underline
atau garis bawah atau pun memilih model rata kiri, tengah dan kanan.
Namun bila ingin memasukkan link dalam email tersebut maka caranya
dengan icon seperti ‗rantai‘ yang berada masih dalam linkaran tersebut,
tepatnya yang berada di bagian kedua dari samping kanan.
6) Terakhir, jika sudah selesai semua, mulai dari mengetik alamat email tujuan
pengiriman hingga isinya, maka tibalah waktunya mengklik button biru
bertuliskan ―Kirim‖ dan secara otomatis surat elektronik anda pun akan
langsung terkirim.
7) Untuk penjelasan langkah demi langkah dengan keterangan gambar yang
lebih jelas, silahkan merujuk kesini: Cara Mengirim Email lewat Yahoo –
Kirim Ymail

b. Bagaimana cara membuka email yang masuk

Sudah disinggung di atas, tapi biar lebih jelas silahkan ikuti prosesnya berikut:

Halaman | 47
 1) Login ke akunmu, ikuti sesuai tutorial cara membuat di atas hingga langkah
ke-3, lalu klik ―Sign In―
2) Setelah berhasil login kamu akan melihat tampilan Dashboard seperti pada
gambar yang baru saja diterangkan di atas, tinggal klik tulisan Email Masuk
atau Inbox di samping kirinya.
3) Untuk membuka email yahoo anda maka yang dilakukan adalah dengan
mengklik judul dari pesan tersebut yang ada di samping kanan dari nama
pengirimnya.
4) Jika koneksi internet anda lancar maka secara otomatis ia akan terbuka
dengan cepat, tapi bila lambat maka akan butuh waktu beberapa menit
untuk membukanya.

D. MEMAHAMI PROSES PENGATURAN E-MAIL

1. Pengaturan Email pada Domain Gmail
Gmail merupakan salah satu penyedia layanan email yang kinerjanya cukup
mumpuni. Anda dapat login menggunakan gmail walaupun bukan menggunakan
akun gmail. Apabila memiliki alamat email domain, maka anda juga dapat
mengintegrasikannya sehingga dapat login melalui gmail. Dengan begitu,
anda dapat mengirim dan menerima email dengan mudah dengan email dari
domain anda melalui gmail. Selain itu, anda dapat menghemat kapasitas dari
hosting. Hal ini dikarenakan penggunaan akun gmail yang free sampai dengan 15
GB.
a. Konfigurasi Melalui SMTP
Adapun langkah- langkah pengaturan email domain pada gmail yaitu sebagai
berikut :
1) Buka gmail.com pada browser kemudian login sesuai akun gmail anda

Halaman | 48
2) Maka akan masuk ke dalam akun anda. Setelah itu pada bagian kanan atas
pilih Settings.

3) Pada halaman Settings pilih tab Accounts and Import

Halaman | 49
4) Kemudian pada bagian Send Mail as klik Add another email address you
own. Hal ini bertujuan agar email domain yang telah tersetting dalam
cPanel dapat terintegrasi dengan Gmail.

5) Setelah itu, masukkan nama dan email domain yang telah anda setting di
cPanel. Adapun cara membuat email dengan domain sendiri dapat anda
baca di Panduan Membuat Email dengan Domain Sendiri. Kemudian,
klik Next Step.

6) Lalu anda akan diarahkan ke halaman Send mail through your SMTP
server. Anda harus melakukan konfigurasi SMTP. Masukkan SMTP
server, username dan password email domain yang anda buat di cPanel.
Terdapat 3 port yang tersedia di sana. Namun, dalam konfigurasi SMTP
anda dapat memilih 2 port. Port 25 digunakan untuk Non SSL. Danport 465
digunakan untuk SSL. Untuk SMTP server gunakan URL pada saat anda
login cPanel.
Adapun perbedaannya yaitu,

Halaman | 50
 a) Non SSL: Untuk yang Non SSL maka, terdapat kata mail dalam email
domain.
b) SSL : Email berada di hostname server
Apabila setting selesai maka klik Add Account.

7) Kemudian anda akan diarahkan ke halaman verifikasi. Klik kirim

verifikasi terlebih dahulu.
8) Setelah itu, buka gmail.com menggunakan username dan password email
domain yang anda konfigurasi tadi. Buka Inbox, kemudian klik link
verifikasi dari Gmail.

b. Konfigurasi Melalui POP3

Setelah konfigurasi SMTP selesai, maka anda perlu melakukan konfigurasi
POP3. Hal ini bertujuan agar email domain yang masuk akan langsung
terintegrasi dengan Gmail.
Adapun langkah- langkahnya yaitu,
1) Login ke akun gmail anda. Kemudian pilih Settings lalu klik tabs Accounts
and Import. Pada bagian Check mail from other accounts klik Add a POP3
mail account you own.

Halaman | 51
2) Anda akan diarahkan ke halaman Add a mail account you own.
Masukkan email domain yang telah anda buat di cPanel. Lalu, klik Next
Step.

3) Kemudian anda akan diarahkan ke pengaturan email POP3.

Masukkan username, password dan POP Server yang ada di pengaturan
cPanel. Pada bagian POP Server diisi URL pada saat anda login cPanel.
Untuk POP3, jangan lupa untuk selalu menggunakan port 995 dan berikan
tanda centang pada penggunaan SSL. Setelah selesai, klik Add Account.

Halaman | 52
 Catatan:
Hostname/ URL untuk POP3 dan SMTP server menggunakan alamat
hosting dari cPanel. Misalnya, zelda.rapidlex.com, leona.rapidlex.com
atau yang lainnya. Untuk mengetahui alamat cPanel, silahkan cek email dari
DomaiNesia mengenai Informasi Account Hosting bagian Control Panel
URL. Atau buka browser kemudian tuliskan namadomain.com/cpanel.

2. Pengaturan Email pada Domain Yahoo Mail

Untuk melakukan konfigurasi Email pada Domain yahoo, langkah-langkahnya
sebagai berikut :
a. Silahkan login ke akun Email Yahoo anda.

b. Mengakses pengaturan Email, opsi Tema, dan lain-lain.

Halaman | 53
c. Pilihan menu pengaturan
Klik ikon menu Pengaturan untuk mengakses:

1) Tema - Mengubah penampilan account Yahoo Mail Anda.

2) Pengaturan - Mengakses ragam pengaturan Yahoo Mail. Lihat
"Pengaturan email" di bawah ini untuk info lebih lanjut.
3) Email Bebas Iklan - Jendela pop-up muncul dengan informasi lebih
lanjut tentang Email Bebas Iklan.
4) Bantuan - Link menuju Halaman Bantuan Yahoo Mail kami.
5) Pintasan Keyboard - Melihat pintasan keyboard yang ada di Yahoo
Mail.
6) Mengirim Masukan - Memberikan masukan Anda kepada Tim Produk
kami tentangYahoo Mail.
7) Privasi - Menampilkan Kebijakan Privasi Yahoo.
8) Ketentuan - Melihat Yahoo's Ketentuan.
9) Tentang Iklan kami - Mempelajari tentang iklan di Yahoo Mail.
10) Info account - Mengakses opsi account Yahoo Anda (seperti mengubah
kata sandi dan info pribadi).

d. Pengaturan Email

Halaman | 54
Sesuaikan Yahoo Mail dengan berbagai fitur. Di Menu Pengaturan,
pilih Pengaturan untuk mengakses:

1) Menampilkan email - Mengaktifkan/menonaktifkan percakapan, tab, dan

fitur terkini. Mengatur email agar ditampilkan dengan atau tanpa panel
preview, beralih antara versi fitur lengkap atau versi email dasar, dan
lainnya.
2) Menulis email - Otomatis menambahkan penerima baru kepada Kontak,
mengaktifkan Preview Link, membuat Tanda Tangan, dan menentukan
pengaturan font default.
3) Accounts - Untuk melihat alamat email dan profil Anda. Mengedit info
account dan mengubah kata sandi Anda. Membuat/menghapus alamat email
ekstra, melihat seberapa banyak penyimpanan yang telah Anda gunakan,
dan lainnya.
4) Balasan Otomatis - Mengonfigurasi pesan balasan otomatis untuk Yahoo
Mail dan mengirim berbagai balasan kepada domain tertentu.
5) Filter - Mengelola filter Anda.
6) Keamanan - Mengatur preferensi "Tampilkan gambar di email" dan
"Kosongkan folder Spam", dan membuat Alamat Mudah-Buang.

Halaman | 55
 7) Alamat Terblokir - Memblokir dan membuka blokir alamat email agar
tidak menghubungi account Yahoo Mail Anda.

e. Opsi menu lainnya

Pelajari berbagai opsi yang muncul untuk satu maupun beberapa email.
1) Opsi untuk satu Email
Untuk melihat opsi yang ada untuk satu pesan:
a) Buka atau pilih satu email.
b) Klik Lebih Lanjut.

Dari sini, Anda akan dapat:

o Menandai Sudah Dibaca - Menandai email yang dicentang
sebagai sudah dilihat.
o Menandai Belum Dibaca - Menandai email yang dicentang
sebagai belum dilihat.
o Membintangi - Menandai email yang Anda lihat dengan bintang
untuk memudahkan pencarian kembali suatu hari.
o Menghapus Bintang - Menghapus bintang dari email yang sudah
dilihat.
o Mencetak - Membuka email di jendela baru tempat Anda bisa
mencetaknya.

Halaman | 56
 - Jika opsi percakapan diaktifkan, Anda hanya akan memiliki opsi
untuk mencetak pesan terbaru.
o Memfilter Email Seperti Ini - Jendela pop-up akan muncul sebagai
tempat Anda membuat filter khusus untuk jenis email seperti ini.
o Menampilkan Header Lengkap - Informasi header lengkap untuk
email yang sedang Anda lihat muncul di jendela pop-up.
o Menentukan Encoding Bahasa - Memilih encoding karakter untuk
masing-masing email yang Anda lihat.
2) Opsi untuk beberapa Email
Melihat opsi yang ada untuk banyak email:
a) Pilih kotak centang beberapa email di daftar pesan.
b) Klik Lebih Lanjut.

Anda akan dapat:

o Menandai Sudah Dibaca - Menandai email yang dicentang sebagai
sudah dilihat.
o Menandai Belum Dibaca - Menandai email yang dicentang sebagai
belum dilihat.
o Membintangi - Menandai email yang dicentang dengan bintang
agar suatu saat bisa dicari lagi dengan mudah.
o Menghapus Bintang - Menghapus bintang dari email yang dipilih.

f. Opsi Pemilihan Email

Klik opsi Pilih di atas daftar email Anda untuk mengakses opsi ini:
1) Semua - Pilih semua email di daftar.
Secara default ada 50 email namun bisa ditambah lagi dengan terus
menggulir ke bawah daftar email Anda dan memilih Semua.

Halaman | 57
 2) Tidak ada - Tidak ada email dipilih.
3) Belum Dibaca - Hanya memilih email yang belum dibaca.
4) Sudah Dibaca - Hanya memilih email yang sudah dibaca.
5) Berbintang- Hanya memilih email yang dibintangi.
6) Tidak Berbintang - Hanya memilih email tanpa tanda bintang.
7) Menyesuaikan ketinggian Baris: Jika opsi Panel Preview diatur ke
"Bawah" atau "Tidak Ada," Anda akan memiliki opsi untuk menyesuaikan
seberapa tinggi munculnya setiap baris di Email Masuk atau folder lainnya.

3. Pengaturan Email pada Domain outlook

a. Buka Microsoft Outlook. Jika Startup Wizard muncul, silakan klik Next.
NOTE: Jika Startup Wizard tidak muncul, pilih Tools di menu, pilih Account
Settings, dan kemudian klik New. Di Add New E-mail Account dialog box,
pilih Microsoft Exchange, POP3, IMAP, atau HTTP, kemudian klik Next.

b. Di halaman Account Configuration, pilih Yes untuk mengindikasikan anda

ingin setup sebuah email account, dan kemudian klik Next.

Halaman | 58
c. Di halaman Auto Account Setup, masukkan data seperti berikut:
1) Your Name : Masukkan nama depan dan nama belakang anda.
2) E-mail Address : Masukkan alamat email anda.
3) Password : Masukkan password yang anda inginkan untuk email account
anda.
4) Retype Password : Masukkan kembali password anda.
d. Di halaman bagian bawah, pilih Manually configure server settings or
additional server types, dan kemudian klik Next.

Halaman | 59
e. Di halaman Choose E-mail Service, pilih Internet E-mail, dan kemudian
klik Next.

Halaman | 60
f. Di halaman Internet E-mail Settings, masukkan informasi email account anda
seperti berikut:
1) Your Name : Masukkan nama depan dan nama belakang anda.
2) E-mail Address : Masukkan alamat email anda.
3) Account Type : Pilih POP3.
4) Incoming mail server : Ketik mail.namadomain.com untuk incoming
server mail anda.
5) Outgoing mail server (SMTP) : Ketik mail.namadomain.com untuk
outgoing server mail anda.
6) User Name : Masukkan alamat email anda.
7) Password : Masukkan password email anda dengan benar.
g. Pilih Remember Password checkbox (jika anda ingin ketika login anda tidak
perlu mengetik ulang password anda), dan kemudian klik More Settings.

h. Di jendela Internet E-mail Settings, pilih di bagian tab Outgoing Server.

Pilih My outgoing server (SMTP) requires authentication dan pilih Use same
settings as my incoming mail server, Kemudian klik Ok.

Halaman | 61
i. Klik Test Account Settings. Microsoft akan mengirimkan sebuah pesan untuk
mencoba incoming and outgoing server anda. Setelah selesai, klik Next.

Halaman | 62
j. Klik Finish.

Halaman | 63
 BAB
IV
SASARAN:
MEMBUAT & MENGGUNAKAN GOOGLE DRIVE

Setelah mempelajari bab ini, anda diharapkan mampu :

A. Memahami Fungsi Dan Manfaat Google Drive
Google Drive adalah layanan penyimpanan daring milik Google yang diluncurkan pada
24 April 2012. Layanan ini merupakan ekstensi dari Google Docs dan akan mengganti
URL docs.google.com dengan drive.google.com setelah diaktifkan. Google Drive
memberikan layanan penyimpanan gratis sebesar 5 GB dan dapat ditambahkan dengan
pembayaran tertentu. Saat ini google drive juga bisa diakses di ponsel android sehingga
memudahkan untuk mengakses dimanapun kita berada.
1. Fungsi Dari Google Drive :
Banyak sekali fungsi-fungsi dari Gogle Drive, diantranya :
a. Files Host (Java Script, Css, HTML).
b. Documents Host.
c. Membuat dan Mengetik Dokumen Secara Online.
d. Membuat Presentasion Secara Online.
e. Membuat Spreadsheet Secara Online.
f. Membuat Form.
g. Menggambar.

2. Kelebihan Google Drive :

b. Dengan Hard Google, yang dapat menyimpan semua file di satu tempat,
sehingga kita dapat mengaksesnya dari mana saja dan berbagi dengan orang
lain.
c. Gunakan Google Hard Android app untuk mengakses foto, dokumen, video dan
file lain yang disimpan pada Drive Google.
d. Kita bisa Upload/Download file ke Hard Google langsung dari perangkat
e. Membuat file Foler yang tersedia offline sehingga Anda dapat mengaksesnya
bahkan ketika Anda tidak memiliki koneksi Internet
f. Membuat dan mengedit dokumen Google dengan format rich text
g. Lakukan perubahan cepat untuk spreadsheet

Halaman | 64
 h. Bisa membaca file PDF
i. Upload dan mengkonversi file ke format Google Docs
j. Mengambil foto dari teks dicetak dan mengubahnya menjadi dokumen Google
k. Support untuk pengguna tablet, Honeycomb (Android 3.0 +)
l. Buka dan lihat file apapun
m. Simpan file seseorang di tempat yang aman
n. Akses dimana saja
o. Buka dan lihat file apapun
p. Simpan file seseorang di tempat yang aman
q. Penelusuran yang canggih
r. Lebih dari penyimpana kolaborasi

3. Kelemahan Google Drive :

Kelemahan penyimpanan data online adalah ketergantungan kita dengan jaringan
internet. Untuk wilayah Indonesia tidak semua tempat memiliki akses internet yang
memungkinkan dapat berjalan dengan lancar.

4. Beberapa fitur yang tersedia di layanan Google Drive :

a. Kapasitas penyimpanan dokumen gratis hingga 5GB.
Google Drive akan memberikan ruang penyimpanan gratis bagi penggunanya
sebesar 5GB, tidak terhitung dokumen yang Anda buat melalui Drive. Anda
dapat mengupload 30 jenis file termasuk file Photoshop, video, foto dan
sebagainya. Google Drive mendukung hampir seluruh jenis file yang populer.
b. Berbagi file, folder dan seluruh isi drive Anda.
Sama seperti Google Docs, Anda dapat berbagi file melalui Google Drive.
Hanya dengan meng-klik kanan di file atau folder dan memilih ―Share‖ dan
memilih opsi sharing yang ada. Untuk mengijinkan seseorang dapat mengakses
seluruh drive Anda, klik tombol orang tersebut dan tanda tambah (plus) di
bagian atas.
c. Menggunakan sistem pencari Google.
Dengan teknologi pencarian Google yang dibenamkan di aplikasi Google
Drive, Anda dapat melakukan pencarian foto pada bagian ‗search‘. Anda juga
dapat melakukan pencarian teks pada dokumen yang di-scan. Setelah beberapa

Halaman | 65
 pengujian, fitur ini ternyata tidak sepenuhnya dapat dipercaya, tapi cukup
pantas untuk dicoba sebagai penolong pencarian file atau foto.
d. Mengkolaborasikan video, foto dan lainnya.
Fitur kolaborasi Google Docs sekarang tersedia untuk berbagai jenis file.
Sebagai contoh, jika Anda meng-upload sebuah video di Drive dan berbagi
dengan seseorang, Anda dapat berdiskusi mengenai video tersebut dengan
fasilitas komentar.
e. Menginstal aplikasi dari pihak ketiga.
Developer pihak ketiga dapat membangun aplikasi yang dapat bekerja dengan
baik di Google Drive. Anda dapat melakukan edit foto dengan menggunakan
aplikasi Pixlr, mengirim fax secara gratis dengan aplikasi HelloFax dan
menandatangani dokumen resmi dengan aplikasi DocuSign. Semuanya dapat
dilakukan lewat layanan Google Drive.

B. Memahami Proses Pembuatan Google Drive

Membuat Akun Google Drive cepat dan mudah, apa lagi jika Anda sudah memiliki
akun Google Gmail, Anda tidak perlu membuat lagi Akun Google Drive bisa langsung
Login. Mengapa demikian? karena satu Akun Gmail bisa digunakan untuk semua
layanan Google seperti Youtube, Blogger dan lain-lain. Google Drive layanan
penyimpanan online yang banyak di gunakan, tapi ada yang masih belum mengetahui
bagaimana cara membuatnya, berikut ini panduan membuat Akun Google drive dengan
cepat dan mudah:
1. Pertama ; Anda perlu membuat Akun Gmail terlebih dahulu, jika Anda sudah
memiliki bisa melewati langkah ini.
2. Kedua ; Buka Browser, disarankan menggunakan Google Chrome. Selanjutnya
silahkan masuk ke laman www.google.co.id.
3. Ketiga ; Setelah halaman terbuka, perhatikan kotak-kotak kecil yang berada di sisi
kanan atas, klik kotak tersebut. Maka akan tampil beberapa layanan Google, lalu
Anda pilih Google Drive

Halaman | 66
4. Kempat ; Selanjutnya Anda akan di minta Login, lalu masukkan alamat email dan
Sandi Akun Gmail Anda.

Halaman | 67
5. Kelima : Maka akan tampil halaman utama pada Google Drive.

6. Keenam ; tahap selanjutnya pembuatan folder untuk penyimpanan file, klik pada
tombol "Baru" berwarna merah , lalu klik Folder

Halaman | 68
7. Ketujuh ; selanjutnya pemberian nama folder, beri nama sesuai yang Anda
kehendaki.

8. Kedelapan : Sampai pada tahap ini pembuatan folder penyimpanan di Google Drive
sudah selesai.

9. Kesembilan ; Apabila Anda ingin mengunggah file klik pada Drive saya, lalu pilih
Unggah File, kemudian akan terbuka jendela baru kemudian Anda cara file dari
komputer yang ingin diunggah.

Halaman | 69
10. Kesepuluh ; Proses pengunggahan sedang berjalan, tunggu hingga selesai.

11. Setelah selesai, file yang telah di unggah bisa Anda bagikan kepada teman atau
sahabat, namun jika Anda tidak ingin membagikannya bisa Anda urungkan.

Halaman | 70
C. Mampu Melakukan Proses Penyimpanan Dan Sharing File
1. Klik kanan pada folder atau file yang akan dibagikan lalu pilih Bagikan.

2. Tulis alamat e-mail untuk membagikannya kepada orang tertentu atau klik
Dapatkan tautan yang bisa dibagikan lalu pilih pengaturan pada dropdown menu.

Untuk akses dari masing-masing pengaturannya, lihat gambar dibawah ini.

Halaman | 71
 3. Lalu salin link yang ada dan klik Beres.

4. Selesai, tempatkan link tersebut sesuai keinginan.

D. Mampu Memahami Manajemen Penyimpanan Di Google Drive

Penyimpanan Drive terbagi antara Google Drive, Gmail, dan Google Foto. Jumlah
penyimpanan gratis untuk setiap pengguna bergantung pada jenis akun Anda:

Google Apps for Work 30 GB

Google Apps Unlimited Penyimpanan tak terbatas

Google Apps for Education (1 TB jika memiliki 4 pengguna atau
kurang)

Google Apps edisi Gratis (lawas) 15 GB

Setiap akun konsumen

Jika penyimpanan sudah mendekati batas kuota atau habis, Anda dapat membeli ruang
penyimpanan tambahan atau mengurangi penggunaannya.

Karena penyimpanan terbagi antara Google Drive, Gmail, dan Google Foto, Anda
dapat mengurangi penggunaan penyimpanan di salah satu layanan tersebut untuk
mengosongkan ruang tambahan.
Jika ingin mengurangi penyimpanan yang digunakan oleh Gmail, lihat Batas
penyimpanan Gmail. Atau, pertimbangkan opsi berikut:
1. Mengosongkan sampah
File yang disinkronkan atau diunggah yang ada di Sampah menggunakan ruang
penyimpanan (Google Dokumen, Spreadsheet, dan Slide tidak menghabiskan ruang
penyimpanan). Anda menghapus file dan folder secara permanen saat
mengosongkan Sampah, sehingga beberapa kuota penyimpanan akan dipulihkan.
Halaman | 72
 Untuk menghapus file dari Sampah secara permanen:
a. Klik Sampah di navigasi sebelah kiri.
b. Klik Sampah > Kosongkan sampah di bagian atas laman.
Atau, pilih item di tempat sampah, lalu klik kanan dan pilih Hapus
selamanya untuk hanya menghapus file atau folder tersebut.
2. Hapus file yang paling banyak menggunakan ruang penyimpanan
a. Arahkan kursor ke atas penggunaan penyimpanan di pojok kiri bawah.
b. Klik Drive pada kotak yang muncul.
c. Anda akan melihat semua file yang dicantumkan menurut ukuran file.
d. Pilih file yang akan dihapus, lalu klik ikon Sampah di bagian atas laman .
e. Klik Sampah di navigasi sebelah kiri.
f. Klik Sampah > Kosongkan sampah di bagian atas laman. Atau, pilih item di
tempat sampah, lalu klik kanan dan pilih Hapus selamanya.
3. Memeriksa penyimpanan foto anda
Jika ruang penyimpanan habis, mungkin ada item tersimpan dalam Google Foto
yang menggunakan kuota penyimpanan Anda. Pertimbangkan untuk menghapus
beberapa foto guna memulihkan kuota penyimpanan yang ingin Anda gunakan
untuk Drive.

Halaman | 73
 BAB
V MEMBUAT & MENGGUNAKAN YOU TUBE

A. Selayang Pandang Youtube

YouTube adalah portal web yang digunakan
untuk saling berbagi video yang dibuat oleh
tiga mantan karyawan PayPal pada Februari
2005. Menggunakan portal youtube ini
pengguna akan dapat mengunggah, menonton, dan saling berbagi video. Perusahaan
yang berkantor pusat di San Bruno, California, ini memakai teknologi Adobe Flash
Video dan HTML5 untuk menampilkan berbagai macam konten video buatan
pengguna, termasuk klip film, klip TV, dan video musik. Selain itu ada pula konten
amatir seperti blog video, video orisinal pendek, dan video pendidikan.
Kebanyakan konten di YouTube diunggah oleh individu, meskipun perusahaan-
perusahaan media seperti CBS, BBC, Vevo, Hulu, dan organisasi besar lain sudah
mulai banyak mengunggah material mereka ke situs ini sebagai bagian dari program
kemitraan YouTube. Pengguna tak terdaftar dapat menonton video, sementara
pengguna terdaftar dapat mengunggah video dalam jumlah tak terbatas. Pada
November 2006, YouTube, LLC resmi di akuisisi oleh Google dengan nilai US$1,65
miliar dan beroperasi sebagai anak perusahaan Google.
Ada yang istimewa dari youtube sejak resmi diakuisisi oleh Google dimana ada
salah satu fasilitas yang memungkinkan prngguna bisa meraup uang dengan cara
bergabung dengan Google youtube adsense. Istilah yang yang tren sekarang adalah
menghasi;kan uang dengan menjadi seorang video blogger atau vlogger.

B. Kode etik penggunaan dan pemanfaatan Social Media

Saat kita berinteraksi menggunakan social media termasuk salah satunya youtube,
maka perlu sekali kita perpatokan pada kode etik. Salah satu dasar kode etik yang bias
dijadikan acuan adalah Undang-Undang Informasi dan Transaksi Elektronik (UU ITE).
Dalam UU ITE diatur mengenai konten yang dilarang, yakni dokumen elektronik tidak
boleh memuat sesuatu yang melanggar kesusilaan, berisikan perjudian, pencemaran
nama baik, pemerasan, kebohongan, pelanggaran terhadap suku, ras, agama, dan antar
golongan (SARA), dan juga pelanggaran terhadap privasi.

Halaman | 74
 Di Indonesia sendiri, aktivitas dalam dunia perkomunikasian dan informatika
dipayungi oleh beberapa undang-undang, antara lain UU No. 36 tahun 1999 tentang
telekomunikasi, UU No. 32 tahun 2002 tentang penyiaran, UU No. 11 tahun 2008
tentang informasi dan transaksi elektronika, dan UU No. 14 tahun 2008 tentang
keterbukaan informasi. Masing-masing UU ini mengatur setiap bidang komunikasi di
Indonesia dan jika diperhatikan, UU ini saling berkaitan satu dengan yang lainnya.
Disamping kode etik diatas ada beberapa etika yang juga harus diperhatikan dalam
bersosial media baik itu di youtube, foursquare, faebook amaupun aplikasi social media
yang lain, antara lain:
1. Batasi membagi informasi seputar kehidupan pribadi,terlebih yang sangat pribadi
dan sensitive.
2. Walau di Facebook dikolom update status bertuliskan „what’s on your
mind’ bukan berarti kita bebas mengungkapkan segala yang kita rasakan di sosial
media. Ada beberapa hal sensitif dan privasi yang seharusnya tidak perlu diketahui
oleh semua orang. Semisal masalah keuangan, bertengkar dengan seseorang,
pandangan kita terhadap seseorang dan lain sebagainya. Alangkah tidak
bijaksananya bila semua orang tahu akan permasalahan dan problematika yang
sedang kita hadapi. Baiknya simpan segala hal sensitif untuk diri sendiri dan tidak
perlu semua teman di sosial media mengetahuinya.
3. Hati-hati bila check in place dan mengupdate sedang dimana kita berada.
Aplikasi untuk check in place seperti Foursquare memang banyak digunakan dan
kemudian di share di sosial media. Pemilik akun sosial media suka check in
placeuntuk memberitahu keberadaannya dan sedang melakukan apa. Tanpa
disadari, check in place bisa mengundang orang yang berniat jahat kepada kita.
Karena orang yang berniat jahat mengetahui dimana kita berada dan dengan siapa
kita berada. Pergunakan media check in place dengan bijak
4. Tidak berbicara dan membagi konten yang memiliki unsur SARA dan Pornografi
Hindari berbicara ataupun menuliskan kalimat bercandaan yang memiliki unsur
SARA ( Suku, Agama dan Ras ) serta pornografi. Karena selain bisa menyinggung
pihak lain juga bisa menimbulkan salah persepsi dan membawa dampak yang
buruk. Tidak semua pengguna sosial media mengerti akan konsep ini, karena itu
mulailah dari diri kita untuk tidak berbicara dan membagi konten yang
mengandung unsur diatas.

Halaman | 75
 5. Hindari untuk mengupdate status yang berhubungan dengan privasi seperti sedang
dirumah sendiri atau mengambil uang di Bank. Update seperti ini bisa
membahayakan diri sendiri. Bila ada orang berniat jahat, dia bisa mendatangi
rumah kita ataupun mendatangi tempat kita berada
6. Bijak dalam mencantumkan personal information.
Personal information yang dimaksudkan adalah biodata yang ditampilkan di akun
sosial media kita seperti alamat rumah, nomor telepon, tempat bersekolah, alamat
email. Bila memang tidak penting, lebih baik tidak usah dicantumkan karena bisa
dimanfaatkan oleh orang yang tidak bertanggungjawab. Semisal mengirim email
atau sms penipuan dan lain sebagainya. Bila memang berniat mencantumkan,
berhati-hatilah bila ada nomor telepon asing atau email dari pengirim yang tidak
diketahui kita terima

C. Pendaftaran user dan channel di Youtube

Mendaftar akun di youtube semudah kita mendaftar e-mail baru, apalagi sekarang
google menerapkan kebijakan satu akun untuk semua fasilitas dibawah naungan
google. Sehingga kita tidak perlu mendaftar berulang-ulang. Berikut ini adalah cara
mendaftar akun youtube dari 0, dimana saya asumsikan kita belum mempunyai akun
google sama sekali.
1. Kunjungi YouTube dan Sign In
Hal pertama harus dilakukan tentunya pergi ke www.YouTube.com. Di homepage
ini kita bisa sign in dan membuat channel atau akun baru jika belum memiliki akun
Google.
PENTING…: Jika anda telah memiliki akun Google - contohnya akun Gmail, anda
cukup sign in dengan memasukkan username dan password.

Halaman | 76
Tapi jika sama sekali belum pernah memiliki akun Google, silahkan klik di
tombol Sign In seperti gambar diatas (dilingkari merah) dan buat akun Google
baru.

2. Buat Google Akun Anda

Untuk membuat akun Google baru, setelah
klik tombol Sign In, klik link yang
bertuliskan Create account di bagian bawah.

Secara otomatis anda akan diarahkan ke

halaman dimana anda bisa mengisikan detil
informasi anda di halaman yang
berjudul Create your Google Account.

Isi form dengan lengkap sesuai

arahan yang ada di layar. Setelah
selesai men-setup akun anda,
silahkan kembali ke homepage
YouTube untuk mengatur
channel anda dan meng-upload
video.

Halaman | 77
3. Setup Channel YouTube Anda
Setelah suskes mendaftarkan akun Google yang baru, dalam kondisi sign-in, dan
berada di homepage, anda bisa men-setup channel anda atau akun YouTube anda
dari homepage YouTube.
Klik tombol Upload di bagian atas layar (dilingkari merah).

Layar akan muncul yang menjelaskan bahwa

anda akan membuat sebuah channel dan
sekaligus membuat profil di Google+.
Layar ini juga akan meminta anda untuk
mengisi informasi yang bisa diakses oleh
publik ketika mereka pergi ke channel anda.
Masukkan data anda seperti nama anda, gender, tanggal lahir anda, upload foto
anda jika anda mau, kemudian klik tombol Continue to upload.

Halaman | 78
4. Upload Video Anda ke YouTube
Setelah anda meng-klik tombol Continue tadi, anda akan sampai di halaman dimana
anda ter-log in dalam halaman channel anda, dengan username yang telah anda
sediakan tampil di bagian pojok kanan atas.

Sekarang anda bisa meng-upload video ke channel YouTube anda dengan memilih
file video yang ingin anda upload, atau tarik file yang ingin anda upload ke jendela
upload.
Atau alternatif lain adalah anda bisa merekam video secara langsung ke channel
anda melalui webcam yang terhubung ke komputer anda.

5. Mengedit Video (Opsional)

Setelah meng-upload
video, gunakan fungsi
video edit milik
YouTube untuk
melalukan editing
sederhana terhadap
video yang akan
diupload.

Halaman | 79
6. Kustomisasi Tampilan YouTube Channel Anda
Untuk melihat homepage
channel, klik ikon YouTube di
bagian pojok atas layar. Otomatis
akan muncul opsi menu di
bagian bawah, klik opsi My
Channel untuk sampai di
halaman channel.

Untuk menambahkan sentuhan akhir pada channel, misalkan menuliskan penjelasan

singkat tentang video channel, aliran dari video channel (humor, pelajaran, game, dan
lain sebagainya) ketik penjelasan tersebut di channel description.

Klik Add channel untuk membuat lebih dari satu channel...

Halaman | 80
D. Meraup uang dari Youtube lewat Adsense

Mendaftar Google Youtube AdSense itu bisa dibilang susah-susah gampang,

tergantung cara melihatnya dari mana serta serta persiapan dalam proses pendaftaran.
Pada dasarnya hanya ada 4 tahapan
untuk mendaftar di Google Youtube
Adsense, yaitu :
a. Proses Daftar itu sendiri
b. Upload Video original
c. Setting dasar dan
d. Kaitkan Akun AdSense.
Mari belajar cara mudah daftar Google Youtube Adsense melalui 4 tahap berikut
ini:
a. Proses Daftar itu sendiri
Langkah utama yang harus dipersiapkan tentulah mendaftar email terlebih dahulu
tetapi bagi yang sudah memiliki akun gmail, maka cukup gunakan akun tersebut
dan tidak perlu mendaftar lagi. Karena di modul sebelumnya sudah dibahas cara
mendaftar akun youtube maka diasumsikan kita semua sudah punya akun google.

Penting… ! untuk memperlancar proses pendaftaran , pastikan untuk tidak

menggunakan akun google yang sudah pernah ditolak oleh System Google.

b. Upload Video original

Karena semua sudah mempunyai akun google silahkan login dahulu ke akun
masing-masing dan upload video ke channel youtube yang sudah diatur pada modul
sebelumnya.

Penting…! Proses pendaftaran akan jauh lebih cepat serta efisien jika video yang
di upload benar-benar original atau hasil rekaman Anda sendiri.

c. Setting Akun
Langkah ketiga untuk cara daftar adsense lewat youtube adalah dengan melakukan
sedikit setting pada akun Youtube yang Anda miliki.

Halaman | 81
Klik pada foto profil dan klik lagi pada menu Creator studio untuk mengaktifkan
fitur monetisasi pada akun
yang akan didaftarkan.
Setelah anda menerima
semua persyaratan dan
kondisinya dengan cara
klik "I accept", perhatikan
pada pojok kanan atas klik
tombol anak panah di
sebelah tombol upload lalu
klik "Manage Video".
Begitu anda meyetujui persyaratan dari Google AdSense, langkah berikutnya
adalah klik tombol Monetize untuk mengaktifkan akun

Halaman | 82
d. Kaitkan Akun Adsense
Langkah
terakhir setelah
berhasil
melakukan
setting pada
akun youtube
adalah
mengaitkan
akun AdSense dengan video yang sudah diupload sebelumnya. Cara mengaitkan
Akun Adsense adalah, dari dashboard Youtube klik menu monetization kemudian
klik pada link "Associate an Adsense Account” (ditandai merah).

Selanjutnya, akan muncul layar di mana Anda diminta mengatur Akun Adsense
Anda. Klik "Continue" tombol untuk mengisi rincian Anda lainnya seperti Alamat,
Negara, Nama Penerima Pembayaran dsb. Pastikan isi dengan lengkap seluruh data
diatas dan sesuaikan dengan alamat yang ada di KTP anda (cantumkan nomor
rumah). Setelah proses selesai anda akan di minta meverifikasi akun google adsense
anda yang baru melalui nomor HP.
Setelah itu tinggal menunggu persetujuan (approve) dari google adsense antara 1 –
7 hari.

Penting…! Alamat harus sesuai KTP karena pihak dari Google akan mengirimkan
PIN melalui pos (bukan email) ke rumah anda jika saldo anda sudah di ambang
batas bayar, untuk memverifikasi alamat anda.

Halaman | 83
TUGAS MODUL 5

1. Buatlah akun google sesuai dengan identas kalian masing-masing

2. Buat dan atur channel youtube anda sesuai dengan isi dari video yang kalian upload
3. Upload video original ke channel yang sudah anda buat
4. Kaitkan akun youtube anda dengan Google Adsense sesuai dengan apa yang sudah
di pelajari di modul sebelumnya.

Halaman | 84
 BAB
VI MEMBUAT & MENGGUNAKAN WEB BLOG

A. Selayang Pandang web blog

Sebelum kita berkenalan lebih jauh dengan weblog, mungkin diantara kita masih
ada yang bertanya-tanya sebenarnya apa beda web blog dengan website? Mari kita
mulai dengan apa itu website.

W
ebsite atau situs adalah beberapa halaman web yang memiliki topik
yang saling terkait satu sama lain, mungkin disertai pula dengan berkas
gambar, video, atau jenis berkas lainnya. Situs web biasanya
ditempatkan pada web server yang dapat diakses melalui jaringan seperti internet,
ataupun jaringan wilayah lokal (LAN) melalui alamat internet atau URL.
Gabungan situs-situs yang dapat diakses publik di internet tersebut disebut World
Wide Web (WWW). Meskipun paling tidak homepage suatu website dapat diakses
publik secara bebas, pada prakteknya sebagian situs web mewajibkan pengunjung
untuk melakukan pendaftaran, bahkan ada yang meminta pembayaran untuk dapat
menjadi aggota agar bisa mengakses web tersebut. Pembatasan-pembatasan ini
biasanya dilakukan untuk alasan keamanan, privasi, atau karena tujuan komersil.
Sebuah halaman web merupakan berkas yang ditulis dengan instruksi berbasis HTML,
atau XHTML. Berkas itu diterjemahkan oleh peramban web atau web browser dan
ditampilkan layaknya halaman web yang kita lihat pada layar komputer.
Protocol untuk mengakses halaman web tersebut di sebut http atau https jika
menginginkan aspek keamanan dan aspek privasi yang lebih baik,
Situs web pertama kali di kenalkan oleh Sir Timothy John ¨Tim¨ Berners-Lee,
sedangkan situs web yang terhubung dengan jaringan pertama kali muncul pada tahun
1991. Tanggal 30 April 1993, CERN (tempat dimana Tim bekerja) mengumumkan
bahwa WWW dapat digunakan secara gratis oleh publik.
Sebuah situs web sendiri bisa berupa hasil kerja individu, organisasi ataupun
perusahaan.. Sebuah situs web kadang berisi link yang terhubung ke situs web lain,
demkian pula dengan situs web lainnya.

Halaman | 85
 B
log adalah akronim dari web log yang merupakan bentuk aplikasi web yang
menyerupai tulisan – tulisan (posting) pada suatu website umum. Situs web
ini biasanya bias diakses semua pengguna Internet berdasar topik dan tujuan
dari orang yang menggunakan blog tersebut.
Media blog ini diperkenalkan oleh Blogger.com milik Pyra Labs sebelum diakuisisi
oleh Google pada 2002. Sejak saat itu, banyak terdapat aplikasi – aplikasi yang
bersifat open source yang diperuntukkan kepada perkembangan para penulis blog
tersebut yang bahkan popularitasnya mampu menyaingi blogger seperti wordpress dll.
Blog sendiri memiliki fungsi yang beraneka macam, dari sebuah catatan harian yang
paling sederhana, media publikasi sampai dengan program – program media dan
perusahaan. Banyak pula weblog yang memiliki interaktif dengan para
pengunjungnya, seperti adanya fasilitas buku tamu dan kolom komentar namun ada
juga yang sebaliknya atau yang bersifat non-interaktif.

B. Membangun web blog dengan Wordpress

WordPress adalah
sebuah aplikasi
open source yang
sangat populer
digunakan sebagai
mesin blog (blog
engine).
WordPress dibangun dengan basis bahasa pemrograman PHP dan di dukung oleh
MySQL sebagai basis data (data base). Selain sebagai blog, WordPress juga sangat
populer digunakan sebagai sebuah CMS (Content Management System) disamping
drupal dan joomla karena kemampuannya untuk dimodifikasi dan disesuaikan dengan
kebutuhan penggunanya. WordPress sendiri merupakan penerus resmi dari b2/cafelog
yang dikembangkan oleh Michel Valdrighi. WordPress saat ini telah menjadi platform
content management system (CMS) pilihan bagi beberapa situs web yang cukup
ternama seperti CNN, Reuters, The New York Times dll.

Langkah pertama yang harus kita lakukan untuk membangun web blog di wordpress
tentulah menuju web portal WordPress di https://id.wordpress.com/, kita akan home
yang sederhana tapi elegan dengan tombol besar ditengah layar bertuliskan ”create
Halaman | 86
website”, saat link tersebut diklik maka akan mengantarkan kita pada halaman
pemilihan nama domain atau blog seperti gambar dibawah ini.

a. Memilih jenis blog

Silahkan pilih salah satu kategori website

yang paling sesuai dengan isi dari blog anda

nanti. Sebagai contoh karena blog kita akan

bercerita tentang prodistik, silahkan pilih

“educations & organization” lalu pada

pilihan berikutnya pilih opsi “general

education”.

b. Memilih web blog layout

Pada tahap ini anda di minta untuk

memilih web blog layout yang

anda anggap paling sesuai dengan

web blog anda. Silahkan pilih

antara

a. A list of my latest post – post terbatu akan ditampilkan dalam formasi list dari

atas ke bawah

b. A welcome page for my site – post terbaru akan ditampilkan berupa thumbnail

dan ringkasan isi post, atau

c. A grid of mylatest post – post terbaru akan ditampilkan berbentuk grid di

homepage.

Halaman | 87
c. Memilih tema web blog

Langkah selanjutnya

adalah memilih

template atau tema

blog, pada tahap ini

silahkan pilih tema

yang menurut anda

paling bagus yang

paling sesuai dengan

isi dari web blog akan kita buat. Pemilihan tema ini menjadi salah satu langkah

yang cukup penting karena akan menentukan tampilan dari web blog kita serta

cepat lambatnya blog kita di-load oleh peramban web (web browser. Perhatikan

screenshot berikut :

d. Memilih nama domain

Jika anda memilih Blog WordPress yang gratis, alamat blognya akan selalu

berakhir dengan “.wordpress.com“. Yang perlu di perhatikan adalah Nama domain

yang dipilih tidak dapat diubah, jadi pastikan Nama domain yang dipilih benar-

benar telah sesuai dengan isi dari blog yang kan kita buat. Maka dari itu pemilihan

Halaman | 88
 nama domain dalam membuat blog menggunakan wordpress harus disiapkan secara

matang sebelumnya.

Pada proses ini pastikan alamat atau nama blog yang dipilih masih tersedia, lihat

gambar yang telah di area kotak diatas, setelah itu tinggal melanjutkan dengan klik

tombol ” select ” dan kita akan diarahkan pada halaman berisi pilihan paket hosting

yang akan kita pilih.

e. Memilih paket hosting

Setelah memilih tema kita akan dihadapkan

pada halaman untuk memilih paket hosting.
Klik tombol ” Select free “, maka kita akan
menuju halaman “create account” di
WordPress.com, silahkan masukkan e-mail
anda yang masih aktif dan klik “Create my
Account” untuk melakukan finalisasi proses
pembuatan blog.

Halaman | 89
 Penting…!
1. Masukkan alamat e-mail anda yang masih aktif di kolom ini
2. Ketikkan password atau kata sandi di kolom ini (kata sandi yang aman
setidaknya terdiri dari gabungan antara huuruf dan angka minimal 8 karakter).
Yang perlu diperhatikan bahwa sandi ini case sensitive.

Klik “continue” dan jangan lupa untuk

melakukan aktivasi melalui e-mail yang tadi
anda masukkan untuk mengaktifkan web blog
yang baru saja anda buat.

f. Dashboard Wordpress

Perhatikan gambar diatas, Anda bisa mengatur segala sesuatu tentang blog anda
menggunakan dashboard Wordpress di atas, berikut adalah penjelasan singkat
bagian-bagian yang ada di dashboard wordpress.
1. Gunakan menu blog post untuk membuat post baru di blog anda
2. Tombol theme merupakan link yang digunakan untuk menuju ke pengaturan
tema dari web blog
3. Gunakan view site jika ingin melakukan pratinjau (preview) pada blog yang
telah kita buat.

Halaman | 90
 Penting…!
Jika anda ingin menggunakan
bahasa Indonesia sebagai
pengantar, klik tombol setting lalu
ubah language ke id-bahasa
indonesia sperti gambar dibawah
ini

Silahkan jelajahi halaman dashboard ini, semua arahan sudah dalam bahasa
indonesia sehingga sangat mudah untuk dipahami, cobalah mengubah tema blog
(desain), menulis post dan halaman, menambahkan pengguna, merevisi profil
pengguna dan masih banyak lagi. Luangkan waktu untuk mengeksplorasi
dashboard WordPress ini, dan jangan takut untuk menguji berbagai perangkat dan
fitur yang tersedia untuk membantu menyesuaikan blog. Jika menemukan
permasalahan, klik pada tab ”help” di menu profil yang akan membawa kita ke
bantuan online WordPress serta forum pengguna aktif di mana kita bisa
mengajukan pertanyaan.

g. Update berita di web blog

Sebelum meng-update betita atau post di wordpress, silahkan login dahulu dengan
menggunakan akun yang sudah didaftarkan sebelumnya, kemudian ikuti langkah-
langkah berikut ini.

1. Pada page my site,

klik blog post kemudian klik add

Halaman | 91
2. Akan tampil menu-menu blog
(pada bagian samping kiri).
Untuk memulai mengisi
ketikkan judul pada kolom
title dan ketikkan isi berita /
posting di kolom berita, klik
ion gambar untuk
menambahkan media ke
posting yang akan kita upload
lalu klik publish menampilkan
posting tersebut di halaman web.

3. Setelah terpublikasi, maka akan tertampil form untuk mengisi artikel/tulisan

yang lain. Jika kita tidak ingin mengisikan tulisan lagi dan ingin melihat hasil
tulisan kita apakah telah terisi dengan benar, maka kita tinggal mengklik
menu View Post.

4. Pada web blog kita, akan tampil artikel/tulisan yang baru saja kita buat.

Halaman | 92
C. Membangun web blog menggunakan Blogger/Blogspot

Blogspot
sebelumnya
hanyalah sebuah
catatan harian
online di internet.
Namun sekarang, platform milik Google ini menjadi salah satu sistem manajemen
konten yang paling populer (CMS) untuk mempublikasikan website dengan sangat
cepat dan mudah. Bisa digunakan dengan sangat mudah, ringan, cepat, stabil, handal
dan jumlah yang bebas untuk membuatnya.Siapa saja dapat menggunakan platform ini
untuk membangun website dalam berbagai hal.
Blogspot-lah yang juga menjadi pelopor munculnya istilah Blogger. Dimana Blogger
bisa merujuk pada istilah narablog atau pengeblog yang merupakan penulis atau
jurnalis yang mencatat berbagai informasi dalam sebuah blog.
Dengan populasi yang besar, mencakup lebih dari 40% situs di dunia menggunakan
CMS ini, tentu sudah menjadi bukti kehebatan Blogger.
Berikut beberapa kelebih Blogger jika dibandingkan dengan CMS lain yang berjalan
dalam format gratis.
1. Memiliki Versi Mobile
2. Ramah SEO (Search Engine Optimization)
3. Ringan & Cepat
4. Didukung sepenuhnya oleh Google hosting, dan harus di akui bahwa Google
hosting adalah web server yang terbaik dan tercepat di seluruh dunia
5. Blogger juga menjamin penggunanya dengan layanan yang stabil.
6. Aman
7. Yang paling utama dari semua keunggulan Blogger adalah layanannya gratis
selamanya.
8. Banyak Dukungan Jika mengalami kendala dalam

Itulah sepintas tentang blogspot / blogger, lalu bagaimana cara membangun sebuah
web blog di blogger? Anda akan mampu membangun web blog anda sendiri, bahkan
meski anda belum pernah mengenal HTML. Ikuti langkah-langkah berikut :

Halaman | 93
a. Siapkan akun google
Karena sekarang google menerapkan satu
akun untuk seluruh layanannya, maka hal
utama yang harus disiapkan untuk
membangun web blog di blogspot adalah
akun Google. Karena sebelumnya kita
sudah membuat akun untuk mendaftar di
youtube hannel, jadi saya asumsikan anda
sudah punya akun google.
Silahkan langsung menuju ke portal
blogspot dengan mengetikkan alamat
http://www.blogger.com
Anda akan disambut oleh login screen Google, Silahkan langsung masukkan
username dan password akun google anda.

b. Buat blog baru

Setelah anda berada di dashboard Blogger langsung klik Blog baru dan anda akan
di bawa ke dialog box seperti di bawah ini

Halaman | 94
1. Isi Judul dengan
judul dari blog
yang akan kalian
buat, pastikan
judul itu sesuai
dengan isi dari
blog.

2. Tentukan alamat
blog yang anda
inginkan.
Nantinya akan
berekstensi .blogspot.com. Untuk alamat blog ini, anda bebas menggunakan
nama apa saja selagi nama tersebut belum dipakai orang lain. Tipsnya
sebaiknya anda membuat nama alamat blog yang berisi kata kunci / judul dari
blog anda. Misal, Blog Prodistik, anda bisa membuat alamat blog seperti
prodistik.blogspot.com. Kalau tidak tersedia, (tanda silang) boleh
ditambahkan angka atau kata lain, atau tanda strip (-) yang mendukung.
Hingga muncul tanda ceklis biru tanda alamat blognya tersedia dan bisa kita
gunakan.

3. Kemudian pilihlah template yang anda ingin gunakan untuk tampilan blog
anda nantinya. Anda bisa pilih template-template yang disediakan oleh
google, seperti template "sederhana", "dinamis", dll. Akan tetapi jika anda
merasa tampilan dari template yang disediakan oleh googel tersebut kurang
menarik, tenang saja pada nantinya anda bisa mengganti tampilan blog anda
dengan template yang lebih menarik, dengan upload custom template. Tapi
untuk sekarang, pilih saja salah satu template yang disediakan blogger. Dan
jika sudah, klik tombol "Buat Blog!"

Sampai di sini, anda telah mempunyai sebuah blog. Tapi, masih ada beberapa
pengaturan yang perlu dilakukan untuk membuat blog anda lebih terlihat cantik
dan menarik..

Halaman | 95
c. Dashboard Blogspot

Fungsi menu yang ada di dashboard Blogspot

1. ENTRI BARU (NEW POST)
Menu ini berfungsi untuk membuat posting / artikel. Dalam menu ini kita bisa
membuat posting bisa berupa text / link / url, gambar, maupun video untuk
dipublikasikan kedalam blog.
2. IKHTISAR (OVERVIEW)
Menu ikhtisar akan menampilkan pemberitahuan singkat / pembaruan terkini,
seperti grafik penayangan blog, komentar yang menunggu diterbitkan
(moderasi) maupun yang telah diterbitkan, jumlah penayangan hari ini, jumlah
posting, dan jumlah follower blog terbaru.
3. POST (POSTS)
Menu post berguna untuk melihat daftar posting / artikel yang ada dalam blog,
baik yang sudah dipublikasian maupun yang masih tersimpan dalam bentuk
draf. Kita juga bisa menghapus atau edit / memperbaharui Posting yang telah
dipublikasikan sebelumnya ke blog melalui menu ini
4. LAMAN (PAGES)
Menu ini berguna untuk menambah halaman pada blog. "Halaman" berbeda
dengan "Posting" blog. Biasanya ini berfungsi untuk menambahkan menu
About Me, Privacy Policy, Disclaimer, Contact, dll pada Blog.

Halaman | 96
5. KOMENTAR (COMMENTS)
Menu komentar pada blogger dashboard berfungsi untuk memoderasi
(menerbitkan / menghapus / spam) komentar dari pengunjung blog yang masuk
pada Posting blog yang telah dipublikasikan kedalam blog.
6. STATISTIK (STATS)
Menu Statistik berguna untuk melihat data - data / informasi tentang kunjungan
blog, tampilan halaman, sumber lalu lintas yang masuk ke blog, telusuran kata
kunci, dll yang terbagi menjadi 4 submenu : Ikhtisar, Post, Sumber Lalu Lintas
& Pemirsa
8. TATA LETAK (LAYOUT)
Tata letak berguna untuk mengatur, baik menambah atau menghapus gadged
blog, seperti Popular Post, Tautan Berlangganan, Facebook Like, Live Traffic,
Label Blog, Gambar, Slide Show, Banner, Arsip Blog, Search Box, dan lain
sebagainya.
9. TEMPLATE
Pada menu Template ini kita bisa mengubah tampilan Blog, baik warna, tema,
ukuran, panjang, lebar blog, ukuran / warna text maupun link, dan sebagainya
baik melalui tombol SESUAIKAN atau pun langsung dari EDIT HTML. EDIT
HTML juga berguna untuk menyisipkan Script, Kode HTML, CSS, dll. Selain
itu, terdapat juga pilihan template sederhana dibawahnya yang bisa digunakan
untuk template blog.
10. SETELAN (SETTINGS)
Yang terakhir adalah menu Setelan, menu ini terdiri dari 6 Sub menu, yaitu
Dasar, Pos dan Komentar, Seluler dan Email, Bahasa dan Pemformatan
Preferensi Penelusuran, Lainnya

Masing-masing sub menu tersebut mempunyai beberapa menu lagi. Fungsi

Setelan antara lain :
- Mengedit Judul , Deskripsi, Url / Alamat Blog, Mengubah privasi,
- Menambahkan Author
- Mengatur, lokasi, pesan, verifikasi, dan moderasi komentar
- Mengatur format waktu, bahasa, memindahkan blog ke akun lain, dsb.

Halaman | 97
 Stelah mengenal bagian-bagian dashboard blogspot, sekarang kita lanjutkan
dengan bagaimana mengupdate berita/post di blogspot

d. Update Berita di Blogspot

Setelah berhasil membuat blog, hal berikutnya yang perlu dilakukan
tentunya mengisi blog dengan tulisan atau posting artikel. Cara posting artikel di
blogger sendiri bisa dibilang sangat mudah. Pada dasarnya hampir sama seperti
menulis email jadi tidak akan sulit untuk dipelajari,
Ikuti langkah berikut :
1. Seperti biasanya silahkan login dulu ke https://blogger.com menggunakan Akun
Google.
2. Jika sudah berhasil login, sekarang tinggal klik icon “Pensil“ di dashboard
(dilingkari merah)

3. Berikutnya anda akan langsung diarahkan ke halaman editor artikel di blogger.

Perhatikan ilustrasi berikut gambar di bawah ini beserta penjelasannya :

1 11
10
12
5
3
6
4 7
2 8
9

Penjelasan :
1. : Ketikkan judul postingan
2 : Isi postingan
3 : Menu-menu untuk mengganti warna tulisan, ukuran font, upload gambar
dan video, DLL.
4 : Format postingan. Pilih saja Compose untuk pemula
5 : Label postingan.
6 : Tanggal artikel ditulis

Halaman | 98
 7 : Tautan permanen.
8 : Lokasi sobat saat menulis artikel. Nggak wajib diisi
9 : Beberapa opsi lain yang bisa dipilih
10 : Tombol untuk mempublikasikan artikel sobat
11 : Tombol untuk menyimpan postingan ke Draft
12 : Preview postingan sebelum dipublikasikan
5. Klik tombol “Publikasikan” kalau artikelnya sudah selesai.
6. Jika sudah tinggal cek alamat blog sobat. Sekarang tulisan sobat sudah online
dan bisa dibaca oleh banyak orang.

Halaman | 99
D. Mengoptimalkan web blog ke Adsense

Adsense adalah layanan periklanan Google, dalam hal ini Goggle bekerja sama
dengan pemilik suatu situs web, blog, atau youtube untuk dipasangi iklan. Pemilik
situs tersebut nantinya dibayar mengggunakan metode Pay Per Click (PPC).
Google akan membayar anda tiap awal bulan jika pendapatan anda dari iklan
Adsense sudah melebihi $100 tiap bulannya. Nah, untuk mereka yang belum mencapai
$100 per bulannya, jumlah pendapatan akan diakumulasi hingga mencapai $100 dulu,
baru nanti Google akan mengirimkan pendapatan di awal bulan berikutnya.
Untuk wilayah Indonesia, menggunakan Western Union adalah cara menerima
pembayaran terbaik. Selain mudah dan cepat, Western Union juga sudah terintegrasi
dengan hampir semua bank besar di Indonesia sehingga pendapatan dari iklan Google
Adsense bisa diambil kapanpun dan dimanapun.
Meski menggiurkan, tetapi tidak serta-merta setiap blog bisa di terima oleh Google
untuk bekerjasama. Para pemilik blog harus mengajukan permohonan kerjasama ke
pihak Google Adsense. Kemudian nanti Google akan me-review blog tersebut apakah
layak untuk di terima bekerja sama atau tidak.
Berikut ini adalah step by step cara blog anda cepat diterima oleh Google Adsense:
1. Optimalkan design web blog
Gunakanlah jenis font yang umum dipakai dalam penulisan formal misalnya
Calibri, Times New Roman, Arial, dsb. Gunakan juga ukuran font yang sesuai dan
mudah dibaca, dan yang utama warna font dan warna design blog harus “match”
sehingga tidak tumpang tindih antar elemen
2. Gunakan responsive design
Membuka situs web sekarang ini, tidak melulu menggunakan media PC atau laptop
tapi menggunakan media smartphone atau tablet sudah merupakan hal lumprah.
Halaman | 100
 Oleh karena itu design suatu blog pun harus bisa menyesuaikan dengan resolusi
media tersebut. Design blog seperti itu dinamakan responsive design. Perlu digaris
bawahi bahwa responsive design berbeda dengan mobile design dari suatu blog.
3. Mulailah mengisi blog dengan tulisan yang orisinil
Tulislah sesuatu yang sesuai dengan bidang yang anda gemari dan geluti agar anda
tidak bingung.
Kemudian untuk mempermudah menggali inspirasi tentang tema tulisan, bukalah
Google Trend. Google Trend otomatis mengurutkan kata kunci yang sedang trend
sehingga mudah untuk dicari dan dilihat
4. Buat tulisan yang SEO friendly
Tulisan yang Search Engine Optimization (SEO) friendly mutlak diperlukan.
Tulisan yang SEO itu adalah tulisan yang berada pada halaman pertama Google
saat orang lain mencari kata kunci yang mereka inginkan di Google. Tulisan yang
SEO otomatis meningkatkan jumlah traffic pengunjung blog anda.
5. Internal link
Internal link adalah tautan yang menghubungkan setiap tulisan anda dengan tulisan
yang lain sehingga semua tulisan anda bisa terbaca oleh pengunjung. Sehingga
diharapkan internal link ini akan mampu mendongkrak traffic dari blog anda
6. Tema tulisan yang abadi
Maksudnya buat tulisan yang akan dicari orang sepanjang waktu. Sebagai contoh
jika anada menulis tentang review film maka tulisan itu hanya akan ramai saat film
tayang tau jika anda menulis tentang piala dunia maka tulisan anda hanya akan
ramai saat pesta olahraga tersebut berlangsung. Jadi buat tulisan yang bertema
abadi sebagai contoh tentang kehamilan maka setiap saat aka nada orang mencari
tulisan tersebut.
7. Integrasikan blog dengan layanan Google yang lain
Dengan membuat blog di Blogger, dengan otomatis anda sudah memiliki Google
Account untuk sign in ke setiap layanan Google.
Layanan Goggle yang paling penting untuk diintegrasikan ke dalam blog antara
lain layanan pengelolaan situs yaitu Google Webmaster Tools, dan layanan analisa
situs yaitu Google Analytics. Salah satu syarat utama untuk bisa diterima oleh
Google Adsense adalah blog anda harus sudah terintergrasi dengan kedua layanan
tersebut.

Halaman | 101
8. Langkah terakhir adalah mengajuakan blog anda untuk bekerja sama dengan google
adsense
Syarat utama dari Google, blog minimal berumur 3-6 bulan dan memiliki
pengunjung yang stabil. Jika blog dibuat dalam bahasa Indonesia, maka lebih baik
jika blog tersebut sudah berumur diatas 6 bulan karena Google menghitung traffic
pengunjung blog tersebut.
Dan disaat web blog sudah cukup memiliki posting tulisan yang baik, mulailah
mengajukan blog anda di Google Adsense. Google Adsense tidak membatasi
berapa posting tulisan yang sudah anda miliki. Walaupun hanya memiliki 10
posting tulisan, asalkan posting itu berkualitas dan orisinil, serta banyak dicari
maka kemungkinan blog diterima lebih besar.
Sejak akhir 2013, Google mewajibkan pemilik blog yang mengajukan kerja sama
dengan Adsense untuk memasang kode HTML iklan yang di tempatkan di widget
HTML blog anda. Tujuannya agar pihak Google bisa cepat me-review suatu blog.
Dan yang terakhir adalah menunggu dan memperbanyak tulisan / posting.
Dalam jangka waktu 1 minggu hingga 2 bulan Google Adsense akan mengirim e-
mail jawaban apakah blog anda diterima untuk bekerja sama atau tidak.

Halaman | 102
TUGAS MODUL 6

1. Gunakan akun google yang sudah anda punya untuk membuat blog
2. Buat blog dengan tema sesuai dengan hobi anda
3. Atur template blog ke tipe responsive template (Aplikasikan tips yang ada pada
subbab Mengoptimalkan Web Blog untuk Adsense)
4. Jangan lupa pasangkan widget google adsense di blog anda
5. Teruslah update tulisan di blog anda, karena semakin baik tulisan atau posting
maka semakin besar kemungkinan peluang kerjasama dengan Google Adsense

Halaman | 103
BAB
VII HTML

A. Memahami struktur dasar di HTML

Mendesain html berarti melakukan suatu tindakan pemrograman. Namun html
bukanlah sebuah Bahasa pemrograman. Namun html hanyalah berisi perintah‐perintah
yang telah terstruktur berupa tag‐tag penyusun.
Mendesain html adalah sebuah seni tersendiri. Homepage yang merupakan
implementasi dari html adalah refleksi dari orang yang membuatnya. Untuk itu kita
perlu mendesainnya dengan baik agar para pengunjung homepage yang kita buat
merasa senang dan bermanfaat.
Mendesain html dapat dilakukan dengan dua cara:
1. Menggunakan html Editor, seperti Microsoft FrontPage, Adobe Dreamweaver dan
lain‐lain.
2. Dengan cara menuliskan sendiri secara manual satu persatu tag‐tag html ke dalam
dokumen html
Ada kelebihan dan kekurangan dari dua cara di atas. Cara pertama kelebihannya
adalah html Editor merupakan sebuah program yang khusus didesain untuk membuat,
Melakukan editing bahkan mem‐publish ke internet. Dengan kemampuannya
menggabungkan kemudahan dan kecanggihan teknologi internet ke dalam dokumen
html maka cara ini sangat disukai oleh para pemula dan desainer yang tidak ingin
belajar lebih mendalam mengenai html. Sedangkan cara kedua adalah menuliskan
secara manual satu persatu tag‐tag html. Hal ini sangat disarakan dikarenakan akan
memakan tenaga dan waktu ekstra untuk melakukannya, ditambah lagi Anda harus
melakukan cara‐cara konvensional untuk melihat hasilnya pada web browser. Namun
pada cara kedua adalah dasar dari segala bentuk html yang akan Anda pelajari, karena
dengan cara itulah Anda akan lebih paham mengenai cara kerja dan berbagai perintah
yang biasa dipakai pada bahasa html.

Halaman | 104
Halaman | 105
Dari struktur dasar html di atas dapat dijelaskan sebagai berikut:
a. Tag
Adalah teks khusus (markup) berupa dua karakter "<" dan ">", sebagai contoh
<body> adalah tag dengan nama body.
Tag harus ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag
penutup (ditambahkan karakter "/" setelah karakter "<"), sebagai contoh <body>
ini adalah tag pembuka isi dokumen html, dan </body> ini adalah tag penutup isi
dokumen html.
b. Element
Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai
contoh untuk menampilkan judul dokumen html pada web browser digunakan
element title, dimana: <title> ini adalah tag pembuka judul dokumen html Judul
Dokumen html ini adalah isi judul dari dokumen html </title> ini adalah tag
penutup judul dokumen html. Tag‐tag yang ditulis secara berpasangan pada suatu
element html, tidak boleh saling tumpang tindih dengan pasangan tag‐tag lainnya.
Contoh penulisan tag‐tag yang benar
<p>
<b>
</b>
</p>
Catatan : Jika penulisan script salah, maka script tidak terbaca sempurna ( Error )
sehingga dapat mengganggu penampilan dan dinamika web itu sendiri.

Halaman | 106
c. Attribute
Attribute mendefinisikan property dari suatu element html, yang terdiri atas nama
dan nilai. Penulisannya adalah sebagai berikut:
<TAG
nama-attr="nilai-attr" nama-attr="nilai-attr">
</TAG>
Secara umum nilai attribute harus berada dalam tanda petik satu atau dua. Sebagai
contoh, untuk membuat warna teks menjadi kuning dan latarbelakang halaman
web menjadi hitam, penulisannya adalah <body bgcolor="black" text="yellow">
d. Element html
Menyatakan pada browser bahwa dokumen Web yang digunakan adalah html.
Sintaks:
<html>
</html>
e. Element head
Merupakan kepala dari dokumen html. Tag <head> dan tag </head> terletak di
antara tag <html> dan tag </html>. Sintaks:
<head>
</head>
f. Element title
Merupakan judul dari dokumen html yang ditampilkan pada judul jendela
browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag
</head>. Sintaks:
<title> Judul Halaman HTML
</title>
g. Element body
Element ini untuk menampilkan isi dokumen html. Tag <body> dan tag </body>
terletak di bawah tag <head> dan tag </head>. Element body mempunyai
attribute‐ attribute yang menspesifikasikan khususnya warna dan latarbelakang
dokumen yang akan ditampilkan pada browser. Sintaks:
<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
</body>

Halaman | 107
text : memberikan warna pada teks
bgcolor : memberikan warna pada latarbelakang dokumen html
background : memberikan latarbelakang dokumen html dalam bentuk gambar
link : memberikan warna untuk link
alink : memberikan warna untuk link yang sedang aktif
vlink : memberikan warna untuk link yang telah dikunjungi. Contoh :

<html>
<head>
<title>Judul Dokumen html</title>
</head>
<body bgcolor="#FFFF00" text="#FF0000" link="#009900"> Penulisan
informasi Web<br>
<a href="#">Text Link (Tombol) ini berwarna hijau</a></body>
</html>

Catatan : Jika attribute bgcolor dan background keduanya dispesifikasikan maka

attribute background yang akan digunakan, akan tetapi jika nilai attribute
background (gambar) tidak ditemukan pada dokumen html maka attribute
bgcolor yang akan digunakan.

Halaman | 108
B. Manipulasi text dengan HTML
1. HEADING
Heading adalah sekumpulan kata yang menjadi judul atau subjudul dalam suatu
dokumen html. html menyediakan enam tingkatan heading. Heading level 1
biasanya untuk judul utama.
Contoh:
Ketiklah dan simpan dengan nama file heading.html
<html>
<head>
<title>Headings</title>
</head>
<body>
<h1>Heading Level 1</h1><! Tulisan
ini tidak memiliki pengaruh >
<h2>Heading Level 2</h2><! dan tidak
akan muncul di browser>
<h3>Heading Level 3</h3><!
Manfaatnya hanya sebagai keterangan
saja>
<h4>Heading Level 4</h4>
<h5>Heading Level 5</h5>
<h6>Heading Level 6</h6>
</body>
</html>

2. PARAGRAF
Untuk membuat paragraf digunakan tag <p> . Setelah tag <p> Anda bisa menulis
isi paragraf dan paragraph tersebut harus diakhiri dengan penutup </p> . Anda bisa
mengatur posisi paragraf dengan attribut align .
Atribut align diikuti dengan posisi yang diinginkan. left untuk rata kiri, center
untuk rata tengah dan right untuk rata kanan.
Contoh:
Ketiklah dan simpan dengan nama file paragraf.html

Halaman | 109
<html>
<head>
<title>Paragraf</title>
</head>
<body>
<html>
<head>
<title>Paragraf</title>
</head>
<bod>
<p align="right"> PERHATIKAN!
Paragraf ini rata kanan : If you can’t
find your answer through the forums, or you wish to contact me for any other
reason, the best place to write is [email protected]. SitePoint has a well-
manned email support system set up to track your inquiries, and if the support staff
are unable to answer your
question, they send it straight to me. Suggestions for improvement as well as
notices of any mistakes you may find are especially welcome.</p>
<p align="center">
PERHATIKAN! Paragraf ini berada di tengah : Craig plays bass guitar in
Melbourne rock band Look Who&rsquo;s Toxic, 4 and indulges in all the
extracurricular activities you&rsquo;d expect of a computer nerd/musician
approaching 30 (other than role playing&mdash;somehow he never got into
that).</p>
<p align="left">PERHATIKAN! Paragraf ini rata kiri : All rights reserved. No
part of this book may be reproduced, stored in a retrieval system or transmitted in
any form or by any means, without the prior written permission of the publisher,
except in the case of brief quotations embedded in critical articles or reviews.</p>
</body>
</html>

Halaman | 110
3. BLOCKQUOTE
Perintah tag <blockquote> digunakan untuk menulis kutipan teks. Dengan
perintah ini browser akan menampilkan teks menjorok ke dalam (meng‐
identasi teks) atau menampilkan teks dalam bentuk huruf miring.
Contoh:
Ketiklah simpan dengan nama file blockquote.html
<html>
<head>
<title>blockquote</title>
</head>
<body>
<h3>Sesuatu yang perlu dicoba</h3>
<blockquote>
Trademark Notice<br>
Rather than indicating every occurrence of a trademarked name as such, this book
uses the names only in an editorial fashion and to the benefit of the trademark
owner with no intention of infringement of the trademark.</blockquote>
</body>
</html>

4. PREFORMATTED TEXT
Preformatted Text (pre) digunakan untuk menampilkan teks sama seperti yang
Anda ketikkan dalam dokumen html. Browser akan menampikan teks tersebut
dalam font monospaced, yaitu seperti terlihat dalam teks yang tampilkan oleh
aplikasi berbasis teks (misalnya telnet).

Halaman | 111
 Contoh:
Ketiklah dan simpan dengan nama file performatted.html

<html>
<head>
<title>Preformatted Text</title>
</head>
<body>
<pre>All rights reserved. No part of this book may be reproduced,<br> stored in a
retrieval system or transmitted in any form or <br>by any means, without the prior
written permission of the<br> publisher,
except in the case of brief quotations<br> embedded in critical articles or reviews.
</pre>
</body>
</html>

5. BEGIN ROW
Tag ini digunakan untuk menulis teks pada baris berikutnya. Tag <br> membuat
baris baru tanpa memberi baris kosong di bawahnya.
Contoh:
Ketiklah dan simpan dengan
nama file beginrow.html
<html>
<head>
<title>Begin Row</title>
</head>

Halaman | 112
 <body>
<p>Software-software yang dibutuhkan yaitu:
<br> Adobe Photoshop
<br> Adobe Dreamwaever
<br> Adobe Flash
</body>
</html>

6. UKURAN FONT
Untuk mengatur huruf dokumen html digunakan tag <font size>. Tag <font size>
memiliki beberapa atribut untuk mengatur ukuran huruf yang akan digunakan.
Contoh:
Ketiklah dan simpan dengan nama file font_size.html
<html>
<head>
<title>Ukuran font</title>
</head>
<body>
<font size=1>Ukuran font
1</font><br>
<font size=2>Ukuran font
2</font><br>
<font size=3>Ukuran font 3</font><br>
<font size=4>Ukuran font 4</font><br>
<font size=5>Ukuran font 5</font><br>
<font size=6>Ukuran font 6</font><br>
<font size=7>Ukuran font 7</font>
</body>
</html>

Halaman | 113
7. JENIS FONT
Atribut face digunakan untuk mengatur jenis huruf yang diinginkan. Atribut face
harus diisi dengan string jenis font seperti Arial, Times New
Roman,Verdana, dan sebagainya.
Contoh:
Ketiklah dan simpan dengan nama file font_face.html
<html>
<head>
<title>Jenis Font</title>
</head>
<body>
<font size=5>
<font face ="Comic Sans MS">Comic Sans MS ---
ABCdef123</font><P>
<font face ="Small Fonts">Small Fonts --- ABCdef123</font><P>
<font face ="Symbol">Symbol --- ABCdef123</font><P>
<font face ="WingDings">WingDings --- ABCdef123</font><P></font>
</body>
</html>

Halaman | 114
8. MANIPULASI TEKS
Untuk memberi efek, dekorasi atau pun manipulasi teks pada html diantaranya
adalah menebalkan, tulisan miring(italic),
memberi coretan dan lain‐lainnya
Contoh :
Ketik dan simpan dengan nama file Manipulasi
teks.html
<html>
<head>
<title>Manipulasi Teks</title>
</head>
<body>
<! PSYSICAL STYLE>
<B>Tebal</B> <br> <! untuk menebalkan teks >
<I>Miring</I> <br> <! untuk membuat teks terlihat miring>
<U>Garis Bawah</U> <br> <! untuk menggarisbawahi teks>
<S>Tercoret</S> <br> <! untuk memberikan coretan pada teks>
<STRIKE>Tercoret juga</STRIKE> <br> <! untuk memberi coretan pada teks >
font
<BLINK> Berkedip</BLINK> <br> <! untuk membuat teks berkedip >
<TT>Seperti mesin tik</TT> <br> <! untuk menampilkan teks dalam typewriter >
<BIG>Tulisan Besar</BIG> <br> <! untuk membesarkan teks >
<SMALL>Tulisan Kecil</SMALL> <br> <! untuk mengecilkan teks > Teks
<SUB>subcript</SUB> <br> <! untuk membuat teks subscript>
Teks <SUP>supercript</SUP><br><br> <! untuk membuat
teks
superscript>
</body>
</html>

Halaman | 115
9. WARNA FONT
Atribut color digunakan untuk mengatur warna font yang akan digunakan. Untuk
memberi nilai pada atribut color, ada dua cara. Cara pertama dengan menuliskan
nama warna seperti Red, Blue, Yellow, White, dll. Sedangkan cara kedua
adalah dengan menggunakan nilai RGB (Red Green Blue) dari suatu warna,
misalnya FF0000 untuk Red, 00FF00 untuk green, dan 0000FF untuk Blue.
Contoh:
Ketiklah dan simpan dengan nama file warna_font.html
<html>
<head>
<title>Warna Font</title>
</head>
<body>
<font size=5>
<font color="red">Warna merah... </font> <p>
<font color= "#FF0000" size="5">Yang ini warna merah </font>
<p>
<font color= "#00FF00" size="5">Kalo yang ini hijau </font>
<p>
</font>
</body>
</html>

Halaman | 116
C. Membuat Table, Tag Gambar, Link & Frame di HTML
1. Table
Dalam menampilkan data yang terstruktur atau tampilan dari database, kita biasanya
akan membuatnya dalam bentuk tabel. HTML juga menyediakan Tabel tag
digunakan untuk menampilkan data dalam bentuk tabel. Dalam tutorial belajar
HTML cara membuat tabel HTMLini kita akan membahas cara penggunaannya.
Untuk membuat tabel di HTML, kita membutuhkan setidaknya 3 tag, yaitu
tag <tabel>, tag <tr>, dan tag <td> :
 Tag <tabel> digunakan untuk memulai tabel
 Tag <tr> adalah singkatan dari table row, digunakan untuk membuat baris dari
tabel.
 Tag <td> adalah singkatan dari table data, digunakan untuk menginput data ke
tabel. Agar lebih jelas, kita akan langsung menggunakan contoh kode HTML,
ketik Sintaks dibawah ini dan simpan dengan nama file : tabel_1baris.html

<html>
<head>
<title>Tabel 1 Baris</title>
</head>
<body>
<table width="200" border="1" cellspacing="0" cellpadding="0"><!mengawali
membuat tabel>
<tr><! mengawali membuat baris>
<td>1 baris </td> <! Membuat 1 baris dan 1 kolom>
</tr> <! Mengakhiri baris pertama>
</table> <! Mengakhiri membuat tabel>
</body>
</html>

Keterangan : Lebar tabel=200 ; jumlah baris =1 ; jumlah kolom=1

Simpan dengan nama file : tabel_2baris.html

Halaman | 117
<html>
<head>
<title>Tabel 2 Baris</title>
</head>
<body>
<table width="200" border="1" cellspacing="0" cellpadding="0">
<tr>
<td> baris ke 1 </td>
</tr>
<tr>
<td>baris ke 2 </td>
</tr>
</table>
</body>
</html>
Keterangan : Lebar “width” tabel=200 ; jumlah baris =2 ; jumlah kolom=1

LATIHAN
Buatlah file html dengan hasil seperti di bawah ini dan simpan dengan nama :
(nama_siswa)_Latihan.html
Keterangan :
‐ Warna background : #66FFCC
‐ Cellpadding="2"
‐ Border=”1”
‐ Lebar tabel : 300

Untuk selanjutnya kita akan membuat dua kolom. Simpan dengan nama file :
tabel_2kolom.html
<html>
<head>
<title>Tabel 2
Kolom</title>
</head>

Halaman | 118
<body>
<table width="300" border="1" cellspacing="0" cellpadding="0">
<tr>
<td> Kolom 1 </td>
<td>Kolom 2 </td>
</tr>
</table>
</body>
</html>
Keterangan : Lebar tabel=300 ; jumlah baris =1 ; jumlah kolom=2

Kita akan membuat 2 baris dan 2 kolom.

Ketik file html di bawah ini dan simpan dengan nama file : tabel_2baris_2kolom.html
<html>
<head>
<title>Tabel 2 Baris 2 Kolom</title>
</head>
<body>
<table width="300" border="1" cellspacing="0" cellpadding="0">
<tr>
<td> Kolom 1 , Baris 1 </td>
<td>Kolom 2, Baris 1 </td>
</tr>
<tr>
<td>Kolom 1 , Baris 2 </td>
<td>Kolom 2, Baris 2 </td>
</tr>
</table>
</body>
</html>
Keterangan : Lebar tabel=300 ; jumlah baris =2 ; jumlah kolom=2

Halaman | 119
Colspan : menggabungkan beberapa kolom
<head>
<title>warna-warna</title>
</head>
<body>
<table width="300" border="1">
<tr>
<td colspan="3" align="center">warna-warna </td>
</tr>
<tr>
<td bgcolor="#00FF00">Hijau</td>
<td bgcolor="#FFFF00">Kuning</td>
<td bgcolor="#FF0000">Merah </td>
</tr>
<tr>
<td bgcolor="#999999">Abu-abu</td>
<td bgcolor="#0000FF">Biru</td>
<td bgcolor="#FF9900">Orange</td>
</tr>
<tr>
<td bgcolor="#663300">Cokelat</td>
<td bgcolor="#3399CC">Biru muda</td>
<td bgcolor="#FF00FF">Merah muda</td>
</tr>
</table>
</body>
</html>

Halaman | 120
Rowspan : menggabungkan beberapa baris
<html>
<head>
<title>warna-warna</title>
</head>
<body>
<table width="300" border="1">
<tr>
<td align="center" bgcolor="#0000FF">Biru</td>
<td rowspan="4" align="center">warna-warna</td>
<td align="center" bgcolor="#00CCFF">Biru muda</td>
</tr>
<tr>
<td bgcolor="#00FF00">Hijau</td>
<td bgcolor="#FF0000">Merah </td>
</tr>
<tr>
<td bgcolor="#999999">Abu-abu</td>
<td bgcolor="#FF9900">Orange</td>
</tr>
<tr>
<td bgcolor="#663300">Cokelat</td>
<td bgcolor="#FF00FF">Merah muda</td>
</tr>
</table>
</body>
</html>

Halaman | 121
LATIHAN
Buatlah file html dengan hasil seperti di bawah ini dan simpan dengan nama :
(nama_siswa)_Latihan7.4.html
Keterangan :
‐ Title : Latihan 06
‐ Warna background : # 00FFCC
‐ Cellpadding="2"
‐ Cellspacing=”2”
‐ Border=”2”
‐ Lebar tabel : 600

2. TAG GAMBAR
Pada bab ini kita akan mempelajari cara menambahkan gambar di HTML. Kita
akan mempelajari cara penggunaan tag image. Tag Image digunakan untuk
menampilkan gambar kedalam halaman web, menggunakan <img>.

a. Atribut src dalam tag <img>

Atribut src adalah singkatan dari source, merupakan atribut yang berisi alamat dari
gambar yang akan ditampilkan. Alamat ini bisa relatif atau absolute. (perbedaan
tentang alamat relatif dan alamat absolute telah kita bahas pada Belajar HTML:
Cara Membuat link di HTML).
Untuk contoh kode HTML tentang image ini, sediakan sebuah gambar yang akan
digunakan sebagai tampilan, dan tempatkan gambar tersebut ke dalam satu folder
dengan halaman contoh. Gambar dapat berupa JPEG, PNG, maupun GIF.
Pada contoh dibawah ini saya menggunakan sebuah gambar koala.jpg yang berada
dalam satu folder dengan halaman HTML saat ini. Save lah sebagai img.html

Halaman | 122
Contoh penggunaan tag <img>:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Image</title>
</head>
<body>
<h1>Belajar Tag Gambar</h1>
<img src="koala.jpg" />
</body>
</html>

Perhatikan bahwa tag <img> tidak

memiliki elemen, sehingga langsung
ditutup dengan />

b. Atribut alt dalam tag <img>

Tag image juga memiliki atribut penting lainnya, yaitu alt Atribut alt
adalah singkatan dari alternative description, dimana alt digunakan untuk
keterangan dari gambar jika gambar tersebut gagal ditampilkan oleh browser.
Atau jika web broser telah disetting untuk tidak menampilkan gambar.
Contoh penggunaan atribut alt pada tag <img>:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Image</title>
</head>
<body>
<h1>Belajar Tag Gambar</h1>
<img alt="gambar koala" src="koala.jpg"/>
</body>
</html>

Halaman | 123
c. Atribut width dan height dalam tag <img>
Atribut lainnya membolehkan kita untuk menentukan besar dari gambar yang
ditampilkan, yaituwidth dan height.
Contoh penggunaan atribut width dan height pada tag <img>:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Tag Image</title>
</head>
<body>
<h1>Belajar Tag Gambar</h1>
<img alt="Gambar Koala" src="koala.jpg" height="200" width="100" />
</body>
</html>
Pada penggunaan tag image diatas, gambar terlihat tidak proporsional, hal ini
karena penggunaan atribut width dan height „memaksa„ gambar untuk tampil
dengan nilai yang kita tetapkan.
Untuk mempertahankan proporsi gambar, namun tetap membuat gambar menjadi
besar/kecil, cantumkan hanya salah satu atribut saja (width saja atau height saja,
namun tidak keduanya). Misalkan jika kita menetapkan atribut width=300px
(tanpa mencantumkan height), maka web browser akan menampilkan gambar
dengan lebar 300px, dan menghitung secara otomatis tinggi gambar agar gambar
tetap proporsional.
Pada penggunaan tag image diatas, gambar terlihat tidak proporsional, hal ini
karena penggunaan atribut width dan height „memaksa„ gambar untuk tampil
dengan nilai yang kita tetapkan.

Halaman | 124
 Untuk mempertahankan proporsi gambar, namun tetap membuat gambar menjadi
besar/kecil, cantumkan hanya salah satu atribut saja (width saja atau height saja,
namun tidak keduanya). Misalkan jika kita menetapkan atribut width=300px
(tanpa mencantumkan height), maka web browser akan menampilkan gambar
dengan lebar 300px, dan menghitung secara otomatis tinggi gambar agar gambar
tetap proporsional

3. LINK
Perintah anchor <a> digunakan untuk membuat suatu link. Untuk membuat link
ke dokumen html lain digunakan perintah <a href = “nama_dokumen”>Teks pada
browser</a>.
Anda juga bisa membuat link dalam sebuah dokumen html. Untuk itu perlu
dipersiapkan nama anchor lokasi tujuan dari link tersebut. Nama anchor dibuat
dengan menambahkan atribut name pada tag <a>. Misalnya <a name =
“Bugs”</a>. Cara melakukan link ke bagian tersebut adalah <a href
=“#nama_anchor”>teks pada browser</a>.
Contoh:
Ketiklah dan simpan dengan nama file contohlink.html
<html>
<head>
<title>Link</title>
</head>
<body>
<a name="lengkap">Pemain-pemain
AC Milan menurut abjad</a>
<blockquote>
<p>Abbiati ,<a href="#abbiati">info
lengkap</a></p>
<p>Ayala</p>
<p>Ambrosini</p>
<p>Albertini</p>
<p>Boban</p>
<p><a href="linktujuan.html">kalo mau tahu lagi klik disini</a></p>

Halaman | 125
 </blockquote>
<p><a name="abbiati">Abbiati</a></p>
<blockquote>
<p>
Kiper ketiga timnas Italia runner up Euro 2000<br> Kiper utama U-21 juara
Piala Eropa U-21 <br>
Kiper utama AC Milan juara Seri-A 1998-1999
</p>
</blockquote>
<p><a href="#lengkap">kembali ke atas</a></p>
</body>
</html>

Ketiklah simpan dengan nama file linktujuan.html

<html>
<head>
<title>Link tujuan</title>
</head>
<body>
<p align=”center”> Maaf, hanya sedikit</p>
<br>Chamot
<br>Dida
<br>Shevchenko
<br><a href=”contohlink.html”>kembali</a>
</body>
</html>

LATIHAN
Buatlah file html yang hasilnya seperti di bawah ini ! Simpan dengan nama file :
hal01.html, hal02.html, hal03.html dan simpan semua file dalam folder dengan
nama (nama_siswa)_latihan_link

Halaman | 126
Pada tulisan Halaman 1 di link ke hal01.html, Halaman 2 di link ke hal02.html,
Halaman 3 di link ke hal03.html.

4. FRAME
Frame digunakan untuk menampilkan halaman didalam sebuah halaman website.
Jadi, frame mampu menampilkan sebuah halaman website didalam halaman
HTML yang kita buat.,

ketiklah file html di bawah ini dan simpan dengan nama : menu01.html
<html>
<head>
</head>
<body bgcolor="#CCFF00"> Menu 01 <br>
<img src="apple.jpg" width="300" height="188">
</body>
</html>

Ketiklah file html di bawah ini dan simpan dengan nama : menu02.html
<html>
<head>
</head>
<body bgcolor="#CCFF00"> Menu 02<br>
<img src="batman.png" width="1024" height="768">
</body>
</html>

Halaman | 127
Ketiklah file html di bawah ini dan simpan dengan nama : menu03.html
<html>
<head>
<title>Isi Menu Tiga</title>
</head>
<body bgcolor="#CCFF00"> Menu 03<br>
<img src="pic.jpg" width="622" height="168">
</body>
</html>

Ketiklah file html di bawah ini dan simpan dengan nama : daftarmenu.html
<html>
<head>
</head>
<body bgcolor="#CCFF00">
<p><a href="menu01.html" target="mainFrame">Menu 1</a></p>
<p><a href="menu02.html" target="mainFrame">Menu 2</a></p>
<p><a href="menu03.html" target="mainFrame">Menu 3</a></p>
</body>
</html>

Ketiklah file html di bawah ini dan simpan dengan nama : frameset.html
<html>
<head>
<title>Frameset</title>
</head>
<frameset cols="80,*" frameborder="NO" border="0" framespacing="0">
<frame src="daftarmenu.html" name="leftFrame" scrolling="NO" noresize>
<frame src="menu01.html" name="mainFrame">
</frameset>
<noframes><body>
</body></noframes>
</html>

Halaman | 128
 Hasil dari frame tersebut adalah sbb:

LATIHAN
Buatlah Frameset yang terdiri dari 3 menu atau lebih. Jenis isi setiap menunya
dapat berisi apa saja. Simpan dalam satu folder dengan nama
(nama_siswa)_Latihan_frame

5. FORM
Form biasanya digunakan untuk mengumpulkan data dari pengunjung web kita.
Mulai dari form untuk login, form kontak, form untuk pendaftaran user, bahkan
untuk mengirimkan data antar halaman web. Pada tutorial belajar HTML: cara
membuat form di HTML ini kita akan membahas cara penggunakan tag form di
dalam HTML.
Penggunaan form hanya menggunakan HTML saja tidak akan terlalu berguna.
Form biasanya hanya berupa interface yang disediakan untuk mengumpulkan data
dari user, dan akan diproses dengan bahasa pemograman web seperti JavaScript
atau PHP, dan disimpan di dalam tabel MySQL.
Tag dasar yang akan kita gunakan untuk membuat form di HTML adalah tag form,
input, textarea, select dan option.

a. Pengertian tag <form>

Sebuah form dalam HTML harus berada di dalam tag form, yang diawali dengan
<form> dan diakhiri dengan </form>. Tag form akan membutuhkan beberapa
atribut untuk dapat berfungsi dengan seharusnya.

Halaman | 129
Atribut pertama adalah action, yang berfungsi untuk menjelaskan kemana data
form akan dikirimkan. Biasanya nilai dari atribut action ini adalah alamat dari
sebuah halaman PHP yang digunakan untuk memproses isi data form.
Atribut kedua adalah method, yang berfungsi untuk menjelaskan bagaimana data
isian form akan dikirim oleh web browser. Nilai dari atribut method ini bisa berupa
get atau post.
Perbedaan method get dan method post adalah, jika kita mengisi atribut method
dengan get (dimana ini adalah nilai default seandainya atribut method tidak ditulis)
maka isian form akan terlihat pada url browser. Method get ini biasanya
digunakan untuk query pencarian. Method postbiasanya digunakan untuk data
yang lebih sensitif seperti yang berisi password, atau registrasi user. Data hasil
form tidak akan terlihat pada browser.
Struktur dasar form akan terlihat sebagai berikut:
<form action="prosesdata.php" method="post">
...isi form...
</form>

b. Mengenal tag <input>

Tag input merupakan tag paling banyak digunakan di dalam form dan memiliki
banyak bentuk, mulai dari isian text biasa, text password, checkbox, radio, sampai
dengan tombol submit, semuanya dalam bentuk tag <input>.
Bentuk-bentuk dari keluarga tag input ini dibedakan berdasarkan atribut type:
 <input type=”text” /> atau bisa juga <input /> adalah textbox inputan biasa
yang menerima input berupa text, contohnya digunakan untuk inputan nama,
username, dan inputan yang berupa text pendek. Input type text ini juga
bisa memiliki atribut value yang bisa diisi nilai tampilan awal dari text
 <input type=”password” /> dalam tampilannya sama dengan type text, namun
teks yang diinput tidak akan terlihat, akan berupa bintang atau bulatan.
Biasanya hanya digunakan untuk inputan yang sensitif seperti password.
 <input type=”checkbox” /> adalah inputan berupa checkbox yang dapat
diceklist atau di centang oleh user. User dapat memilih atau tidak memilih
checkbox ini. Type checkboxmemiliki atribut checked yang jika ditulis atau
diisi dengan nilai checked, akan membuat chexkbox langsung terpilih pada

Halaman | 130
 saat pertama kali halaman ditampilkan. Contoh inputancheckbox berupa
hobi, yang oleh user dapat dipilih beberapa hobi.
 <input type=”radio” /> mirip dengan checkbox, namun user hanya bisa
memilih satu diantara pilihan group radio. Type radio ini berada dalam suatu
grup dan user hanya bisa memilih salah satunya. Contoh inputan type radio
adalah jenis kelamin.
 <input type=”submit” /> akan menampilkan tombol untuk memproses
form.
Biasanya diletakkan pada baris terakhir dari form. Atribut value jika diisi
akan membuat text tombol submit berubah sesuai inputan nilai value.

c. Mengenal tag <textarea>

Tag textarea pada dasarnya sama dengan input type text, namun lebih besar dan
dapat berisi banyak baris. Panjang dan banyak baris untuk text area di atur
melalui atribut rows dan cols, atau melalui CSS.
Contoh penggunaan textarea adalah sebagai berikut:
<textarea rows="5" cols="20">
Text yang diisi dapat mencapai banyak baris
</textarea>
Elemen yang berada diantara tag textarea akan ditampilkan sebagai text awal dari
form.

d. Mengenal tag <select>

Tag select digunakan untuk inputan yang telah tersedia nilainya, dan user hanya
dapat memilih dari nilai yang ada. Tag select digunakan bersama-sama dengan
tag option untuk membuat box pilihan.
Contoh penggunaan tag select adalah sebagai berikut:
<select>
<option>Pilihan 1</option>
<option>Pilihan 2</option>
<option value="pilihan ketiga">Pilihan 3</option>
</select>

Halaman | 131
Ketika form dikirim untuk diproses, nilai dari tag <option> akan dikirimkan. Nilai
ini adalah berupa text diantara tag option, kecuali jika kita memberikan
atribut value. Jika atribut value berisi nilai, maka nilai value-lah yang akan
dikirim. Ada atau tidaknya atribut value ini tidak akan tampak dalam tampilan
form.
Tag select memiliki atribut selected yang dapat ditambahkan agar tag select berisi
nilai awal. Contoh penggunaanya adalah sebagai berikut:
<select>
<option>Pilihan 1</option>
<option>Pilihan 2</option>
<option value="pilihan ketiga" selected>Pilihan 3</option>
</select>

e. Mengenal Atribut: Name

Setiap tag inputan di dalam form harus ditambahkan atribut name agar dapat
diproses oleh web server nantinya. Di dalam halaman proses (yang biasanya
berupa bahasa PHP atau ASP), nilai dari atribut name inilah yang akan menjadi
variabel form. Contoh pemakaiannya adalah sebagai berikut:
<input type="text" name="username">
<input type="text" name="email">

Kedua input diatas akan tampak sama persis, namun pada saat pemrosesan data,
masing- masing akan dibedakan menurut atribut name.
Merangkum seluruh tag form HTML yang telah kita bahas diatas, maka saatnya
untuk membuat sebuah form HTML. Silahkan buka text editor, dan tuliskan kode
HTML berikut, lalu save sebagaiformulir.html
Contoh penggunaan tag form, ketiklah file html di bawah ini dan simpan dengan
nama : form.html

Halaman | 132
<html>
<head>
<title>Formulir</title>
</head>
<body>
<form action="#" method="get">
<h3>Formulir Biodata</h3>
<table width="400" border="1" cellpadding="0" cellspacing="2"
bordercolor="#666666">
<tr>
<td width="100">Nama</td>
<td><input type="text" name="textfield"></td>
</tr>
<tr>
<td>Alamat</td>
<td><textarea name="textarea"></textarea></td>
</tr>
<tr>
<td>Tempat</td>
<td><input type="text" name="textfield2"></td>
</tr>
<tr>
<td>Tanggal Lahir </td>
<td><select name="select">

<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>

Halaman | 133
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>

<select name="select2">
<option value="1">Januari</option>
<option value="2">Februari</option>
<option value="3">Maret</option>
<option value="4">April</option>
<option value="5">Mei</option>
<option value="6">Juni</option>
<option value="7">Juli</option>

Halaman | 134
<option value="8">Agustus</option>
<option value="9">September</option>
<option value="10">Oktober</option>
<option value="11">Nopember</option>
<option value="12">Desember</option>
</select>

<select name="select3">
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
</select></td>
</tr>
<tr>

<td>Jenis Kelamin </td>

<td><input name="radiobutton" type="radio" value="radiobutton"> Pria
<input name="radiobutton" type="radio" value="radiobutton"> Wanita</td>
</tr>
<tr>
<td>Hobi</td>
<td><input type="checkbox" name="checkbox" value="checkbox"> Olah raga
</td>
</tr>
<tr>
<td>&nbsp;</td>

Halaman | 135
<td><input type="checkbox" name="checkbox2" value="checkbox"> Baca Buku
</td>
</tr>
<tr>

<td>&nbsp;</td>
<td><input type="checkbox" name="checkbox3" value="checkbox">
Internetan</td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type="submit" name="Submit" value="Submit">
<input name="Reset" type="reset" id="Reset" value="Reset"></td>
</tr>
</table>
</form>
</body>
</html>

Halaman | 136
Halaman | 137
LATIHAN
Buatlah web pribadi sederhana dengan HTML…!

Halaman | 138