กระบวนการพัฒนาเว็บไซต์
Phase 1: สำรวจปัจจัยสำคัญ (Research)
รู้จักตัวเอง กำหนดเป้าหมายและสำรวจความพร้อม
เรียนรู้ผู้ใช้ ระบุกลุ่มผู้ใช้และศึกษาความต้องการ
ศึกษาคู่แข่ง สำรวจการแข่งขันและเรียนรู้คู่แข่งขัน
Phase 2: พัฒนาเนื้อหา (Site Content)
สร้างกลยุทธ์การออกแบบ
หาข้อสรุปขอบเขตเนื้อหา
Phase 3: พัฒนาโครงสร้างเว็บไซต์ (Site Structure)
จัดทำระบบข้อมูล
จัดทำโครงสร้างข้อมูล
พัฒนาระบบเนวิเกชัน
Phase 4: ออกแบบและพัฒนาหน้าเว็บ (Visual Design)
ออกแบบลักษณะหน้าตาเว็บเพจ
พัฒนาเว็บต้นแบบและข้อกำหนดสุดท้าย
Phase 5: พัฒนาและดำเนินการ (Production & Operation)
ลงมือพัฒนาเว็บเพจ
เปิดตัวเว็บไซต์
ดูแลและพัฒนาต่อเนื่อง
องค์ประกอบของการออกแบบเว็บไซต์ที่ดี
ความเรียบง่าย (Simplicity) การสื่อสารเนื้อหาถึงผู้ใช้โดยจำกัดองค์ประกอบเสริมที่เกี่ยวข้องกับการนำเสนอ ให้เหลือเฉพาะสิ่งที่จำเป็นเท่านั้น เช่น อาจไม่ทำตัวอักษรวิ่งวนไปมาให้ลายตา การใช้ชนิดของตัวอักษร ไม่มากจนเกิดความวุ่นวาย หรือใช้สีตัวอักษรที่ฉูดฉาดเกินไป
ความสม่ำเสมอ (Consistency) การ ใช้รูปแบบเดียวกันตลอดทั้งไซต์ เนื่องจากผู้ใช้จะรู้สึกกับว่าเว็บไซต์เสมือนสถานที่จริง ถ้าลักษณะของแต่ละหน้าแตกต่างกันมาก ผู้ใช้จะเกิดความสับสนหรือไม่แน่ใจว่ากำลังอยู่ในเว็บเดิมหรือไม่
ความเป็นเอกลักษณ์ (Identity) การ ออกแบบควรคำนึงถึงภาพรวมขององค์กร เช่น ถ้าออกแบบเว็บไซต์เกี่ยวกับเด็ก วัยรุ่น ควรมีสีสันสดใส หรือการออกแบบเว็บไซต์ของธนาคารไม่ควรจะดูเหมือนสวนสนุก ผู้ออกแบบต้องเลือกใช้องค์ประกอบเหล่านี้อย่างเหมาะสม
เนื้อหามีประโยชน์ (Useful Content) เนื้อหา เป็นสิ่งที่สำคัญที่สุดในเว็บไซต์ ดังนั้น ควรเตรียมเนื้อหาและข้อมูลที่ผู้ใช้ต้องการให้ถูกต้องสมบูรณ์ โดยมีการปรับปรุงเพิ่มเติมให้ทันต่อเหตุการณ์อยู่เสมอ
ระบบเนวิเกชันที่ใช้งานง่าย (User-Friendly Navigation) เนวิเกชันเสมือนป้ายบอกทางให้กับผู้ใช้ การออกแบบเนวิเกชัน ควรออกแบบให้วางในตำแหน่งเดียวกันของทุกๆ หน้า เพื่ออำนวยความสะดวกให้กับผู้ใช้งาน
มีลักษณะที่น่าสนใจ (Visual Appeal) เป็นเรื่องยากที่จะตัดสินว่าหน้าตาของแต่ละเว็บไซต์แห่งหนึ่งแห่งใดน่าสนใจหรือ ไม่ เพราะเกี่ยวข้องกับองค์ประกอบความชอบของแต่ละบุคคล อย่างไรก็ดีหน้าตาของเว็บไซต์จะมีความสัมพันธ์กับคุณภาพขององค์ประกอบต่างๆ เช่น ภาพกราฟฟิกจะต้องสมบูรณ์ไม่เป็นรอย หรือจุดด่าง หรือมีเส้นขอบเป็นขั้นบันได การใช้โทนสีที่เข้ากันอย่างสวยงาม ตลอดจนตัวอักษรที่อ่านง่าย สบายตา เป็นต้น
การใช้งานอย่างไม่จำกัด (Compatibility) การ ออกแบบให้ผู้ใช้ส่วนใหญ่เข้าถึงได้มากที่สุด โดยไม่มีการบังคับให้ผู้ใช้ต้องติดตั้งโปรแกรมใดๆ เพิ่มเติม หรือสามารถแสดงผลได้ในทุกๆระบบปฏิบัติการที่มีความละเอียดของหน้าจอที่ต่างกันได้อย่างไม่มีปัญหา
การออกแบบเนวิเกเตอร์ที่ดี
เข้าใจง่าย
มีความสม่ำเสมอ
มีการตอบสนองต่อผู้ใช้
มีความพร้อมและเหมาะต่อการใช้งาน
นำเสนอหลายทางเลือก
มีขั้นตอนสั้นและประหยัดเวลา
มีรูปที่สื่อความหมาย
มีคำอธิบายที่ชัดเจนและเข้าใจได้ง่าย
มีความเหมาะสมกับวัตถุประสงค์ของเว็บไซต์
สนับสนุนเป้าหมายและพฤติกรรมของผู้ใช้
หลักการออกแบบหน้าเว็บ
สร้างลำดับชั้นความสำคัญขององค์ประกอบ (Visual Hierarchy)
หลักสำคัญในการออกแบบหน้าเว็บอย่างหนึ่งก็คือ การสร้างลำดับชั้นความสำคัญขององค์ประกอบต่าง ๆ ภายในหน้าเว็บ เพื่อเน้นให้เห็นว่าอะไรเป็นเรื่องสำคัญมาก สำคัญรองลงไปหรือสำคัญน้อยตามลำดับการจัดระเบียบขององค์ประกอบอย่างเหมาะสม จะช่วยแสดงถึงความสัมพันธ์ระหว่างองค์ประกอบต่าง ๆ ในหน้าเว็บได้ ในการออกแบบคุณจึงควรให้ความสนใจกับปัจจัยเหล่านี้ด้วย
ขนาดเปรียบเทียบ (relative size) ขององค์ประกอบต่าง ๆ ในหน้าเว็บจะช่วยสื่อความหมายถึงความสำคัญของสิ่งหนึ่งต่อสิ่งอื่น ๆ โดยองค์ประกอบที่มีขนาดใหญ่ย่อมสามารถดึงความสนใจของผู้ใช้ได้ก่อน และยังแสดงถึงความสำคัญที่มีเหนือองค์ประกอบขนาดเล็ก ตัวอย่างที่เราเห็นกันอยู่ทั่วไปก็คือ การกำหนดหัวข้อเรื่องต่าง ๆ ให้มีขนาดใหญ่กว่าส่วนของเนื้อหาเสมอ เพื่อแสดงให้ผู้ใช้มองเห็นได้ชัดเจนและเข้าใจจุสำคัญของเนื้อหาได้ดีขึ้น แต่เมื่อใดก็ตามที่คุณกำหนดให้ส่วนของหัวข้อมีขนาดเล็กกว่าเนื้อหาก็จะส่งผลให้ผู้ใช้เกิดความสับสนได้ทันที
ตำแหน่งและลำดับขององค์ประกอบ แสดงถึงลำดับความสำคัญของข้อมูลที่คุณต้องการให้ผู้ใช้ได้รับ เนื่องจากภาษาส่วนใหญ่รวมถึงภาษาไทยและอังกฤษจะอ่านจากซ้ายไปขวา และจากบนลงล่าง คุณจึงควรจัดวางสิ่งที่มีความสำคัญไว้ที่ส่วนบนหรือด้านซ้ายของหน้าอยู่เสมอ เพื่อให้ผู้ใช้มองเห็นได้ก่อน แต่ถ้าคุณจัดวางสิ่งสำคัญไว้ที่ส่วนท้ายของหน้า ผู้ใช้จำนวนมากอาจจะไม่ได้รับข้อมูลนั้น
สีและความแตกต่างของสี แสดงถึงความสำคัญและความสัมพันธ์ของสิ่งต่างๆภายในหน้าสีที่เด่นชัดเหมาะสมสำหรับองค์ประกอบที่มีความสำคัญมาก ส่วนองค์ประกอบที่ใช้สีเดียวกันย่อมสื่อความหมายถึงความสัมพันธ์ที่ใกล้ชิดและความสำคัญที่เท่าเทียมกัน โดยทั่วไปการใช้สีที่แตกต่างกันอย่างชัดเจนจะสามารถดึงดูดความสนใจจากผู้ใช้ให้มองเห็นและตอบสนองอย่างรวดเร็ว แต่การใช้สีที่หลากหลายเกินไปอย่างไม่มีความหมายเต็มไปหมดทั้งหน้า กลับจะสร้างความสับสนให้กับผู้ใช้เสียมากกว่า
ภาพเคลื่อนไหว เป็นสิ่งที่ดึงดูดความสนใจได้เป็นอย่างดี แต่คุณจะต้องใช้อย่างจำกัดและระมัดระวัง เพราะการที่เราใช้สิ่งเคลื่อนไหวในหน้าเว็บมากเกินไปนั้น จะทำให้มีจุดสนใจบนหน้าจอมากมายจนผู้ใช้ตัดสินใจได้ลำบากว่า สิ่งไหนสำคัญกว่ากัน ดังนั้นคุณควรใช้ภาพเคลื่อนไหวโดยมีเป้าหมายที่ชัดเจนว่า จะให้ผู้ชมเพ่งความสนใจไปตรงไหน
ไม่มีความคิดเห็น:
แสดงความคิดเห็น