1 / 106

องค์ประกอบพื้นฐาน

องค์ประกอบพื้นฐาน. การ พัฒนาเว็บไซต์. ความ เรียบง่าย ( Simplicity) 2. ความสม่ำเสมอ ( Consistency) 3. ความเป็นเอกลักษณ์ ( Identity) 4. เนื้อหาที่มีประโยชน์ ( Useful Content) 5. ระบบเนวิเกชันที่ใช้งานง่าย ( User-Friendly Navigation) 6 . มีลักษณะที่น่าสนใจ ( Visual Appeal)

dagan
Download Presentation

องค์ประกอบพื้นฐาน

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. องค์ประกอบพื้นฐาน การพัฒนาเว็บไซต์

  2. ความเรียบง่าย (Simplicity)2. ความสม่ำเสมอ (Consistency) 3. ความเป็นเอกลักษณ์ (Identity)4. เนื้อหาที่มีประโยชน์ (Useful Content)5.ระบบเนวิเกชันที่ใช้งานง่าย (User-Friendly Navigation) 6. มีลักษณะที่น่าสนใจ (Visual Appeal) 7. การใช้งานอย่างไม่จำกัด(Compatibility) องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์

  3. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 1. ความเรียบง่าย (Simplicity)- มีรูปแบบที่เรียบง่าย ไม่ซับซ้อนและใช้งานได้อย่างสะดวก - สื่อสารเนื้อหาถึงผู้ใช้โดยมีเฉพาะองค์ประกอบ เสริมที่จำเป็นเท่านั้น

  4. Chaos design

  5. Chaos design

  6. Chaos design

  7. Bad design

  8. Simplicity design

  9. Simplicity design

  10. Simplicity design

  11. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ *หากลักษณะของเว็บเพจแต่ละหน้าในเว็บไซต์เดียวกัน มีความแตกต่างกัน อาจทำให้ผู้ใช้เกิดความสับสนได้ 2. ความสม่ำเสมอ (Consistency)- สร้างความสม่ำเสมอให้กับเว็บไซต์โดยใช้รูปแบบเดียวกันตลอดทั้งเว็บไซต์ ทั้งในส่วนของรูปแบบหน้า สไตล์ของกราฟิก ระบบเนวิเกชัน และโทนสี

  12. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 3. ความเป็นเอกลักษณ์ (Identity) - การออกแบบต้องคำนึงถึงลักษณะขององค์กร - รูปแบบของเว็บไซต์สามารถสะท้อนถึงเอกลักษณ์ขององค์กร

  13. Bad Identity

  14. Bad Identity

  15. Good Identity

  16. Good Identity

  17. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 4. เนื้อหาที่มีประโยชน์ (Useful Content)- ควรจัดเตรียมเนื้อหาและข้อมูลที่ผู้ใช้ต้องการให้ถูกต้องและสมบูรณ์- ควรมีการปรับปรุงและเพิ่มเติมให้ทันต่อเหตุการณ์อยู่เสมอ

  18. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 5.ระบบเนวิเกชันที่ใช้งานง่าย (User-Friendly Navigation)- ระบบเนวิเกชันจะต้องออกแบบให้ผู้ใช้เข้าใจง่ายและใช้งานสะดวก โดยใช้กราฟิกที่สื่อความหมายร่วมกับคำอธิบายอย่างชัดเจน - มีรูปแบบและลำดับของรายการอย่างสม่ำเสมอ

  19. โครงสร้างเว็บเพจ (Web Page Structure)

  20. Bad Navigation

  21. Bad Navigation

  22. Good Navigation

  23. Good Navigation

  24. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 6. มีลักษณะที่น่าสนใจ (Visual Appeal)- ความน่าสนใจของเว็บไซต์จะมีความสัมพันธ์กับคุณภาพขององค์ประกอบต่าง ๆ เช่น คุณภาพของกราฟิก การใช้ชนิดตัวอักษร การใช้โทนสี เป็นต้น

  25. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 7. การใช้งานอย่างไม่จำกัด (Compatibility) - ควรออกแบบเว็บไซต์ให้ครอบคลุมกับผู้ใช้ส่วนใหญ่มากที่สุด - ไม่ควรมีการติดตั้งโปรแกรมเพิ่มเติม หรือเลือกใช้เบราเซอร์ชนิดใดชนิดหนึ่ง - สามารถแสดงผลได้ทุกระบบปฏิบัติการและที่ความละเอียดหน้าจอต่าง ๆ กันได้อย่างไม่มีปัญหา

  26. Screen Resolution 1024 x 768 Web safe area for อ้างอิงจาก http://www.designerstoolbox.com/designresources/safearea/compare/ หรือ สืบค้นจาก keyword : “web safe area”

  27. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 8. ระบบการใช้งานที่ถูกต้อง (Functional Stability)ระบบการทำงานต่าง ๆ ในเว็บไซต์จะต้องมีความแน่นอนและทำหน้าที่ได้อย่างถูกต้อง เช่น การกรอกข้อมูล การเชื่อมโยง เป็นต้น ควรมีการตรวจสอบการทำงานอยู่เสมอ

  28. องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์องค์ประกอบพื้นฐานของการออกแบบเว็บไซต์ 9. คุณภาพในการออกแบบ (Design Stability)ควรมีมาตรฐานการออกแบบและการจัดระบบข้อมูลให้มีลักษณะเป็นไปในทิศทางเดียวกันทั้งเว็บไซต์

  29. Web design and Development Resourceswww.smashingmagazine.com Web Galleryhttp://www.dbcut.comhttp://www.rookienet.comhttp://bestwebgallery.com

  30. ตัวอักษรบนเว็บ Typography on the Web

  31. heading content list รูปแบบการใช้งาน

  32. ควรเลือกใช้รูปแบบตัวอักษร(font)ที่เครื่องคอมพิวเตอร์ทุกเครื่องมีการใช้งานควรเลือกใช้รูปแบบตัวอักษร(font)ที่เครื่องคอมพิวเตอร์ทุกเครื่องมีการใช้งาน Web Safe font

  33. การวางเลย์เอาท์(Layout) สำหรับเว็บเพจ

  34. 1. เครื่องมือ Table2. เครื่องมือ Layout3. เครื่องมือ Layer เครื่องมือที่ใช้

  35. Header Navigator(Menu) Content Sidebar Footer โครงสร้างของเว็บเพจ

  36. โครงสร้างของตาราง

  37. โครงสร้างของตาราง(ต่อ)โครงสร้างของตาราง(ต่อ)

  38. โครงสร้างของตาราง(ต่อ)โครงสร้างของตาราง(ต่อ)

  39. โครงสร้างของตาราง(ต่อ)โครงสร้างของตาราง(ต่อ)

  40. โครงสร้างของตาราง(ต่อ)โครงสร้างของตาราง(ต่อ) cellspacingคือ ระยะห่างระหว่างช่องเซลล์cellpaddingคือ ระยะห่างเนื้อหา(content)กับเซลล์

  41. ขั้นตอนการใช้เครื่องมือ Table

  42. ขั้นตอนการใช้เครื่องมือ Table1. วิเคราะห์จำนวนแถว (row)และคอลัมภ์(column)

  43. ขั้นตอนการใช้เครื่องมือ Table1. วิเคราะห์จำนวนแถว (row)และคอลัมภ์(column)

  44. ขั้นตอนการใช้เครื่องมือ Table row = 4column = 1

More Related