dream weaver

cinta adalah anugrah

1. Bukalah Adobe Dreamweaver CS4.
2. Pada menu awal, buatlah file HTML baru. Klik pada tombol HTML di bawah kolom Create New.
3. Desktop Dreamweaver akan segera terbuka. Klik tombol Split untuk bekerja dengan dua jendela sekaligus, Code dan Design.
4. Pada jendela Design, ketiklah tulisan untuk judul website dan semboyannya, misalnya sebagai berikut :
KURSUS KOMPUTER PRIVAT
Kursus Komputer Paling Bermutu di Kota Anda
HOME | PROFIL | LAYANAN | KONTAK
Selamat Datang di Website Kami
5. Sekarang kita ubah format tulisan judul menjadi Heading 1. Tempatkan kursor pada tulisan judul di jendela Design. Klik tombol HTML pada panel Properties. Gantilah Format-nya menjadi Heading 1.
6. Selanjutnya kita akan mengubah style pada tulisan judul tersebut. Kursor masih berada pada tulisan judul, klik tombol CSS pada panel Properties. Gantilah Font-nya menjadi Arial, Helvetica, sans-serif.
7. Pada kotak dialog New CSS Rule, gantilah Selector Type menjadi Tag. Selector Name akan berganti menjadi h1. Klik OK untuk mengakhiri.
8. Kembali ke tampilan sebelumya. Pada panel Properties, klik pada tombol Align Center.
9. Selanjutnya kita akan mengubah format tulisan tagline-nya. Tempatkan kursor pada tulisan baris kedua.
10. Klik tombol HTML pada panel Properties. Kemudian, gantilah Format-nya dengan Heading 3. Tulisan tersebut akan berukuran lebih besar dan tebal..
11. Untuk membuat tulisan rata tengah, klik pada tombol CSS pada panel Properties. Kemudian klik pada tombol Align Center.
12. Kotak dialog New CSS Rule segera terbuka. Gantilah Selector Type menjadi Tag. Selector Name akan berubah menjadi h3. Klik OK untuk mengakhiri.
13. Sekarang kita akan menambahkan garis horizontal sebagai pembatas bagi menu utama pada halaman ini. Tempatkan dan klik kursor pada posisi terakhir tulisan baris kedua, kemudian klik pada tombol Horizontal Rule pada panel Insert.
14. Lakukan hal yang sama untuk menambahkan garis horizontal di bawah menu utama. Tempatkan kursor pada posisi terakhir tulisan baris ketiga, kemudian klik pada tombol Horizontal Rule pada panel Insert.
Nah, pada contoh di atas kita telah berlatih membuat format Judul dan Tagline untuk digunakan sebagai judul halaman website. Pada latihan selanjutnya kita akan membuat hyperlink dan tulisan berjalan (marquee)
Membuat Hyperlink dan Tulisan Berjalan
Hyperlink adalah bagian paling penting dari website. Hyperlink menghubungkan satu halaman web dengan halaman lainnya. Sebuah website tentu tidak hanya berupa halaman tunggal semata, melainkan bisa terdiri atas beberapa sampai puluhan atau bahkan ratusan halaman. Masing-masing halaman pada website diberi hyperlink agar pengunjung dapat dengan mudah menemukan apa yang dicari. Dengan demikian, perencanaan struktur menu pada sebuah website menjadi hal yang sangat penting.
Hal lain yang biasanya ada dalam sebuah website adalah tulisan berjalan. Tulisan berjalan atau marquee dipergunakan untuk menyampaikan pesan khusus yang diperlihatkan dengan teks bergerak. Gerakan yang ditimbulkan oleh marquee akan menarik perhatian pengunjung website. Hal inilah yang menyebabkan marquee banyak dipakai oleh pemilik website untuk menuliskan pesan-pesan khusus tadi.
Kita lanjutkan latihan terakhir untuk menambahkan hyperlink sederhana dan tulisan berjalan pada halaman web yang sudah kita buat.
1. Pada jendela Design, sorotlah tulisan HOME yang akan kita jadikan hyperlink.
2. Pada panel Insert, klik tombol Hyperlink.
Kotak Dialog Hyperlink akan segera muncul memperlihatkan form Text yang sudah berisi tulisan HOME.
Form Link dapat kita isi dengan nama file. Khusus untuk hyperlink HOME bisa kita isi dengan file index.html. Cara lain adalah dengan klik pada ikon folder di sebelah kanan drop-down menu, lanjutkan dengan memilih file index.html.
Form Target untuk sementara bisa kita tinggalkan.
Klik OK untuk mengakhiri.
3. Nah, sekarang tulisan HOME sudah menjadi hyperlink yang dapat berlaku sebagai tombol menju ke halaman index.html.
Perhatikan bahwa tulisan HOME sekarang menjadi berwarna biru sebagai tanda bahwa tulisan tersebut telah aktif sebagai hyperlink.
4. Selanjutnya, kita dapat melakukan hal sama dengan langkah yang lebih sederhana untuk tulisan LAYANAN, GALLERY, dan KONTAK. Caranya adalah sebagai berikut :
Sorot tulisan LAYANAN, kemudian pada panel Properties isilah form Link secara manual, ketikkan layanan.html. Tekan ENTER.
File layanan.html belum ada karena belum kita buat, jangan khawatir karena kita akan membuat file ini nanti.