Tutorial membuat website dengan adobe dreamweaver cs6

Web editor digunakan untuk merancang tampilan atau interface dari website yang akan dibuat. Web editor akan mempermudah kita dalam proses pembuatan website, karena kita tidak perlu lagi menuliskan kode HTML secara manual. Kita cukup mengklik dan mengatur konfigurasi yang digunakan. Untuk langkah pertama dalam merancang tampilan web maka yang pertama kali yang harus d buat adalah tabel.

Karena tabel digunakan untuk kerangka dari web itu sendiri. Pertama silahkan buka Adobe Dreamweaver CS6. Kemudian pastikan tab yang aktif adalah Design dan pada bagian mode Designer diganti menjadi Classic. Tampilannya seperti di bawah ini. Caranya seperti gambar di bawah ini. Jika sudah, sekarang kita akan membuat tabel. Untuk itu kita klik tab Common lalu klik elemen Tabel. Lihat gambar di bawah. Kemudian akan tampil kotak dialog Table.

Lalu buat ketentuan tabel seperti gambar di bawah. Ketentuan tabel lebih jelas seperti di bawah ini. Jika sudah pada jendela dokumen akan tampak tabel yang telah dibuat, aturlah posisi tabel agar berada di tengah dengan mengatur Align : Center pada jendela Properties.

Sampai di sini kita telah membuat tabel pertama pada dokumen php. Tahap selanjutnya adalah membuat header website. Langkah-langkahnya sebagai berikut. Pertama klik baris kedua kolom pertama tabel, lalu tahan drag dari posisi P1 sampai posisi P2. Hasil setelah di merge cells akan terlihat seperti gambar di bawah.

Pada baris kedua kolom yang telah di merge cell kita klik, lalu pada tab Common klik elemen Image. Kemudian kotak dialog Select Image Source akan tampil.

Setelah dimasukkan gambar tampilan header website akan terlihat seperti gambar di bawah ini. Setelah kita merancang header website, tahap selanjutnya adalah membuat menu atas. Untuk membuatnya ikuti langkah-langkah di bawah ini. Pada dokumen index. Kemudian gabungkan kedua kolom tersebut menggunakan perintah Merge Cells seperti yang pernah diajarkan sebelumnya. Di dalam menu insert itu, ada option Table. Setelah tabel sudah ada di layar komputer kamu, kamu bisa masuk ke dalam tabel itu dan membuat tabel kedua.

Kegunaan dari tabel kedua adalah untuk membuat layout website yang nantinya akan kamu miliki. Kamu juga harus melakukan hal yang sama seperti tabel pertama. Setelah kedua tabel ini sudah selesai, maka sudah tercipta layout website milik kamu sendiri. Sekarang saatnya berurusan dengan halaman pertama, header , background , menu dan yang lainnya. Sudah save project dan membuat tabel dengan Adobe Dreamweaver?

Berarti sekarang saatnya membuat halaman pertama dari website kamu. Untuk membuat halaman pertama ini, coba pikirkan terlebih dahulu desain yang ingin dipakai. Kamu bisa cek beberapa referensi di internet. Bisa dari artikel-artikel yang membahas desain website hingga referensi dari website-website yang kamu sukai. Kamu juga bisa memasukkan beberapa desain grafis di dalam halaman utama website kamu sehingga memberikan kesan yang mendalam bagi yang melihatnya secara langsung ketika website sudah jadi dan diluncurkan di dunia maya.

Setelah membuat halaman pertama menggunakan Adobe Dreamweaver, pastinya kamu perlu memiliki background website. Untuk menampilkan slideshow, aturlah pada CSS terlebih dahulu dengan script seperti berikut. Lalu untuk menampilkan slideshow pada halaman web, menggunakan script dibawah ini.

Ketik script dibawah ini untuk menu bagian kanan. Beri background untuk menu bar atas. Rapihkan tampilkan sesuai dengan konten isi web anda. Untuk pengaturannya lakukan di CSS dengan script berikut. Atur bagian Footer dengan script dibawah ini. Berikut ini adalah tampilan web design sementara untuk kelompok saya. Jadi sampai untuk sementara samapai sini progres web design yang sudah kami buat.. Terimakasihh :. Kirimkan Ini lewat Email BlogThis!

Berbagi ke Twitter Berbagi ke Facebook. Aprilya 14 Desember Abrisam 15 Desember Misalnya dalm kotak pencarian sy mencari lagu naff kok pencarian tersebut tidak merespon, yang ada layaknya merefresh saja. Ini coba liat webnya. Komentar yang anda masukkan akan dimoderasi terlebih dahulu oleh admin. Komentar berbau promosi, akan dihapus. Emoticon Emoticon. Contact Disclaimer Privacy. Burung Internet.

Tentang komputer, internet, teknologi, anime. Menu Home Daftar Isi Tutorial. Sebelum membaca tutorial ini, pastikan sobat sudah membaca tutorial berikut.