หลักการออกแบบและการพัฒนาการนำเสนอผ่านเว็บ

หลักการออกแบบพื้นฐานและการออกแบบเว็บไซต์

เมื่อเรากล่าวถึงการออกแบบนั่นย่อมกินความไปอย่างกว้างขวาง การออกแบบไม่ได้มีความหมายหรือคุณค่าเฉพาะในตัวเองเท่านั้น แต่งานออกแบบเป็นตัวกำหนดหรือเสริมคุณค่าให้กับสิ่งใดสิ่งหนึ่ง ซึ่งหวังผลจะให้ได้คุณค่าทางความงาม เช่น การสร้างสรรค์จิตกรรมของศิลปิน ก็เริ่มต้นด้วยการออกแบบ ส่วนจะออกแบบไว้ล่วงหน้าหรือออกแบบไปพร้อมกับการสร้างสรรค์งานก็ได้
การออกแบบใดๆ ก็ตาม ย่อมได้รับการปรับปรุงเปลี่ยนแปลงอยู่ตลอดเวลา มนุษย์ไม่เคยพึงพอใจกับสิ่งใดสิ่งหนึ่งโดยไม่มีการเปลี่ยนแปลง ต่อเมื่อมีการพัฒนาเปลี่ยนแปลงให้เหมาะสมกับประโยชน์และความพึงพอใจแต่ละ ช่วงเวลา สิ่งนั้นจึงจะได้รับการยอมรับเป็นอย่างดี งานออกแบบทั้งหลายจึงปฏิเสธการพัฒนาไม่ได้
ความหมายของการออกแบบ

การออกแบบ (Design) จากหนังสือ Webster Dictionary ได้ให้ความหมายไว้ดังนี้
1. คือ โครงการหรือแผนงานที่กำหนดไว้ในสมอง ซึ่งประกอบด้วยวิธีการและจุดหมายปลายทางไว้เรียบร้อยแล้ว
2. คือ จุดมุ่งหมายที่ได้กำหนดไว้ในการทำงานเป็นรายบุคคลหรือเป็นกลุ่ม
3. คือ การร่างแบบงานจะเป็นโดยวิธีสเก็ตช์บนกระดาษ หรือปั้นด้วยดินเหนียว
4. การจัดส่วนมูลฐานต่างๆ ซึ่งจะทำให้เกิดงานศิลปะ

จากความหมายข้างต้น สามารถให้ความหมายของนักออกแบบ (Designer) ได้ว่านักออกแบบ คือ ผู้คิดค้นหาแนวทางใหม่ๆ ในการผสมผสานรูปร่าง (Shapes) และสีสัน(Colors) โดยที่นักออกแบบที่ดีจะมีคุณสมบัติต่อไปนี้
1. ต้องเป็นผู้ที่มีประสบการณ์มาก และหลักการต่างๆ ที่จะนำมาใช้นั้นควรตั้งอยู่บนประสบการณ์ที่ได้พบมาในชีวิต
2. ศึกษาความต้องการของคน เพราะการออกแบบที่ดีนั้นต้องมาจากความเป็นจริง และสามารถตอบสนองความต้องการของคนในขณะนั้นได้
3. มีความคิดริเริ่มสร้างสรรค์ สามารถที่จะสร้างสรรค์งานออกมาด้วยความสามารถของตนเอง
4. สามารถถ่ายทอดความคิดของตนออกมาให้ผู้อื่นเข้าใจได้ โดยการเขียนเป็นรูปร่างหรือทำหุ่นจำลอง
5. มีความรู้ความเข้าใจในเรื่องวัสดุต่างๆ และกระบวนการทำงานเป็นอย่างดี
สิ่งที่นักออกแบบจะต้องคำนึงถึงเมื่อมีการออกแบบ ดังนี้
1. ออกแบบแล้ว เกิดประโยชน์ใช้สอยที่ดี
2. ออกแบบแล้ว มีความงามตามความต้องการ
3. ผลงานออกแบบที่ดีต้องให้ความพอใจประทับใจแก่ผู้พบเห็น
4. ผลงานออกแบบที่ดีต้องเลือกวัสดุได้อย่างเหมาะสมกับงานออกแบบ
5. การออกแบบที่ดีต้องรู้จักประหยัด

ความสำคัญและความจำเป็นของการออกแบบ

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

นอกจากนี้ มีความจำเป็นที่ต้องมีการออกแบบ ดังต่อไปนี้
1. เป็นเครื่องช่วยในการถ่ายทอดทางความคิดและความรู้สึกของตนให้ผู้อื่นทราบ และเข้าใจโดยการใช้เส้น สีนำมาประกอบกันเข้าให้เป็นรูปร่างโดยให้ผู้อื่นเข้าใจในสิ่งนั้นด้วย
2. เป็นการช่วยในการวางรูปหรือโครงสร้างนั้นๆ ให้เหมาะสมกับหน้าที่ ตลอดจนการใช้สอยด้วย
3. ช่วยให้ผู้พบเห็นเกิดความรู้สึกคล้อยตามในด้านความงามและคุณค่า
4. เป็นส่วนหนึ่งที่จะช่วยให้เกิดการค้นคว้าการทดลอง ทั้งในด้านวัสดุและวิธีการใหม่ๆ

หลักการออกแบบที่ดี

การออกแบบที่ดี ซึ่งถือว่าเป็นหัวใจของการออกแบบนั้นต้องมีหลักเกณฑ์ในการยึดถือปฏิบัติที่ถูกต้อง ซึ่งเป็นสิ่งจำเป็นสำหรับนักออก แบ่งออกได้ดังนี้
1. หน้าที่ของการนำไปใช้ (Function) เป็นสิ่งแรกที่นักออกแบบจะต้องคำนึงถึงเป็นอย่างยิ่งเพราะของแต่ละอย่างมี หน้าที่ในการใช้สอยไม่เหมือนกัน การออกแบบจะต้องออกแบบให้เหมาะสมที่สุดและถูกต้องมากที่สุด เช่น เครื่องปั้นดินเผาจะนำมาใช้ประโยชน์แทนโลหะย่อมไม่ได้
2. การประหยัด (Economy) การประหยัดในที่นี้อาจจะหมายถึงการประหยัดวัสดุและเงินทองที่จะนำมาลงทุน ด้วย สิ่งต่างๆ ที่มีคุณภาพดีเลิศขนาดไหนก็ตาม ถ้าราคาในการผลิตสูงแล้วไม่ถือว่าเป็นการออกแบบที่ถูกต้อง นอกจากจะมีราคาสูงแล้ว แบบที่ออกไปนั้นก็ควรเป็นแบบที่ง่ายและเหมาะ
3. ความทนทาน (Durability) การออกแบบที่ดีนั้นนอกจากจะประหยัดแล้ว ยังต้องคำนึงถึงความทนทานด้วย วัสดุอะไรก็ตามถึงแม้ว่าจะมีราคาถูก รูปแบบจะสวยงามขนาดไหนก็แล้วแต่ ถ้าขาดความทนทานคุณค่าของสิ่งนั้นๆ ก็จะด้อยลงไปทันที
4. วัสดุ (Material) การเลือกวัสดุต่างๆ ที่จะนำมาใช้งานนั้น นอกจากจะประหยัดแล้วเราถือว่าเป็นสิ่งสำคัญอย่างหนึ่ง เพราะว่าจะต้องเหมาะสมกับประโยชน์ใช้สอย ความคงทนถาวร เช่น ถ้าเราจะสร้างบ้านเราก็ควรจะสร้างโมเดล (Model) เสียก่อนว่าบ้านหลังนี้เมื่อสร้างเสร็จแล้วจะใช้วัสดุอะไร จำนวนเท่าไหร่ จึงจะเหมาะสมและถูกต้อง สวยงาม ทนทาน เป็นต้น
5. โครงสร้าง (Construction) โครงสร้างของสิ่งต่างๆ ไม่เหมือนกัน ฉะนั้นผู้ออกแบบจะต้องศึกษาโครงสร้าง หรือธรรมชาติของสิ่งเหล่านั้นให้เข้าใจเป็นอย่างดีเสียก่อน จึงจะเป็นนักออกแบบที่ดีได้
6. ความงาม (Beauty) ถ้าสิ่งต่างๆที่นักออกแบบได้กระทำขึ้นโดยคำนึงถึงสิ่งต่างๆ ที่กล่าวมาแล้วนั้นยังไม่เป็นการเพียงพอ สิ่งที่ตามมาอีกอย่างหนึ่งที่ขาดเสียไม่ได้คือ เรื่องความสวยงาม ถ้าเรายังจำสุภาษิตที่ว่า “ไก่งามเพราะขน คนงามเพราะแต่ง” ความงาม คืออะไร ความงาม คือ ความพอดี ไม่มากไม่น้อยเกินไป การตกแต่งหรือการออกแบบนั้น จึงจะเหมาะสมและสวยงาม เพราะเชื่อว่าทุกคนชอบความสวยงามด้วยกันทั้งนั้น การออกแบบก็เช่นเดียวกัน การออกแบบถือว่าเป็นคุณสมบัติที่ขาดไม่ได้
7. ลักษณะเด่นพิเศษเฉพาะอย่าง (Personality) ไม่ว่าสิ่งที่มนุษย์สร้างขึ้นหรือเกิดขึ้นเองตามธรรมชาติก็จะถือว่ามีลักษณะ เด่นประจำตัวของมันอยู่เช่นเดียวกัน แต่ถ้าเป็นสิ่งที่มนุษย์ออกแบบแล้ว จะต้องเน้นจุดดีของแต่ละสิ่งออกมาให้เห็นเด่นชัด จึงจะถือได้ว่าการออกแบบนั้นสมบูรณ์ เช่น การออกแบบเครื่องตกแต่งว่าจะจัดตรงไหนให้เด่นและสวยงาม สะดุดตากว่าจุดอื่นๆ จึงควรเน้นจุดนั้นเป็นพิเศษกว่าที่อื่น

วิธีการออกแบบ

วิธีการออกแบบสามารถแบ่งออกเป็นหัวข้อย่อยๆ ได้ดังนี้
1. การออกแบบที่เป็นไปตามธรรมชาติ (Natural Design) นักออกแบบอาจจะได้แรงบันดาลใจในการออกแบบผลงานจากสิ่งที่เห็นได้ในธรรมชาติ เช่น ดอกไม้ ใบไม้ คน สัตว์ ทิวทัศน์ นำสิ่งที่เห็นนั้นมาจัดองค์ประกอบ (Composition) และอาจตกแต่งเพิ่มเติมตามความเหมาะสมให้งานชิ้นนั้นสวยงามสมบูรณ์
2. การออกแบบเรขาคณิต (Geometrical Design) คือ การออกแบบโดยใช้รูปทรงเรขาคณิตเช่น สามเหลี่ยม สี่เหลี่ยม วงกลม เป็นต้น มาประกอบกันเป็นรูปร่างต่างๆ ตามต้องการ
3. การออกแบบนามธรรม (Abstract Design) คือ การออกแบบที่ไม่แสดงเนื้อหาแต่มุ่งเน้นความสวยงาม และความรู้สึกของผู้ดู อาจได้แรงดลใจ ได้ความคิดจากธรรมชาติก็ได้ เป็นการออกแบบที่ทำได้หลายแง่มุม หลากหลายความคิด
4. การออกแบบตกแต่ง (Decorative Design) คือ การออกแบบตกแต่งให้ดูสวยงามน่าชม ไม่ว่าจะเป็นการออกแบบตกแต่งอาคารร้านค้า ออกแบบตกแต่งสภาพแวดล้อม ออกแบบลายผ้า เครื่องประดับ เป็นต้น
5. การออกแบบคติกำหนด (Conventional Design) คือ การออกแบบโดยกำหนดขึ้นเองว่าสิ่งนี้แทนสิ่งนั้นที่ผู้ออกแบบต้องการ ซึ่งความจริงอาจไม่มีอยู่ สิ่งที่ออกแบบอาจจะได้ความคิดจากธรรมชาติ แต่มุ่งตกแต่งเพิ่มเติมให้ความสวยงาม และเป็นไปตามความต้องการ เช่นพระพุทธรูป อันประกอบด้วยศิลปะและอุดมคติ สร้างขึ้นตามความคิดเกี่ยวกับรูปร่างที่สมบูรณ์ที่เรียกว่า “มหาบุรุษลักษณะ” ศิลปกรรมสมัยคลาสสิคของกรีกก็เช่นกัน เป็นการผสมผสานลักษณะของคนจริงๆ ความเป็นศิลปะ และอุดมคติเข้าด้วยกัน ซึ่งจะไม่พบเห็นคนที่รูปร่างอย่างนั้น
6. การออกแบบกระจายลวดลาย (All over Design) เป็นการออกแบบตามใจชอบ อาจจะมีลายที่ซ้ำหรือไม่ซ้ำกัน การออกแบบประเภทนี้มุ่งเน้นเรื่องช่วงระยะ (Space) เป็นสำคัญ
7. การออกแบบลวดลายซ้ำกัน (Repeated Design) หมายถึง การออกแบบที่มีลวดลายซ้ำๆกัน เช่น ลายผ้า ลายถ้วยชาม ซึ่งจะมีลายซ้ำเรียงลำดับอย่างสวยงาม เป็นจังหวะโดยเว้นช่องว่างที่เท่ากันพองาม

หลักการออกแบบเว็บไซต์

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

องค์ประกอบของการออกแบบเว็บไซต์

การออกแบบเว็บไซต์ที่มีประสิทธิภาพนั้นต้องคำนึงถึง องค์ประกอบสำคัญดังต่อไปนี้
1. ความเรียบง่าย (Simplicity)
หมาย ถึง การจำกัดองค์ประกอบเสริมให้เหลือเฉพาะองค์ประกอบหลัก กล่าวคือในการสื่อสารเนื้อหากับผู้ใช้นั้น เราต้องเลือกเสนอสิ่งที่เราต้องการนำเสนอจริง ๆ ออกมาในส่วนของกราฟิก สีสัน ตัวอักษรและภาพเคลื่อนไหว ต้องเลือกให้พอเหมาะ ถ้าหากมีมากเกินไปจะรบกวนสายตาและสร้างความคำราญต่อผู้ใช้
ตัวอย่าง เว็บไซต์ที่ได้รับการออกแบบที่ดี ได้แก่ เว็บไซต์ของบริษัทใหญ่ ๆ อย่างเช่น Apple Adobe Microsoft หรือ Kokia ที่มีการออกแบบเว็บไซต์ในรูปแบบที่เรียบง่าย ไม่ซับซ้อน และใช้งานอย่างสะดวก

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

3. ความเป็นเอกลักษณ์ (Identity)
ใน การออกแบบเว็บไซต์ต้องคำนึงถึงลักษณะขององค์กรเป็นหลัก เนื่องจากเว็บไซต์จะสะท้อนถึงเอกลักษณ์และลักษณะขององค์กร การเลือกใช้ตัวอักษร ชุดสี รูปภาพหรือกราฟิก จะมีผลต่อรูปแบบของเว็บไซต์เป็นอย่างมาก ตัวอย่างเช่น ถ้าเราต้องออกแบบเว็บไซต์ของธนาคารแต่เรากลับเลือกสีสันและกราฟิกมากมาย อาจทำให้ผู้ใช้คิดว่าเป็นเว็บไซต์ของสวนสนุกซึ่งส่งผลต่อความเชื่อถือของ องค์กรได้

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

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

6. คุณภาพของสิ่งที่ปรากฏให้เห็นในเว็บไซต์ (Visual Appeal)
ลักษณะ ที่น่าสนใจของเว็บไซต์นั้น ขึ้นอยู่กับความชอบส่วนบุคคลเป็นสำคัญ แต่โดยรวมแล้วก็สามารถสรุปได้ว่าเว็บไซต์ที่น่าสนใจนั้นส่วนประกอบต่าง ๆ ควรมีคุณภาพ เช่น กราฟิกควรสมบูรณ์ไม่มีรอยหรือขอบขั้นบันได้ให้เห็น ชนิดตัวอักษรอ่านง่ายสบายตา มีการเลือกใช้โทนสีที่เข้ากันอย่างสวยงาม เป็นต้น

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

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

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

การออกแบบเว็บไซต์

ในการออกแบบเว็บไซต์นั้นประกอบด้วยกระบวนการต่าง ๆ มากมาย เช่น การออกแบบโครงสร้าง ลักษณะหน้าตา หรือการเขียนโปรแกรม แต่มีหลายคนที่พัฒนาเว็บไซต์ โดยขาดการวางแผนและทำงานไม่เป็นระบบ ตัวอย่างเช่น การลงมือออกแบบโดยการใช้โปรแกรมช่วยสร้างเว็บ เนื้อหาและรูปแบบก็เป็นไปตามที่นึกขึ้นได้ขณะนั้น และเมื่อเห็นว่าดูดีแล้วก็เปิดตัวเลย ทำให้เว็บนั้นมีเป้าหมายและแนวทางที่ไม่แน่นอน ผลลัพธ์ที่ได้จึงเสี่ยงกับความล้มเหลวค่อนข้างมาก
การออกแบบเว็บไซต์อย่างถูกต้องจะช่วยลดความผิดพลาด และช่วยลดความเสี่ยงที่จะทำให้เว็บประสบความล้มเหลว การออกแบบเว็บไซต์ที่ดีต้องอาศัยการออกแบบและจัดระบบข้อมูลอย่างเหมาะสม
ในกระบวนการออกแบบเว็บไซต์นั้น สิ่งที่ต้องทำเป็นอันดับแรก คือ การจัดระบบโครงสร้างข้อมูล หมายความว่าต้องพิจารณาว่าเว็บไซต์ควรจะมีข้อมูลและการทำงานใดบ้าง ด้วยการสร้างแผนผังโครงสร้างก่อนที่จะลงมือพัฒนาเว็บไซต์ โดยเริ่มจากการกำหนดเป้าหมายของเว็บไซต์และกลุ่มผู้ใช้เป้าหมาย ต่อมาพิจารณาถึงเนื้อหาและการใช้งานที่จำเป็น แล้วนำมาจัดกลุ่ม ให้เป็นระบบจากนั้นก็ถึงเวลาในการออกแบบโครงสร้างข้อมูลในหน้าเว็บให้พร้อม ที่จะนำไป ออกแบบกราฟิกและหน้าตาต่อไป

การจัดระบบโครงสร้างข้อมูล เป็นพื้นฐานที่สำคัญในการออกแบบเว็บไซต์ที่ดีที่จะช่วยคุณพัฒนาแบบแผนราย ละเอียดข้อมูลในการออกแบบเว็บไซต์ ซึ่งได้แก่ รูปแบบการนำเสนอระบบการทำงาน แบบจำลอง ระบบเรวิเกชั่น และอินเตอร์เฟสของเว็บ

1. ออกแบบเพื่อผู้ใช้ (Design for Users)
กระบวน การแรกของการออกแบบเว็บไซต์คือการกำหนดเป้าหมายของเว็บไซต์กำหนดกลุ่มผู้ใช้ ซึ่งการจะให้ได้มาซึ่งข้อมูล ผู้พัฒนาต้องเรียนรู้ผู้ใช้ หรือจำลองสถานการณ์ สิ่งเหล่านี้จะช่วยให้เราสามารถออกแบบเนื้อหาและการใช้งานเว็บไซต์ได้อย่าง เหมาะสม ตรงกับความต้องการของผู้ใช้อย่างแท้จริง

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

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

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

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

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

1.4 ข้อมูลหลักที่ควรมีอยู่ในเว็บไซต์
เมื่อ เราทราบถึงความต้องการที่ผู้ใช้ต้องการได้รับเมื่อเข้าชมเว็บไซต์หนึ่ง ๆ แล้ว เราก็ออกแบบเว็บไซต์ให้มีข้อมูลที่ผู้ใช้ต้องการ ซึ่งข้อมูลต่อไปนี้ เป็นสิ่งที่ผู้ใช้ส่วนใหญ่คาดหวังจะได้รับเมื่อเข้าไปชมเว็บไซต์
- ข้อมูลเกี่ยวกับบริษัท
- รายละเอียดของผลิตภัณฑ์
- ข่าวความคืบหน้าและข่าวจากสื่อมวลชน
- คำถามยอดนิยม
- ข้อมูลในการติดต่อ

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

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

2.1 แบบแผนของระบบข้อมูล
แบบแผนของระบบข้อมูล (Organizational Schemes) คือการกำหนดลักษณะพื้นฐานของข้อมูลภายในกลุ่มเดียวกัน ซึ่งตัวอย่างของระบบแบบแผนข้อมูลในชีวิตประจำวันได้แก่ สมุดโทรศัพท์ หรือการจัดวางสินค้าในร้านหรือห้างสรรพสินค้า ซึ่งแบบแผนของระบบข้อมูลมีหลายรูปแบบดังนี้
- แบบแผนระบบข้อมูลแบบแน่นอน (Exact Organizational Schemes) เกิดจากการแบ่งข้อมูลออกเป็นกลุ่มที่แน่นอน ตัวอย่างเช่น ระบบข้อมูลตามตัวอักษร ระบบข้อมูลตามลำดับเวลา หรือระบบข้อมูลตามลำดับพื้นที่ ซึ่งข้อดีของระบบนี้คือ ออกแบบง่าย ดูแลง่าย และยังง่ายต่อการใช้งาน แต่ข้อเสีย คือ ผู้ใช้จำเป็นต้องรู้ถึงชื่อและรายละเอียดของสิ่งที่ต้องการจะค้นมิฉะนั้นอาจ หาไม่เจอ
- แบบแผนระบบข้อมูลแบบไม่แน่นอน (Ambiguous Organizational Schemes) เป็นการจัดข้อมูลให้เป็นกลุ่มโดยไม่มีการกำหนดแน่นอน ซึ่งยากต่อการออกแบบดูแลและใช้งาน แต่ในปัจจุบันการออกแบบระบบข้อมูลแบบนี้ เป็นที่นิยมกันมาก เนื่องจากผู้ใช้อินเตอร์เน็ตบางคนไม่รู้ว่าสิ่งที่กำลังค้นหาคืออะไร ซึ่งอาจจะรู้บางส่วนแต่ยังไม่แน่ใจนักแต่อุปสรรคของการค้นหาข้อมูลวิธีนี้ คือ อาจจะใช้เวลานานและต้องทำหลายครั้ง
ตัวอย่างของแบบแผนข้อมูลแบบไม่แน่นอนได้แก่
1. จัดกลุ่มข้อมูลตามหัวข้อ คือการกำหนดหัวข้อที่เข้าใจง่ายและไม่กว้าง
2. จัดกลุ่มข้อมูลตามผู้ใช้ คือการแบ่งกลุ่มผู้ใช้ออกตามความสนใจของกลุ่ม
3. จัดกลุ่มข้อมูลตามการทำงาน คือแบ่งเนื้อหาตามกระบวนการและหน้าที่
4. จัดกลุ่มข้อมูลตามแบบจำลอง คือการใช้แบบจำลองในการแยก ซึ่งมักจะใช้กับข้อมูลที่ผู้ใช้คุ้นเคยอยู่แล้ว
- แบบแผนข้อมูลแบบผสม (Hybrid Schemes) เนื่องจากว่าการเลือกใช้แบบแผนระบบข้อมูลแบบใดแบบหนึ่งไปแล้ว ก็ยังไม่อาจอำนวยความสะดวกต่อผู้ใช้ได้ จึงอาจจะมีการจัดสร้างแบบแผนข้อมูลอีกแบบหนึ่งเพิ่มลงไป ซึ่งหากต้องการสร้างแบบแผนข้อมูลแบบผสม ควรแยกส่วนของการนำเสนอที่แตกต่างกันให้อยู่คนละที่ หรือทำให้มีลักษณะแตกต่างกัน

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

2. โครงสร้างข้อมูลแบบไฮเปอร์เท็กซ์ (Hypertext)
เป็นโครง สร้างข้อมูลแบบใหม่ที่มีลักษณะคล้ายเครือข่ายโยงใย โครงสร้างระบบนี้ประกอบด้วยองค์ประกอบ สองส่วนคือส่วนรายการหรือกลุ่มข้อมูลที่ถูกลิงค์ กับลิงค์ที่เชื่อมโยงข้อมูล เมื่อสองสิ่งนี้รวมกันจะเกิดระบบการเชื่อมโยงข้อมูลประเภทต่าง ๆ ไม่ว่าจะเป็นตัวอักษร ข้อมูล รูปภาพ เสียง หรือภาพยนตร์ การเชื่อมโยงอาจเป็นไปตามลำดับชั้นหรือไม่เป็นลำดับชั้น หรือทั้งสองอย่างรวมกันก็เป็นได้
จากความยืดหยุ่นของระบบไฮเปอร์เท็ก ซ์ อาจจะทำให้มีการเชื่อมโยงข้อมูลที่ซับซ้อนเกินไป จนทำให้ผู้ใช้สับสนและไม่สามารถคำนึงถึงโครงสร้างรวมของเว็บไซต์ได้

3. โครงสร้างข้อมูลแบบฐานข้อมูล (Database Model)
โดย ทั่วไปแล้วโครงสร้างข้อมูลแบบฐานข้อมูลมักจะเป็นที่นิยมนำมาใช้กับเว็บขนาด ใหญ่ โดยตจะมีผู้รับผิดชอบเรื่องระบบฐานข้อมูลโดยเฉพาะ ฐานข้อมูลเป็นระบบข้อมูลที่เป็นที่นิยมมากประเภทหนึ่ง โดยข้อมูลจะถูกจัดให้อยู่ในรูปแบบแถวและคอลัมน์ ด้วยกฎเกณฑ์บางอย่างที่มีการกำหนดไว้เฉพาะฐานข้อมูลนั้น ๆ การนำระบบฐานข้อมูลเข้ามาใช้จะช่วยเพิ่มความสามารถในการค้นหาข้อมูลได้อย่าง ถูกต้องรวดเร็ว นอกจากนี้ยังช่วยเพิ่มความสะดวกในการดูแลและปรับปรุงเนื้อหาอย่างมี ประสิทธิภาพอีกด้วย

ออกแบบระบบเว็บเนวิเกชั่น (Designing Web Navigation)
มีผู้กล่าวเอาไว้ว่าระบบเว็บเนวิเกชั่น เปรียบเสมือนป้ายบอกทาง ถ้าหากเราขับรถไปตามถนนโดยไม่มีป้ายบอกทาง เราก็อาจหลงทางได้ แต่ถ้ามีป้ายบอกทาง เราก็สามารถเดินทางไปยังเป้าหมายที่ตั้งเอาไว้ได้ หรือทำให้เราทราบตำแหน่งที่อยู่ของเราในปัจจุบันได้ เช่นเดียวกัน หากเราเข้าไปในอินเตอร์เน็ต อาจทำให้เราหลงทางได้ เพราะเว็บไซต์บางแห่งขาดระบบนำทางที่ดี โดยปกติแล้วการออกแบบโครงสร้างของเว็บที่ดี ก็มีส่วนให้ผู้ใช้เข้าถึงข้อมูลได้ง่ายขึ้น ส่วนระบบเนวิเกชั่นนั้น เป็นส่วนเสริมในการสร้างสิ่งแวดล้อมที่สื่อความหมาย เพื่อให้ผู้ใช้สามารถท่องเว็บได้โดยไม่หลงทาง ผู้ใช้จะไม่มีความกังวลใจว่า ขณะนี้ตนเองกำลังอยู่ที่ใด ได้ผ่านที่ไหนมาบ้างและกำลังจะไปไหนต่อ
หัวใจสำคัญของระบบเนวิเกชั่น คือ การเข้าถึงข้อมูลอย่างสะดวก ไม่ว่าเนื้อหาในเว็บไซต์จะดีเพียงใดก็จะไม่มีประโยชน์ ถ้าหากผู้ใช้ไม่สามารถเข้าถึงเนื้อหานั้นได้ โดยปกติแล้วในการทำงานของเว็บบราวเซอร์ ก็มีระบบเนวิเกชั่นอยู่แล้ว ตัวอย่างเช่น ปุ่ม Back Forward หรือ History เป็นต้น หรือแม้กระทั่งลิงค์ของเว็บไซต์ ที่ใช้สีในการสื่อความหมายว่าข้อความส่วนใดเป็นส่วนที่ลิงค์ได้ และหลังจากที่เคยลิงค์ไปแล้ว เว็บบราวเซอร์ก็ยังสามารถบอกได้ว่าส่วนใดเคยลิงค์ไปบ้างแล้ว
ในการสร้างระบบเว็บเนวิเกชั่น ต้องทราบลักษณะเนวิเกชั่นพื้นฐานของเว็บบราวเซอร์แล้วเป็นอย่างดี เพื่อจะได้หลีกเลี่ยงการออกแบบที่จะไปลบล้างหรือทำซ้ำกับลักษณะนั้นให้สับสน

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

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

จากผลการศึกษา ความสะดวกของผู้ใช้ พบว่าตำแหน่งที่ดีที่สุดสำหรับระบบเนวิเกชั่นบาร์นั้น คือด้านบนหรือด้านล่างสุดของเว็บ ไม่ได้อยู่ด้านข้างเหมือนดังที่ปรากฏในเว็บไซต์หลาย ๆ เว็บ
- ระบบเนวิเกชั่นแบบโลคอล (Local) เหมาะสำหรับเว็บที่มีความซับซ้อนมากๆ เพราะการใช้ระบบเนวิเกชั่นแบบโกลบอลอาจยังไม่เพียงพอ ซึ่งระบบเนวิเกชั่นแบบโลคอลจะช่วยในกรณีที่บางส่วนของเว็บต้องการระบบเนวิเก ชั่นที่มีลักษณะเฉพาะตัว เช่น หัวข้อย่อยของเนื้อหาที่อยู่ภายในส่วนหลัก ๆ ของเว็บไซต์ เพื่อเพิ่มความสะดวกและสื่อความหมายให้ดียิ่งขึ้น

- ระบบเนวิเกชั่นเฉพาะที่ (Ad Hoc) เป็นระบบเนวิเกชั่นแบบเฉพาะที่เกิดขึ้นตามความจำเป็นของเนื้อหา ซึ่งก็คือลิงค์ของคำหรือข้อความที่น่าสนใจซึ่งฝังอยู่ในประโยค (Embedded link) ที่เชื่อมโยงรายละเอียดเกี่ยวกับคำนั้นๆ เพิ่มเติม ปกติแล้วผู้ดูแลเนื้อหาในเว็บไซต์จะเลือกคำหรือวลีที่น่าสนใจในข้อความ มาสร้างเป็นลิงค์เพิ่มเติม แต่ต้องระวังไม่สร้างลิงค์ให้มากเกินไปในข้อความแต่ละย่อหน้าจนดูรกหรือ สับสน

2. ประเภทของระบบเนวิเกชั่นหลัก
ระบบเนวิเกชั่นหลัก (Main Navigation Elements) เป็นระบบเนวิเกชั่นที่สำคัญและพบได้มากที่สุด โดยจะอยู่ในหน้าเดียวกับเนื้อหา ไม่ใช่เนวิเกชั่นที่อยู่ในหน้าแรก ช่วยให้ผู้ใช้ที่ผ่านหน้าแรกเข้าไป ไม่ต้องกลับมาเริ่มต้นใหม่ที่หน้าแรกเพื่อเข้าเนื้อหาในส่วนอื่น ๆ ต่อไประบบเนวิเกชั่นหลักทั้งส่วนโกลบอลและโลคอล จะช่วยให้ผู้ใช้สามารถย้ายจากหน้าใด ๆ ไปสู่ส่วนอื่นในเว็บไซต์ได้อย่างคล่องตัว ระบบเนวิเกชั่นหลักมีหลายรูปแบบ ได้แก่

- เนวิเกชั่นบาร์ (Navigation Bar) เป็นระบบพื้นฐานที่ใช้ได้หลายรูปแบบทั้งแบบลำดับชั้น แบบโกลบอล และแบบโลคอล โดยทั่วไปเนวิเกชั่นบาร์จะประกอบด้วยกลุ่มของลิงค์ต่าง ๆ ที่รวมกันอยู่ในบริเวณหนึ่งของหน้าเว็บ โดยอาจจะเป็นตัวหนังสือหรือกราฟิกก็ได้ถือเป็นรูปแบบของระบบเนวิเกชั่นที่ ได้รับความนิยมมากที่สุด ดังรูปที่ 5.6 ซึ่งแสดงการใช้ตัวหนังสือและกราฟิกเป็นเนวิเกชั่นบาร์

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

- Pull – Down Menu ซึ่งเป็นส่วนประกอบของฟอร์ม แต่ก็สามารถนำมาใช้เป็นระบบเนวิเกชั่นได้เช่นเดียวกัน ซึ่งคุณสมบัติที่โดดเด่นคือ มีรายการให้เลือกมากมายแต่ใช้พื้นที่น้อยมาก ซึ่งเหมาะสำหรับข้อมูลประเภทเดียวกันที่มีจำนวนมาก เช่น รายชื่อประเทศ จังหวัด เป็นต้น ไม่เหมาะที่จะใช้กับข้อมูลจำนวนน้อย และไม่ควรมีระบบเนวิเกชั่นหลาย ๆ แห่งในหนึ่งหน้า

- Pop – Up Menu จะมีลักษณะคล้ายกับ Pull – Down menu แต่รายการย่อยจะปรากฏ เมื่อนำเมาส์ไปวางไว้เหนือตำแหน่งของรายการในเมนูหลัก จากนั้นก็สามารถเลื่อนเมาส์ไปเลือกรายการต่าง ๆ ที่ปรากฏขึ้นได้ ระบบเนวิเกชั่นแบบนี้จะไม่ทำให้เว็บเพจดูรก และช่วยประหยัดพื้นที่แสดงรายการย่อยของเมนูได้

- Image Map เป็นการใช้กราฟิก เป็นลิงค์ในแบบ Image map ได้รับความนิยมนำมาใช้กับระบบเนวิเกชั่นมากขึ้นเรื่อย ๆ โดยจะกำหนดให้บางบริเวณของกราฟิกนั้นสามารถลิงค์ไปยังส่วนต่าง ๆ ตามที่ต้องการได้ จึงควรมีคำอธิบายในส่วนของ ALT ให้ครบถ้วนเพื่อที่ผู้ใช้จะได้รู้ว่าบริเวณนั้นถูกลิงค์ไปยังแหล่งใด

- Search Box การที่เราเตรียมระบบการสืบค้นข้อมูล (Search) ภายในเว็บไซต์เป็นระบบเนวิเกชั่นแบบหนึ่งที่มีประโยชน์สำหรับเว็บที่มี ข้อมูลปริมาณมาก ๆ ทำให้ผู้ใช้ค้นหาสิ่งที่ต้องการได้อย่างรวดเร็ว

3. ประเภทของระบบเนวิเกชั่นเสริม
ระบบ เนวิเกชั่นเสริม (Supplement Navigation Element) หรืออาจจะเรียกอีกอย่างว่า Remote Navigation เป็นเนวิเกชั่นอีกแบบที่ช่วยเพิ่มแนวทางการท่องเว็บของผู้ใช้ และยังช่วยให้ผู้ใช้มองเห็นภาพรวมของเว็บไซต์ได้ดียิ่งขึ้น แต่ไม่สามารถนำมาใช้แทนระบบเนวิเกชั่นหลักได้ เพราะผู้ใช้จะเลือกระบบเนวิเกชั่นเสริมนี้ ก็ต่อเมื่อระบบเนวิเกชั่นไม่สามารถตอบสนองความต้องการได้ ตัวอย่างของระบบเนวิเกชั่นเสริม ได้แก่ ระบบสารบัญ (Table of Contents) ระบบดัชนี (Index System) แผนที่เว็บไซต์ (Site Map) ไกด์ทัวร์ (Guided Tour) เป็นต้น

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

ออกแบบหน้าเว็บไซต์ (Page Design)

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

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

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

- สร้างความสม่ำเสมอตลอดทั่วทั้งไซด์
เพราะการที่ สร้างเว็บไซต์ที่มีความหลากหลายมากเกินไป อาจทำให้ผู้ใช้เกิดความสับสนว่ายังอยู่ในเว็บเดิมหรือเปล่า การออกแบบเว็บไซต์ที่ดี ควรสร้างมาตรฐานของเว็บไซต์ให้เกิดขึ้น เพื่อเป็นเอกลักษณ์ให้ผู้ใช้สามารถจดจำลักษณะของเว็บไซต์ได้ดียิ่งขึ้น โดยอาจนำโครงสร้างของหน้าเว็บเพจ, รูปแบบของกราฟิก, ลักษณะตัวอักษร, โทนสี และองค์ประกอบอื่นๆ ที่เคยออกแบบไว้ นำไปใช้กับทุกๆหน้า ซึ่งความสม่ำเสมอของโครงสร้าง หน้าและระบบเนวิเกชั่นจะทำให้ผู้ใช้เกิดความคุ้นเคยและสามารถคาดการณ์ลักษณะ ของเว็บได้ ล่วงหน้าและช่วยให้การท่องเว็บเป็นไปอย่างสะดวก
ข้อควรระวัง ของการรักษาความสม่ำเสมอของเว็บไซต์ คือ ต้องสร้างความน่าสนใจของแต่ละหน้าให้เกิดให้ได้ไม่เช่นนั้นอาจกลายเป็นข้อ จำกัดที่ทำให้เว็บไซต์ดูหน้าเบื่อได้

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

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

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

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

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

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

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

- โครงสร้างหน้าเว็บแบบสร้างสรรค์ รูปแบบนี้เป็นโครงสร้างที่อยู่เหนือกฎเกณฑ์ใด ๆ มักมีรูปแบบและการจัดวางองค์ประกอบเฉพาะตัวที่คุณคาดไม่ถึง ซึ่งเป็นที่นิยมในเว็บไซต์ของศิลปิน, นักออกแบบ, บริษัทโฆษณา หรือผู้ที่ทำงานเกี่ยวข้องกับความคิดสร้างสรรค์เพราะสามารถใช้เว็บไซต์ของ ตัวเอง ในการสื่อในการแสดงถึงฝีมือและความสามารถในการออกแบบอย่างสร้างสรรค์

3. ส่วนประกอบของหน้าเว็บ
เราสามารถแบ่งหน้าเว็บเพจออกได้ 3 ส่วนประกอบหลัก ๆ ได้แก่ ส่วนหัว ส่วนเนื้อหา และส่วนท้าย ซึ่งแต่ละส่วนมีรายละเอียดดังต่อไปนี้

- ส่วนหัวของหน้า (Page Header) ถือเป็นบริเวณที่สำคัญที่สุดของหน้า เพราะเป็นส่วนที่จะดึงดูดผู้ใช้ให้ติดตามเนื้อหาที่เหลือภายในหน้าดังกล่าว โดยปกติส่วนหัวมักจะประกอบด้วยชื่อเว็บ ระบบเนวิเกชั่น และหัวข้อหลักหรือชื่อของเนื้อหาในหน้านั้นก็ได้ และไม่ว่าที่บริเวณนี้จะใช้องค์ประกอบอะไรก็ตาม แต่สิ่งสำคัญคือความสม่ำเสมอที่จะต้องมีเหมือนกันในทุกๆ หน้าและที่ต้องระวังคือ ถ้าเราใช้กราฟิกที่มีขนาดใหญ่ ซึ่งต้องใช้เวลานานในการดาวน์โหลด และไม่มีการแสดงสิ่งที่น่าสนใจให้เห็นในส่วนนี้ไปพลาง ๆ อาจจะทำได้ดูน่าเบื่อ และกลายเป็นการขับไล่ผู้ใช้ให้เปลี่ยนไปยังเว็บอื่นได้
บริเวณที่สำคัญ คือมุมซ้ายด้านบนของเว็บ ซึ่งถือเป็นบริเวณที่มีความสำคัญมากเป็นพิเศษ เพราะถือเป็นบริเวณแรกของหน้าจอที่ผู้ใช้จะเริ่มต้นให้ความสนใจ ด้วยเหตุนี้เว็บไซต์ส่วนใหญ่ จึงมีการจัดวางโลโก้หรือชื่อของเว็บไซต์ ที่ตำแหน่งนี้ และมักจะทำเป็นลิงค์สำหรับเชื่อมกลับไปยังหน้าโฮมเพจอีกด้วย

- ส่วนของเนื้อหา (Page Body) ควรจะมีความกะทัดรัด และจัดเป็นระเบียบเพื่อให้มองเห็นข้อมูลได้รวดเร็ว โดยแสดงใจความสำคัญไว้ในส่วนต้น ๆ ของหน้า พร้อมทั้งมีการจัดรูปแบบตัวอักษรอย่างเหมาะสม เพื่อทำให้เนื้อหาดูน่าสนใจ และอ่านได้อย่างสะดวก เช่น การใช้ขนาดประเภทของตัวอักษร ที่เหมาะสม การกำหนดความยาวบรรทัดที่ไม่ให้ยาวเกินไป จนยากต่อการอ่าน การจัดตัวหนังสือให้ชิดขอบด้านต่าง ๆ อย่างเป็นระเบียบ สิ่งเหล่านี้จะช่วยสร้างความเชื่อมั่นต่อเนื้อหายิ่งขึ้น เนื่องจากทุกคนต้องการแหล่งข้อมูลที่ชัดเจน เป็นระเบียบและน่าเชื่อถือ

- ส่วนท้ายของหน้า (Page Footer) เป็นส่วนที่จะให้ข้อมูลเพิ่มเติมเกี่ยวกับเนื้อหาและเว็บไซต์ โดยอาจเป็นระบบเนวิเกชั่นแบบโกลบอล ที่เป็นตัวอักษรซึ่งทำหน้าที่เหมือนระบบเนวิเกชั่นหลัก แบบกราฟิกในส่วนหัวของหน้า หรืออาจเป็นที่รวมลิงค์เกี่ยวกับนโยบายทางกฎหมายลิขสิทธิ์ ความเป็นส่วนตัว และวิธีการติดต่อกับผู้ดูแลเว็บไซต์ ซึ่งส่วนท้ายของหน้านี้ก็จำเป็นต้องคงความสม่ำเสมอ ในทุก ๆ หน้าเช่นเดียวกับส่วนหัวของหน้า

สื่อประสมในเว็บเพจ

การพัฒนาอย่างต่อเนื่องของซอฟต์แวร์ที่ใช้สร้างเว็บเพจ นอกจากจะทำให้ผู้สร้างสามารถบรรจุภาพต่าง ๆ ลงไปในเว็บเพจแล้ว ยังสามารถบรรจุสื่อประสม (Multimedia) ได้อีกด้วย อาทิ แฟ้มเสียง ภาพเคลื่อนไหว ภาพจากวีดิทัศน์ ฯลฯ เป็นต้น ทำให้เว็บเพจมีความสวยงาม น่าสนใจและน่าติดตามมากขึ้น

1. แฟ้มเสียง (Audio file)
ระบบของแฟ้มเสียงที่ใช้กันโดยทั่วไปมี 3 ชนิด คือ Digitize Audio, Music Files และ Text to Speech
- Digitize Audio เป็นรูปแบบของแฟ้มเสียงที่ทำงานโดยถูกแปลงจาก Analog ไปเป็น Digital เพื่อให้ใช้กับคอมพิวเตอร์ได้
- Music Files เป็นรูปแบบตัวโน้ตดนตรีที่เรียงสลับกัน เพื่อให้เล่นออกมาเป็นเสียงเพลง
- Text to Speech เป็นเทคนิคในการแปลงข้อความ (Text file)

2. แฟ้มวีดิทัศน์ (Video files)
ปัจจุบัน Digital Video เป็นสิ่งที่ทำให้เว็บเพจมีความทันสมัยและแปลกตายิ่งขึ้น โดยทั้งผู้ผลิตฮาร์ดแวร์และซอฟต์แวร์ และผู้ใช้งาน ต่างให้ความสนใจและพัฒนาเทคโนโลยีสาขานี้เป็นอย่างมาก เพื่อเพิ่มความน่าสนใจให้กับเว็บเพจ อย่างไรก็ตามแฟ้มภาพวีดิทัศน์จะมีขนาดใหญ่มาก ดังนั้นจำเป็นต้องมีการบีบอัดแฟ้มให้มีขนาดเล็กลง โดยผ่านกระบวนการที่เรียกว่า “Codec” (Compression / Decompression) ซึ่งจะกระทำโดยผ่านซอฟต์แวร์ต่าง ๆ ดังนี้ CinePak (Compac Video) เป็นวิธีที่นิยมกันมากที่สุด ใช้ในซอฟต์แวร์ที่ชื่อ Quicktime และ Video for Windows (vfw) Indeo คุณภาพรองจาก CinePak แต่เร็วกว่าใช้ได้ใน Quicktime Version 2.0 และ vfm JPEG นิยมนำมาใช้ทำ Video Capture แล้วใช้ CinePak มาทำ Codec MPEG Codec ได้คุณภาพ ของวีดิทัศน์สมบูรณ์มาก อย่างไรก็ตาม ยังขาดฮาร์ดแวร์ที่สนับสนุนอยู่มาก

3. แฟ้มภาพเคลื่อนไหว (Animation files)
การ สร้างภาพเคลื่อนไหวที่ดีและง่ายที่สุดนั้นก็คือ ใช้คุณสมบัติของแฟ้มภาพ GIF หลาย ๆ ภาพมาเก็บไว้ในแฟ้มเดียวกัน เรียกว่า GIF Animation โดยที่เมื่อแฟ้มเหล่านี้ถูกเรียกใช้งานผ่านโปรแกรมค้นผ่าน รูปภาพทั้งหมดที่เก็บไว้จะถูกแสดงออกมาตามลำดับที่เราเรียงไว้ ทำให้ได้ภาพเสมือนกับเคลื่อนไหวอยู่
สำหรับการใช้งานแฟ้มข้อมูล ประเภทเสียง ภาพวีดิทัศน์ และภาพเคลื่อนไหว จำเป็นต้องคำนึงถึงวัตถุประสงค์ของงานด้วย เนื่องจากแต่ละแฟ้มมีขนาดใหญ่ ทำให้การเรียกใช้งานผ่านโปรแกรมค้นผ่านแต่ละครั้งต้องใช้เวลานาน อาจจะทำให้ผู้เข้ามาชมอดทนรอไม่ไหวและออกไปเว็บเพจอื่น ๆ แทน

ปัจจัยที่มีอิทธิพลต่อการแสดงผลของเว็บไซต์

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

1. ระบบปฏิบัติการ
ระบบ ปฏิบัติการ (Operating System) ระบบปฏิบัติการคอมพิวเตอร์เป็นปัจจัยสำคัญที่มีผลต่อการทำงานของบราวเซอร์ มาก ระบบปฏิบัติการหลักที่นิยมใช้กันมาก ได้แก่ Windows, Macintosh, Unix และ Linux โดยในแต่ละระบบจะแตกต่างกันในเรื่องของชนิดและรุ่นของบราวเซอร์ที่ใช้ได้ ระดับความละเอียดของหน้าจอ ชุดขอระบบสี และชนิดของตัวอักษรที่มาพร้อมกับระบบ เป็นต้น
ในการออกแบบเว็บเพจ ถ้าหากทราบว่ากลุ่มผู้ใช้เป้าหมายส่วนใหญ่ ใช้ระบบปฏิบัติการใดก็จะเป็นประโยชน์อย่างมาก เพราะจะทำให้สามารถออกแบบได้เหมาะสมกับสิ่งแวดล้อมของผู้ใช้ได้มากขึ้น

2. ความละเอียดหน้าจอ
ความ ละเอียดหน้าจอ (Monitor resolution) โดยปกติแล้วจะกำหนดความละเอียดของหน้าจอไว้ที่หน่วยพิกเซล ซึ่งความละเอียดของหน้าจอนั้นไม่ได้ขึ้นอยู่กับขนาดของมอนิเตอร์ที่ใช้ แต่ขึ้นอยู่กับประสิทธิภาพของการ์ดแสดงผล ยิ่งหน้าจอมีความละเอียดมากเท่าไร รูปภาพหรือองค์ประกอบใด ๆ ในเว็บก็จะเล็กลง แต่ในขณะเดียวกันก็สามารถแสดงรายละเอียดได้มากขึ้น เนื่องจากความละเอียดของหน้าจอมีผลต่อการแสดงผลของเว็บไซต์ การออกแบบเว็บไซต์จึงจำเป็นต้องทราบว่ากลุ่มผู้ใช้นั้นนิยมใช้ความละเอียด ของหน้าจอที่เท่าไร
3. ความเร็วในการรับส่งข้อมูล
ความเร็วในการรับ ส่งข้อมูล (Connection Speed) ยังคงเป็นปัญหาหลักที่จำกัดความก้าวหน้าของเทคโนโลยีใหม่ ๆ สำหรับเครือข่ายเว็บ เนื่องจากความเร็วในปัจจุบันยังช้า และไม่ทันใจ ทำให้ผู้พัฒนาต้องมีความพยายามอย่างยิ่งที่จะออกแบบเว็บให้มีขนาดเล็ก เพื่อการส่งผ่านข้อมูลที่เร็วขึ้น

4. เว็บบราวเซอร์
เว็บบราว เซอร์ (Web Browser) เป็นโปรแกรมที่ใช้สำหรับเรียกดูเอกสารบนเว็บ ซึ่งสามารถแสดงผลได้ทั้งที่เป็นตัวอักษร รูปภาพ และภาพเคลื่อนไหว โดยปกติแล้วเว็บบราวเซอร์แต่ละชนิดนั้นก็จะมีคุณสมบัติพื้นฐานไม่แตกต่างกัน มาก แต่จะมีรายละเอียดปลีกย่อยอื่น ๆ เช่น การแสดงผลตัวอักษร การแสดงปุ่ม หรือตารางเป็นต้น รวมไปถึงเทคโนโลยีใหม่ ๆ ที่ต้องมั่นใจว่า เมื่อนำเทคโนโลยีเหล่านั้นแทรกลงไปกับเอกสารแล้ว เมื่อจะไปแสดงผลกับเว็บบราวเซอร์ชนิดต่างๆ จะสามารถรองรับเทคโนโลยีเหล่านั้นหรือไม่

การวิเคราะห์และประเมินผลงานสือนำเสนอรูปแบบต่างๆ

การวิเคราะห์และประเมินผลงานสื่อนำเสนอแบบต่างๆ
เนื่องด้วยเว็บไซต์ประกอบด้วยส่วนสำคัญ 2 ส่วน ได้แก่ ส่วนที่เป็นหน้าแรกของเว็บไซต์ที่เรียกว่า Homepage และส่วนที่เป็นเนื้อหา (Web page) หลายๆ หน้ารวมกัน เรียกว่า Web Pages Homepage เป็นหน้าเว็บหน้าแรกของเว็บไซต์ ซึ่งมีต้องมีจุดเด่นมาก เพื่อดึงดูดให้ผู้ชมเข้ามาเยี่ยมชมเว็บไซต์และเกิดความประทับใจ อยากเข้ามาเยี่ยมชมอยู่เรื่อยๆ จึงต้องมีการจัดการประเมินเว็บไซต์เพื่อปรับปรุงแก้ไขให้ได้สื่อนำเสนอที่ดีและน่าสนใจอยู่เสมอ หลักเกณฑ์การประเมินเว็บไซต์ประกอบด้วยดังนี้คือ
หลักเกณฑ์การประเมิน Homepage
แนวคิดในการออกแบบ
- สำหรับเด็กนักเรียน
- สำหรับนักศึกษา - สำหรับบุคคลทั่วไป - บริการฟรี - เก็บค่าลงทะเบียน
1. องค์ประกอบ
- ชื่อเรียกเว็บไซต์สอดคล้องเหมาะสมกับเนื้อหา

- ชื่อหัวข้อเรื่องแต่ละเรื่องเหมาะสมสอดคล้องกับเนื้อหา
- มีการสมัครเป็นสมาชิกได้ (Member Login)
- มีกระดานข่าว(web board) (เพื่อเสนอเนื้อหาปรับปรุงที่น่าสนใจ รวมถึงการ ถามปัญหา การแสดงความคิดเห็น ฯลฯ)
- มีระบบนับจำนวนสมาชิกเพื่อประเมินความนิยม
- มีข้อแนะนำในการใช้เว็บไซต์

- มีการออกแบบหน้าโฮมเพจที่โดดเด่นแปลกใหม่เป็นเอกลักษณ์ของตัวเองแสดง ถึงความคิดสร้างสรรค์
- มีการออกแบบที่สอดคล้องเหมาะสมกับกลุ่มเป้าหมาย ดึงดูดความสนใจ
- ไม่ใช้ภาพ ข้อความ เนื้อหาหรือส่วนใดส่วนหนึ่งที่ละเมิดลิขสิทธิ์
2. ตัวอักษร
- ชนิดตัวอักษร (Font) ต้องเป็นมาตรฐาน

- ชนิดตัวอักษรไม่ควรหลากหลายเกินกว่า 3 ชนิดใน 1 หน้าเว็บเพจ
- ชนิดตัวอักษรต้องเป็นแบบที่อ่านง่ายชัดเจน
- รูปแบบตัวอักษร แตกต่างเหมาะสม
- ขนาดตัวอักษรต้องเหมาะสมกับกลุ่มเป้าหมาย
- ชนิดตัวอักษรและแบบตัวอักษรที่ใช้มีความกลมกลืนเป็นระบบในทุกหน้าของเว็บไซต์
3. การใช้สี
- สีตัวอักษร

- สีพื้นเว็บ
- สีภาพประกอบ
- สีวัตถุอื่นๆ ที่นำมาประกอบ
- ใช้สีสวยงามสบายตาไม่หลากหลายสีเกินไป
- ใช้สีสื่อความหมายได้(เช่นสีแดงแทนเรื่องราวใหม่ๆ ที่น่าติดตาม)
- ความแตกต่างระหว่างสีพื้นและสีข้อความ สีภาพประกอบ เหมาะสม
- มีความแตกต่างระหว่างสีข้อความและข้อความที่ลิงค์ได้
- ความกลมกลืนในการใช้สีในทุกหน้าของเว็บไซต์
4. ภาพกราฟิก
- ชนิดของภาพเหมาะสมกับกลุ่มเป้าหมาย (ภาพวาดการ์ตูนใช้กับเด็ก, ภาพถ่ายใช้ กับบุคคลทั่วไป)

- ภาพต้องสื่อความหมายตรงตามจุดประสงค์หรือสามารถอธิบายเพิ่มเติมได้มาก กว่าตัวหนังสือ
- ขนาดของภาพที่แสดงในหน้าจอเหมาะสม
- ชนิดและขนาดของไฟล์ภาพไม่ใหญ่เกินไป
5. ภาพเคลื่อนไหว(animation)
- ควรใช้ในกรณีที่ไม่สามารถหาภาพจริงได้ (เช่นภาพการไหลเวียนของโลหิต) หรือการอธิบายเรื่องที่เป็นนามธรรม หรือเรื่องที่ซับซ้อนเพื่อให้ดูง่ายขึ้น

- ภาพต้องสื่อความหมายตรงตามจุดประสงค์หรืออธิบายเพิ่มเติมได้มากกว่า หนังสือ
- ขนาดของภาพที่แสดงในหน้าจอเหมาะสม
- ชนิดและขนาดของไฟล์ภาพไม่ใหญ่เกินไป
- ความเร็วของการเคลื่อนไหวเป็นธรรมชาติ
- จำนวนของภาพเคลื่อนไหวเหมาะสม
6. ภาพวีดิทัศน์ (video)
- ใช้ในกรณีที่เนื้อหาต้องการนำเสนอถึงความต่อเนื่องของขั้นตอนวิธีการอย่างใด อย่างหนึ่ง หรือแสดงสภาพจริงที่เกิดขึ้น

- ขนาดของภาพวีดิทัศน์ที่แสดงในหน้าจอเหมาะสม
- ชนิดและขนาดของไฟล์ไม่ใหญ่เกินไป
- ภาพวิดิทัศน์ที่แสดงเคลื่อนไหวเหมือนจริง
- บอกวิธีการเปิดดูวีดิทัศน์หรือโปรแกรมที่จะใช้ในการดู
การประเมินด้านเสียงควรมีดังนี้
- ทั้งเสียงบรรยายและเสียงประกอบ(Background) ชัดเจน

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

- ตำแหน่งที่จัดวางเหมาะสมและตรงกันในทุกๆ หน้า
- สื่อความหมายได้เพียงพอ มีความเป็นสากลตามกลุ่มเป้าหมาย
- รูปแบบและขนาดของปุ่มเหมือนกันทุกหน้า
8.การประเมินด้านการจัดวางองค์ประกอบต่างๆ
- มีความสมดุลเหมาะสม

- มีความเป็นสากล (เช่นจากบนมาล่าง ซ้ายไปขวา)
- มีความกลมกลืนในทุกๆ หน้า

แนะนำตัว


ชื่อ นางสาวภรณ์ทิพย์ เทียบสี

รหัสนิสิต 50011420043

สาขาสาธารณสุขศาสตร์

คณะสาธารณสุขศาสตร์

มหาวิทยาลัยมหาสารคาม

โรคเบาหวาน(Diabetes Disease)



โรคเบาหวาน (Diabetes disease)

โรคเบาหวาน เกิดจากความผิดปกติของร่างกายที่มีการผลิตฮอร์โมนอินซูลินไม่เพียงพอ ส่งผลทำให้ระดับน้ำตาลในกระแสเลือดสูงเกินกว่าระดับปกติ นั้นคือ ระดับน้ำตานในกระแสเลือดสูงกว่า 126 มก./ดล. โรคนี้มีความรุนแรงสืบเนื่องมาจากการที่ร่างกายไม่สามารถใช้น้ำตาลได้อย่างเหมาะสม โดยปกติน้ำตาลจะเข้าสู่เซลล์ร่างกายเพื่อใช้เป็นพลังงานภายใต้การควบคุมของฮอร์โมนอินซูลิน แต่ในผู้ป่วยที่เป็นโรคเบาหวานจะไม่สามารถทำงานได้อย่างมีประสิทธิภาพ ผลที่เกิดขึ้นทำให้ระดับน้ำตาลในเลือดสูงขึ้น ในระยะยาวจะมีผลในการทำลายหลอดเลือด ถ้าหากไม่ได้รับการรักษาอย่างเหมาะสม อาจนำไปสู่สภาวะแทรกซ้อนที่รุนแรงได้ เช่น แผลเรื้อรังที่เท้า ทำให้ต้องตัดเท้า เบาหวานขึ้นตา ทำให้ตามัว มองเห็นไม่ชัดเจน เป็นต้น

ชนิดและสาเหตุของโรคเบาหวาน


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

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

อาการและอาการแทรกซ้อนของโรคเบาหวาน

อาการ
ถ้าหากพบอาการดังต่อไปนี้ ควรปรึกษาแพทย์ เพราะมีความเสี่ยงต่อการเกิดโรคเบาหวาน
ปัสสาวะมากขึ้นและบ่อยครั้งขึ้น
ปัสสาวะกลางคืนบ่อยขึ้น (ระหว่างช่วงเวลาที่เข้านอนแล้วจนถึงเวลาตื่นนอน
หิวน้ำบ่อยและดื่มน้ำในปริมาณที่มากๆ
เหนื่อยง่ายไม่มีเรี่ยวแรง
น้ำหนักตัวลดโดยไม่ทราบสาเหตุ โดยเฉพาะถ้าหากน้ำหนักเคยมากมาก่อน
ติดเชื้อบ่อยกว่าปกติ เช่น ติดเชื้อทางผิวหนังและกระเพาะอาหาร
สายตาพร่ามองเห็นไม่ชัดเจน
เป็นแผลหายช้า
โดย เบาหวานชนิดที่ 2 อาจจะมีอาการเหล่านี้บางอย่าง หรืออาจไม่มีอาการเหล่านี้

อาการแทรกซ้อน
ภาวะแทรกซ้อนทางสายตา (Diabetic retinopathy
เกิดจากการที่น้ำตาลเข้าไปใน endothelium ของ หลอดเลือดเล็กๆ ในลูกตา ทำให้หลอดเลือดเหล่านี้มีการสร้างไกลโคโปรตีนซึ่งจะถูกขนย้ายออกมาเป็น Basement membrane มากขึ้น ทำให้ Basement membrane หนา แต่เปราะ หลอดเลือดเหล่านี้จะฉีกขาดได้ง่าย เลือดและสารบางอย่างที่อยู่ในเลือดจะรั่วออกมา และมีส่วนทำให้ Macula บวม ซึ่งจะทำให้เกิด Blurred vision หลอดเลือดที่ฉีกขาดจะสร้างแขนงของหลอดเลือดใหม่ออกมามากมายจนบดบังแสงที่มาตกกระทบยัง Retina ทำให้การมองเห็นของผู้ป่วยแย่ลง
ภาวะแทรกซ้อนทางไต (Diabetic nephropathy)
พยาธิสภาพของหลอดเลือดเล็กๆ ที่ Glomeruli จะทำให้ Nephron ยอมให้ albumin รั่วออกไปกับ filtrate ได้ Proximal tubule จึงต้องรับภาระในการดูดกลับสารมากขึ้น ซึ่งถ้าเป็นนานๆ ก็จะทำให้เกิด Renal failure ได้ ซึ่งผู้ป่วยมักจะเสียชีวิตภายใน 3 ปี นับจากแรกเริ่มมีอาการ
ภาวะแทรกซ้อนทางระบบประสาท (Diabetic neuropathy)
หากหลอดเลือดเล็กๆ ที่มาเลี้ยงเส้นประสาทบริเวณปลายมือปลายเท้าเกิดพยาธิสภาพ ก็จะทำให้เส้นประสาทนั้นไม่สามารถนำความรู้สึกต่อไปได้ เมื่อผู้ป่วยมีแผล ผู้ป่วยก็จะไม่รู้ตัว และไม่ดูแลแผลดังกล่าว ประกอบกับเลือดผู้ป่วยมีน้ำตาลสูง จึงเป็นอาหารอย่างดีให้กับเหล่าเชื้อโรค และแล้วแผลก็จะเน่า และนำไปสู่ Amputation ในที่สุด
โรคหลอดเลือดหัวใจ (Coronary vascular disease)
โรคหลอดเลือดสมอง (Cerebrovascular disease)
โรคของหลอดเลือดส่วนปลาย (Peripheral vascular disease)
แผลเรื้อรังจากเบาหวาน (Diabetic ulcer)

การดูแลและป้องกันการเกิดโรคเบาหวาน

การดูแลผู้ป่วยโรคเบาหวาน


การดูแลและป้องกันโรคเบาหวาน สามารถทำได้โดย
1. การควบคุมน้ำตาลในเลือดให้อยู่ในเกณฑ์ปกติและแก้ไขปัจจัยเสี่ยงอื่นๆ


2. การรักษาจำเป็นจะต้องทำงานร่วมกันระหว่างผู้ป่วย แพทย์ ผู้ให้คำแนะนำเรื่องโรคเบาหวาน โภชนาการและยา การรักษานี้จะช่วยให้เกิดความสมดุลทั้งในด้านโภชนาการ การออกกำลังกาย และการใช้ยารักษา ควรเจาะระดับน้ำตาลในเลือดสม่ำเสมอ ให้ปรึกษาแพทย์ว่าควรเจาะช่วงใด และบ่อยแค่ไหนถึงจะดีที่สุด ยาบางชนิดหรือยาสมุนไพรอาจมีผลต่อการควบคุมน้ำตาลในเลือด จะต้องตรวจสอบกับแพทย์และเภสัชกรก่อนเลือกผลิตภัณฑ์ยาเหล่านี้

การรักษาโรคเบาหวานในผู้สูงอายุ


การรักษาโรคเบาหวานในผู้สูงอายุมีเป้าหมายคือ

1. ควบคุมระดับน้ำตาลในเลือดให้อยู่ในระดับที่เหมาะสมตลอดชีวิต คือประมาณ 140 มิลลิกรัม/เดซิลิตร ซึ่งเป็นระดับที่ผู้ป่วยมีความเสี่ยงน้อยต่อการเกิดภาวะน้ำตาลต่ำในเลือด

2 ป้องกันหรือชะลอโรคแทรกซ้อนที่เกิดขึ้นจากภาวะน้ำตาลในเลือดสูง (สมอง ใจ ไต ตา ชา แผล)
3. เพิ่มคุณภาพชีวิตของผู้ป่วย คือให้มีชีวิตอยู่ได้อย่างปกติสุขและมีคุณภาพ

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

อาหารแลกเปลี่ยนสำหรับผู้ป่วยเบาหวาน

อาหารแลกเปลี่ยนสำหรับผู้ป่วยเบาหวาน
รายการอาหารแลกเปลี่ยนสำหรับผู้ป่วยเบาหวาน จัดแบ่งอาหารออกเป็น 6 หมวด ด้วยกัน อาหารแต่ละชนิดในหมวดเดียวกันจะมีคุณค่าทางโภชนาการใกล้เคียงกันสามารถแลกเปลี่ยนกันได้ในหมวดเดียวกัน เช่นหากคุณไม่ชอบข้าวคุณก็สามารถเปลี่ยนข้าวเป็นก๋วยเตี๋ยว ซึ่งจะช่วยให้ผู้ป่วยรับประทานอาหารได้หลากหลาย
รายการอาหารแลกเปลี่ยนสำหรับผู้ป่วยเบาหวาน มี 6 หมวด ดัวนี้
1. หมวดน้ำนม อาหารในหมวดน้ำนม 1 ส่วน(240 ม.ล.)ให้พลังงาน 150 กิโลแคลอรีให้โปรตีน 8 กรัม ไขมัน 8 กรัม คาร์โบไฮเดรต 12 กรัมได้แก่
นมสดจืด ยู เอช ที 1 ถ้วยตวง
นมสดจืดพาสเจอร์ไร 1 ถ้วยตวง
นมสดพร่องมันเนย 1 ถ้วยตวง
นมข้นจืด 1/2 ถ้วยตวง
นมผง 1/3 ถ้วยตวง
นมเปรียวไม่ปรุงแต่งรส 1ถ้วยตวง
น้ำนมพร่องมันเนย 1 ถ้วยตวง (240 ม.ล.) หรือโยเกิร์ตพร่องมัน 1 ถ้วยตวง ให้พลังงาน 125 กิโลแคลอรีให้โปรตีน 8 กรัม ไขมัน 5 กรัม คาร์โบไฮเดรต 12 กรัมได้แก่
2. หมวดผักแบ่งเป็น 2 หมวด คือหมวด ก ให้พลังงานต่ำ หมวด ข ให้พลังงานต้องรับประทานจำนวนจำกัด
หมวด ก.ให้พลังงานต่ำรับประทานไม่จำกัด ผักบุ้ง ใบตั้งโอ มะเขือชนิดต่างๆ ผักคะน้า ใบขื่นช่าย มะเขือเทศสีดา ผักกวางตุ้ง แตงกวา แตงร้าน ผักกาดขาว ฟักเขียว เห็ดฟาง ผักกาดหอม บวบ ผักตำลึง ผักโขม น้ำเต้า ยอดฟักทอง สายบัว ผักชี แตงโมอ่อน ใบกระเพรา ใบโหระพา พริกหนุ่ม ต้นหอม คูน ขิงอ่อน ใบสาระแหน่ หยวกกล้วยอ่อน
หมวด ข. ให้พลังงาน 28 กิโลแคลอรีต่อน้ำหนักอาหาร 100 กรัมหรือผักสดหนึ่งถ้วยตวง ผักสุขครึ่งถ้วยตวง ได้แก่ผักกะเฉด บวบ ผักบุ้ง ดอกกุ๋ยช่าย เห็ดเป๋าฮื้อ มะเขือเทศ ผักโขม ใบชะพลู ดอกมะขาม แครอท ใบขี้เหล็ก มะระ แขนงกะหล่ำ ต้นกระเทียม รากบัว ขิงแก่ ใบยอ ถั่วพลู ฟักทอง หอมหัวใหญ่ แห้ว ต้นกระเทียม มะละกอดิบ กะหล่ำปม ปล็อกเคอรี่ สะเดา หน่อไม้ เห็ดหูหนู ผักหว่าน ใบชะมวง ยอดแค มันแกว พริกหยวก ผักคะน้า ผักป่วยเล้ง ถั่วงอก กะหล่ำปลี ยอดชะอม ถั่วฝักยาว สะตอ ดอกโสน พริกหวาน มะรุม หัวผักกาด ใบกระเทียมจีน ยอดมะขามอ่อน ข้าวโพดอ่อน ใบมะขามอ่อน ยอดกระถิน ยอดและใบตำลึง
3. หมวดผลไม้ ผลไม้ 1 ส่วนให้พลังงาน 60 กิโลแคลอรีคาร์โบไฮเดรต 15 กรัม ได้แก่
o กล้วยน้ำว้า 1 ผล
o กล้วยไข่ 1 ผล
o กล้วยหอม ครึ่งผล
o กล้วยหักมุก ครึ่งผล
o ขนุน 2 ยวง
o แคนตาลูป 15 คำ
o เงาะ 6 ผล
o ชมพู่ 4 ผล
o เชอรี่ 12 ผล
o แตงโม 10-12 คำ
o แตงไทย 10 คำ
o ทุเรียน 1 เม็ดกลาง
o น้ำองุ่น 3/4ถ้วยตวง
o น้ำส้ม ครึ่งถ้วยตวง
o น้ำสับปะรด ครึ่งถ้วยตวง
o น้อยหน่า ครึ่งผล
o ฝรั่ง 1 ผลเล็ก
o พลับสด 2 ผล
o แพร์ 1 ผล
o พุทรา 4 ผล
o มะขามหวาน 2 ฝัก
o มะพร้าวอ่อน ครึ่งถ้วยตวง
o มะม่วงดิบ ครึ่งผล
o มะม่วงสุก 6 ชิ้น
o มะละกอ 8 คำ
o มังคุด 4 ผล
o ลองกอง 8-10 ผล
o น้ำพรุน หนึ่งในสามถ้วยตวง
o น้ำผลไม้รวม หนึ่งในสามถ้วยตวง
o ละมุด 2 ผล
o ลางสาด 7 ผล
o ลำไย 6 ผล
o ลิ้นจี่ 6 ผล
o ลูกตาลสด 6 ลอน
o สตรอเบอรี 13 ผล
o สาลี 1ผลเล็ก
o สับปะรด 9 คำ
o ส้มเขียวหวาน 1 ผล
o ส้มจีน 5 ผล
o ส้มโอ 2 กลีบ
o แอบเปิ้ล 1 ผล
o องุ่น 15 ผล
o พรุน 3 ผล
o ลูกเกด 2 ช้อนโต๊ะ
o น้ำแอบเปิ้ล ครึ่งถ้วยตวง
ผลไม้ที่ควรจะหลีกเลี่ยง ผลไม้เชื่อม ผลไม้กวน ผลไม้ดอง ผลไม้บรรจุกระป๋อง ผลไม้สดที่มีเครื่องจิ้ม เช่นมะม่วงน้ำปลาหวาน ผลไม้จิ้มน้ำตาลพริกเกลือ
4. หมวดข้าว และแป้ง อาหารหนึ่งส่วนให้พลังงาน80 แคลอรีโปรตีน 3 กรัม ไขมัน 1 กรัม คาร์โบไฮเดรต 15 กรัม
o ข้าวกล้อง 1 ทัพพี
o ข้าวซ้อมมือ 1 ทัพพี
o ข้าวสวย 1 ทัพพี
o ข้าวเหนียวนึ่ง 3 ชต
o ก๋วยเตี๋ยวสุข 1/2 ถ้วยตวง
o มักกะโรนี,สปาเกตตี้,2/3 ถ้วยตวง
o ขนมปังกรอบจืด 3 แผ่นสี่เหลี่ยม
o มันฝรั่งสุก 1/2 ถ้วยตวง
o ข้าวโพดต้ม 1/2ฝัก
o ฟักทอง 3/4 ถต.
o ขนมปังโฮลวีท 1 แผ่น
o วุ้นเส้นสุก 2/3 ถ้วยตวง
o ข้าวต้ม 2 ทัพพี
o ขนมจีน 1 1/2 จับ
o บะหมี่ 1 ก้อน
o ขนมปังปอนด์ 1 แผ่น
o มันเทศหรือเผือก 1/2 ถ้วยตวง
o มันแกว 2 ถ้วยตวง
o ลูกเดือยสุก 1/2 ถ้วยตวง
o ซีเรียล 1/2 ถ้วยตวง
5. หมวดเนื้อสัตว์ แบ่งเป็นเนื้อสัตว์ไม่ติดมัน และเนื้อสัตว์ติดมันซึ่งให้พลังงานต่างกัน
ก.เนื้อสัตว์ไขมันต่ำมาก 1 ส่วน เนื้อสุก 2 ชต.ให้โปรตีน 7 กรัม ไขมัน 1 กรัม พลังงาน 35 กิโลแคลอรีไม่ติดมัน 1 ส่วนให้พลังงาน 55 กิโลแคลอรี
o เลือดหมู 6 ชตเลือดไก่ 3 ชต
o ปลาแห้ง 2 ชต.
o เนื้อปลา 2 ชต.
o ลูกชิ้นปลา 5 ลูก
o ปลาหมึกแห้ง 1 ชต.
o ปลาหมึก 2 ชต.
o เนื้อปู 2 ชต
o กุ้งขนาดกลาง 4-6 ตัว
o กุ้งฝอย 6 ชต.
o กุ้งแห้ง 2 ชต.
o หอยแครง 10 ตัว
o กุ้งขนาดกลาง 4-6 ตัว
o กุ้งฝอย 6 ชต.
o กุ้งแห้ง 2 ชต.
o หอยแครง 10 ตัว
o หอยลาย 10 ตัว
o ปลาทูน่ากระป๋อง(นำเกลือ) 1/4 ถ้วยตวง
o ไข่ขาว 2 ฟอง
o ถั่วเมล็ดสุก 1/2 ถัวยตวง
o หอยลาย 10 ตัว
o ปลาทูน่ากระป๋อง(นำเกลือ) 1/4 ถ้วยตวง
o ไข่ขาว 2 ฟอง ถั่วเมล็ดสุก 1/2 ถัวยตวง
· ข.เนื้อสัตว์มีไขมันต่ำ 1 ส่วนเท่ากับเนื้อสุก 2 ช้อนโต๊ะให้โปรตีน 7 กรัม ไขมัน 3 กรัม พลังงาน 55 กิโลแคลอรี
o เนื้ออกไก่ 2 ชต
o เนื้อห่านไม่ติดหนังมัน 2 ชต.
o ลูกชิ้นไก่ หมู 5-6 ลูก
o ปลาซัลมอน 2 ชต.
o ปลาทูน่า(ในน้ำมัน) 2 ชต
o ปลาจาระเม็ดขาว 2 ชต.
o หอยนางรม 6 ตัวกลาง
o เนื้อเป็ดไม่ติดหนังมัน 2 ชต
o หมูเนื้อแดง 2 ชต.
o เนื้อสะโพก น่อง 2 ชต.
o เครื่องในสัตว์ 2 ชต.
o ปลาซาร์ดีน 2 ตัวกลาง
o ปลาหมอ 2 ชต.
o แฮม 1 ชิ้น
ค.เนื้อสัตว์มีไขมันปานกลาง 1 ส่วนคือเนื้อสุก 2 ช้อนโต๊ะ ให้โปรตีน 7 กรัม ไขมัน 5 กรัม พลังงาน 75 กิโลแคลอรี
o เนื้อบดไม่ติดมัน 2 ชต
o หมูติดมัน 2 ชต.
o ไก่ทอดมีหนัง 2 ชต.
o เนื้อเป็ดติดหนัง 2 ชต.
o แคบหมูไม่ติดมัน 1/2 ถต.
o เนื้อปลาทอด 2 ชต.
o นมถั่วเหลือง 1 ถต.
o เต้าหู้อ่อน 3/4 หลอด
o ซี่โครงหมูติดมัน 2 ชต.
o หมูย่าง 2 ชต.
o เนื้อไก่ติดหนัง 2 ชต
o เป็ดย่างไม่มีหนัง 2 ชต
o ตับเป็ด 2 ชต.
o เขยแข็ง 1 แผ่น
o ไข่ 1 ฟอง
o เต้าหู้เหลือง 1/2 แผ่น
ง.เนื้อสัตว์ไขมันสูง 1 ส่วน ให้โปรตีน 8 กรัม ไขมัน 8 กรัม คาร์โบไฮเดรต 12 กรัม พลังงาน 150 กิโลแคลอรี
o ซี่โครงหมูติดมัน 2 ชต.
o หมูปนมัน 2 ชต.
o ไส้กรอกอิสาน 1 แท่ง
o หมูยอ 2 ชต.
o หมูบดปนมัน 2 ชต.
o กุนเชียง 2 ชต.
o ไส้กรอกหมู 1 แท่ง
o คอหมู 2 ชต.
o เบคอน 3 ชิ้น
สีแดงหมายถึงอาหารที่มีโคเลสเตอรอลสูง สีม่วงหมายถึงอาหารที่มีเกลือสูง
6. ไขมันหรือน้ำมัน 1 ส่วน ให้ไขมัน 5 กรัมพลังงาน 45 กิโลแคลอรีแบ่งออกเป็น
ไขมันที่มีกรดไขมันอิ่มตัวสูง Saturated fat ได้แก่ น้ำมันหมู,ไก่ 1 ชช. เนยสด 1 ชช. เบคอนทอด 1 ชิ้น กะทิ 1 ชต. ครีมนมสด 2 ชต.
ไขมันที่มีกรดไขมันไม่อิ่มตัวหลายตำแหน่ง Polyunsaturated fatได้แก่น้ำมันพืช (ถั่วเหลือง รำข้าว ข้าวโพด) 1ชช. เนยเทียม 1 ชช มายองเนส 1 ชช น้ำสลัด 1 ชต. เมล็ดดอกทานตะวัน 1 ชต.
ไขมันที่มีกรดไขมันไม่อิ่มตัวตำแหน่งเดียว Monounsaturated fat ได้แก่ น้ำมันถั่วลิสง,น้ำมันมะกอก 1 ชช. มะกอก 8-10 ผล ถั่วอัลมอน,เมล็ดมะม่วงหิมพานต์ 6 เมล็ด ถั่วลิสง 10 เมล็ด เนยถั่ว 2 ชช งา 1 ชต
ไขมันซึ่งไม่ควรรับประทาน ได้แก่ไขมันชนิดอิ่มตัวสูง ซึ่งทำให้มีการเพิ่มของโคเลสเตอรอลได้แก่ กะทิ น้ำมันปาลม์ ไขมันสัตว์ น้ำมันมะพร้าว