การออกแบบและพัฒนาเว็บไซต์

Macromedia Dreamweaver 11 ตุลาคม 2562

การสร้าง Web Page เขียน Code เอง CODE HTML ใช้โปรแกรม สำเร็จรูป (WYSIWYG*) *What you see is what you get. 11 ตุลาคม 2562

ขั้นตอนการพัฒนาเว็บ วางแผนการสร้างเว็บไซต์ กำหนดหัวข้อและเนื้อหาที่จะนำเสนอ ทำเว็บอะไรดีนะเรา? ทำเว็บส่วนตัวดีกว่า 11 ตุลาคม 2562

กำหนดชื่อไฟล์ของเอกสารเว็บ 1 หน้า/1 ไฟล์ 11 ตุลาคม 2562

การออกแบบเว็บในประเภทต่างๆ แบบเชิงเส้น แบบรากต้นไม้ แบบผสม 11 ตุลาคม 2562

คำแนะนำในการตั้งชื่อ File และ Folder 11 ตุลาคม 2562

แผนผังการดูแลเว็บเพจ สร้างเว็บเพจ ปรับปรุง Upload 11 ตุลาคม 2562

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

What version? โปรแกรม Dreamweaver ออกมาได้หลากหลาย version แล้ว จนถึงวันนี้ Version CS6 11 ตุลาคม 2562

ความสามารถของ Dreamweaver 1. สนับสนุนการทำงานแบบ WYSIWYG (What You See Is What You Get) หมายความว่า เว็บที่เราเขียนหน้าจอ Dreamweaver ก็จะแสดงแบบเดียวกับเว็บเพจจริงๆ ช่วยให้เราเขียนเว็บเพจง่ายขึ้น ไม่ต้องเขียน Code HTML เอง 2. มีเครื่องมือในการช่วยสร้างเว็บเพจ ที่มีความยืดหยุ่นสูง 3. สนับสนุนภาษาสคริปต์ต่างๆ ทั้งฝั่ง Client และ Server เช่น Java, ASP, PHP, CGI, VBScript 4. มีเครื่องมือในการ Upload หน้าเว็บเพจไปที่เครื่อง Server เพื่อทำการเผยแพร่งานที่เราสร้างในอินเทอร์เน็ต โดยการส่งผ่าน FTP หรือ โดยการใช้โปรแกรม FTP ภายนอกช่วย เช่น WS FTP 5. รองรับมัลติมีเดีย เช่น การใส่เสียง, การแทรกไฟล์วิดีโอ, การใช้งานร่วมกับโปรแกรม Flash , Fireworks 11 ตุลาคม 2562

การใช้งานพื้นฐาน (สิ่งที่ควรทราบเบื้องต้น) 1. ภาษา HTML เป็นภาษาที่ออกแบบสำหรับการแสดงผลเท่านั้น! ไม่สามารถประมวลผล หรือ ใช้เขียนเว็บแอพพลิเคชั่นได้ 2. หากต้องการเพิ่มลูกเล่น หรือ เทคนิคพิเศษ เช่น Effect ต่าง ๆ ต้องนำภาษา JavaScript มาเสริม HTML อีกที 3. การจัดรูปแบบใน Code เช่นการขึ้นบรรทัดใหม่ การเว้นวรรค ไม่มีผลต่อการแสดงผลทาง Web Browser 4. การขึ้นบรรทัดใหม่ ต้องใช้ Tag <BR> หรือ กดปุ่ม Shift+Enter 11 ตุลาคม 2562

การใช้งานพื้นฐาน (สิ่งที่ควรทราบเบื้องต้น) (ต่อ) 5. การขึ้นย่อหน้าใหม่ ต้องใช้ Tag <P> หรือ กดปุ่ม Enter 6. การเว้นวรรค ต้องใช้ Tag พิเศษ คือ   หรือ กดปุ่ม Ctrl+ Shift + Spacebar 7. หลักการอ่าน Tag ของภาษา HTML จะอ่านค่าจาก Tag ที่อยู่ด้านในก่อน 8. ไฟล์ HTML และ Script ต่างๆ สามารถเปิดแก้ไขในโปรแกรม Text Editor ทั่ว ๆ ไป ไม่จำเป็นต้องแก้ไขใน Dreamweaver เพียงอย่างเดียว 9. การแทรกข้อความ และ การปรับแต่งค่าต่าง ๆ ให้คลิกตำแหน่งที่ต้องการ แล้วพิมพ์ข้อความตามต้องการ หรือให้เลือกข้อความเมื่อต้องการกำหนดค่าต่าง ๆ เพิ่มเติม 11 ตุลาคม 2562

ทำความรู้จักกับส่วนประกอบที่สำคัญของโปรแกรม 11 ตุลาคม 2562

ตั้งค่าภาษาไทยใน Dreamweaver ก่อนสร้างเว็บเสมอนะ Edit/Preferences... Ctrl+U Step 1 Step 2 ++เราจะสร้างเว็บภาษาไทย+++ 11 ตุลาคม 2562

เริ่มต้นสร้างเว็บแล้วนะ ก่อนอื่นจะเริ่มต้นสร้างเว็บต้องรู้จัก การสร้าง Site งานกันก่อนนะ 11 ตุลาคม 2562

การสร้าง Site งาน Menu Site/New Site ตั้งชื่อไซต์ สร้าง Folder เก็บ File เว็บ เสร็จแล้วก็ OK เลยนะคะ 11 ตุลาคม 2562

อย่าลืมพิมพ์ Title ด้วยนะ มีประโยชน์ต่อการ Search Engine นะจะบอกให้ F12 ดูเลย RUN 11 ตุลาคม 2562