นายพงศ์พิทักษ์ รัตนภักดี

1. หน่วยที่ 2
เครื่องมือพื้นฐานและส่วนประกอบของโปรแกรม

2. Adobe Dreamweaver CS6 เป็นโปรแกรมที่ช่วยในการสร้างเว็บไซต์ และ
เหมาะสมสาหรับนักพัฒนาเว็บไซต์มือใหม่ โดยสามารถนารูปภาพหรือข้อความ
มาประกอบเป็นเว็บเพจ อีกทั้งยังเพิ่มลูกเล่นต่าง ๆ เช่น เสียง ภาพเคลื่อนไหว
วีดิโอ ซึ่งไม่จาเป็นต้องรู้หลักการเขียนโปรแกรมด้วยภาษา HTML ก็สามารถ
สร้างเว็บไซต์ได้
Adobe Dreamweaver CS6

3. ส่วนประกอบของ Adobe Dreamweaver CS6

4. 1. Menu bar เป็นแถบรวบรวมคำสั่งทั้งหมดของโปรแกรม
- Code สาหรับแสดงการทางานในรูปแบบ HTML นอกจากนี้ยังสามารถเขียนคาสั่ง HTML
หรือคาสั่งภาษาสคริปต์ (Script) อื่นๆ ได้ด้วย
- Split สาหรับแสดงการทางานแบบ HTML กับการแสดงพื้นที่ออกแบบ โดยจะแสดงส่วน
ของคาสั่ง ไว้ด้านบนและแสดงเว็บเพจปกติไว้ ด้านล่าง
- Design สาหรับแสดงเว็บเพจคล้ายกับที่เราเห็นในบราวเซอร์ เช่น ข้อความ กราฟิก หรือ
ออปเจ็กต์อื่นๆ และสามารถแก้ไขเนื้อหาลงเว็บเพจได้
- Title สาหรับแสดงชื่อของเว็บเพจ ในส่วนของแถบหัวเรื่อง

5. 2. Toolbar เป็นแถบรวบรวมคาสั่งที่ใช้งานบ่อยๆ
3. Document Windows เป็นพื้นที่สาหรับสร้างหน้าเว็บเพจ และสามารถเลือกพื้นที่การทางาน
ได้หลายมุมมอง เช่น
- Code View สาหรับแสดงการทางานในรูปแบบ HTML นอกจากนี้ยังสามารถเขียน
คาสั่ง HTML หรือคาสั่งภาษาสคริปต์ (Script) อื่นๆ ได้ด้วย
- Code and Design สาหรับแสดงการทางานแบบ HTML กับการแสดงพื้นที่ออกแบบ
โดยด้านบนจะแสดงส่วนของคาสั่ง และด้านล่างแสดงเว็บเพจปกติไว้
- Design View สาหรับแสดงเว็บเพจคล้ายกับที่เราเห็นในบราวเซอร์ เช่น ข้อความ
กราฟิก หรือออปเจ็กต์อื่นๆ และสามารถแก้ไขเนื้อหาลงเว็บเพจได้

6. 4. Status bar เป็นแถบแสดงสถานะ ซึ่งประกอบด้วย 2 ส่วน คือ ทางด้านซ้ายเรียกว่า Tag
Selector ใช้สาหรับแสดงคาสั่ง HTML ของส่วนประกอบในเว็บเพจที่เลือกอยู่ และทาง
ด้านขวาเป็นส่วนที่บอกขนาดหน้าจอการแสดงผลและเวลาที่ใช้ในการดาวน์โหลดเว็บเพจ
5. Properties Inspector เป็นส่วนที่กาหนดคุณสมบัติต่าง ๆ ในการปรับแต่งองค์ประกอบของ
หน้าเว็บเพจ
6. Insert Bar เป็นแถบที่ประกอบด้วยปุ่มคาสั่งที่ใช้ในการแทรกออบเจ็กต์ (องค์ประกอบต่างๆ)
ลงในเว็บเพจ โดยแบ่งเป็นหมวดหมู่

7. เครื่องมือพื้นฐานของโปรแกรม

8. - Common เป็นกลุ่มเครื่องมือพื้นฐานในการสร้างเว็บเพจ เช่น รูปภาพ กราฟิก ตาราง ไฟล์ มีเดีย เป็นต้น
- Layout เป็นกลุ่มเครื่องมือที่ช่วยในการจัดองค์ประกอบของหน้าเว็บเพจ
- Forms เป็นกลุ่มเครื่องมือที่ใช้สร้างแบบฟอร์มรับข้อมูลจากผู้ชม เช่น ช่องรับข้อความ และ
ฟิลด์ชนิดต่างๆ
- Data เป็นกลุ่มเครื่องมือที่ใช้สาหรับสร้างหน้าเว็บติดต่อกับฐานข้อมูล
- Spry เป็นกลุ่มเครื่องมือที่ใช้ในการจัดการหน้าเว็บเพจ โดยจะช่วยในการทางานเพิ่มเติมหรือ
แก้ไขในส่วนที่ผิดพลาดหรือต้องการปรับเปลี่ยนให้สะดวกขึ้น
- jQuery Mobile เป็นกลุ่มเครื่องมือที่ช่วยในการสร้างหน้าเว็บบนมือถือ
- InConext Editing เป็นกลุ่มเครื่องมือที่ช่วยอานวยความสะดวกให้ผู้ใช้งานสามารถแก้ไขเว็บเพจได้
- Text เป็นกลุ่มเครื่องมือที่ใช้จัดรูปแบบข้อความในเว็บเพจ
- Favorite เป็นกลุ่มเครื่องมือที่ใช้งานบ่อยๆ เพื่อความสะดวกในการใช้งาน
- Color Icons แสดงสีของปุ่มเครื่องมือ
- Hide Labels ซ่อนชื่อเรียกของปุ่มเครื่องมือ

9. เครื่องมือที่จาเป็นและใช้งานมากที่สุด
1. Hyperlink คือ การเชื่อมโยงไปยังเว็บไซต์อื่น
2. Email Link คือ การเชื่อมโยงไปยังจดหมายอิเล็กทรอนิสก์หรืออีเมล
3.NamedAnchor คือ การเชื่อมโยงภายในเว็บไซต์และภายในหน้าเดียวกัน
4. Table คือ การแทรกตาราง
5. Insert Div Tag คือ การส้รางฟีดข่าวแบบ RSS
6. Images คือ การแทรกรูปภาพ
7. Media คือ การแทรกวิดิโอ แฟลช เสียง และ มิเดียต่างๆ
8. Widget คือ การแก้ไขโครงสร้างของรูปภาพ
9. Date คือ การแทรกวันที่
10. Server-Side Include คือ การติดต่อกับเซิฟเวอร์ของ site
11. Head คือ การกาหนดหัวหลักของเว็บไซต์
12. Script คือ การแทรกโค้ด Java หรือ โค้ดที่เกี่ยวกับเว็บไซต์