Anda di halaman 1dari 18

Modul PAT PKWU kelas XI MIPA/ IPS/ IBB

All About Website


Semester Genap Tahun Ajaran 2017/2018

“ALL ABOUT WEBSITE”

1. Apa Perbedaan Internet dengan Web?


http://belajar-sampai-mati.blogspot.com/2012/07/apa-perbedaan-internet-dengan-web.html
Sebenarnya, istilah ―internet‖ tidak sama dengan istilah ―web‖. Kedua istilah tersebut
mungkin sudah menjadi satu kesatuan yang sulit untuk dipisahkan, karena orang biasanya
beranggapan bahwa internet adalah web, atau sebaliknya.
Padahal, web dan internet dua hal yang berbeda. Internet adalah jaringan (fisik) yang
terkoneksi atau terhubung dengan jutaan komputer yang menggunakan protokol yang sama
untuk berbagi/mengirimkan informasi (TCP/IP). Dalam kenyataannya, internet adalah gabungan
dari jaringan-jaringan yang lebih kecil. Untuk layanan yang digunakan untuk mentrasfer file dari
suatu lokasi ke lokasi lain ini berupa FTP (File transfer protocol)
Sedangkan web, atau World Wide Web, adalah koleksi dokumen multimedia, atau
berbagai media, yang dimasukkan ke dalam jaringan internet dengan menggunakan protokol
HTTP. Kata kunci pembeda yang tepat untuk membedakan antara internet dan web adalah;
internet adalah hardware, sedang web adalah software.Sedang aplikasi yang didukung oleh
internet di antaranya e-mail, telnet, ftp, instant messanger, dan lain-lain.

2. Mesin pencari web


http://id.wikipedia.org/wiki/Mesin_pencari
Mesin pencari atau Search engine adalah program komputer yang dirancang untuk
melakukan pencarian atas berkas-berkas yang tersimpan dalam layanan www, ftp, publikasi milis,
ataupun news group dalam sebuah ataupun sejumlah komputer peladen dalam suatu jaringan.
Search engine merupakan perangkat pencari informasi dari dokumen-dokumen yang tersedia.
Hasil pencarian umumnya ditampilkan dalam bentuk daftar yang seringkali diurutkan menurut
tingkat akurasi ataupun rasio pengunjung atas suatu berkas yang disebut sebagai hits. Informasi
yang menjadi target pencarian bisa terdapat dalam berbagai macam jenis berkas seperti halaman
situs web, gambar, ataupun jenis-jenis berkas lainnya. Beberapa mesin pencari juga diketahui
melakukan pengumpulan informasi atas data yang tersimpan dalam suatu basisdata ataupun
direktori web.
Sebagian besar mesin pencari dijalankan oleh perusahaan swasta yang menggunakan
algoritma kepemilikan dan basisdata tertutup, di antaranya yang paling populer adalah Google
(MSN Search dan Yahoo!). Telah ada beberapa upaya menciptakan mesin pencari dengan sumber
terbuka (open source), contohnya adalah Htdig, Nutch, Egothor dan OpenFTS.[1]
Sejarah
Saat awal perkembangan internet, Tim Berners-Lee membuat sebuah situs web yang
berisikan daftar situs web yang ada di internet melalui peladen web CERN. Sejarah yang mencatat
sejak tahun 1992 masih ada hingga kini.[2] Dengan semakin banyaknya situs web yang aktif
membuat daftar ini tidak lagi memungkinkan untuk dikelola oleh manusia. Utilitas pencari yang
pertama kali digunakan untuk melakukan pencarian di internet adalah Archie yang berasal dari
kata "archive" tanpa menggunakan huruf "v".[3] Archie dibuat tahun 1990 oleh Alan Emtage, Bill
Heelan dan J. Peter Deutsch, saat itu adalah mahasiswa ilmu komputer Universitas McGill,
Amerika Serikat. Cara kerja program tersebut adalah mengunduh daftar direktori serta berkas
yang terdapat pada layanan ftp publik (anonim) kemudian memuatnya ke dalam basisdata yang
memungkinkan pencarian.
Mesin pencari lainnya seperti Aliweb, muncul di 1993 dan masih berjalan hingga saat
ini.Salah satu mesin pencari pertama yang sekarang berkembang menjadi usaha komersial yang
cukup besar adalah Lycos, yang dimulai di Carnegie Mellon University sebagai proyek riset pada
tahun 1994.
Segera setelah itu, banyak mesin pencari yang bermunculan dan bersaing memperebutkan
popularitas. Termasuk di antaranya adalah WebCrawler, Hotbot, Excite, Infoseek, Inktomi, dan
AltaVista. Masing-masing bersaing dengan menambahkan layakan-layanan tambahan seperti
yang dilakukan oleh Yahoo.
Tahun 2002 Yahoo! mengakuisisi Inktomi, setahun kemudian mengakuisisi AlltheWeb dan
Altavista kemudian meluncurkan mesin pencari sendiri yang didasarkan pada teknologi
gabungan dari mesin-mesin pencari yang telah diakuisisinya serta memberikan layanan yang
mengutamakan pencarian Web daripada layanan-layanan lainnya.
Di bulan desember 2003, Orase menerbitkan versi pertama dari teknologi pencari waktu-
riilnya.Mesin ini memiliki banyak fungsi baru dan tingkat unjuk kerja yang jauh lebih baik.
Mesin pencari juga dikenal sebagai target investasi internet yang terjadi pada akhir tahun
1990-an. Beberapa perusahaan mesin pencari yang masuk ke dalam pasar saham diketahui
mencatat keuntungan besar. Sebagian lagi sama sekali menonaktifkan layanan mesin pencari,
dan hanya memasarkannya pada edisi-edisi enterprise saja, contoh Northern Light sebelumnya
diketahui merupakan salah satu perintis layanan mesin pencari di internet.
Buku Osmar R. Zaïane From Resource Discovery to Knowledge Discovery on the Internet
menjelaskan secara rinci sejarah teknologi mesin pencari sebelum munculnya Google. Mesin-
mesin pencari lainnya mencakup a9.com, AlltheWeb, Ask Jeeves, Clusty, Gigablast, Teoma,
Wisenut, GoHook, Kartoo, dan Vivisimo.

Google
Google muncul pada akhir tahun 1997, dimana Google memasuki pasar yang telah diisi
oleh para pesaing lain dalam penyediaan layanan mesin pencari, seperti Yahoo, Altavista, HotBot,
Excite, InfoSeek dan Lycos, dimana perusahaan-perusahaan tersebut mengklaim sebagian
perusahaan yang bergerak dalam bidang layanan pencarian di internet. Hingga akhirnya Google
mampu menjadi sebagai penyedia mesin pencari yang cukup diperhitungkan di dunia.
Saat tingginya persaingan antar mesin pencari yang ada, namun mesin pencari lain tidak
mampu menghentikan kesuksesan Google. Setelah Yahoo mampu pada posisi puncak di sekitar
tahun 2000, Google mampu menerobos liga besar tersebut.sehingga Google dipandang sebagai
mesin pencari yang utama seperti yang kita ketahui pada hari ini.
Yahoo
Yahoo raja directori di internet, di samping para pengguna internet melihat DMOZ serta
LookSmart berusaha menurunkan nya dari posisi puncak tersebut.Akhir-akhir ini, telah tumbuh
secara cepat dalam ukurannya, mereka pun sudah memiliki harga sehingga mudah untuk
memasukinya, dengan demikian, mendapatkan sebuah daftar pada direktori Yahoo memang
memiliki nilai yang tinggi.
pada tahun 2001, mesin pencari Google berkembang besar. Keberhasilan ini didasarkan
pada bagian konsep dasar dari link popularity dan PageRank. Setiap halaman diurutkan
berdasarkan seberapa banyak situs yang terkait, dari sebuah premis bahwa situs yang diinginkan
pasti lebih banyak terhubung daripada yang lain. Rangking situs (The PageRank)dari sebuah link
halaman dan jumlah link dari halaman-halaman tersebut merupakan masukan bagi Rangking
situs yang bersangkutan. Hal ini memungkinkan bagi Google untuk mengurutkan hasilnya
berdasarkan seberapa banyak halaman situs yang menuju ke halaman yang ditemukannya. User
interface Google sangat disukai oleh pengguna, dan hal ini berkembang ke para pesaingnya.

Manfaat
mesin pencari merupakan tempat kebanyakan orang mencari sesuatu via internet. Menurut
survei hampir 90% pengguna internet memakai mesin pencari untuk mencari lokasi tertentu di
internet. dan di antara mesin pencari yang ada, google merupakan mesin pencari yang paling
banyak digunakan.
Sebagian besar pengguna mesin pencari tidak pernah melewatkan dua halaman pertama
dari mesin pencari.
Sebagian besar (hampir 70%) pengguna mesin pencari tidak pernah klik pada hasil
pencarian sponsor. Dengan demikian, hasil pencarian yang organik (secara alami) akan membuat
suatu website memperoleh posisi strategis dalam dunia internet.
Di negara-negara maju, porsi penjualan yang dilakukan melalui internet sudah hampir
mencapai 20% dari keseluruhan transaksi tahunan.
Sebuah informasi yang mudah di akses oleh semua orang baik dalam maupun luar negeri.
Memudahkan Masyarakat dalam mencari informasi di internet.

Cara kerja mesin pencari


Mesin pencari web bekerja dengan cara menyimpan informasi tentang banyak halaman
web, yang diambil langsung dari WWW. Halaman-halaman ini diambil dengan web crawler —
browser web otomatis yang mengikuti setiap pranala/link yang dilihatnya. Isi setiap halaman lalu
dianalisis untuk menentukan cara indeks-nya (misalnya, kata-kata diambil dari judul, subjudul,
atau field khusus yang disebut meta tag). Data tentang halaman web disimpan dalam sebuah
database indeks untuk digunakan dalam pencarian selanjutnya.Sebagian mesin pencari, seperti
Google, menyimpan seluruh atau sebagian halaman sumber (yang disebut cache) maupun
informasi tentang halaman web itu sendiri.
Selain halaman web, Mesin pencari juga menyimpan dan memberikan informasi hasil
pencarian berupa pranala yang merujuk pada file, seperti file audio, file video, gambar, foto dan
sebagainya, serta informasi tentang seseorang, suatu produk, layanan, dan informasi beragam
lainnya yang semakin terus berkembang sesuai dengan perkembangan teknologi informasi.
Ketika seseorang mengunjungi mesin pencari dan memasukkan query, biasanya dengan
memasukkan kata kunci, mesin mencari indeks dan memberikan daftar halaman web yang paling
sesuai dengan kriterianya, biasanya disertai ringkasan singkat mengenai judul dokumen dan
kadang-kadang sebagian teksnya.
Ada jenis mesin pencari lain: mesin pencari real-time, seperti Orase. Mesin seperti ini tidak
menggunakan indeks.Informasi yang diperlukan mesin tersebut hanya dikumpulkan jika ada
pencarian baru. Jika dibandingkan dengan sistem berbasis indeks yang digunakan mesin-mesin
seperti Google, sistem real-time ini unggul dalam beberapa hal: informasi selalu mutakhir,
(hampir) tak ada pranala mati, dan lebih sedikit sumber daya sistem yang diperlukan. (Google
menggunakan hampir 100.000 komputer, Orase hanya satu.) Tetapi, ada juga kelemahannya:
pencarian lebih lama rampungnya.
Manfaat mesin pencari bergantung pada relevansi hasil-hasil yang diberikannya. Meskipun
mungkin ada jutaan halaman web yang mengandung suatu kata atau frasa, sebagian halaman
mungkin lebih relevan, populer, atau autoritatif daripada yang lain. Kebanyakan mesin pencari
menggunakan berbagai metode untuk menentukan peringkat hasil pencarian agar mampu
memberikan hasil "terbaik" lebih dahulu.Cara mesin menentukan halaman mana yang paling
sesuai, dan urutan halaman-halaman itu diperlihatkan, sangat bervariasi.Metode-metode nya juga
berubah seiring waktu dengan berubahnya penggunaan internet dan berevolusinya teknik-teknik
baru.
Sebagian besar mesin pencari web adalah usaha komersial yang didukung pemasukan
iklan dan karenanya sebagian menjalankan praktik kontroversial, yaitu membolehkan pengiklan
membayar agar halaman mereka diberi peringkat lebih tinggi dalam hasil pencarian.

Pentingnya mesin pencari optimasi


Salah satu alasan yang menyebabkan diperlukan mesin pencari optimasi adalah karena
ada banyak World Wide Web Wanderer yang sudah ada, dan akan terus bertambah di setiap
bulannya.
Sebagai Contoh, seseorang mempunyai World Wide Web Wanderer untuk menjual produk
pertanian maka di Indonesia akan ada puluhan atau ratusan Website sejenis. Sementara itu, jika
ingin melihat segmen dunia maka akan lebih banyak lagi jumlahnya. Untuk itu, dengan
menempatkan posisi di tingkat ada dalam hasil pencarian maka akan membuat website
pengguna tersebut ibarat toko strategis yang terletak di tepi jalan besar. Dengan SEO yang bagus
maka kemungkinan website anda dikunjungi oleh orang lain akan lebih besar.
Dengan Kaidah SEO yang bagus, website menggunakan lebih jelas atau keluhan sehingga
akan lebih diperhatikan oleh mesin pencari. itulah inti dari SEO, yaitu untuk membuat website
anda diperhatikan oleh mesin pencari.

Proses Pencarian
Melakukan pencarian dokumen yang dimuat pada suatu situs bisa begitu mudah dan
kelihatannya mungkin sulit juga.apalagi mengignat begitu menyebarnya informasi dimana-mana,
bahkan University of Calofornia menyebutkan saat ini telah terdapat lebih dari 50 milyar halaman
web di internet, meskipun tidak ada ada satupun yang benar-benar tahu jumlah persisnya.
kesulitan yang mungkin terjadi adalah karena WWW tersebut tidak terdata dalam bentuk
yang terstandardisasi isinya. tidak sama halnya dengan katalog yang ada di perpustakaan, yang
memiliki standardisasi secara mendunia berdasarkan subjek dari judul buku, meskipun jumlahnya
juga tidak sedikit.
Dalam pencarian di web, pengguna selalu memperkirakan kata apa yang di kira-kira
terdapat pada halaman yang ingin anda temukan. atau kira-kira apa subjek yang dipilih oleh
seseorang untuk mengelolah halaman situs yang mereka kelola, topik apa saja kira-kira yang di
bahas.
Jika pengguna melakukan apa yang dikenal dengan pencarian pada halaman web,
sebenarnya tidaklah melakukan pencarian. tidak mungkin melakukan pencarian di WWW secara
langsung.
Pada web benar-benar terdiri dari banyak sekali halaman web yang ingin disimpan dari
berbagai server diseluruh dunia. Komputer pengguna tidak langsung melakukan pencarian
kepada seluruh komputer tersebut secara langsung.
Apa yang mungkin pengguna lakukan hanyalah melalui komputer untuk mengakses satu
atau lebih perantara yang disebut dengan alat bantu pencarian yang ada saat ini. Melakukan
pencarian pada alat bantu itu tadi ke database yang dimiliki. data base tersebut mengkoleksi
situs-situs yang ditemukan dan simpan.
alat bantu pencarian ini menyediakan hasil pencarian dalam bentuk hypertext link dengan
URL (Uniform resource locator) menuju halaman lainnya. ketika anda klik link ini, dan menuju ke
alamat tersebut maka dokumen, gambar, suara dan banyak lagi bentuk lainnya yang ada pada
server tersebut disediakan, sesuai dengan informasi yang terdapat di dalamnya. layanan ini bisa
menjangkau ke manapun di seluruh dunia.
Tidak mungkin seseorang untuk melakukan pencarian ke seluruh komputer yang
terhubung internet ini, atau bahkan alat bantu pencarian yang mengklaim bahwa melakukannya,
tidak benar.

Kategori Alat Pencari


Saat ini, tiga bentuk dari alat bantu pencarian ini. Menggunakan strategi yang berbeda
untuk memanfaatkan kemampuan potensial dari masing-masing nya, yaitu

Mesin pencari dan mesin pencari-meta


Karakteristik:
a. Menyimpan data dalam bentuk teks penuh pada halaman yang terpilih,
b. Pencarian berdasarkan kata kunci, mereka mencoba mencocokkan dengan tepat kata kunci
tersebut dengan teks yang ada dalam dokumen,
c. Tidak perlu dilakukan browsing, dan tidak ada subjek dari kategori,
d. Database dijaring dan dikumpulkan oleh spidr, yaitu komputer yang memiliki program robot,
dengan kemampuan seminimal mungkin dari pandangan atau sentuhan manusia,
e. Ukuran search engine:dari skala kecil hingga mampu menyimpan sangat banyak (sekitar
hingga 20 milyar halaman web).
f. Meta-search engine dengan cepat melakukan pencarian ke dalam beberapa data base dari
berbagai search engine dalam satu kali permintaan. hasilnya adalah daftar yang hasilnya dan
penggabungan hasil pencarian dari beberapa mesin pencari yang mereka libatkan. Contoh :
Search engine: Google, Yahoo Search, Ask.com. Meta-Search : Dogpile, Copernic, dan
lainnya.
Subject Directories
Karakteristik :
a. Seleksi dari situs yang ada merupakan seleksi langsung yang dilakukan oleh manusia, kadang
kala para ahli untuk subjek tertentu,
b. Sering dengan hati-hati dievaluasi dan menjaga keterbaruan informasi yang mereka miliki,
namun tidak selalu, kadang-kadang tidak, terutama untuk mereka yang telah memiliki data
yang banyak dan bersifat general,
c. Biasanya dikelola dalam bentuk subjek dan direktori yang tersusun secara hirarki,
d. Sering dilengkapi dengan catatan mengenai deskripsinya ( tidak untuk Yahoo),
e. Subjek dapat di-browse subjek dan kategorinya atau melakukan pencarian berdasarkan kata-
kata tertentu,
f. Dokumen yang tidak penuh teks. pencarian diminta lebih spesifik dibandingkan dengan
pencarian melalui mesin pencari, karena kata kunci tidak bisa dibandingkan dengan isi dari
halaman suatu situs, melainkan hanya pada subjek, kategori-kategori, dan deskripsi.
g. Terdapat ribuan atau bahkan lebih subjek direktori dalam praktek dan kenyataannya apa saja
yang dipikirkan di sana.

Specialized Databade (Invisible Web)


Karakteristik :
a. Merupakan web yang menyediakan akses melalui suatu kotak pencarian ke dalam isi
database pada sebuah komputer di suatu tempat,
b. Dapat saja berubah berbagai topik, dapat pula juga hal yang komersial, pekerjaan yang
spesifik, pemerintahan, dll
c. Juga terdiri dari banyak halaman yang menghasilkan hasil pencarian dari katalog direktori
online.

Prinsip Umum Dari mesin pencari


Sistem kinerja mesin ini ada beberapa hal yang perlu di perhatikan terutama
keterkaitannya dengan masalah arsitekrut dan mekanismenya.

Spider
Merupakan program yang men-download halaman-halaman yang mereka temukan, mirip
dengan browser.Perbedannya adalah bahwa browser menapilkan secara langsung informasi yang
ada (baik tekas, gambar, dll).Untuk kepentingan manusia yang menggunakannya pada saat itu,
sedangkan spider tidak melakukan untuk menampilkan dalam bentuk yang terlihat seperti itu,
karena kepentingannya adalah untuk mesin, bukan untuk manusia, spider pun dijalankan oleh
mesin secara otomatis. Kepentingannya adalah untuk mengambil halaman-halaman yang
dikunjunginya untuk disimpan kedalam database yang dimiliki oleh search engine.

Crawler
Merupakan program yang dimiliki search engine untuk melacak dan menemukan link yang
terdapat dari setiap halaman yang ditemuinya. Tugasnya adalah untuk menentukan spoder harus
pergi kemana dan mengevaluasi link berdasarkan alamat yang ditentukan dari awal.Crawler
mengikuti link dan mencoba menemukan dokumen yang belum dikenal oleh search engine.
Indexer
Komponen ini melakukan aktifitas untuk menguraikan masing-masing halaman dan
meneliti berbagai unsur, seperti teks, headers, struktur atau fitur dari gaya penulisan, tag HTML
khusus, dll.

Database
Merupakan tempat standar untuk menyimpan data-data dari halaman yang telah
dikunjungi, di-download dan sudah dianalisis.kadang kala disebut juga dengan index dari suatu
search engine.

Result Engine
Mesin yang melakukan penggolongan dan penentuan peringkat dari hasil pencarian pada
search engine. Mesin ini menentukan halaman mana yang menemui kriteria terbaik dari hasil
pencarian berdasarkan permintaan penggunanya, dan bagaimana bentuk penampulan yang akan
ditampilkan.
Proses ini dilaksanakan berdasarkan algoritma perangkingan yang dimiliki oleh search
engine tersebut, mengikuti kaidah perangkingan hakaman yang dipergunakan oleh mereka
adalah hak mereka, para peneliti mempelajari sifat-sifat yang mereka gunakan, terutama untuk
meningkatkan pencarian yang dihasilkan oleh serach engine tersebut.

Web Server
Merupakan komponen yang melayani permintaan dan memberikan respon balik dari
permintaan tersebut. Web Server ini biasanya menghasilkan informasi atau dokumen dalam
format HTML. Pada halaman tersebut tersedia layanan untuk mengisikan kata kunci pencarian
yang diinginkan oleh usernya. Web Server ini juga bertanggung jawab dalam menyampaikan
hasil pencarian yang dikirimkan kepada komputer yang meminta informasi.

Web Hosting
merupakan Suatu program aplikasi yang digunakan untuk membuka suatu Web,
mengelola dan melakukan navigasi berbagai data dan informasi pada WWW, serta bisa berupa
tempat penyimpanan file,baik itu berupa tulisan,gambar,script dll.yang biasanya hosting itu
disewa dan jangka sewanya biasanya dihitung pertahun.
3. Perancangan web
Dari Wikipedia bahasa Indonesia, ensiklopedia bebas
http://id.wikipedia.org/wiki/Perancangan_web
Perancangan web (web design) adalah istilah umum yang digunakan untuk mencakup
bagaimana isi web konten ditampilkan, (biasanya berupa hypertext atau hypermedia) yang
dikirimkan ke pengguna akhir melalui World Wide Web, dengan menggunakan sebuah browse
web atau perangkat lunak berbasis web.Tujuan dari web design adalah untuk membuat
website—sekumpulan konten online termasuk dokumen dan aplikasi yang berada pada server
web / server.Sebuah website dapat berupa sekumpulan teks, gambar, suara dan konten lainnya,
serta dapat bersifat interaktif ataupun statis.

Konten
Elemen-elemen seperti teks, forms, images (GIFs, JPEGs, Portable Network Graphics) dan
video dapat diletakkan di dalam halaman menggunakan tag-tag HTML/XHTML/XML.Browser
terkadang juga memerlukan Plug-ins seperti Adobe Flash, QuickTime, Java, dan sebagainya untuk
menampilkan beberapa media yang diletakkan di dalam halaman web menggunakan tag-tag
HTML/XHTML.
Halaman web dan situs web dapat berupa halaman statis, atau dapat diprogram secara
dinamis sehingga menghasilkan halaman web dengan konten atau tampilan visual yang
diinginkan, tergantung pada berbagai faktor, seperti masukan dari pengguna akhir, masukan dari
Webmaster, atau perubahan dalam lingkungan komputasi (seperti situs yang terkait dengan
database yang telah diubah).
 Bahasa Markup (seperti HTML, XHTML dan XML)
 Gaya lembar bahasa (seperti CSS dan XSL)
 Client-side scripting (seperti JavaScript dan VBScript)
 Server-side scripting (seperti PHP dan ASP)
 Teknologi database (seperti MySQL dan PostgreSQL)
 Teknologi multimedia (seperti Flash dan Silverlight)

Operasi dasar Dreamweaver 8


http://sampangansemarang.wordpress.com/2010/03/03/bab-2-mengenal-dreamweaver-8/

Membuat dan Menyimpan Halaman Web


1. Buat file HTML baru dengan Dreamweaver, melalui menu File > New.
2. Pada layar utama ketikkan teks sebagai berikut :
buatlah suatu layout web sederhana dalam bentuk table, kemudian men-desain web dengan
mengisi bagian-bagian pada layout serta menambahkan banner & background warna/ gambar
apabila diperlukan.
3. Sekarang kita akan menyimpan file tersebut. Pilih menu File > Save As… atau File > Save dan
tentukan nama file dan lokasi penyimpanan file. Akhiran
(extension) file untuk halaman HTML dapat berupa .html atau .htm. Untuk
menyimpan, kita juga dapat menggunakan short-cut Ctrl+Shift+S untuk Save
As… dan Ctrl+S untuk Save.
4. Setelah dokumen HTML tersimpan, kita akan melihat hasilnya di sebuah web browser. Untuk
melihat hasilnya di web browser, pilih menu File > Preview in Browser dan pilih jenis browser
yang diinginkan. Menu ini juga dapat diakses melalui short-cut F12 untuk web browser utama
dan Ctrl+F12 untuk web browser kedua.
5. Halaman web yang dibuat akan ditampilkan di web browser. Mengatur Property Teks
6. Untuk mengatur property teks, seperti ukuran, warna, jenis dan sebagainya, kita dapat
melakukannya dengan cara memilih (block) terhadap teks yang akan diatur dan atur property
yang diinginkan di layar properties di bawah layar dokumen utama. Sebagai contoh jika kita
akan membuat teks pada baris pertama di atas menjadi huruf verdana, ukuran 12 pixel dan
warna biru, maka property yang harus diatur sebagai berikut:
7. Selanjutnya buatlah agar teks di baris kedua menjadi jenis arial, berwarna merah, ukuran 16px!
Teks di baris ketiga menjadi Georgia, berwarna hijau dan ukuran 14px! Tampilannya menjadi
seperti pada gambar berikut ini:
8. Aturlah teks pada baris pertama agar menjadi miring (italic) dengan menggunakan tombol I dan
aturlah teks kedua menjadi tebal (bold) dengan menggunakan tombol B yang ada di layar
properties.
9. Perataan teks dapat diatur secara rata kiri (left), tengah (center), kanan (right) atau kiri dan
kanan (justify). Gunakan tombol untuk mengatur perataan teks. Aturlah semua teks di atas
menjadi rata tengah! Tampilan halaman menjadi sebagai berikut:
Mengatur Property Halaman Property halaman meliputi pengaturan yang berhubungan dengan
halaman web, seperti judul halaman, background halaman, pengaturan teks dan link, margin
dan sebagainya. Untuk membuka window pengaturan halaman, klik tombol ―Page Properties…‖
10. Dari window page-properties, atur jenis huruf menjadi Verdana, ukuran 11 pixel dan warna
putih (#ffffff), atur juga background halaman menjadi warna biru (#0000ff)! Lihat gambar di
bawah ini!
11. Background halaman juga dapat berupa gambar (image). Untuk menambahkan gambar (image)
sebagai background halaman, dari window page-properties pilih Background image dan klik
tombol Browse… untuk memilih gambar yang akan dijadikan background.
12. Selanjutnya kita akan mengatur judul halaman menjadi ―Belajar Design Web dengan
Dreamweaver‖. Pada window page-properties, pilih kategori Title/Encoding dan ubah teks pada
isian Title menjadi Belajar Design Web dengan Dreamweaver.
https://lis.dickinson.edu/technology/Training/Tutorials/Web/dw8/dw8basic.pdf
Selain membuat dan menyimpan halaman web, dibawah ini juga dijelaskan beberapa
istilah dan operasi dasar dari proses desain web menggunakan Dreamweaver 8 antara lain:
a. Home Page : Halaman depan suatu situs
b. Compressed : memampatkan/ memperkecil file size. Proses ini harus dijalankan ketika kita ingin
berbagi file web dengan browser lain.
c. Pada tampilan lembar kerja program Dreamweaver :
i. Code : menampilkan posisi dimana kita dapat melihat bahasa program dari desain web
kita
ii. Split : menampilkan posisi dimana kita dapat melihat bahasa program dan desain website
dari desain web kita
iii. Design : menampilkan posisi dimana kita membuat desain website
d. Banner : Desain visual pada halaman website yang menjadi identitas khusus bagi situs web
tersebut
e. Home : Desain visual yang berisi daftar isi pada sebuah halaman web yang dimaksudkan
sebagai petunjuk informasi apa yang akan dilihat oleh audiens.
f. Profile : berisi desain visual awal pada halaman website dengan maksud untuk menjelaskan
kepada audiens, tentang data diri pembuat situs web tersebut.
g. Photo Gallery : desain visual yang berisi koleksi foto pemilik website tersebut.
h. About Us : berisi desain visual situs web yang menjelaskan kepada audiens tentang latar
belakang, siapa saja yang ikut terlibat, dan tujuan dalam pembuatan situs web tersebut.
i. Contact Us : Format tampilan yang berisi tentang nama, alamat, no telp, no fax, alamat
email, dll yang berhubungan dengan informasi yang dibutuhkan oleh audiens.
j. Operasi dasar :
i. Insert rows : menambah satu buah baris ditengah–tengah tabel menggunakan
ii. Split cells : menambahkan satu atau lebih baris atau kolom di tengah–tengah table.
iii. Merge cells : menggabungkan dua buah kolom satu baris, menjadi satu kolom satu baris
iv. Insert coulomns : menambah satu buah kolom di tengah – tengah table.
v. Cell properties : mewarnai baris atau kolom tertentu pada desain table.
vi. Pixels : Perhitungan berdasarkan jumlah titik cahaya yang merupakan unsur terkecil yang
ditayangkan pada layar monitor.
vii. Insert – Image – Select Image Source : proses setting untuk insert foto pada menu photo
gallery, agar foto kecil dapat di Hyperlink
viii. Right click – properties – bg – browse background source : proses setting untuk background
gambar/ foto pada menu photo gallery
k. Animasi Text Berjalan :
i. Behavior :
1. Alternate : pola animasi text yang bergerak bolak – balik di dalam halaman web pada
Program Dreamweaver.
2. Scroll : pola animasi text yang bergerak menembus halaman web mulai dari suatu sisi
halaman web ke sisi yang lain, kemudian muncul kembali dari sisi halaman yang lain
pada Program Dreamweaver.
3. Slide : pola animasi text yang bergerak mulai dari suatu sisi halaman web kemudian
berhenti di ujung halaman web pada Program Dreamweaver.
ii. Direction :
1. Down : arah gerak ke bawah
2. Left : arah gerak ke kiri
3. Right : arah gerak ke kanan
4. Up : arah gerak ke atas
iii. Scrollamount : perintah untuk mengatur kecepatan gerak text berjalan web pada Program
Dreamweaver
iv. Onmouseover=‖stop();‖ : Perintah yang digunakan untuk menghentikan teks berjalan,
ketika mouse diarahkan kedalam area teks tersebut.
v. Onmouseout=‖start();‖ : Perintah yang digunakan untuk menjalankan kembali teks yang berhenti,
ketika mouse diarahkan keluar area teks tersebut.
4. Web Design with Macromedia Dreamweaver
Oleh : Ria Hantoro
http://rhantoro.net/files/I%20-%20Web%20Design%20with%20Dreamweaver.pdf

A. Sejarah Internet
Internet merupakan jaringan komputer yang dibentuk oleh Departemen Pertahanan
Amerika Serikat di tahun 1969, melalui proyek ARPA yang disebut ARPANET (Advanced Research
ProjectAgencyNetwork), di mana mereka mendemonstrasikan bagaimana dengan hardware
dan software komputer yang berbasis UNIX, kita bisa melakukan komunikasi dalam jarak yang
tidak terhingga melalui saluran telepon. Proyek ARPANET merancang bentuk jaringan,
kehandalan, seberapa besar informasi dapat dipindahkan, dan akhirnya semua standar yang
mereka tentukan menjadi cikal bakal pembangunan protokol baru yang sekarang dikenal
sebagai TCP IP (Transmission Control Protocol/Internet Protocol).
Tujuan awal dibangunnya proyek itu adalah untuk keperluan militer. Pada saat itu
Departemen Pertahanan Amerika Serikat (US Department of Defense) membuat sistem jaringan
komputer yang tersebar dengan menghubungkan komputer di daerah-daerah vital untuk
mengatasi masalah bila terjadi serangan nuklir dan untuk menghindari terjadinya informasi
terpusat, yang apabila terjadi perang dapat mudah dihancurkan.
Pada mulanya ARPANET hanya menghubungkan 4 situs saja yaitu Stanford Research
Institute, University of California, Santa Barbara, University of Utah, di mana mereka
membentuk satu jaringan terpadu di tahun 1969, dan secara umum ARPANET diperkenalkan
pada bulan Oktober 1972. Tidak lama kemudian proyek ini berkembang pesat di seluruh
daerah, dan semua universitas di negara tersebut ingin bergabung, sehingga membuat
ARPANET kesulitan untuk mengaturnya. Oleh sebab itu ARPANET dipecah manjadi dua, yaitu
"MILNET" untuk keperluan militer dan "ARPANET" baru yang lebih kecil untuk keperluan non-
militer seperti, universitas-universitas. Gabungan kedua jaringan akhirnya dikenal dengan nama
DARPA Internet, yang kemudian disederhanakan menjadi Internet.
Source : wikipedia.com

B. World Wide Web


Jejaring Jagat 7embar (177") atau World Wide Web ("WWW", atau singkatnya
"Web") adalah suatu ruang informasi yang yang dipakai oleh pengenal global yang disebut
Uniform Resource Identifier (URI) untuk mengidentifikasi sumber-sumber daya yang berguna. JJJ
sering dianggap sama dengan Internet secara keseluruhan, walaupun sebenarnya is hanyalah
bagian daripadanya. Hiperteks dilihat dengan sebuah program bernama penjelajah web yang
mengambil informasi (disebut "dokumen" atau "halaman web") dari peladen web (server web)
dan menampilkannya, biasanya di sebuah tampilan komputer. Kita lalu dapat mengikuti pranala
di setiap halaman untuk pindah ke dokumen lain atau bahkan mengirim informasi kembali
kepada peladen untuk berinteraksi dengannya. IN disebut "surfing"atau "berselancar" dalam
bahasa Indonesia. Halaman web biasanya diatur dalam koleksi material yang berkaitan yang
disebut "situs web".
Source : wikipedia.com
C. Pendahuluan
Saat ini aktifitas membuat website sudah mulai menjadi tren baru yang banyak dipelajari
orang, menggeser aktifitasmembuat email beberapa waktu lalu. Apalagi saat ini sudah
banyak terdapat program aplikasi web editor yang memudahkan orang untuk membuat
website dengan cepat, mudah dan hasilnya pun sangat menarik dan interaktif. Salah satu
program aplikasi web editor tersebut adalah Dreamweaver, yang dalam sejarahnya dahulu
bernama Macromedia Dreamweaver karena sudah diakuisisi oleh perusahaan besar Adobe
maka sekarang dikenal Adobe Dreamweaver. Aplikasi Macromedia Dreamweaver sudah
dikenal banyak orang karena user akan lebih terbantu dalam membuat website karena telah
dilengkapi dengan berbagai macam kelengkapan sehingga waktu pembuatan juga dapat
menjadi lebih efektif dan efisien.

D. Mengenal Area Kerja Macromedia Dreamweaver 8


Pada Windows, Dreamweaver menyediakan semua-dalam-satu-jendela tata letak
terpadu. Dalam ruang kerja terpadu, semua jendela dan panel yang terintegrasi ke dalam satu
jendela aplikasi yang lebih besar
E. Dreamweaver workspace elements
Bagian ini secara ringkas menjelaskan beberapa unsur dari ruang kerja Dreamweaver. Note :
Dreamweaver menyediakan banyak panel lain, inspector, dan window. Untuk membuka panel
Dreamweaver, inspector, dan window, gunakan menu Window. Jika Anda tidak dapat menemukan
sebuah panel, inspector, atau window yang ditandai sebagai terbuka, pilih menu Window> Arrange
mengeluarkan semua panel terbuka.

The Start Page,


memungkinkan Anda untuk membuka dokumen baru atau membuat dokumen baru. Dari
The Start Page Anda juga dapat mempelajari lebih lanjut tentang Dreamweaver dengan mengambil
tur produk atau tutorial.

The Insert Bar


berisi tombol untuk memasukkan berbagai jenis "objects", seperti gambar, tabel, dan layer,
ke dalam dokumen. Setiap objek adalah potongan kode HTML yang
memungkinkan Anda untuk mengatur berbagai atribut seperti yang Anda memasukkannya.
Sebagai contoh, Anda dapat menyisipkan tabel dengan mengklik tombol Tabel dalam Insert bar.
Jika Anda suka, Anda dapat memasukkan objek menggunakan menu Insert sebagai
pengganti Insert bar.

The Dokumen Toolbar,


berisi tombol yang memberikan pilihan-pilihan untuk pandangan yang berbeda dari
Dokumen jendela (seperti Design view dan Code view), berbagai pilihan tampilan, dan beberapa
operasi umum seperti preview di browser.

The Standar Toolbar, (tidak ditampilkan dalam ruang kerja default layout)
berisi tombol untuk operasi umum dari menu File dan Edit: New, Buka, Simpan, Simpan
Semua, Cut, Copy, Paste, Undo dan Redo. Untuk menampilkan toolbar Standar, pilih View>
Toolbar> Standar. The Coding toolbar, (ditampilkan dalam tampilan Code hanya) berisi tombol-
tombol yang memungkinkan Anda melakukan banyak koding standar operasi.

Style Rendering toolbar, (tersembunyi secara default)


berisi tombol-tombol yang memungkinkan Anda melihat bagaimana desain Anda akan
terlihat dalam jenis media yang berbeda jika Anda menggunakan media-tergantung style sheet.
Itu jugs memuat sebuah tombol yang memungkinkan Anda mengaktifkan atau menonaktifkan
CSS style.

The Document window,


menampilkan jendela dokumen aktif ketika Anda telah membuat dan mengeditnya.

The Property inspector,


memungkinkan Anda melihat dan mengubah berbagai properti objek yang dipilih atau
teks. Setiap jenis objek memiliki sifat yang berbeda. Property inspector yang tidak diperluas secara
default dalam Coder workspace layout.
The Tag Selector,
di status bar di bagian bawah jendela Dokumen menunjukkan hierarki tag di sekitar
pilihan saat ini. Klik sembarang tag di hirarki untuk memilih bahwa tag dan semua isinya. Panel
Groups, ialah set panel berkaitan yang dikelompokkan bersama di bawah satu pos. Untuk
memperluas kelompok panel, klik panah expander di sebelah kiri nama grup, untuk kelompok
undock panel, tarik gripper di tepi kiri judul kelompok bar.

The File panel


yang memungkinkan Anda untuk mengelola file dan folder Anda, apakah mereka
merupakan bagian dari situs Dreamweaver atau di server jauh. Files panel juga memungkinkan
Anda untuk mengakses semua file pada disk lokal Anda, seperti halnya Windows Explorer
(Windows) atau Finder (Macintosh).

F. The Document Window


Jendela Dokumen menunjukkan dokumen saat ini. Anda dapat memilih salah satu
tampilan berikut:

Design View,

Adalah lingkungan desain tata letak halaman visual, visual mengedit, dan pengembangan
aplikasi cepat. Dalam pandangan ini, Dreamweaver menampilkan sepenuhnya dapat diedit,
visual dari dokumen, mirip dengan apa yang Anda akan melihat melihat halaman dalam
browser. Anda dapat mengkonfigurasi Design view untuk menampilkan konten dinamis saat
Anda sedang bekerja pada dokumen (lihat Melihat tinggal data dalam Design view).

Code View

Ialah tampilan layar putih berupa code-code untuk menulis dan mengedit HTML, JavaScript,
server-kode bahasa - seperti PHP atau ColdFusion Markup Language (CFML) - dan jenis lainnya
kode. Untuk informasi lebih lanjut, lihat Coding di Dreamweaver.

Code and Design View

memungkinkan Anda untuk melihat kedua Kode melihat dan Desain tampilan untuk
dokumen yang sama dalam satu jendela.

Ketika Document Window memiliki judul bar, bar judul menampilkan judul halaman dan,
dalam tanda kurung, file's path dan nama file. Setelah nama file, Dreamweaver menampilkan
bintang jika Anda telah membuat perubahan yang belum tersimpan.

Ketika sebuah Document Window dimaksimalkan, tab muncul di bagian atas jendela
Dokumen wilayah yang menunjukkan nama file dari semua dokumen yang terbuka. Untuk beralih ke
dokumen, klik tab.

G. The Document Toolbar

Show Code View


menampilkan hanya Code View pada Document Window.

Show Code and Design View


menampilkan tampilan Code dan Design View. Bila Anda memilih tampilan gabungan ini,
pilihan Design View pada Top menjadi tersedia dalam menu Pilihan View. Gunakan opsi ini untuk
menentukan pandangan mana muncul di bagian atas Document window anda.

Show Design View


hanya menampilkan Design View Design view di Document Window.

Server Debug
menampilkan laporan untuk membantu Anda debug halaman ColdFusion saat ini.
Laporan termasuk kesalahan, jika ada, di halaman Anda. Document Title memungkinkan Anda
untuk memasukkan judul untuk dokumen Anda, untuk ditampilkan dalam judul browser bar. Jika
dokumen Anda sudah memiliki judul, ini akan muncul dalam bidang ini.

No Browser / Check Errors


memungkinkan Anda untuk memeriksa kompatibilitas cross-browser.

Validate Markup
memungkinkan Anda memvalidasi dokumen aktif atau tag yang dipilih.
File Management
menampilkan File Manajemen pada menu pop-up.

Preview / Debug in Browser


memungkinkan anda untuk melihat atau debug dokumen Anda dalam browser. Pilih
browser dari menu pop-up.

Refresh Design View


merefresh dokumen's Design tampilan setelah Anda membuat perubahan dalam
tampilan Kode. Perubahan yang Anda buat dalam tampilan Kode tidak secara otomatis muncul
dalam Design view sampai Anda melakukan tindakan-tindakan tertentu, seperti menyimpan file
atau mengklik tombol ini.

View Options
memungkinkan anda untuk mengatur opsi untuk melihat dan Desain Kode pandangan,
termasuk pandangan mana harus muncul di atas yang lain. Pilihan dalam menu untuk tampilan
yang aktif: Desain tampilan, Kode tampilan, atau keduanya. Untuk informasi tentang pilihan
tampilan Kode, lihat Pengaturan preferensi coding. Untuk informasi tentang pandangan Desain
pilihan, lihat Memilih elemen dalam Dokumen jendela, Melihat dan
mengedit isi kepala, dan Menggunakan panduan visual di Dreamweaver.

Visual Aids
memungkinkan Anda menggunakan berbagai alat bantu visual untuk merancang
halaman Anda.

H. The Insert Bar

Insert bar
berisi tombol untuk membuat dan memasukkan objek seperti tabel, layer, dan gambar.
Ketika anda menggulung pointer di atas tombol, sebuah tooltip muncul dengan nama tombol.
Tombol tersebut akan disusun dalam beberapa kategori, yang Anda dapat beralih di sisi kiri
Insert bar. Kategori tambahan muncul ketika dokumen aktif berisi kode server, seperti ASP atau
CFML dokumen, PHP. Ketika Anda memulai Dreamweaver, kategori terakhir Anda
bekerja di terbuka.

The Common Category


memungkinkan Anda untuk membuat dan memasukkan benda yang paling sering
digunakan, seperti gambar dan tabel. The Layout Category yang memungkinkan Anda untuk
menyisipkan tabel, div tag, layer, dan frame. Anda dapat juga anda memilih di antara tiga dilihat
dari tabel: Standar (default), Tabel Expanded, dan Layout. Ketika modus Layout dipilih, Anda dapat
menggunakan alat tata letak Dreamweaver: Draw Layout Cell dan Draw Layout Table. The Forms
Category yang berisi tombol untuk membuat bentuk dan memasukkan elemen form. The Text
Category yang memungkinkan Anda untuk memasukkan berbagai teks-list-format dan tag,
seperti b, em, p, hi, dan ul. The HTML Category yang memungkinkan Anda untuk menyisipkan tag
HTML untuk

Selamat Belajar..
Semoga Bisa Mendapatkan Prestasi Terbaik Yang Membanggakan..

Anda mungkin juga menyukai