Tutorial ini akan memperkenalkan anda tentang program Adobe Dreamweaver CS4. Ini meliputi pengenalan kepada antara muka Dreamweaver, fungsi toolbar yang terdapat di dalamnya serta elemen-elemen yang berkaitan.
Adobe Dreamweaver dipilih kerana perisian ini membolehkan pengguna membangunkan sesebuah halaman web tanpa mengetahui bagaimana hendak menggunakan kod HTML. Semua kod akan dihasilkan secara automatik oleh perisian tersebut.
Walaupun Adobe Dreamweaver CS4 tidak memerlukan seseorang itu mahir dalam bahasa HTML , pemahaman tentang HTML masih lagi dititikberatkan. Melalui pemahaman HTML, anda akan faham bagaimana sesebuah halaman web dibangunkan.
Klik pada imej untuk paparan yang lebih jelas.
Elemen-elemen yang terdapat pada skrin pengenalan
Open Recent Item - merupakan senarai fail yang anda sedang gunakan untuk pembangunan halaman web.
Create New - membolehkan anda membuat fail baru untuk HTML, PHP , CSS dan sebagainya.
Top Features - video tutorial tentang topik-topik tertentu dalam menggunakan Dreamweaver.
Getting Started, New Features, Resources - apabila anda klik pilihan arahan tersebut, ia akan membuka halaman web Adobe Dreamweaver serta ‘Help File’ yang lebih terperinci.
Elemen-elemen yang terdapat pada antara muka Adobe Dreamweaver CS4
Application Bar
mengandungi pilihan menu seperti File, Edit, View, Insert, Modify, Format, Commands, Site, Window dan Help . Setiap pilihan mempunyai fungsi tertentu dan anda digalakkan untuk mencuba setiap pilihan.
Dalam versi terkini ini iaitu CS4, terdapat beberapa perubahan baru iaitu penambahan Quick Access Icons untuk ‘Layout’, ‘Extend Dreamweaver’ dan ‘Site’.
- Layout - merupakan shortcut untuk mengubah paparan dokumen anda.
- Extend Dreamweaver - membolehkan anda mendapatkan file extension bagi Dreamweaver daripada website Adobe
- Site - untuk menguruskan fail dan direktori halaman web anda
Jika anda ingin mengubah paparan ruang kerja (workspace), anda boleh klik pada perkataan DESIGNER yang terdapat pada toolbar ini. Anda digalakkan untuk mencuba setiap pilihan untuk mengetahui perbezaan antara setiap ruang kerja. Seperti yang terdapat pada imej di bawah, ruang kerja adalah dalam bentuk Classic, iaitu ruang kerja yang biasa anda lihat dalam versi Dreamweaver yang terdahulu.
Document Toolbar
mengandungi butang serta pop-up menu di mana anda boleh memilih paparan dokumen halaman web yang anda sedang bina. Tiga bentuk paparan iaitu, Code , Split (menunjukkan paparan dalam bentuk code dan design) dan Design.
Paparan dalam bentuk Design View:
Paparan dalam bentuk Code View:
Paparan dalam bentuk Split View:
Terdapat perubahan baru pada document toolbar ini iaitu, Live View. Liew View membolehkan anda melihat halaman web yang anda bina seperti yang akan dipaparkan pada browser, perbezaannya anda boleh melihat dalam perisian Dreamweaver.
Document Window, Properties Inspector, Window Size, Tag Selector
Document Window - Ruangan untuk membina halaman web.
Properties Inspector - memaparkan spesifikasi tentang halaman web yang sedang anda bina seperti font, warna teks dan sebagainya.
Tag Selector - akan memaparkan status elemen berdasarkan kedudukan cursor terkini.
Window Size - memaparkan saiz paparan halaman web.
Panel Groups - mengandungi panel-panel yang diletakkan dalam satu kumpulan.
Insert Bar
mengandungi ikon serta butang untuk memasukkan imej, jadual, media dan sebagainya ke dalam halaman web yang sedang anda bina. Perbezaan antara CS3 & cs4, dalam CS3, Insert Bar terletak pada bahagian bawah Application toolbar, manakala dalam CS4, Insert Bar terletak pada sebelah kanan tetingkap.
Insert Bar juga mengandungi pelbagai kumpulan objek seperti Common, Layout, Forms, Data, Spry, Incontext Editing, Text, Favourites.
Sekiranya anda ingin lebih tahu lagi tentang antaramuka perisian Adobe Dreamweaver, anda boleh klik pada butang Help yang terdapat pada Application toolbar atau shortcut : F1.
Pelajari lagi elemen lain yang terdapat pada tetingkap Dreamweaver CS4.
Possibly Related Posts:
Komen Terbaru