โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

ข้ามไปยังเนื้อหา

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

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

อะโดบี ดรีมวีฟเวอร์ (Adobe Dreamweaver) หรือชื่อเดิมคือ แมโครมีเดีย ดรีมวีฟเวอร์ (Macromedia Dreamweaver) เป็นโปรแกรมแก้ไข HTML พัฒนาโดยบริษัทแมโครมีเดีย (ปัจจุบันควบกิจการรวมกับบริษัท อะโดบีซิสเต็มส์) ดรีมวีฟเวอร์มีทั้งในระบบปฏิบัติการแมคอินทอช และไมโครซอฟท์วินโดวส์ ดรีมวีฟเวอร์ยังสามารถทำงานบนระบบปฏิบัติการแบบยูนิกซ์ ผ่านโปรแกรมจำลองอย่าง WINE ได้ โปรแกรม Dreamweaver มีการพัฒนาดังนี้

  • Dreamweaver 1.0 (ธันวาคม ค.ศ. 1997) เป็นเวอร์ชันแรกสำหรับระบบปฏิบัติการ MAC OS
  • Dreamweaver 1.2 (มีนาคม ค.ศ. 1998) เป็นเวอร์ชันแรกสำหรับระบบปฏิบัติการ Windows
  • Dreamweaver 2.0 (ธันวาคม ค.ศ. 1998)
  • Dreamweaver 3.0 (ธันวาคม ค.ศ. 1999)
  • Dreamweaver UltraDev 1.0 (มิถุนายน ค.ศ. 2000)
  • Dreamweaver 4.0 (ธันวาคม ค.ศ. 2000)
  • Dreamweaver UltraDev 4.0 (ธันวาคม ค.ศ. 2000)
  • Dreamweaver MX (พฤษภาคม ค.ศ. 2002)
  • Dreamweaver MX 2004 (10 พฤศจิกายน ค.ศ. 2003)
  • Dreamweaver 8 (13 พฤศจิกายน ค.ศ. 2005)
  • Dreamweaver CS3 (16 เมษายน ค.ศ. 2007) เป็นเวอร์ชันแรกหลังจากรวมกับบริษัทอะโดบีซิสเต็มส์
  • Dreamweaver CS4 (23 กันยายน ค.ศ. 2008)
  • Dreamweaver CS5 (20 มิถุนายน ค.ศ. 2010)
  • Dreamweaver CS6 (23 เมษายน ค.ศ. 2012)

Adobe Dreamweaver เป็นโปรแกรมสาหรับพัฒนาเว็บไซต์ ซึ่งมีคุณสมบัติครอบคลุมตั้งแต่การออกแบบและสร้างเว็บและสร้างเว็บเพจ,การบริหารจัดการเว็บไซต์ ตลอดไปจนถึงการพัฒนาเว็บแอพพลิเคชั่นเบื้องต้น โปรแกรมนี้ได้รับความนิยมเป็นอย่างมากเพราะมีคุณสมบัติเด่นคือใช้งานง่าย มีเครื่องมือสำหรับวางข้อความ ภาพกราฟิก ตาราง แบบฟอร์ม มัลติมิเดีย รวมทั้งองค์ประกอบต่างๆเพื่อโต้ตอบกับผู้ชมลงบนเว็บเพจได้ง่าย โดยผู้ใช้ไม่จำเป็นต้องรู้จักภาษา HTML , CSS ,  JavaScript และภาษาสคริปต์อื่นๆ ดังนั้นจึงเหมาะสำหรับผู้เริ่มต้นและผู้ใช้ทั่วไป นอกจากนี้ยังมีคุณสมบัติขั้นสูงอีกมากมายสาหรับนักพัฒนาเว็บไซต์มืออาชีพด้วยเช่นกัน Dreamweaver เป็นโปรแกรมที่ช่วยให้เขียนเว็บไซต์ได้ง่ายขึ้น แก้ไขได้ง่ายขึ้น และมีเครื่องมืออำนวยความสะดวกมากมายที่มีประโยชน์ในการทำเว็บไซต์ โปรแกรมนี้ได้เป็นที่นิยมกันมากในหมู่ของเว็บมาสเตอร์ต่างๆ ทั้งในเมืองไทย และในต่างประเทศ

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

สำหรับเวอร์ชั่นเก่าๆ ของ โปรแกรม Adobe Dreamweaver มีการใช้งาน หรือการเขียนโค้ดที่เรียกได้ว่าง่ายอยู่แล้ว แต่ในเวอร์ชั่น CC ที่ทางผู้พัฒนาอย่าง Adobe ได้พัฒนาออกมาในรูปแบบของการติดตั้งเป็นชุดโปรแกรม Adobe Creative Cloud ซึ่งจะประกอบไปด้วยโปรแกรมที่ทางผู้พัฒนาเครือ Adobe ได้พัฒนาจัดออกมาเป็นชุดของเวอร์ชั่น CC นั้นเอง ถ้าหากคุณอยากใช้งานแบบไม่มีข้อจำกัด หรือเงื่อนไขใดๆ แนะนำให้ ซื้อ Adobe ของแท้ มาไว้ใช้งาน และก็ที่สำคัญควรเลือกซื้อจากตัวแทนจำหน่ายที่ไว้ใจได้ เพื่อไม่ให้มีการเกิดข้อผิดพลาดในขั้นตอนของการลงทะเบียน หรือในขั้นตอนของการอัพเดทโปรแกรมนั้นเอง ในส่วนของการใช้งานก็ใช้งานเหมือนเวอร์ชั่นก่อนๆ แต่แตกต่างตรงที่คำสั่งบางตัวจะมีโค้ดเด้งออโต้มาให้คุณเลือก เรียกได้ว่าสะดวก สบาย แถมลดเวลาในการเขียนโค้ดได้อีกด้วย

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

เรื่อง : ก้าวแรกสู่การเป็นนักพัฒนาเว็บไซต์ เริ่มทำความรู้จักกับโปรแกรม Dreamweaver

Dreamweaver เป็นโปรแกรมเพื่อช่วยในการพัฒนาเว็บไซต์ ให้เป็นไปอย่างง่ายดาย ซึ่งมีคุณสมบัติในการใช้งานในแบบ WYSIWYG (What You See Is What You Get) คือ เป็นโปรแกรมประเภทคุณออกแบบมาอย่างไรกับโปรแกรม Dreamweaver คุณก็เห็นงานของคุณเป็นแบบนั้นเมื่อดูการแสดงผลผ่าน Web Browser เลยครับ โดยโปรแกรม Dreamweaver จะช่วยอำนวยความสะดวกให้กับการพัฒนาเว็บไซต์ให้เราได้เป็นอย่างมาก เนื่องจาก ในเบื้องต้น ถ้าเราอยากจะมีเว็บไซต์สัก 1 เว็บ เราไม่จำเป็นต้องมานั่งเรียนรู้ Code ของ HTML เลยครับ เราก็สามารถสร้าง Website ได้อย่างมืออาชีพแล้ว
*ด้านล่างของบทความมีเอกสาร Dreamweaver Shortcut ให้ Download

เวอร์ชั่นต่าง ๆ ของโปรแกรม Dreamweaver

ในปัจจุบันนี้โปรแกรม Dreamweaver ถูกพัฒนาโดย Adobe ซึ่งเป็นการซื้อกิจการต่อมาจาก Macromedia เมื่อปี 2005 ที่ผ่านมา ดังนั้น ในปัจจุบันนี้เราจะเรียกโปรแกรมนี้ว่า Adobe Dreamweaver แทน Macromedia Dreamweaver กันครับ โดยนับถึงปัจจุบันนี้ (วันที่ผม re-write บทความคือปี 2015) โปรแกรมได้รับการพัฒนามาแล้วทั้งหมด 16 เวอร์ชั่น (นับตั้งแต่เวอร์ชั่น 1.0 ที่ออกมาเมื่อปี 1997) ดังนี้

Major versionVersion NameYearProvider
1 1.0 1997 Macromedia
2 2.0 1998 Macromedia
3 3.0 1999 Macromedia
4 4.0 2000 Macromedia
5 UltraDev 4.0 2000 Macromedia
6 MX 2002 Macromedia
7 MX 2004 2003 Macromedia
8 8.0 2005 Macromedia
9 CS3 2007 Adobe
10 CS4 2008 Adobe
11 CS5 2010 Adobe
12 CS6 2012 Adobe
13 CC (Creative Cloud) 2013 Adobe
14 CC 2014 2014 Adobe
15 CC 2014 (14.1) 2014 Adobe
16 CC 2015 2015 Adobe

ดาวน์โหลดโปรแกรม Dreamweaver

หากท่านต้องการ Download โปรแกรมมาใช้งาน สามารถเข้าไปดาวน์โหลดได้จากเว็บของ Adobe ได้โดยตรง ซึ่งจะได้โปรแกรมในเวอร์ชั่นล่าสุดมาใช้งาน และเป็นเวอร์ชั่นทดลองใช้งาน หรือทำการ Click ที่ ฺBanner ด้านล่างนี้เพื่อเข้าสู่หน้า Download ของ Adobe

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

หน้าจอของโปรแกรม Dreamweaver

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

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง
Dreamweaver Version 7 หรือ MX 2004
โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง
Dreamweaver Version 12 หรือ CS6
โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง
Dreamweaver Version 13 หรือ CC

องค์ประกอบที่สำคัญของโปรแกรม Dreamweaver

เครื่องมือหลัก ๆ ของโปรแกรม Dreamweaver ที่จะต้องใช้งานกันบ่อย ๆ ก็มีอยู่ด้วยกัน 4 ส่วนหลัก ๆ ด้วยกันครับ ตามหมายเลขในรูปภาพที่เขียนไว้ ซึ่งในแต่ละส่วนเราจะมารู้จักกันทีละเครื่องมือกันเรียงตามหมายเลข ดังนี้

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง
1. Document หรือส่วนที่ใช้แสดงหน้าเว็บของเรา ซึ่งส่วนนี้เป็นพื้นที่หลักที่เราจะใช้กัน จะทำการออกแบบหน้าเว็บเพจก็ทำที่นี้กันครับ
2. Main Menu เป็นส่วนที่เก็บรวบรวมคำสั่งการใช้งานโปรแกรมไว้ โดยเราสามารถเรียกใช้งานคำสั่งต่าง ๆ ได้คลิกเลืแกที่เมนูทีเราต้องการ
3. Panel Group ส่วนนี้เป็นส่วนที่รวบรวมพาเนลชนิดต่าง ๆ ไว้
4. Properties ส่วนนี้เป็นส่วนที่ใช้งานกันบ่อยมาก เป็นส่วนที่ใช้ในการกำหนดคุณสมบัติต่าง ๆ ของสิ่งที่ปรากฏบนเว็บเพจของเรา

มุมมองการใช้งานของโปรแกรม Dreamweaver

โปรแกรม Dreamweaver จะมีมุมมองในการใช้งานโปรแกรมอยู่ด้วยกัน 4 มุมมอง คือ
1. Design เป็นมุมมองในแบบ What You See Is What You Get
2. Code เป็นมุมมองที่ใช้งานการทำงานเกี่ยวกับโค้ดของเว็บเพจ
3. Split เป็นมุมมองที่แบ่งส่วนหน้าจอโปรแกรมออกเป็น 2 ส่วน ระหว่าง Design กับ Code
4. Live เป็นมุมมองที่ใช้แสดงผล คล้าย ๆ การ Preview การแสดงผลกับ Web Browser
เราสามารถเลือกมุมมองทั้ง 4 ข้างต้นได้จากปุ่ม ด้านบนของโปรแกรม ดังรูป

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

ทำความรู้จักกันไปแบบคร่าว ๆ นะครับ สำหรับโปรแกรม Dreamweaver ในบทความนี้ ส่วนของการใช้งานต่าง ๆ ของโปแกรม Dreamweaver โดยละเอียด DwThai.Com จะนำเสนอท่านต่อไปในบทความที่จะค่อย ๆ ทยอยเขียนตามออกมาเรื่อย ๆ ครับ

คลิปประกอบบทความ

*คลิกที่โลโก้ YouTube เพื่อเข้าดูที่ยูทูปนะครับ จะสามารถขยายจอดูได้

Dreamweaver Shortcut

สำหรับท่านที่ต้องการทราบ Shortcut ในการใช้ปุ่ม Keyboard กับโปรแกรม Dreamweaver ท่าน Download ได้จากไฟล์ด้านล่างนี้

About the Author

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

Sittichai is a Web Developer and Web Technology Instructor for over 10 yrs. He is also a webmaster of dwthai.com and author jQuery with Dreamweaver (2010). DwThai.Com is a website for web developer using Adobe Dreamweaver.

Contact with him :



บทความอื่นที่คุณอาจสนใจ

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

การสร้างจุด Link (Text Link)

การสร้าง Link ในแบบ Text Link Link หรือ ลิงค์ เป็นจุดเชื่อมโยงที่ปรากฎบนหน้าเว็บ เพื่อให้ผู้ใช้งานเว็บสามารถคลิกหรือกด...  

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง

โปรแกรม Dreamweaver ใช้ทำอะไรบ้าง


โปรแกรม Dreamweaver มีลักษณะอย่างไร

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

ปัจจุบันโปรแกรม Dreamweaver ใช้ชื่อเต็มว่าอะไร

อะโดบี ดรีมวีฟเวอร์ (Adobe Dreamweaver) หรือชื่อเดิมคือ แมโครมีเดีย ดรีมวีฟเวอร์ (Macromedia Dreamweaver) เป็นโปรแกรมแก้ไข HTML พัฒนาโดยบริษัทแมโครมีเดีย (ปัจจุบันควบกิจการรวมกับบริษัท อะโดบีซิสเต็มส์) สำหรับการออกแบบเว็บไซต์ในรูปแบบ WYSIWYG กับการควบคุมของส่วนแก้ไขรหัส HTML ในการพัฒนาโปรแกรมที่มีการรวมทั้งสองแบบเข้า ...

มุมมองในการใช้งานของโปรแกรม Dreamweaver มีกี่แบบอะไรบ้าง

โปรแกรม Dreamweaver จะมีมุมมองในการใช้งานโปรแกรมอยู่ด้วยกัน 4 มุมมอง คือ 1. Design เป็นมุมมองในแบบ What You See Is What You Get. 2. Code เป็นมุมมองที่ใช้งานการทำงานเกี่ยวกับโค้ดของเว็บเพจ 3. Split เป็นมุมมองที่แบ่งส่วนหน้าจอโปรแกรมออกเป็น 2 ส่วน ระหว่าง Design กับ Code.

Insert Panel ทำหน้าที่ใด

5. Insert panel เป็นพาเนลที่รวบรวมกลุ่มคำสั่งที่ใช้สำหรับสร้างและแทรกออบเจ็คต่างๆ โดยจะแบ่งออกเป็นกลุ่ม เพื่อให้ใช้งานได้สะดวก ตัวอย่างกลุ่มคำสั่งที่ใช้งาน Common เป็นกลุ่มคำสั่งสำหรับวางออบเจ็ค ที่ต้องใช้งานเป็นประจำ เช่น รูปภาพ ตาราง ไฟล์มัลติมีเดีย หรือลิงค์ เป็นต้น