การออกแบบกราฟิกสำหรับเว็บไซต์
ระบบการวัดชนาดของรูปภาพ
เมื่อจอมอนิเตอร์ทำการแสดงผลรูปภาพในเว็บเพจ พิกเซลในรูปภาพจะจับคู่กันแบบหนึ่งต่อหนึ่งกับพิกเซลตามความละเอียดของหน้าจอ
ทำให้หน่วยการวัดรูปภาพในเว็บจึงเป็นพิกเซล ไม่ใช่นิ้วหรือเซ็นติเมตรแต่อย่างใด
ดังนั้นในกระบวนการ ออกแบบกราฟิกและรูปภาพต่างๆ คุณจึงความลดขนาดเป็นพิกเซลไว้เสมอ
ซึ่งจะมีประโยชน์ในการเปรียบเทียบขนาดกราฟิกกับองค์ประกอบอื่นๆ ในหน้าเว็บ
รวามถึงขนาดวินโดว์ของบราวเซอร์อีกด้วย
ระบบการวัดความละเอียดของรูปภาพ
เนื่องจากรูปภาพในเว็บโดยส่วนใหญ่จะถูกสแดงผ่านหน้าจอมอนิเตอร์
ในทางเทคนิคที่ถูกต้องแล้ว ระบบการวัดความละเอียดของรูปภาพจึงต้องเป็น “Pixels
per inch” (ppi) แต่ก็มีระบบการวัดอีกแบบหนึ่งคือ “Dot
per inch (dpi) ที่ใช้ความละเอียดของรูปถาพที่พิมพ์ออกมา
ซึ่งความละเอียดที่ได้จะขึ้นอยู่กับประสิทธิภาพของเครื่องพิมพ์แต่ละเครื่องในทางปฏิบัติ
หน่วยppi กับ dpi อาจใช้แทนกันได้ ทำให้เป็นที่ยอมรับว่าความละเอียดของรูปภาพในหน้าจอมีหน่วยเป็น dpi แทนท่จะเป็น ppi ที่ถูกต้อง
ความละเอียดของรูปภาพ
โดยปรกติแล้ว
รูปภาพทุกรูปในเว็บไซท์ควรจะมีความละเอียดแค่ 72 ppi ก็ เพียงพอแล้ว เรื่องจากจอมอนิเตอร์องผู้ใช้ส่วนใหญ่มีความละเอียดต่ำ (72
ppi) ดังนั้นแม้ว่ารูปภาพจะมีความละเอียดสูงกว่านี้เราก็ไม่อาจมองเห็นความแตกต่างได้
เมื่อเปรียบเทียบความละเอียดของรูปภาพในเว็บกับในสิ่งพิมพ์
คุณจะเห็นความแตกต่างกันว่ารูปภาพในเว็บมีคุณภาพที่ต่ำกว่า
เนื่องจากมีข้อมูลและรายละเอียดของรูปภาพที่น้อยกว่าทำให้รูปที่ได้มองดูมีลักษณะเป็นจุดเล็กๆ
ซึ่งถือเป็นธรรมชาติของรูปภาพในเว็บ
ปัญหาเกี่ยวกับขนาดไฟล์ของกราฟิก
แม้ว่ากราฟิกและรูปภาพต่างๆ
จะช่วยสึความหมายและสร่างประโยชน์อีกหลายอย่าง
เราควรรู้ถึงข้อเสียของกราฟิกเหล่านี้ไว้บ้าง โดยปรกติ
แล้วข้อมูลในเว็บไซท์ประกอบด้วยไฟล์ HTML ที่เป็นตัวอักษร และกราฟิกหรือรูปภาพเป็นสิ่งสำคัญ
กราฟิกใช้เวลาในการดาวน์โหลดมาก กว่าตัวอักษรหลายเท่า
ดังนั้นกราฟิกขนาดใหญ่อาจใช้เวลาในการสแดงผลนานมาก
เมื่อผู้ใช้ระบบการเชื่อต่อกับอินเตอร์เน็ทที่ค่อนข้างช้า
แม้ว่ากราฟิกของคุณจะออกแบบมาอย่างดีเพียงใด
ถ้าต้องใช้เวลาในการโหลดนาน จรทำให้ผู้ใช้รู้สึกหงุดหงิด
และเปลี่ยนใจไม่รอดูรูปเหล่านั้นสิ่งที่คุณทุ่มเทออกไปไว้ก็จะมีมีความหมาย เพื่อป้องกันปัญหาความล่าช้านี้เราจึงต้องทำการลดขนาดไฟล์กราฟิกลงให้เล็กเข้าไว้ก่อน
ลดขนาดไฟล์กราฟิกสำหรับเว็บ (Optimizing
Web Graphic)
ปัญหาความเชื่องช้าของอินเตอร์เน็ททำให้ผู้ออกแบบเว็บไซท์ต้องระมัดระวังในเรื่องของเวลาที่ใช้ในการดาวน์โหลดเป็นอย่างมาก
แนวทางง่ายๆ
สำหรับผู้มีหน้าที่ออกแบบกราฟิกำหรับเว็บก็คือพยายามทำให้กราฟิกมีขนาดเล็กมากที่สุดเท่าที่จะเป็นไปได้
ทั้งนี้ผู้ออกแบบต้องรู้จักที่จะสร้างความสมดุลระหว่างความสวยงามกับความเร็วในการแสดงผลเรื่องจากการสร้างเว็บโดยไม่มีรูปภาพกราฟิกใดๆ
เลยย่อมไม่น่าสนใจ เพราะกราฟิกมีบทบาทสำคัญในการแนะนำ และสร้างความบันเทิงต่อผู้ชม
ดังนนั้นแนวทางที่ดีที่สุดคือการสร้างเว็บที่มีประสิทธิภาพ
โดยใช้กราฟิกที่แสดงผลได้อย่างรวดเร็ว
การ Optimize กราฟิกจะช่วยลดขนาดไฟล์ให้เล็กลงได้ทำให้แสดงผลได้เร็วขึ้น
และทำให้การปราฏของสีอย่างถูกต้องในหน้าจอของผู้ใช้
**************************************************
ออกแบบเนวิเกชันสำหรับเว็บ
ความสำคัญของระบบเนวิเกชัน
ในชีวิตจริงของเราบางครั้งอาจมีความจำเป็นต้องขับรถไปในที่ๆ
ไม่เคยไปมาก่อน
สิ่งที่ทุกคนปราถนาคือการไปถึงที่หมายโดยไม่หลงทางเพราะนอกจากจะทำให้เราไปไม่ถึงที่หมาย
เสียเวลาเสียพลังงานแล้วยังอาจทำให้อารมณ์เสียได้อีก
โชคดีที่เรามีระบบการป้องกันการจราจรที่ดี เช่นป้ายแสดงชื่อถนน ป้ายแสดงชื่อทางแยก
สิ่งเหล่านี้เมื่อนำมาใช้ปะกอบกันก็จะช่วยให้เรารู้ตำแหน่งปัจจุบันและทิศทางไปสู่จุดหมายได้
เช่นเดียวกับโลกอินเตอร์เน็ท
ที่คุณอาจหลงทางในเว็บไซท์บางแห่งเพราะขาดระบบการนำทางที่ดีทำให้เกิดความรู้สึกสับสนและไม่พอใจ
ขณะที่การออกแบบโครงสร้างข้อมูลที่ดีช่วยให้ผู้ใช้เข้าถึงข้อมูลได้ง่ายขึ้น
ส่วนระบบนิเนวิเกชั่นเป็นส่วนเสริมในการสร้างสิ่งแวดล้อมที่สื่อความหมาย
เพื่อช่วยให้ผู้ใช้ท่องเว็บได้อย่างคล่องตัวโดยไม่หลงทาง
ทำให้ผู้ใช้รู้สึกสบายขณะที่ท่องเว็บ โดยสามารถรู้ว่าตัวเองกำลังอยู่ที่ไหน
ได้ผ่านที่ใดมาบ้าง และควรจะไปทางไหนต่อ
การเข้าถึงข้อมูลอย่างสะดวกเป็นหัวใจสำคัญของระบบเนวิเกชั่น
การมีเนื้อหาในเว็บไซท์ที่ดีจะเป็นสิ่งดึงดูดให้ผู้ใช้เข้ามาใช้บริการอย่างสม่ำเสมอแต่เนื้อหานั้นจะไม่มีประโยชน์เลยถ้าผู้ใช้ค้นหาสิ่งที่ต้องการไม่พบ
ความสำเร็จของเว็บไซท์ส่วนหนึ่งมาจากการที่ผู้ใช้สามารถพึ่งพาระบบเนวิเกชั่นในการนำทางไปถึงที่หมายได้
ระบบเนวิเกชั่นนั้นอาจประกอบด้วยองค์ประกอบหลายๆ อย่าง
เช่นเนวิเกชันบาร์ หรือ pop-up
menu ซึ่งมักจะมีอยู่ในทุกๆ
หน้าของเว็บเพจ และอาจอยู่ในหน้าเฉพาะที่มีรูปแบบป็นระบบสารบัญ ระบบดัชนี หรือ site map ที่สามารถให้ผู้ใช้คลิกผ่านโครงสร้างข้อมูลไปยังส่วนอื่นๆได้
การเข้าใจถึงรูปแบบและองค์ประกอบของระบบเนวิเกชั่นเหล่านี้
จะทำให้คุณออกแบบระบบเนวิเกชันด้วยองค์ประกอบที่เหมาะสมได้อย่างมีประสิทธิภาพ
รูปแบบของเนวิเกชัน
ระบบเนวิเกชันสำหรับเว็บไซท์ขนาดใหญ่มักใช้หลายรูปแบบร่วมกันเพื่อเพิ่มช่องทางการเข้าถึงข้อมูลให้มากขึ้น
ซึ่งผู้ออกแบบควรมีความเข้าใจและเลือกใช้อย่างเหมาะสม
โดยไม่ให้หลากหลายหรือจำกัดเกินไป
ระบบเนวิเกชั่นแบ่งออกเป็น 4 รูปแบบดังนี้
ระบบเนวิกเกชั่นแบบลำดับขั้น (Hierarchical)
ระบบเนวิกเกชันแบบโกลบอล (Global)
ระบบเนวิกเกชั่นแบบโลคอล (Local)
ระบบเนวิกเกชันแบบเฉพาะที่ (Ad Hoc)
องค์ประกอบของระบบเนวิกเกชันหลัก (Main Navigation Elements)
ระบบเนวิกเกชันที่สำคัญและพบได้มากที่สุดคือ
เนวิเกชันที่อยู่ในหน้าเดียวกับเนื้อหา ไม่ใช่เนวิกเกชันที่อยู่ในหน้าแรก
เนื่องจากเมื่อผู้ใช้ผ่านหน้าแรกเข้าไปสู่ภายในเว็บไซท์แล้ว
ก็ไม่อยากจะกลับมาเริ่มต้นใหม่ที่หน้าแรกทุกครั้งก่อนจะเข้าไปดูเนื้อหาในส่วนอื่นๆต่อ
ระบบเนวิเกชันหลักทั้งแบบโกบอลและแบบโลคอล จึงช่วยให้ผู้ใช้สามารถย้ายจากหน้าใดๆ
ไปสู่ส่วนอื่นในเว็บไซท์ได้อย่างคล่องตัว องค์ประกอบของเนวิกเกชันมีได้หลายรูปแบบ
ได้แก่ เนวิเกชั่น,บาเนวิเกชั่นเฟรมPull down, menu, pop-up menu, Imagemap และsearch box เนวิเกชันบาร์ (Nevigation Bar)
เนวิเกชันบาร์เป็นระบบพื้นฐานที่ใช้ได้หลายรูปแบบทั้งแบบลำดับชั้น แบบโกลบอล และแบบโคบอล โดยทั่วไปเนวิเกชันบาร์จะประกอบด้วยกลุ่มของลิงค์ต่าง
ๆ ที่อยู่รวมกันในบริเวณหนึ่งของหน้าเว็บ โดยอาจจะเป็นตัวหนังสือหรือกราฟิกก็ได้ และถือเป็นรูปแบบของระบบเนวิเกชันที่ได้รับความนิยมมากที่สุด
เนวิเกชันบาร์ระบบเฟรม (Frame-Based)
การสร้างเนวิเกชันบาร์โดยใช้ระบบเฟรมเป็นอีกวิธีที่ทำให้ผู้ใช้เข้าถึงเนวิเกชันได้ง่าย
และสม่ำเสมอ คุณสมบัติของเฟรมจะทำให้คุณสามารถแสดงเว็บหลาย
ๆ หน้าไว้ในหน้าต่างบราวเซอร์เดียวกัน โดยที่แต่ละหน้ายังเป็นอิสระต่อกัน การลิงค์จากเฟรมที่เป็นเนวิเกชันบาร์สามารถควบคุมการแสดงผลของข้อมูลในอีกเฟรมหนึ่งได้ ดังนั้นส่วนที่เป็นเนวิเกชันบาร์จะปรากฏอยู่คงที่เสมอ ในขณะที่ผู้ใช้เลื่อนดูข้อมูลใด ๆ ก็ตามในอีกเฟรมหนึ่ง การแยกระบบเนวิเกชันบาร์ออกจากหน้าข้อมูลในลักษณะนี้ จะทำให้ผู้ใช้เข้าถึงระบบเนวิเกชันได้ตลอดเวลา และยังคงความสม่ำเสมอทั่งทั้งเว็บไซต์
อย่างไรก็รตาม การใช้เฟรมในระบบเนวิเกชันนั้น สร้างปัญหาที่สำคัญอีกหลายประการ อาทิเช่น
1. การครอบครองพื้นที่หน้าจอตลอดเวลา
2. รบกวนการทำงานของบราวเซอร์
3. ทำให้เวลาในการแสดงผลช้ายิ่งขึ้น
4. ต้องใช้การออกแบบที่ซับซ้อน
คุณสมบัติสำคัญของระบบเนวิเกชัน
ในปัจจุบันแม้ว่าจะมีโปรแกรมที่ใช้ช่วยในการสร้างเว็บไซต์มากมาย แต่ก็ไม่มีโปรแกรมไหนที่จะช่วยสร้างระบบเนวิเกชันให้คุณได้อย่างมีประสิทธิภาพ การใช้คุณสมบัติพิเศษ On Mouse Over หรือ Image Map ก็ไม่สามารถช่วยอะไรได้มากนัก ในการออกแบบเว็บไซต์ต้องรู้หลักนการสร้างเนวิเกชันที่เหมาะสม เพื่อจะสื่อถึงเนื้อหาได้อย่างชัดเจนและน่าสนใจ จากนั้นจึงใช้โปรแกรมต่าง ๆ ช่วยสร้างสิ่งเหล่านั้นให้สำเร็จขึ้นมา คุณสมบัติของระบบเนวิเกชันทั้ง 10 ประการต่อไปนี้ ไม่ได้รวมกันเป็นสูตรสำเร็จแต่อย่างใด แต่จะเป็นส่วนช่วยให้เข้าใจในหลักการ และนำไปใช้ในการะบวนการออกแบบได้อย่างดี
ระบบเนวิเกชันที่มีประสิทธิภาพ ควรมีคุณสมบัติดังนี้
o เข้าใจง่าย
o มีความสม่ำเสมอ
o มีการตอบสนองต่อผู้ใช้
o มีความพร้อมและเหมาะสมต่อการใช้งาน
o นำเสนอหลายทางเลือก
o มีขั้นตอนสั้นและประหยัดเวลา
o มีรูปแบบที่สื่อความหมาย
o มีคำอธิบายที่ชัดเจนและเข้าใจได้ง่าย
o เหมาะสมกับวัตถุประสงค์ของเว็บไซต์
o สนับสนุนเป้าหมายและพฤติกรรมของผู้ใช้
****************************************************
ไม่มีความคิดเห็น:
แสดงความคิดเห็น