Cara Menggunakan Macromedia Dreamweaver



Dreamweaver merupakan salah satu software dari kelompok Adobe yang banyak digunakan untuk mendesain situs web. Adapun Adobe Dreamweaver sendiri adalah sebuah HTML editor profesional yang berfungsi mendesain secara visual dan mengelola situs web maupun halaman web. Untuk memulai penggunaan Dreamweaver MX 2004, kliklah Start > All Program > Macromedia Dreamweaver MX 2004. Saat pertama kali menggunakan Dreamweaver akan tampil Welcome Screen dimana kita dapat memilih tutorial yang sudah disediakan oleh Dreamweaver.
 

1. Elemen Dreamweaver MX 2004
Dalam ruang kerja Dreamweaver ada beberapa elemen utama yang membentuk suatu ruang kerja yang merupakan satu kesatuan tampilan antara menu utama, panel, property inspector, serta toolbar. Perhatikan ruang kerja Dreamweaver pada gambar berikut :
 
 
 A.     Insert bar berisi tombol-tombol untuk menyisipkan berbagai macam objek, sepeti : image, tabel, dan frame, ke dalam documen.
B.     Document toolbar berisi tombol menu pop-up yang menyediakan tampilan berbeda Document Window, misalnya Code, Split, atau Design.
C.     Document window berfungsi menampilkan documen dimana anda bekerja sekarang.
D.    Panel group adalah kumpulan panel yang saling berkaitan satu sama lainnya yang dikelompokkan dibawah satu judul.
E.     Tag selector berfungsi menampilkan hierarki tag disekitar pilihan yang aktif pada Design View.
F.     Property inspector berfungsi melihat dan mengubah berbagai property objek yang terpilih.
G.     Files panel berfungsi mengatur file-file dan folder-folder yang membentuk situs web anda.
2. Mengenal Panel Properties
Panel Properties digunakan untuk melihat dan mengubah berbagai property objek dan teks yang terpilih. Setiap objek memiliki property yang berbeda-beda.
 
 
Kelebihan Dreamweaver MX 2004
1)    Dapat digunakan pada dua system operasi, diantaranya Macintosh atau windows.
2)    Dapat dilihat tampilan website preview pada computer, ponsel atau PDA, dan printer.
3)    Membangun web dengan CSS dengan menggunakan CSS layout, CSS panel, dan CSS visualization.
4)    Fasilitas lengkap pendukung CSS
3. Tabel
Tabel merupakan salah satu fasilitas untuk mendesain halaman web. Dengan menggunakan table, lebih mudah untuk memodifikasi desain web.Untuk membuat table lakukan beberapa langkah berikut ini :
1)    Siapkan file baru, lalu letakkan kursor pada jendela dokumen.
2)    Pilih salah satu perintah pembuatan table berikut : pilih perintah menu Insert > Table. Klik tombol table yang terletak pada tabulasi table didalam Insert Bar.
3)    Selanjutnya akan tampil kotak dialog Table seperti pada 1.4 kemudian, tentukan jumlah kolom dan baris dengan memasukkan angka pada beberapa kotak teks yang sudah disediakan.
 
 
Mengatur nilai property table :
1)    Row untuk menentukan jumlah baris tabel.
2)    Colums untuk menentukan jumlah kolom table
3)    Width untuk menentukan ukuran lebar tabel dan satuan ukuran yang dipakai, pixels atau persentase.
4)    Border untuk mengatur ketebalan border atau garis bingkai tabel.
5)    Cell Padding untuk mengatur jarak antara isi sel dengan batas tepi sel atau penampang sel.
6)    Cell Spacing untuk menentukan jarak antar sell dalam tabel.
Bagian Header
Fungsinya memberikan keterangan yeks pada bagian tabel sesuai dengan pilihan yang tersedia.
None, tanpa menggunkan keterangan teks.
Left untuk menampilkan keterangan teks pada kolom pertama atau pada bagian sebelah kiri.
Top untuk menampilkan keterangan teks pada baris pertama atau bagian sebelah atas.
Both untuk menampilkan keterangan teks pada kolom dan baris pertama.
Bagian Accessbility
Anda dapat memberikan keterangan judul tabel pada kotak teks Caption. Sementara untuk perataan teks busa menggunakan Align Caption.
E. Penempatan Struktur VBScript di Tag HTML
Stuktur dokumen HTML terbagi menjadi dua bagian yaitu bagian yang di akhiri dengan dan bagian yang diakhiri dengan . Pada bagian body disinilah yang akan ditampilkan didalam browser. Sebuah dokumen HTML selalu diawali oleh sebuah tanda pembuka atau disebut dengan opening tag dan diakhiri dengan tanda penutup yang disebut dengan ending tag yang ditandai dengan karakter /. Contoh penulisan dokumen HTML dapat dilihat sebagai berikut :

<html>
<head>
       ---------------- isi dari head
</head>
<body>
       ---------------- isi dari body
</body>
</html>

untuk penempatan struktur VBScript didalam dokumen HTML , kita membutuhkan Tag sebagai ending tag. Ada dua cara dalam penempatan struktur VBScript didalam dokumen HTML yaitu dibagian head dan pada bagian body. Cara penulisan tag VBScript ada dua macam yaitu :
<script language="vbscript">
 atau 
<script language="vbs">

Struktur VBScript yang diletakkan pada section body merupakan script yang berfungsi sebagai batang tubuhdari pemrograman VBScript dan diletakkan diakhir sebagai tujuan agar script dapat mengnali object html yang ada pada section body.
<html>
<head>
</head>
<body>
<script language="vbscript">
----------- isi dari kode VBScript ------------
</script>
</body>
</html>


contoh : simpan dengan nama contoh1.htm
<html>
<head>
</head>
<body>
<script language="vbscript">
document.write(" saya baru belajar VBScript")
</script>
</body>
</html>
 
semoga bermanfaat
 
 
[Read More...]


Belajar PHP dengan menggunakan Dreamweaver



           Dreamweaver, PHP, HTML dan MySQL sebenarnya saling berhubungan. Pengen tahu? Bahkan ada juga alternatif gratisan dari Dreamweaver, yang cukup powerful lho.

          HTML penting buat bikin desain tampilan web, PHP buat proses data yang ada di MySQL untuk ditampilkan melalui HTML, yang itu mungkin udah pada tahu kan? Nah, Dreamweaver apa lagi tuh?
Dreamweaver pada awalnya adalah sebuah software yang berguna untuk membantu kita mendesain web, atau dengan kata lain untuk mempermudah kita agar tidak terlalu pusing dengan kode-kode HTML. Dengan Dreamweaver, kita akan lebih mudah mendesain karena tidak perlu membayangkan desain tata letak web site yang kita buat. Kita bisa langsung melihat di layar, hasil desain web yang kita bikin.

         Jika kita membuat kode HTML menggunakan notepad misalnya, maka kita harus menyimpannya dulu dan membukanya menggunakan browser. Jika menggunakan Dreamweaver, maka kita bisa langsung melihat. Istilah kerennya WYSIWYG, What You See Is What You Get.
Saya ulangi lagi, Dreamweaver pada awalnya adalah alat bantu untuk membuat kode HTML.

        Dalam perkembangannya, Dreamweaver juga bisa digunakan untuk membuat kode PHP. Bahkan untuk akses ke database MySQL kamu bisa dengan mudah membuatnya dengan Dreamweaver. Sebenarnya yang dilakukan Dreamweaver adalah membuatkan koneksi dan query standar PHP untuk akses ke MySQL dengan menggunakan fungsi-fungsi yang di tanam dalam software Dreamweaver.

         Namun demikian, pada akhirnya kita akan tetap perlu utak-atik kode yang dihasilkan oleh Dreamweaver untuk menyesuaikan dengan kebutuhan kita secara lebih detil.
Jadi, tetaplah semangat untuk belajar HTML, PHP dan MySQL ya. Penting banget tuh, dijamin bakal kepake terus biarpun udah ada software bantu.
[Read More...]


Cara membuat website dengan menggunakan Dreamweaver



         Cara membuat website menggunakan Dreamweaver ternyata mudah dipelajari lho, yuk kita lihat tutorial nya.
Setelah semua bahan untuk design dan content web sudah siap, langkah membuat website berikutnya adalah menerjemahkan design yang telah kita buat kedalam bahasa pemrograman. Ada 2 cara untuk membuat script website, yaitu :
1. Dengan cara Instant, Instan disini kita bisa dengan mudah menerjemahkan design kita kedalam bahasa pemrograman dengan bantuan software – software semacam dreamweaver, frontpage dan lain – lain.
2.Dengan cara manual, Apabila anda lebih prefer membangun website anda secara manual, maka baca ulasan berikut ini: untuk text Anda harus merubahnya ke dalam file yang berformat HTML (umumnya berakhiran .htm atau .html) agar dapat dibaca oleh program Internet Explorer/Firefox (browser Anda).        

            Apabila Anda belum mempelajari bahasa HTML, CSS, Javascript dan lain –lain anda bisa baca – baca artikel yang sudah kami sediakan di web prothelon.com. Untuk pembuatan web secara manual hanya membutuhkan notepad atau notepad++

            Nah, untuk kali ini yang akan kita bahas adalah cara membuat website menggunakan dreamweaver. Adobe   Dreamweaver memberi kemudahan untuk merancang dan menata halaman demi halaman website, dengan menyediakan berbagai Tools yang siap pakai. Sangat mudah untuk menyisipkan elemen-elemen apapun yang kita perlukan, seperti Text, Gambar, atau Media lain sekalipun (suara, film, animasi flash, dll.)
Dengan cara ini kita bisa membuat halaman website yang canggih dan dilengkapi dengan berbagai media masa kini, tanpa harus tahu sedikitpun pemrograman di dalamnya. Adobe Dreamweaver telah menyiapkan berbagai perangkat siap pakai dan akan menuliskan kode-kode yang diperlukan ketika kita menggunakan perangkat tersebut.

Nah, berikut ini kita akan latihan cara membuat website sederhana dengan bantuan macromedia dreamweaver :
Try This: 4 Langkah Mudah Belajar Cara Membuat Website, Langsung Praktek!
1.Buka aplikasi dreamweaver, klik html.
2.Membuat table, dengan cara insert – Table – Isikan Rows = 1, Columns = 1, Table Width = 100 %
3.Setelah membuat table, arahkan Kursor ke dalam tabel yang kita buat tadi.
4.Buat table yang kedua yang nantinya akan digunakan sebagai layout website kita, seperti contoh : 
   Rows =  4, Columns=2 dan Table Width = 900 Pixel, Tabel ini bisa anda atur sesuai dengan kebutuhan    
5.Atur table mulai dari Header, Footer dll
6.Membuat menu dengan cara, Insert – Spry – Spry Menu Bar
7.Menu ini bisa kita pilih, apakah akan horizontal atau vertical.
8. Save.
 
Catatan Penting : Pembuatan website diatas merupakan salah satu cara perancangan web yang berbasis Table. selain menggunakan table sebetulnya ada cara lain yaitu dengan menggunakan Div atau campuran keduanya Div+Table. kedua cara memiliki plus minus masing-masing dan anda akan mengerti dengan sendirinya seiring dengan pengetahuan dan pengalaman anda dalam membuat website.
Lihat kan? Ternyata cara membuat website menggunakan dreamweaver tidak sedulit yang dibayangkan. Selamat mencoba.
 
[Read More...]


Batik Unik yang Nge-Trend



         Bila dahulu baju batik hanya dikenakan dalam acara formal dengan model terbatas, kini busana batik dapat dipakai di berbagai situasi dengan bahan kain yang bervariasi. Bahkan, desainer baju batik pun seringkali memunculkan model baju batik unik untuk menarik minat pemakainya.


Batik Unik yang Menjadi Trend

Tidak bisa dipungkiri bahwa dunia fashion sangat dekat dengan wanita. Beragam model dan jenis busana didesain untuk waninta. Dunia desain baju wanita pun kian berkembang, termasuk baju batik wanita. Bila dahulu baju batik hanya dikenakan dalam acara formal dengan model terbatas, kini busana batik dapat dipakai di berbagai situasi dengan bahan kain yang bervariasi. Bahkan, desainer baju batik pun seringkali memunculkan model baju batik unik untuk menarik minat pemakainya.
Salah satu jenis batik unik yang sedang menjadi trend adalah model kaos batik unik. Desain kaos batik ini muncul di Yogyakarta. Beragam design tersedia untuk memuaskan pelanggan. Motif yang banyak dijumpai pada kaos batik adalah motif seputar pewayangan.  Selain nyaman, tentu saja kaos batik unik ini menjadi pilihan menarik bagi kaum remaja. Sebelumnya, trend batik unik juga diramaikan dengan hadirnya batik bola. Baju batik dengan motif klub sepak bola dunia menjadi trend yang melanda seluruh usia mulai dari anak-anak hingga pria dewasa.
Bukan hanya terbatas pada baju. Ternyata motif batik unik pun kian merajalela dan mengepakkan sayapnya. Motif batik unik muncul pada tas, sepatu, cover buku, kertas pembungkus kado, hingga pisau dapur. Semangat kreatif untuk mempertahankan dan meningkatkan minat masyarakat untuk memakai batik telah mendorong terciptanya batik unik dalam berbagai segi kehidupan kita. Pada akhirnya, batik akan sanggup bertahan dari masa ke masa, bahkan terus mengalami perkembangan.
[Read More...]


 

Categories

Recent Comments

Popular Posts

Return to top of page Copyright © 2010 | Platinum Theme Converted into Blogger Template by HackTutors