แนะนำโปรแกรม Dreamweaver (2)

ส่วนประกอบของหน้าจอโปรแกรม
Adobe Dremweaver CS6 

เมื่อเปิดโปรแกรม Dreamweaver แล้ว จะได้หน้าต่างโปรแกรม ซึ่งมีส่วนประกอบหลักแสดงดังภาพ

1 Menu bar       Menu bar เป็นที่รวมคาสั่งทั้งหมดของโปรแกรม Dreamweaver ที่ใช้ในการจัดการกับไฟล์เว็บเพจ ประกอบด้วยเมนูแสดงดังภาพ

Menu bar ประกอบด้วยเมนูย่อย ดังนี้         1 File เป็นเมนูคาสั่งสำหรับจัดการกับไฟล์เว็บเพจ เช่น สร้างเว็บเพจใหม่ บันทึกเว็บเพจ เปิดเว็บเพจ แสดงเว็บเพจผ่านบราวเซอร์ หรือออกจากโปรแกรม เป็นต้น           2 Edit เป็นเมนูคำสั่งสำหรับการแก้ไข เช่น คัดลอง ตัด วาง ค้นหา รวมถึงการ ตั้งค่าการทำงาน (Preference) ต่าง ๆ เป็นต้น           3 View เป็นเมนูคำสั่งสำหรับปรับเปลี่ยนมุมมองของเว็บเพจขณะทำงาน เป็นต้น           4 Insert เป็นเมนูคำสั่งสำหรับแทรกวัตถุต่าง ๆ เช่น รูปภาพ เสียง ตาราง ฟอร์มต่าง ๆ ลงบนเว็บเพจ เป็นต้น           5 Modify เป็นเมนูคำสั่งสำหรับแก้ไขวัตถุต่าง ๆ บนเว็บเพจ เช่น การแก้ไข รูปแบบตัวอักษร การแก้ไขรูปภาพ การจัดการตาราง หรือการกำหนดคุณสมบัติของเว็บเพจ เป็นต้น           6 Format เป็นเมนูคำสั่งสำหรับเปลี่ยนรูปแบบโดยรวมของข้อความบนเว็บเพจ เช่น การจัดรูปแบบข้อความ การสร้างหัวข้อรายการ เป็นต้น           7 Command เป็นเมนูคำสั่งสำหรับจัดการกับชุดคำสั่งต่าง ๆ บนเว็บเพจที่ทำงานอยู่           8 Site เป็นเมนูคำสั่งสำหรับจัดการกับ Site เช่น สร้าง Site หรือแก้ไข Site ที่ทางาน รวมถึงการตรวจสอบลิงค์ต่าง ๆ ใน Site เป็นต้น           9 Window เป็นเมนูที่ใช้ในการเปิดหรือปิดพาเนลที่ทำงานอยู่          10 Help เป็นเมนูที่ใช้ในการขอความช่วยเหลือผ่านเว็บไซต์ Adobe 2 Toolbar        Toolbar เป็นแถบเครื่องมือที่ใช้รวมปุ่มคำสั่งที่จำเป็นต้องใช้งานเป็นประจำสามารถ เปิด/ปิดการใช้งานได้ Toolbars ประกอบด้วยแถบเครื่องมือดังนี้        2.1 Document Toolbar เป็นทูลบาร์ที่ประกอบไปด้วยปุ่มคาสั่งในการ กำหนดมุมมองการแสดงเว็บเพจ การแสดงความละเอียดของหน้าเว็บเพจ การโอน ย้ายไฟล์ หรือการกำหนดคำอธิบายเว็บเพจ เป็นต้น แสดงดังภาพ         2.2 Standard Toolbar เป็นทูลบาร์ที่ประกอบไปด้วยปุ่มคำสั่งพื้นฐาน ที่ใช้ในการจัดการไฟล์ เช่น การสร้างไฟล์ บันทึกไฟล์ เปิดไฟล์ คัดลอกย้าย หรือวางเนื้อหาตลอดจนการยกเลิกหรือทำซ้าคาสั่งด้วย แสดงดังภาพ        2.3 Style Rendering Toolbar เป็นทูลบาร์ที่ออกแบบมาเพื่อให้แสดงการทำงานของหน้าเว็บเพจที่ใช้ Style Sheet บนมีเดียประเภทต่าง ๆ เช่น บนหน้าจอคอมพิวเตอร์ บนเครื่องพิมพ์ บนโปรเจ็คเตอร์ บนทีวี การเพิ่ม/ลดขนาดตัวอักษร ตลอดจนการแสดงสีของสถานการณ์เชื่อมโยง แสดงดังภาพ 3 Application bar       เป็นแถบประยุกต์ ประกอบด้วยแถบเครื่องมือแสดงดังภาพ             3.1. สำหรับเลือกรูปแบบการแสดงพื้นที่สำหรับสร้างหน้าเว็บเพจ เช่น Code Split หรือ Design เป็นต้น             3.2. สำหรับค้นหา และติดตั้งโปรแกรมเสริม             3.3. สำหรับบริหารจัดการไซต์ เช่นสร้างไซต์ใหม่ 4 Workspace switcher         เป็นปุ่มสำหรับเปลี่ยนมุมมองพื้นที่ทำงาน (Workspace) โดยสามารถเลือกได้ว่าต้องการใช้งานรูปแบบในลักษณะใด ซึ่งใน Adobe Dreamweaver CS6 มีให้เลือกใช้ 11 แบบ แสดงดังภาพ 5 Insert panel        เป็นพาเนลที่รวบรวมกลุ่มคำสั่งที่ใช้สำหรับสร้างและแทรกออบเจ็คต่าง ๆ โดยจะแบ่งออกเป็นกลุ่ม เพื่อให้ใช้งานได้สะดวก ตัวอย่างกลุ่มคำสั่งที่ใช้งาน แสดงดังภาพ 6 กลุ่มพาเนลการทำงาน (Panel Group)       เป็นพาเนลหน้าต่างขนาดเล็ก ที่รวบรวมเครื่องมือไว้เป็นกลุ่มตามหน้าที่ สำหรับใช้งานเฉพาะเรื่องไว้ โดยสามารถเปิดหรือปิดพาเนลการทำงานได้โดยคลิกเมนูคาสั่งWindow แล้วคลิกเลือกพาเนลที่ต้องการ แสดงดังภาพ 7 Document Area         เป็นพื้นที่สำหรับสร้างหน้าเว็บเพจ ใส่ข้อมูลเนื้อหา และองค์ประกอบของเว็บเพจเช่น ภาพกราฟิก ระบบมัลติมีเดีย และโค้ดต่าง ๆ ซึ่งสามารถให้แสดงพื้นที่ในมุมมองได้ 3 มุมมอง คือ มุมมองโค้ด (Code View) มุมมองสปริน (Split View) และมุมมองออกแบบ (Design View) แสดงดังภาพ 8 แถบสถานะ (Status Bar)        เป็นแถบที่อยู่ด้านล่างของหน้าต่างการทำงาน ใช้แสดงข้อมูลเพิ่มเติมเกี่ยวกับสถานะการทำงานของเว็บเพจที่กาลังทำอยู่ เช่น แสดงและเลือกแท็ก HTML การปรับขนาดการแสดงผล การกำหนดขนาดหน้าต่าง ขนาดของไฟล์และเวลาที่ใช้ในการโหลด และการแสดงรหัสภาษาของเว็บเพจทีกาลังใช้งาน แสดงดังภาพ 9 พาเนลคุณสมบัติ (Panel Properties)       เป็นพาเนลที่อยู่ด้านล่างของหน้าจอโปรแกรม เป็นส่วนที่ต้องใช้งานบ่อยที่สุด เพื่อใช้ในการปรับแต่งรายละเอียดและการแก้ไขคุณสมบัติต่าง ๆ เช่น ขนาด ตาแหน่ง หรือสี เป็นต้น โดยพาเนลนี้จะเปลี่ยนไปตามวัตถุที่เลือกใช้งานบนเว็บเพจ ตัวอย่างพาเนลคุณสมบัติ แสดงดังภาพ

ที่มา : http://www.kruwan-d.info/chapter2.html