LECTURE

ออกแบบหน้าเว็บ 
หลักสำคัญในการออกแบบหน้าเว็บ

คือ การใช้รูปภาพและองค์ประกอบต่างๆ ร่วมกัน เพื่อสื่อความหมายเกี่ยวกับเนื้อหาหรือลักษณะสำคัญของเว็บให้น่าสนใจ บนพื้นฐานของความเรียบง่ายและสะดวกของผู้ใช้

หลักการออกแบบหน้าเว็บ

         1.สร้างลำดับชั้นความสำคัญขององค์ประกอบ
         2.สร้างรูปแบบ บุคลิก สไตล์
         3.สร้างความสม่ำเสมอตลอดทั่วทั้งเว็บไซต์
         4.จัดวางองค์ประกอบที่สำคัญไว้ในส่วนบนของหน้า
         5.สร้างจุดสนใจด้วยความแตกต่าง
         6.จัดแต่งหน้าเว็บให้เป็นระเบียบและเรียบง่าย
         7.ใช้กราฟิกอย่างเหมาะสม

 เราสามารถใช้ประโยชน์จากเว็บได้ 2 แนวทาง
       1.การใช้เป็นสื่อโดยตรงให้อ่านบนหน้าจอ
       2.การใช้เป็นสื่อกลางในการพิมพ์ข้อมูลลงในหน้ากระดาษเพื่อเก็บรวบรวมหรืออ่านภายหลัง

รูปแบบโครงสร้างหน้าเว็บ แบ่งเป็น 4 รูปแบบ
    1.โครงสร้างหน้าเว็บในแนวตั้ง ได้รับความนิยมมากที่สุด เพราะมีรูปแบบที่ง่ายในการพัฒนาและมีข้อจำกัดน้อยสุดเมื่อเทียบกับรูปแบบอื่น
    2.โครงสร้างหน้าเว็บในแนวนอน ต้องอาศัยความคิดสร้างสรรค์และความพยายามมากกว่าปรกติ เนื่องจากมีข้อจำกัดและสิ่งที่ต้องระวังค่อนข้างมาก
    3.โครงสร้างหน้าเว็บที่พอดีหน้าจอ รูปแบบนี้ใช้พื้นที่น้อยกว่าเว็บทั่วไปและมักจะจัดอยู่ตรงกึ่งกลางของหน้าจอ จะไม่มี Scroll Bar
    4.โครงสร้างหน้าเว็บแบบสร้างสรรค์ รูปแบบนี้อยู่เหนือกฎเกณฑ์ มักมีรูปแบบและการจัดวางองค์ประกอบเฉพาะตัวที่คาดไม่ถึง มักจะเป็นเว็บของศิลปิน นักออกแบบ บริษัทโฆษณา

 ส่วนประกอบของหน้าเว็บ แบ่งเป็น 3 ส่วน
   1.ส่วนหัว (Page Header)
   2.ส่วนเนื้อหา (Page Body)
   3.ส่วนท้าย (Page Footer)

จัดระบบข้อมูลในเว็บ  

ปัญหาความคลุมเครือของกลุ่มข้อมูล

 - การแบ่งข้อมูลต้องอาศัยพื้นฐานทางด้านภาษามาช่วยเพราะคำหนึ่งคำมีความหมายได้หลายอย่างในเหตุการณ์ต่างกัน

 - การแบ่งหมวกหมู่ในเว็บมักจะเกี่ยวข้องกับสิ่งที่เป็นนามธรรม เช่น หัวเรื่องหรือข้อความ ดังนั้นจึงเป็นการยากที่จะทำให้ทุกคนเข้าใจระบบการจัดกลุ่มข้อมูลที่เราได้ออกแบบไว้

การจัดลำดับความสำคัญของข้อมูล

       ได้แก่ การจัดกลุ่มข้อมูลการกำหนดตำแหน่งของข้อมูลและเทคนิคที่ใช้นำเสนอผู้ออกแบบควรจัดกลุ่มข้อมูลที่มีความสัมพันธ์กันให้อยู่ในกลุ่มเดียวกัน โดยรูปแบบการจัดกลุ่มข้อมูลอาจกระทำได้หลายลักษณะ หลักการออกแบบโครงสร้างระบบข้อมูลแบบลำดับชั้นควรมีจำนวน 7 บวกลบ 2 รายการในเมนูที่มีจำนวนรายการมากกว่า 10 จะสร้างความรู้สึกว่ามากเกินไปส่วนความลึกไม่ควรเกิน 4-5 ชั้น เพราะจะทำให้ผู้ใช้อาจหมดหวังและเลิกล้มความตั้งใจได้ โครงสร้างระบบข้อมูลแบบไฮเปอร์เท็กซ์มีลักษณะคล้ายเครือข่ายโยงใยโครงสร้างระบบนี้แบ่งเป็น 2 ส่วนคือ รายการ หรือกลุ่มข้อมูลที่ถูกลิงค์กับลิงค์ที่เชื่อมโยงข้อมูลเหล่านั้นส่วนใหญ่จึง มักนำระบบนี้มาใช้เป็นส่วนเสริมให้กับโครงสร้างข้อมูลแบบลำดับชั้น

โครงสร้างข้อมูลแบบฐานข้อมูล 

   มักนิยมใช้กับเว็บขนาดใหญ่ การนำระบบฐานข้อมูลมาใช้ในเว็บจะช่วยเพิ่มความสามารถในการค้นหาข้อมูลได้อย่างรวดเร็วและถูกต้อง แต่เป็นเรื่องยากที่จะเอาข้อมูลทั้งหมดมาไว้ในฐานข้อมูล

 

ออกแบบกราฟิกสำหรับเว็บไซต์  

-รูปแบบกราฟิกสำหรับเว็บไซต์

-รูปแบบหลักมี 2 ประเภท คือ GIF และ JPG

-GIF ย่อมาจากคำว่า Graphic Interchange Format

-ได้รับความนิยมในยุคแรก

-มีระบบสีแบบ Index ซึ่งมีข้อมูลสีขนาด 8 บิต ทำให้มีสีมากสุด 256 สี

-มีการบีบอัดข้อมูลตามแนวของพิกลเซล เหมาะสำหรับกราฟิกที่ประกอบด้วยสีพื้น

-JPG ย่อมาจากคำว่า Joint Photographic Experst Group

-มีข้อมูลสีขนาด 24 บิต (True Color) สามารถแสดงสีได้ถึง 16.7ล้านสี

-ใช้ระบบการบีบอัดที่มีลักษณะที่สูญเสีย (lossy)

-ไฟล์ประเภทนี้ควรนำไปใช้กับรูปถ่ายหรือกราฟิกที่มีการไล่ระดับสีอย่างละเอียดระบบการวัดความละเอียดของรูปภาพ