Tutorial dreamweaver

10

Click here to load reader

Transcript of Tutorial dreamweaver

Page 1: Tutorial dreamweaver

Para pengunjung blog saya sekalian, selamat datang di blog saya yang sederhana ini Pada page ini saya akan membuat tutorial tentang membuat web sesuai dengan judul, pertama – tama yang harus anda ketahui, saya membuat web dengan menggunakan software dreamweaver. Dreamweaver yang saya gunakan adalah dreamweaver bawaan dari adobe, tapi bagi anda yang menggunakan dreamweaver dari macromedia juga dapat mengikuti tutorial ini, karena tidak jauh berbeda , Baiklah langsung saja kita mulai:

Instal dreamweaver (Adobe atau macromedia)

Jika anda sudah menginstal dreamweaver, bukalah program tersebut dan pilih menu HTML seperti pada gambar di bawah ini.

Anda lihat menu create new di atas. klik HTML!

selanjutnya setelah anda klik html maka layar putih kosong akan tampil pada layar anda, layar tersebut berguna untuk web yang akan anda buat nantinya.

Page 2: Tutorial dreamweaver

Gambar di atas adalah gambar form untuk anda membuat web.

Selanjutnya anda harus menamai web yang anda buat, bagaimana caranya??

Lihat gambar di atas, blok tulisan untitled, dan ganti jadi nama web yang anda inginkan

Selanjutnya jika anda ingin mengatur konfigurasi huruf, background image, dll yang harus anda lakukan adalah masuk ke menu page properties, menu ini ada di bagian bawah.

Gambar di atas adalah gambar tombol menuju menu page properties, dan seperti inilah tampilan page properties.

Page 3: Tutorial dreamweaver

dari pada anda cape scroll-scroll terus, lebih baik kita ganti page. hehehe

ok, di halaman sebelumnya anda sudah tau cara mengatur konfigurasi halaman web lewat page properties, selanjutnya yang anda lakukan adalah membuat tabel. Untuk apa??? tabel tersebut berguna untuk anda menaruh gambar sebagai header, advertisement, dll. Untuk membuat tabel, klik lah menu tabel.

Page 4: Tutorial dreamweaver

Gambar di atas adalah gambar pilihan menu dari menu tabel

Selanjutnya setelah anda mengklik menu tabel, pilih, anda ingin membuat berapa kolom, dan berapa baris, serta ketebalan rangka tabel, dll.

Page 5: Tutorial dreamweaver

Pada gambar di atas dapat anda lihat, anda dapat menentukan berapa baris dan kolom yang anda inginkan, dan ubah nilai border thickness menjadi noll, agar saat web di publish web anda terlihat rapih karena borderless, jiah TV kalee borderless ahahaha

Setelah itu akan muncul tabel seperti yang anda inginkan, kenapa tabel saya posisinya ada di tengah sedangkan anda ada di kiri? selain itu mengapa punya saya tabelnya lebih lebar? pada saat tabel muncul karena baru saja anda buat, anda klik align menjadi center di bagian bawah menu, setelah itu tarik DOT pada tabel, untuk membuatnya menjadi melar, tariklah ke kiri. maka akan tampil saperti gambar ini.

Page 6: Tutorial dreamweaver

Selanjutnya jika kita ingin menyisipkan gambar pada web, pada menubar pilihlah image, lalu insert image seperti gambar di bawah ini.

Page 7: Tutorial dreamweaver

Pada saat anda ingin menyisipkan gambar, misalnya untuk header, pertama-tama blok lah beberapa kolom, kemudian di merge dengan sortcut key ctrl+alt+m seperti gambar di bawah ini.

Lalu saat anda memasukan gambar maka gambar yang anda masukan tergantung pada resoulsinya, tabel tersebut akan melar, lalu anda setting tabel agar rapih kembali, inilah repotna pake tabel.

Page 8: Tutorial dreamweaver

sisanya dapat anda mengembangkannya sendiri, baik dari backgroundnya ataupun menyisipkan flash kedalamnya, lalu saya akan menjelaskan bagaimana cara anda mempreview blog anda seandainya sudah terpublish. caranya adalah pilih menu file, lalu preview in browser, plihlah default browser anda, dan inilah hasilnya.

Page 10: Tutorial dreamweaver

Pada gambar di atas, dapat anda lihat, gambar sudah di tampilkan, setelah itu dapat anda lhat karna settingan di awal border thicknessnya di setting nol, setelah itu dapat anda lihat juga, layarnya putih, karna backgroundnya belum di edit, jadi untuk lebih lengkapnya silahkan anda mencobanya, silahkan mencoba