Embedded Files
พื้นฐานการใช้โปรแกรม Adobe Dreamweaver CS6
โปรแกรม Dreamweaver คือสุดยอดโปรแกรมสำหรับงานพัฒนาเว็บไซต์ที่มีกลุ่มผู้ใช้งานมากเป็นอันดับต้นๆเนื่องจากมีกลุ่มเครื่องมือที่ใช้งานง่ายครอบคลุมการทำงานจริงในทุกๆด้าน ซึ่งปัจจุบันได้ถูกพัฒนามาถึงเวอชั่น CS6
ในเวอร์ชั่นนี้มีการปรับปรุงขีดความสามารถให้ดียิ่งขึ้น ดังนั้นเนื้อหาของบทนี้จึงขอกล่าวถึงพื้นฐานการใช้งานและทำความรู้จักโปรแกรม Dreamweaver CS6 ก่อนที่จะใช้งานในระดับสูงต่อไป
1. เมนูบาร์ รวบรวมกลุ่มรายการเมนูซึ่งประกอบด้วย
File คำสั่งที่ทำงานเกี่ยวกับการจัดการไฟล์เว็บเพจ
Edit คำสั่งเพื่อการแก้ไขค่า
View คำสั่งสำหรับแสดงผลมุมมองของเว็บเพจ
Insert คำสั่งใช้ในการแทรกข้อมูล
Modify คำสั่งเพื่อปรับแต่งรายละเอียด
Format คำสั่งที่ใช้สำหรับปรับค่ารูปแบบของฟอนต์และ CSS
Commands คำสั่งสำหรับทำงานทางด้าน HTML
Site คำสั่งที่ใช้บริหารจัดการเกี่ยวกับไซต์
Windows คำสั่งที่รวบรวมการใช้งานพาเนลและหน้าต่างของโปรแกรม
Help คำสั่งเกี่ยวกับข้อความช่วยเหลือ
2. Panel กลุ่มพาเนลที่จัดเก็บกลุ่มเครื่องมือต่างๆในการออกแบบ
3. File Panel บริหารจัดการเกี่ยวกับไซต์และไฟล์ต่างๆ
4. Open a Recent Item รายชื่อไฟล์ที่มีการเปิดใช้งานก่อนหน้านี้
5. Create New รูปแบบการสร้างเว็บเพจ ซึ่งรองรับการทำงานทางด้านชุดคำสั่งภาษาต่างๆของเว็บไซต์
6. Top Features ชุดคำสั่งและเครื่องมือเพื่ออธิบายและรายละเอียดการใช้งาน
ส่วนประกอบพื้นฐานในการพัฒนาเว็บไซต์
ส่วนประกอบพื้นฐานในการพัฒนาเว็บไซต์
ส่วนประกอบพื้นฐานของโปรแกรม Dreamweaver CS6 จะประกอบด้วยส่วนที่ใช้ในการควบคุมและปรับแต่งรายละเอียดให้กับข้อความ,รูปภาพ,วีดีโอ หรือไฟล์มัลติมีเดียต่างๆ ที่นำเข้ามาใช้ในการสร้างสรรค์หน้าเว็บเพจ ซึ่งสามารถอธิบานสรุปได้ดังนี้
1. หน้าต่างออกแบบเว็บเพจ พื้นที่ออกแบบหน้าเว็บเพจ ซึ่งจะสัมพันธ์กับมุมมองการทำงาน
Code = สำหรับพิมพ์คำสั่ง
Split = แยกพื้นที่ออกเป็น 2 ส่วนสำหรับเขียนคำสั่งและออกแบบหน้าเว็บเพจ
Design = ใช้สำหรับออกแบบหน้าเว็บเพจ
2. Menu Bar รวบรวมกลุ่มรายชื่อเมนูคำสั่ง ที่ใช้ในการจัดการและออกแบบหน้าเว็บเพจ
3. File Name แสดงชื่อไฟล์เว็บเพจที่กำลังดำเนินการอยู่
4. Properties กำหนดคุณสมบัติสำหรับวัตถุต่างๆที่วางอยู่บนหน้าเว็บเพจ
5. Insert Panel กลุ่มเครื่องมือสำหรับใช้ออกแบบหน้าเว็บเพจ
6. Panel Group กลุ่มของพาเนลต่างๆ ที่สามารถใช้ในการจัดการและออกแบบหน้าเว็บเพจ
การสร้างไซต์
การกำหนดไซต์มีความสำคัญมากในการทำเว็บด้วย Dreamweaver ไม่ว่าจะสร้างเว็บไซต์ใหม่ หรือ แก้ไขเว็บไซต์เก่าที่เคยทำมาแล้ว การกำหนดไซต์เป็นขั้นแรกของการทำเว็บด้วย Dreamweaver เป็นการกำหนดให้โปรแกรมทราบที่อยู่ของไฟล์ต่างของเว็บไซต์ที่เราทำไว้ ทำให้โปรแกรมสามารถดึงมาแก้ไขได้
เครื่องมือต่างๆของ Dreamweaver นั้นจะทำงานโดยอ้างอิง site ที่เรากำหนดทั้งหมด ถ้าไม่ได้กำหนด site ก็ทำให้เครื่องมือเหล่านั้นแทบจะหมดความหมายไปเลยทีเดียว
สิ่งแรกที่เราจะต้องเข้าใจในการทำเว็บไซต์คือ ไฟล์ทั้งหมด ทั้งรูปภาพ ไฟล์เอกสารต่างๆ เช่น HTML หรือไฟล์ VDO ที่อยู่ในเว็บไซต์ จะถูกรวมอยู่ใน Folder เดียวเราจะเรียก Folder นั้นว่า local rot folder
วิดีโอแสดงขั้นตอนการสร้างไซต์
ขั้นตอนการสร้างและบันทึกหน้าเว็บเพจ
การบันทึกหน้าเว็บเพจ
หลังจากที่สร้างเว็บเพจขึ้นมาแล้ว เราสามารถบันทึกเว็บเพจโดยคลิกเมนู File หลังจากนั้นเลือกคำสั่งสำหรับบันทึกอื่นๆได้ดังต่อไปนี้
Save As คือ การบันทึกเมื่อต้องการเปลี่ยนแหล่งที่เก็บ หรือเปลี่นไฟล์เป็นชื่ออื่น
Save All เป็นการบันทึกทุกไฟล์ที่เปิดใช้งานอยู่
Save Related File เป็นการบันทึกทุกไฟล์ที่มีความเกี่ยวข้องกับเว็บเพจที่ทำงาน เช่น ไฟล์ Css เป็นต้น
Save As Template เป็นการบันทึกเว็บเพจที่ออกแบบไว้ให้เป็น Template
หลักการตั้งชื่อเว็บเพจ
การตั้งชื่อเว็บเพจถือว่าเป็นสิ่งสำคัญที่จำเป็นต้องทำความเข้าใจ เนื่องจากการตั้งชื่อที่ไม่ถูกต้องจะทำให้เว็บเพจมีปัญหาเมื่ออัพโหลดขึ้นระบบอินเทอร์เน็ต ซึ่งหลักการตั้งชื่อเว็บเพจที่สำคัญมีดังนี้
ชื่อไฟล์ควรเป็นภาษาองกฤษและตัวพิมพ์เล็กเท่านั้น
ซื่อไฟล์ไม่ควรเว้นช่องว่าง แต่สามารถใช้เครื่องหมาย _ หรือ - เพื่อเชื่อมชื่อไฟล์ได้ เช่น my_web.html หรือ my-web.html
ไม่ควรใช้อักขระพิเศษในการตั้งชื่อ เช่น * @ # % เนื่องจากผิดหลักการตั้งชื่อเว็บไซต์
สำหรับเว็บเพจที่เป็นหน้าแรก ควรตั้งชื่อเป็น index หรือ defaultเท่านั้น ส่วนนามสกุลไฟล์เว็บเพจสามารถใช้ได้ทั้ง .htm และ.html
http://www.kruning.cba.ac.th/unit2/unit2main.html
Page updated
Google Sites
Report abuse