Membuat Page Layouts Di Dreamweaver

Langkah 3: Tutorial Dreamweaver CS3 - Layouts Page

Sobat dapat menggunakan Dreamweaver untuk membuat tata letak halaman umum (dalam template) baik menggunakan tabel atau css. Keuntungan dan kerugian dari kedua pendekatan ini diuraikan di bawah ini:

Tabel Layouts: Keuntungan

Mudah untuk merancang
Bekerja dengan baik pada browser lama

Tabel Layouts: Kekurangan

Loads hanya sekali semua elemen dalam tabel telah dimuat - biasanya lebih lambat dari layout css
Perubahan tabel perlu dibuat pada setiap halaman dan semua halaman perlu upload ke server lagi

CSS Layouts: Keuntungan

cepat Loads - file css hanya perlu dimuat sekali
Dapat dengan mudah mengubah tata letak seluruh situs dengan mengutak-atik file. css sebagai elemen desain dipisahkan dari konten

CSS Layouts: Kekurangan

Lebih menantang untuk merancang
Mungkin tidak bekerja pada beberapa browser lama

Membuat Layout Halaman menggunakan Tabel

Menggunakan "pendekatan tabel" layout anda akan terstruktur dalam tabel dan sel-sel.

Sobat Menganalisis layout (dibuat dalam Adobe Fireworks atau Photoshop) untuk mengetahui berapa banyak tabel dengan berapa banyak baris dan kolom akan perlukan sobat untuk menciptakan dalam Dreamweaver.

Sekarang sobat mulai membuat tabel. sobat dapat menggunakan piksel atau persentase untuk menentukan lebar dan tinggi.Jika sobat memiliki lebih dari 1 kolom pastikan lebar semua kolom menambahkan hingga lebar Tabel. [Insert> Tabel]

Inspektur Properties sangat berguna untuk mengedit properti dari setiap elemen dalam halaman sobat. Untuk menyunting properti dari tabel cukup pilih tabel dan membuka Properties Inspector. [Window> Properties]

Coba dan membuat tabel terpisah sebanyak mungkin. Hal ini karena tabel akan memuat hanya sekali semua elemen di dalamnya telah dimuat.

Jelajahi menciptakan tata letak yang sobat rancang menggunakan tabel. Sobat bisa memberikan warna latar belakang, membuat tabel dalam tabel, menentukan alignment dari isi dalam sel dll, Jadi maju terus dan mencobanya.

Membuat Layout Halaman menggunakan Tag DIV dan CSS

Menggunakan pendekatan CSS sobat akan menciptakan tata letak halaman web menggunakan tag div untuk memisahkan berbagai jenis konten pada halaman dan positioning tag div ini di CSS.

Sobat akan perlu untuk menciptakan sebuah style sheet css dan melampirkannya pada template.

Untuk setiap div yang sobat buat dalam template sobat akan perlu untuk menciptakan gaya yang sesuai di file css. sobat dapat menentukan posisi lokasi div di halaman, warna latar belakang, batas dan properti lainnya dalam gaya.

Cara mudah untuk membuat sebuah css, div layout berbasis menggunakan salah satu tata letak Dreamweaver pre-built.[File New> Blank Page> HTML> tata letak Pilih yang paling sesuai dengan kebutuhan Anda]