More Related Content
Similar to สมุดล่มเล็ก (20)
สมุดล่มเล็ก
- 2. หลักการออกแบบเว็บไซต์ เว็บไซต์เป็นสื่อที่ได้รับความนิยมอย่ามากบนอินเตอร์เน็ต ซึ่งเว็บไซต์เป็นสื่อที่อยู่ในความควบคุมของผู้ใช้โดยสมบูรณ์ กล่าวคือ ผู้ใช้สามารถตัดสินใจเลือกได้ว่าจะดูเว็บไซต์ใดและจะไม่เลือกดูเว็บไซต์ใด ได้ตามต้องการ จึงทาให้ผู้ใช้ไม่มีความ อดทนต่ออุปสรรคและปัญหาที่เกิดจากการออกแบบเว็บไซต์ผิดพลาดถ้าผู้ใช้เห็นว่าเว็บที่กาลังดูอยู่นั้นไม่มีประโยชน์ต่อตัวเขา หรือไม่เข้าใจว่าเว็บไซต์นี้จะใช้งานอย่างไร เขาก็สามารถที่จะเปลี่ยนไปดูเว็บไซต์อื่นๆ ได้อย่างรวดเร็ว เนื่องจากในปัจจุบันมี เว็บไซต์อยู่มากมาย และยังมีเว็บไซด์ที่เกิดขึ้นใหม่ ๆ ทุกวัน ผู้ใช้จึงมีทางเลือกมากขึ้น และสามารถเปรียบเทียบคุณภาพของ เว็บไซด์ต่าง ๆ ได้เอง เว็บไซด์ที่ได้รับการออกแบบอย่างสวยงาม มีการใช้งานที่สะดวก ย่อมได้รับความสนใจจากผู้ใช้ มากกว่าเว็บไซด์ที่ดู สับสนวุ่นวาย มีข้อมูลมากมายแต่หาอะไรไม่เจอ นอกจากนี้ยังใช้เวลาในการแสดงผลแต่ละหน้านานเกินไป ซึ่งปัญหาเหล่านี้ ล้วนเป็นผลมาจากการออกแบบเว็บไซด์ไม่ดีทั้งสิ้น ดังนั้น การออกแบบเว็บไซด์จึงเป็นกระบวนการสาคัญในการสร้างเว็บไซด์ ให้ประทับใจผู้ใช้ ทาให้เขาอยากกลับเข้ามาเว็บไซด์ เดิมอีกในอนาคต ซึ่งนอกจากต้องพัฒนาเว็บไซด์ที่ดีมีประโยชน์แล้ว ยังต้องคานึงถึงการแข่งขันกับเว็บไซด์อื่น ๆ อีกด้วย องค์ประกอบของการออกแบบเว็บไซต์ การออกแบบเว็บไซต์ที่มีประสิทธิภาพนั้นต้องคานึงถึง องค์ประกอบสาคัญดังต่อไปนี้ 1. ความเรียบง่าย (Simplicity) หมายถึง การจากัดองค์ประกอบเสริมให้เหลือเฉพาะองค์ประกอบหลัก กล่าวคือในการสื่อสารเนื้อหากับผู้ใช้นั้น เรา ต้องเลือกเสนอสิ่งที่เราต้องการนาเสนอจริง ๆ ออกมาในส่วนของกราฟิก สีสัน ตัวอักษรและภาพเคลื่อนไหว ต้องเลือกให้ พอเหมาะ ถ้าหากมีมากเกินไปจะรบกวนสายตาและสร้างความคาราญต่อผู้ใช้ตัวอย่างเว็บไซต์ที่ได้รับการออกแบบที่ดี ได้แก่ เว็บไซต์ของบริษัทใหญ่ ๆ อย่างเช่น Apple Adobe Microsoft หรือ Kokia ที่มีการออกแบบเว็บไซต์ในรูปแบบที่เรียบง่าย ไม่ ซับซ้อน และใช้งานอย่างสะดวก 2. ความสม่่าเสมอ ( Consistency) หมายถึง การสร้างความสม่าเสมอให้เกิดขึ้นตลอดทั้งเว็บไซต์ โดยอาจเลือกใช้รูปแบบเดียวกันตลอดทั้งเว็บไซต์ก็ได้ เพราะถ้าหากว่าแต่ละหน้าในเว็บไซต์นั้นมีความแตกต่างกันมากจนเกินไป อาจทาให้ผู้ใช้เกิดความสับสนและไม่แน่ใจว่ากาลัง อยู่ในเว็บไซต์เดิมหรือไม่ เพราะฉะนั้นการออกแบบเว็บไซต์ในแต่ละหน้าควรที่จะมีรูปแบบ สไตล์ของกราฟิก ระบบเนวิเกชั่น (Navigation) และโทนสีที่มีความคล้ายคลึงกันตลอดทั้งเว็บไซต์ 3. ความเป็นเอกลักษณ์ (Identity) ในการออกแบบเว็บไซต์ต้องคานึงถึงลักษณะขององค์กรเป็นหลัก เนื่องจากเว็บไซต์จะสะท้อนถึงเอกลักษณ์และ ลักษณะขององค์กร การเลือกใช้ตัวอักษร ชุดสี รูปภาพหรือกราฟิก จะมีผลต่อรูปแบบของเว็บไซต์เป็นอย่างมาก ตัวอย่างเช่น ถ้าเราต้องออกแบบเว็บไซต์ของธนาคารแต่เรากลับเลือกสีสันและกราฟิกมากมาย อาจทาให้ผู้ใช้คิดว่าเป็นเว็บไซต์ของสวน สนุกซึ่งส่งผลต่อความเชื่อถือขององค์กรได้
- 3. 4. เนื้อหา (Useful Content) ถือเป็นสิ่งสาคัญที่สุดในเว็บไซต์ เนื้อหาในเว็บไซต์ต้องสมบูรณ์และได้รับการปรับปรุงพัฒนาให้ทันสมัยอยู่เสมอ ผู้พัฒนาต้องเตรียมข้อมูลและเนื้อหาที่ผู้ใช้ต้องการให้ถูกต้องและสมบูรณ์ เนื้อหาที่สาคัญที่สุดคือเนื้อหาที่ทีมผู้พัฒนาสร้างสรรค์ ขึ้นมาเอง และไม่ไปซ้ากับเว็บอื่น เพราะจะถือเป็นสิ่งที่ดึงดูดผู้ใช้ให้เข้ามาเว็บไซต์ได้เสมอ แต่ถ้าเป็นเว็บที่ลิงค์ข้อมูลจากเว็บอื่น ๆ มาเมื่อใดก็ตามที่ผู้ใช้ทราบว่า ข้อมูลนั้นมาจากเว็บใด ผู้ใช้ก็ไม่จาเป็นต้องกลับมาใช้งานลิงค์เหล่านั้นอีก 5. ระบบเนวิเกชั่น (User-Friendly Navigation) เป็นส่วนประกอบที่มีความสาคัญต่อเว็บไซต์มาก เพราะจะช่วยไม่ให้ผู้ใช้เกิดความสับสนระหว่างดูเว็บไซต์ ระบบเนวิ เกชั่นจึงเปรียบเสมือนป้ายบอกทาง ดังนั้นการออกแบบเนวิเกชั่น จึงควรให้เข้าใจง่าย ใช้งานได้สะดวก ถ้ามีการใช้กราฟิกก็ควร สื่อความหมาย ตาแหน่งของการวางเนวิเกชั่นก็ควรวางให้สม่าเสมอ เช่น อยู่ตาแหน่งบนสุดของทุกหน้าเป็นต้น ซึ่งถ้าจะให้ดีเมื่อ มีเนวิเกชั่นที่เป็นกราฟิกก็ควรเพิ่มระบบเนวิเกชั่นที่เป็นตัวอักษรไว้ส่วนล่างด้วย เพื่อช่วยอานวยความสะดวกให้กับผู้ใช้ที่ยกเลิก การแสดงผลภาพกราฟิกบนเว็บเบราเซอร์ 6. คุณภาพของสิ่งที่ปรากฏให้เห็นในเว็บไซต์ (Visual Appeal) ลักษณะที่น่าสนใจของเว็บไซต์นั้น ขึ้นอยู่กับความชอบส่วนบุคคลเป็นสาคัญ แต่โดยรวมแล้วก็สามารถสรุปได้ว่า เว็บไซต์ที่น่าสนใจนั้นส่วนประกอบต่าง ๆ ควรมีคุณภาพ เช่น กราฟิกควรสมบูรณ์ไม่มีรอยหรือขอบขั้นบันได้ให้เห็น ชนิด ตัวอักษรอ่านง่ายสบายตา มีการเลือกใช้โทนสีที่เข้ากันอย่างสวยงาม เป็นต้น 7. ความสะดวกของการใช้ในสภาพต่าง ๆ (Compatibility) การใช้งานของเว็บไซต์นั้นไม่ควรมีขอบจากัด กล่าวคือ ต้องสามารถใช้งานได้ดีในสภาพแวดล้อมที่หลากหลาย ไม่มีการ บังคับให้ผู้ใช้ต้องติดตั้งโปรแกรมอื่นใดเพิ่มเติม นอกเหนือจากเว็บบราวเซอร์ ควรเป็นเว็บที่แสดงผลได้ดีในทุกระบบปฏิบัติการ สามารถแสดงผลได้ในทุกความละเอียดหน้าจอ ซึ่งหากเป็นเว็บไซต์ที่มีผู้ใช้บริการมากและกลุ่มเป้าหมายหลากหลายควรให้ ความสาคัญกับเรื่องนี้ให้มาก 8. ความคงที่ในการออกแบบ (Design Stability) ถ้าต้องการให้ผู้ใช้งานรู้สึกว่าเว็บไซต์มีคุณภาพ ถูกต้อง และเชื่อถือได้ ควรให้ความสาคัญกับการออกแบบเว็บไซต์เป็น อย่างมาก ต้องออกแบบวางแผนและเรียบเรียงเนื้อหาอย่างรอบคอบ ถ้าเว็บที่จัดทาขึ้นอย่างลวก ๆ ไม่มีมาตรฐานการออกแบบ และระบบการจัดการข้อมูล ถ้ามีปัญหามากขึ้นอาจส่งผลให้เกิดปัญหาและทาให้ผู้ใช้หมดความเชื่อถือ 9. ความคงที่ของการท่างาน (Function Stability) ระบบการทางานต่าง ๆ ในเว็บไซต์ควรมีความถูกต้องแน่นอน ซึ่งต้องได้รับการออกแบบสร้างสรรค์และตรวจสอบอยู่ เสมอ ตัวอย่างเช่น ลิงค์ต่าง ๆ ในเว็บไซต์ ต้องตรวจสอบว่ายังสามารถลิงค์ข้อมูลได้ถูกต้องหรือไม่ เพราะเว็บไซต์อื่นอาจมีการ เปลี่ยนแปลงได้ตลอดเวลา ปัญหาที่เกิดจากลิงค์ ก็คือ ลิงค์ขาด ซึ่งพบได้บ่อยเป็นปัญหาที่สร้างความราคาญกับผู้ใช้เป็นอย่าง มาก
- 4. การออกแบบเว็บไซต์ ในการออกแบบเว็บไซต์นั้นประกอบด้วยกระบวนการต่าง ๆ มากมาย เช่น การออกแบบโครงสร้าง ลักษณะหน้าตา หรือการเขียนโปรแกรม แต่มีหลายคนที่พัฒนาเว็บไซต์ โดยขาดการวางแผนและทางานไม่เป็นระบบ ตัวอย่างเช่น การลงมือ ออกแบบโดยการใช้โปรแกรมช่วยสร้างเว็บ เนื้อหาและรูปแบบก็เป็นไปตามที่นึกขึ้นได้ขณะนั้น และเมื่อเห็นว่าดูดีแล้วก็เปิดตัว เลย ทาให้เว็บนั้นมีเป้าหมายและแนวทางที่ไม่แน่นอน ผลลัพธ์ที่ได้จึงเสี่ยงกับความล้มเหลวค่อนข้างมาก ความล้มเหลวที่พบเห็นได้ทั่วไป ได้แก่ เว็บที่แสดงข้อความว่าอยู่ระหว่างการก่อสร้าง (Under Construc- tion หรือ Coming soon) ซึ่งแสดงให้เห็นถึงการขาดการวางแผนที่ดีบางเว็บถือได้ว่าตายไปแล้ว เนื่องจากข้อมูลไม่ทันสมัย ขาดการพัฒนาปรับปรุงเทคโนโลยีล้าสมัย ลิงค์ผิดพลาด สิ่งเหล่านี้แสดงให้เห็นถึงการขาดการดูแล ตรวจสอบและพัฒนาให้ ทันสมัยอยู่เสมอ การออกแบบเว็บไซต์อย่างถูกต้องจะช่วยลดความผิดพลาดเหล่านี้ และช่วยลดความเสี่ยงที่จะทาให้เว็บประสบความ ล้มเหลว การออกแบบเว็บไซต์ที่ดีต้องอาศัยการออกแบบและจัดระบบข้อมูลอย่างเหมาะสม กระบวนการแรกของการออกแบบเว็บไซต์คือการกาหนดเป้าหมายของเว็บไซต์กาหนดกลุ่มผู้ใช้ ซึ่งการจะให้ได้มาซึ่ง ข้อมูล ผู้พัฒนาต้องเรียนรู้ผู้ใช้ หรือจาลองสถานการณ์ สิ่งเหล่านี้จะช่วยให้เราสามารถออกแบบเนื้อหาและการใช้งานเว็บไซต์ ได้อย่างเหมาะสม ตรงกับความต้องการของผู้ใช้อย่างแท้จริง ก่าหนดเป้าหมายของเว็บไซต์ ขั้นตอนแรกของการออกแบบเว็บไซต์ คือการกาหนดเป้าหมายของเว็บไซต์ให้แน่ชัดเสียก่อน เพื่อจะได้ออกแบบการ ใช้งานได้ตรงกับเป้าหมายที่ได้ตั้งเอาไว้ โดยทั่วไปมักจะเข้าใจว่าการทาเว็บไซต์มีจุดมุ่งหมายเพื่อบริการข้อมูลของหน่วยงาน หรือองค์กรเท่านั้น แต่ในความเป็นจริงแล้ว เว็บไซต์แต่ละแห่งก็จะมีเป้าหมายของตนเองแตกต่างกันออกไป ก่าหนดกลุ่มผู้ใช้เป้าหมาย ผู้ออกแบบเว็บไซต์จาเป็นต้องทราบกลุ่มผู้ใช้เป้าหมายที่เข้ามาใช้บริการเว็บไซต์ เพื่อที่จะได้ตอบสนองความต้องการ ของผู้ใช้ได้อย่างชัดเจน ตัวอย่างเช่นเว็บไซต์ที่มีกลุ่มผู้ใช้หลากหลาย เช่น เซิร์ชเอ็นจิน เว็บท่า และเว็บไดเรกทอรี่ แต่เว็บไซต์ ส่วนใหญ่นั้นจะตอบสนองความต้องการเฉพาะกลุ่มเท่านั้น ไม่สาหรับทุกคน เพราะคุณไม่สามารถตอบสนองความต้องการของ คนที่หลากหลายได้ในเว็บไซต์เดียว
- 5. สิ่งที่ผู้ใช้ต้องการจากเว็บ หลังจากที่ได้เป้าหมายและกลุ่มเป้าหมายของเว็บไซต์แล้ว ลาดับต่อไปคือการออกแบบเว็บไซต์เพื่อดึงดูดผู้ใช้งานให้ได้ นานที่สุด ด้วยการสร้างสิ่งที่น่าสนใจเพื่อดึงดูดผู้ใช้โดยทั่วไปแล้ว สิ่งที่ผู้ใช้คาดหวังจากการเข้าชมเว็บไซต์หนึ่ง ได้แก่ - ข้อมูลและการใช้งานที่เป็นประโยชน์ - ข่าวและข้อมูลที่น่าสนใจ - การตอบสนองต่อผู้ใช้ - ความบันเทิง - ของฟรี ข้อมูลหลักที่ควรมีอยู่ในเว็บไซต์ เมื่อเราทราบถึงความต้องการที่ผู้ใช้ต้องการได้รับเมื่อเข้าชมเว็บไซต์หนึ่ง ๆ แล้ว เราก็ออกแบบเว็บไซต์ให้มีข้อมูลที่ผู้ใช้ ต้องการ ซึ่งข้อมูลต่อไปนี้ เป็นสิ่งที่ผู้ใช้ส่วนใหญ่คาดหวังจะได้รับเมื่อเข้าไปชมเว็บไซต์ - ข้อมูลเกี่ยวกับบริษัท - รายละเอียดของผลิตภัณฑ์ - ข่าวความคืบหน้าและข่าวจากสื่อมวลชน - คาถามยอดนิยม - ข้อมูลในการติดต่อ
- 6. ออกแบบหน้าเว็บไซต์ (Page Design) หน้าเว็บเป็นสิ่งแรกที่ผู้ใช้จะได้เห็นขณะที่เปิดเข้าสู่เว็บไซต์ และยังเป็นสิ่งแรกที่แสดงถึงประสิทธิภาพในการออกแบบ เว็บไซต์อีกด้วย หน้าเว็บจึงเป็นสิ่งสาคัญมาก เพราะเป็นสื่อกลางให้ผู้ชมสามารถใช้ประโยชน์จากข้อมูลของระบบงานของ เว็บไซต์นั้นได้ โดยปกติหน้าเว็บจะประกอบด้วย รูปภาพ ตัวอักษร สีพื้น ระบบเนวิเกชั่น และองค์ประกอบอื่น ๆ ที่ช่วยสื่อ ความหมายของเนื้อหาและอานวยความสะดวกต่อการใช้งาน หลักสาคัญในการออกแบบหน้าเว็บก็คือ การใช้รูปภาพและองค์ประกอบต่าง ๆ ร่วมกันเพื่อสื่อความหมาย เกี่ยวกับ เนื้อหาหรือลักษณะสาคัญของเว็บไซต์ โดยมีเป้าหมายสาคัญเพื่อการสื่อความหมายที่ชัดเจนและน่าสนใจ บนพื้นฐานของความ เรียบง่ายและความสะดวกของผู้ใช้ การออกแบบโครงสร้างเว็บไซต์ (Site Structure Design) โครงสร้างเว็บไซท์ ( Site Structure ) เป็นแผนผังของการลาดับเนื้อหาหรือการจัดวางตาแหน่งเว็บเพจทั้งหมด ซึ่งจะ ทาให้เรารู้ว่าทั้งเว็บไซท์ประกอบไปด้วยเนื้อหาอะไรบ้าง และมีเว็บเพจหน้าไหนที่เกี่ยวข้องเชื่อมโยงถึงกัน ดังนั้นการออกแบบ โครงสร้างเว็บไซท์จึงเป็นเรื่องสาคัญ เปรียบเสมือนกับการเขียนแบบอาคารก่อนที่จะลงมือสร้าง เพราะจะทาให้เรามองเห็น หน้าตาของเว็บไซท์เป็นรูปธรรมมากขึ้น สามารถออกแบบระบบเนวิเกชั่นได้เหมาะสม และเป็นแนวทางการทางานที่ชัดเจน สาหรับขั้นตอนต่อๆไป นอกจากนี้โครงสร้างเว็บไซท์ที่ดียังช่วยให้ผู้ชมไม่สับสนและค้นหาข้อมูลที่ต้องการได้อย่างรวดเร็ว วิธีการจัดโครงสร้างเว็บไซท์สามารถทาได้หลายแบบ แต่แนวคิดหลักๆที่นิยมใช้กันมีอยู่ 2 แบบคือ จัดตามกลุ่มเนื้อหา ( Content-based Structure ) จัดตามกลุ่มผู้ชม ( User-based Structure ) รูปแบบของโครงสร้างเว็บไซต์ เราสามารถวางรูปแบบโครงสร้างเว็บไซท์ได้หลายแบบตามความเหมาะสม เช่น แบบเรียงลาดับ ( Sequence ) เหมาะสาหรับเว็บไซท์ที่มีจานวนเว็บเพจไม่มากนัก หรือเว็บไซท์ที่มีการนาเสนอ ข้อมูลแบบทีละขั้นตอน แบบระดับชั้น ( Hierarchy ) เหมาะสาหรับเว็บไซท์ที่มีจานวนเว็บเพจมากขึ้น เป็นรูปแบบที่เราจะพบได้ทั่วไป แบบผสม ( Combination ) เหมาะสาหรับเว็บไซท์ที่ซับซ้อน เป็นการนาข้อดีของรูปแบบทั้ง 2 ข้างต้นมาผสมกัน
- 7. การใช้สีในการออกแบบเว็บไซต์ การสร้างสีสันบนหน้าเว็บเป็นสิ่งที่สื่อความหมายของเว็บไซต์ได้อย่างชัดเจน การเลือกใช้สีให้เหมาะสม กลมกลืน ไม่ เพียงแต่จะสร้างความพึงพอใจให้กับผู้ใช้ แต่ยังสามารถทาให้เห็นถึงความแตกต่างระหว่างเว็บไซต์ได้ สีเป็นองค์ประกอบหลัก สาหรับการตกแต่งเว็บ จึงจาเป็นอย่างยิ่งที่จะต้องทาความเข้าใจเกี่ยวกับการใช้สี ระบบสีที่แสดงบนจอคอมพิวเตอร์ มีระบบการแสดงผลผ่านหลอดลาแสงที่เรียกว่า CRT (Cathode ray tube) โดยมี ลักษณะระบบสีแบบบวก อาศัยการผสมของของแสงสีแดง สีเขียว และสีน้าเงิน หรือระบบสี RGB สามารถกาหนดค่าสี จาก 0 ถึง 255 ได้ จากการรวมสีของแม่สีหลักจะทาให้เกิดแสงสีขาว มีลักษณะเป็นจุดเล็ก ๆ บนหน้าจอไม่สามารถมองเห็น ด้วยตาเปล่าได้ จะมองเห็นเป็นสีที่ถูกผสมเป็นเนื้อสีเดียวกันแล้ว จุดแต่ละจุดหรือพิกเซล (Pixel) เป็นส่วนประกอบของภาพบน หน้าจอคอมพิวเตอร์ โดยจานวนบิตที่ใช้ในการกาหนดความสามารถของการแสดงสีต่าง ๆ เพื่อสร้างภาพบนจอนั้นเรียกว่า บิต เด็ป (Bit-depth) ในภาษา HTML มีการกาหนดสีด้วยระบบเลขฐานสิบหก ซึ่งมีเครื่องหมาย (#) อยู่ด้านหน้าและตามด้วย เลขฐานสิบหกจานวนอักษรอีก 6 หลัก โดยแต่ละไบต์ (byte) จะมีตัวอักษรสองตัว แบ่งออกเป็น 3 กลุ่ม เช่น #FF12AC การใช้ ตัวอักษรแต่ละไบต์นี้เพื่อกาหนดระดับความเข้มของแม่สีแต่ละสีของชุดสี RGB โดย 2 หลักแรก แสดงถึงความเข้มของสี แดง 2 หลักต่อมา แสดงถึงความเข้มของสีเขียว 2 หลักสุดท้ายแสดงถึงความเข้มของสีน้าเงิน สีมีอิทธิพลในเรื่องของอารมณ์การสื่อความหมายที่เด่นชัด กระตุ้นการรับรู้ทางด้านจิตใจมนุษย์ สีแต่ละสีให้ความรู้สึก อารมณ์ที่ไม่เหมือนกัน สีบางสีให้ความรู้สึกสงบ บางสีให้ความรู้สึกตื่นเต้นรุนแรง สีจึงเป็นปัจจัยสาคัญอย่างยิ่งต่อการออกแบบ เว็บไซต์ ดังนั้นการเลือกใช้โทนสีภายในเว็บไซต์เป็นการแสดงถึงความแตกต่างของสีที่แสดงออกทางอารมณ์ มีชีวิตชีวาหรือเศร้า โศก รูปแบบของสีที่สายตาของมนุษย์มองเห็น สามารถแบ่งออกเป็น 3 กลุ่ม คือ 1. สีโทนร้อน (Warm Colors) เป็นกลุ่มสีที่แสดงถึงความสุข ความปลอบโยน ความอบอุ่น และดึงดูดใจ สีกลุ่มนี้ เป็นกลุ่มสีที่ช่วยให้หายจากความเฉื่อยชา มีชีวิตชีวามากยิ่งขึ้น 2. สีโทนเย็น (Cool Colors) แสดงถึงความที่ดูสุภาพ อ่อนโยน เรียบร้อย เป็นกลุ่มสีที่มีคนชอบมากที่สุด สามารถ โน้มนาวในระยะไกลได้ 3. สีโทนกลาง (Neutral Colors) สีที่เป็นกลาง ประกอบด้วย สีดา สีขาว สีเทา และสีน้าตาล กลุ่มสีเหล่านี้คือ สี กลางที่สามารถนาไปผสมกับสีอื่น ๆ เพื่อให้เกิดสีกลางขึ้นมา ** สีนั้นมีความสาคัญอย่างยิ่งในการออกแบบเว็บไซต์ การเลือกสีให้เข้ากับเนื้อหาของเว็บไซต์ จะทาให้เว็บไซต์มี ความน่าเชื่อถือยิ่งขึ้น และยังส่งผลอย่างมากกับความสวยงามของเว็บไซต์
- 8. สีบอกความรู้สึก สีฟ้า ให้ความรู้สึกสงบ สุขุม สุภาพ หนักแน่น เคร่งขรึม เอาการเอางาน ละเอียด รอบคอบ สง่างาม มีศักดิ์ศรี สูงศักดิ์ เป็น ระเบียบถ่อมตน สามารถลดความตื่นเต้น และช่วยทาให้มีสมาธิ แต่ถ้ามีสีน้าเงินเข้มเกินไป ก็จะทาให้รู้สึกซึมเศร้าได้ สีเขียว เป็นสีในวรรณะเย็น จะสร้างความรู้สึกเย็นสบาย ใช้เป็นสีที่ช่วยผ่อนคลายความเครียดได้ ให้ความรู้สึก สงบ เงียบ ร่มรื่น ร่มเย็น การพักผ่อน การผ่อนคลาย ธรรมชาติ ความปลอดภัย ปกติ ความสุข ความสุขุม เยือกเย็น สีเหลือง เป็นสีแห่งความเบิกบาน เร้าอารมณ์ และเรียกร้องความสนใจ ให้ความรู้สึกแจ่มใส ความสดใส ความร่าเริง ความเบิกบาน สดชื่น ชีวิตใหม่ ความสด ใหม่ ความสุกสว่าง การแผ่กระจาย อานาจบารมี ให้ลองสังเกตดูว่า วันที่ท้องฟ้ามืดครื้มปราศจากแสงแดด เราจะรู้สึกหงอยเหงา หดหู่ แต่พอมีแสงแดด ท้องฟ้าสว่าง มีสี เหลือง เราจะรู้สึกมีชีวิตชีวาขึ้น สีแดง เป็นสีที่สร้างความตื่นเต้น และกระตุ้นสมอง สีแดงปานกลางแสดงถึงความมีสุขภาพดี ความมีชีวิต ความรัก ความสาคัญ ความอุดมสมบูรณ์ ความมั่งคั่ง สีแดงจัดมีความหมายแฝงด้านกามารมณ์ นอกจากนี้สีแดงยังสร้างความรู้สึกรุนแรง ให้ความรู้สึกร้อน กระตุ้น ท้าทาย เคลื่อนไหว ตื่นเต้น เร้าใจ มีพลัง มันจะใช้กันกรณีที่เกี่ยวกับความตื่นเต้น หรืออันตราย สีม่วง ให้ความรู้สึก มีเสน่ห์ น่าติดตาม เร้นลับ ซ่อนเร้น มีอานาจ มีพลังแฝงอยู่ ความรัก ความเศร้า ความผิดหวัง ความ สงบ ความสูงศักดิ์ เป็นสีที่ปลอบโยน และช่วยลดความเครียด แต่เดิมสีม่วงได้มาจากสัตว์มีกระดอง,เปลือก ในทะเลเมดิเตอร์เรเนียน มีชื่อว่า Purpura จึงได้ชื่อภาษาอังกฤษว่า Purple
- 9. สีส้ม ให้ความรู้สึก ร้อน ความอบอุ่น ความสดใส มีชีวิตชีวา วัยรุ่น ความคึกคะนอง การปลดปล่อย ความเปรี้ยว การระวัง เป็นสีที่เร้าความรู้สึก ปรกติควรใช้แต่น้อยเมื่อเทียบกับสีอื่น สังเกตว่าคนที่อยู่ในห้องสีส้มจะอยู่ได้ไม่นาน สีน้่าตาล ให้ความรู้สึกอบอุ่น ได้พักผ่อน แต่ควรใช้ร่วมกับสีส้ม เหลือง หรือสีทอง เพราะถ้าใช้สีน้าตาลเพียงสีเดียว อาจทาให้เกิด ความรู้สึกหดหู่ได้ สีเทา ให้ความรู้สึก เศร้า อาลัย ท้อแท้ ความลึกลับ ความหดหู่ ความชรา ความสงบ ความเงียบ สุภาพ สุขุม ถ่อมตน สีนี้มีข้อดีคือทาให้เย็น แต่สร้างความสร้างความรู้สึกหม่นหมองได้ ควรใช้ร่วมกับสีที่มีชีวิต โทนสว่างอย่างน้อยหนึ่งสี สีขาว ให้ความรู้สึก บริสุทธิ์ สะอาด สดใส เบาบาง อ่อนโยน เปิดเผย การเกิด ความรัก ความหวัง ความจริง ความเมตตา ความ ศรัทธา ความดีงาม ให้ความรู้สึกรื่นเริง โดยเฉพาะเมื่อใช้กับสีแดง เหลือง และส้ม ** ในการสร้างเว็บก็ควรที่จะเลือกสีให้เหมาะกับสม
- 10. ทฤษฎีสี รูปด้านล่างวงล้อความสัมพันธ์ของสี ซึ่งบรรจุสีที่นิยมใช้ในเว็บไซต์ไว้ 20 สี เหมาะสาหรับผู้ที่กาลังเลือกสีที่จะใช้ในเว็บไซต์ อยู่เราสามารถใช้ความสัมพันธ์ของวงล้อขอสีนี้ให้เกิดประโยชน์ได้อย่างมากมาย เช่น ต้องการออกแบบให้เว็บไซต์รู้สึกตัดกันโดยสิ้นเชิง เราอาจใช้ชุดสี 4 สีที่ทามุมกัน 90 องศา เช่นดังตัวอย่างถ้าเราเลือกชุดสี 1 , 6 , 11 , 16 สีที่ได้จะตัดกันชัดเจน ถ้าต้องการให้เว็บไซต์ดูกลมกลืนก็อาจเลือกชุดสีใกล้เคียงกันก็ได้เช่น เลือกชุดสีเขียวเบอร์ 8 , 9 , 10 , 11 ก็จะได้สีในโทน สีเขียวสว่าง ด้านล่างเป็นเบอร์สีที่ใช้แบ่งตามมาตราฐานการอ้างอิงของสี Hexadecimal - Browser Colour Codes 1 - #FF0000 6 - #FFFF00 11 - #009900 16 - #0000FF 2 - #FF3300 7 - #CCFF00 12 - #006633 17 - #3300CC 3 - #FF6600 8 - #99CC00 13 - #006666 18 - #660099 4 - #FF9900 9 - #66CC00 14 - #003399 19 - #990066 5 - #FFCC00 10 - #339900 15 - #0033CC 20 - #CC0033
- 11. พื้นฐานในการออกแบบเว็บไซต์ที่ดี มีเนื้อหาเป็นประโยชน์ ตรงกับที่ผู้ใช้ต้องการ มีการปรับปรุงเพิ่มเติมเนื้อหา และพัฒนาเว็บไซต์อยู่เสมอ ใช้เวลาในการดาวน์โหลดน้อย แสดงผลเร็ว ใช้งานที่สะดวก เข้าใจง่าย โปรแกรมที่ใช้ในการท่าเว็บ "Joomla" joomla เป็น CMS ที่ได้รับความนิยมเป็นอันดับต้น ๆ เพราะมีระบบการจัดการเนื้อหาที่มีรูปแบบสากล การ ปรับแต่งหน้าตาของเว็บไซต์ทาได้ง่าย เพราะถูกออกแบบมาให้รองรับกับเทคโนโลยีการ ออกแบบเว็บไซต์ สมัยใหม่ ไม่ว่าจะเป็นการรองรับ Flash หรือ GIF Animation นอกจากนี้คุณยังสามารถ Download Template ได้อย่าง มากมายมีทั้งแบบที่สามารถนามาใช้งานได้ฟรี ** สาหรับใครที่ยังไม่รู้จักว่า CMS คืออะไร ขออธิบายสั้น ๆ เพิ่มเติมดังนี้นะคะ CMS นั้นเป็นอักษรย่อของ คาว่า "Content Management System" ซึ่งเมื่อเราแปลเป็นภาษาไทย หมายถึง ระบบบริหารจัดการเนื้อหาของ เว็บไซต์ นั่นหมายความว่า สิ่งที่เราจะต้องดูแลก็คือเนื้อหาของเว็บไซต์ เช่น การเพิ่มบทความ การเพิ่มรูปภาพ หรือ การปรับแต่งโยกย้ายโมดูลต่าง ๆ ไม่จาเป็นจะต้องมานั่งเขียน Code ด้วยภาษา HTML, PHP, SQL เพียงแต่เรียนรู้ วิธีการติดตั้ง การปรับแต่ง การใช้งาน CMS เท่านั้น สาหรับ Code ต่าง ๆ ที่นามาสร้าง และ ออกแบบเว็บไซต์ จะ ทาโดยทีมงานของผู้พัฒนา CMS ของแต่ละทีม ซึ่งทาให้ประหยัดเวลาในการสร้าง และออกแบบเว็บไซต์ ได้อย่าง มาก ข้อดีของ CMS 1. ผู้ใช้งานไม่จาเป็นต้องมีความรู้เรื่องการทาเว็บไซต์ เพียงแค่เคยพิมพ์ หรือเคยโพสข้อความในอินเทอร์เนต ก็ สามารถมีเว็บไซต์เป็นของตัวเองได้ 2. ไม่เสียเวลาในการพัฒนาเว็บไซต์ ไม่เสียเงินจานวนมาก 3. ง่ายต่อการดูแล เพราะมีระบบจัดการทุกอย่างให้เราหมด 4. มีระบบจัดการที่เราสามารถหามาใส่เพิ่มได้มากมาย อย่างเช่น ระบบแกลลอรี่ 5. สามารถเปลี่ยนหน้าตาเว็บไซต์ได้ง่ายๆ เพียงแค่โหลดทีม (Theme) ของ CMS นั้นๆ
- 12. วิธีติดตั้ง ขั้นตอน การติดตั้ง joomla 2.5 ขั้นก่อนการติดตั้ง Joomla คือโปรแกรม OpenSource จาพวก CMS (Content Management System) ซึ่งใช้สาหรับสร้างเว็บไซต์ มีความ ปลอดภัยสูง และเป็นที่นิยมมาก ก่อนการติดตั้งโปรแกรมเราต้องจาลองเครื่องของเราให้เป็นเครื่อง sever ก่อน ตามลิงค์ ติดตั้ง php Mysql Apache โปรแกรมจาลอง Web Server ด้วย XAMPP แล้วเตรียมฐานข้อมูลตามวิธีด้านล่าง เมื่อเสร็จแล้วจะได้ดังรูป
- 13. ขั้นการติดตั้งโปรแกรม โหลดโปรแกรม Joomla 2.5 ก่อน (โหลดได้ที่ http://www.joomla.org/download.html ) หลังจากโหลดไฟล์โปรแกรม joomla2.5 มาเรียบร้อยแล้ว ให้ทาการ Unzip ไฟล์โปรแกรม ไปไว้ที่ D:xampphtdocsjoomla25 ตัวอย่างวิธีการ Unzip โปรแกรม
- 14. เริ่มการติดตั้ง 1. เปิด web browser พิมพ์ URL ชื้อไปที่ http://localhost/joomla25/ จะได้หน้าจอดังรูป ในขั้นตอนนี้ให้เลือก ภาษาไทย แล้วคลิก ปุ่ม ต่อไป 2.จะสังเกตว่าบนหน้าต่าง เป็นคาว่า ใช่ ทั้งหมด แล้วจึงคลิกปุ่ม ต่อไป
- 15. 3.หน้านี้อธิบายเกียวกับลิขสิทธิ์ ก็คลิก ต่อไป ได้เลย 4. การตั้งค่าฐานข้อมูล ชนิดของฐานข้อมูล : Mysql (ต้องเลือก Mysql เท่านั้นนะครับ) ชื้อโฮส : localhost ชื้อผู้ใช้ฐานข้อมูล : root (ค่าปกติ admin ของฐานข้อมูล Mysqlจะ ชื่อ root) รหัสผ่าน : *** (หรืออาจไม่ตั้งก็ได้) ชื้อฐานข้อมูล : joomla25 (ตั้งชื้อฐานข้อมูลอะไรก็ได้ แต่ต้องไม่ซ้ากันนะ) คานาหน้าตาราง : (อันนี้ไม่ต้องสนใจก็ได้ ให้เป็นตามค่าปกติที่เว็บกาหนดมาก็ได้) จากนั้นคลิกปุ่ม ต่อไป ได้เลย
- 16. 5.ตั้งค่าหลักของเว็บ ชื้อเว็บ : ทดลองติดตั้ง joomla2.5 (พิมพ์ชื้ออะไรก็ได้ สามารถแก้ไข้ได้ภายหลังนะ) อีเมล์ของคุณ : jaideiw_may@hotmail.com (เป็นเมล์ของผู้ดูแลระบบ ระบบจะติดต่อกับadminที่เมล์นี้) รหัสผ่านผู้ดูแล : admin (กาหนดอะไรก็ได้ ) ยืนยันรหัสผ่านผู้ดูแล : admin ข้อมูลตัวอย่าง ให้กดที่ปุ่ม ..ติดตั้งข้อมูลตัวอย่าง.. ข้อมูลตัวอย่างจะช่วยให้เราเห็นตาแหน่งของโครงสร้างได้ชัดเจน ทาเสร็จแล้วค่อยลบออกก็ได้ กรอบข้อมูลเสร็จก็คลิก ต่อไป ได้เลย 6
- 17. .มาถึงตรงนี้เราได้ทาการติดตั้งjoomla เสร็จเรียบร้อยแล้ว แต่ยังใช้งานไม่ได้ ต้องลบโฟล์เดอร์ installation ก่อน กดปุ่ม..ลบโฟลเดอร์ installation 8.เสร็จเรียบร้อยให้คลิก ปุ่ม ดูหน้าเว็บ จะปรากฏหน้าเว็บ ดังรูปข้างล่างนี้
- 18. วิเคราะห์ทฤษฎีการออกแบบเว็บไซต์วิทยาลัยเซนต์หลุยส์ ทฤษฎีความเรียบง่าย วิทยาลัยเซนต์หลุยส์มีการออกแบบเว็บไซต์ที่เรียบง่าย ดูแล้วสบายตา การใช้ตัวอักษรเห็นได้ชัดเจน ไม่มีภาพเคลื่อนไหว ตลอดเวลาจนทาให้เวียนหัว มีการแบ่งหมวดหมู่ ต่างๆไว้อย่างชัดเจน ทาให้สะดวกค้นหาได้ง่าย (จากทฤษฏีการออกแบบ เว็บไซต์ อ.ชัยมงคล เทพวงษ์)
- 19. ความสม่่าเสมอ *วิทยาลัยเซนต์หลุส์มีการออกแบบที่สม่าเสมอในทุกหน้า ของเว็บไซต์ องค์ประกอบหลักๆที่สาคัญจะอยู่ใน ตาแหน่งเดิมในทุกหน้า เพื่อให้ดูง่าย สม่าเสมอมองเห็นได้ชัดเจน *(จากทฤษฏีการออกแบบเว็บไซต์ อ.ชัยมงคล เทพวงษ์)
- 20. ความเป็นเอกลักษณ์ *วิทยาลัยเซนต์หลุยส์มีการออกแบบเว็บต์ไซต์ที่เป็นเอกลักษณ์เฉพราะที่โดดเด่น โดยมีพระแม่ฟาติมาอยู่ด้าน ขวามือ ซึงเป็นสัญลักษณ์ของศาสนาคริสต์ และมีรูปพระเยซูคริสต์ อยู่ด้านซ้ายมือ มีตราสัญลักษณ์อยู่ทางด้าน บนซ้าย และมีดอกไม้ประจามหาวิทยาลัยอยู่ด้านบนขวา (จากทฤษฏีการออกแบบเว็บไซต์ อ.ชัยมงคล เทพวงษ์)
- 21. เนื้อหาเป็นหมวดหมู่ *วิทยาลัยเซนต์หลุยส์ มีการแบ่งเนื้อหาออกเป็นหมวดหมู่อย่างชัดเจน เพี่อให้สะดวกในการค้นหาข้อมูล เช่น เกียรติประวัติวิทยาลัยเซนต์หลุยส์ การบริหาร คณะวิชา หน่วยงานวิทยาลัยฯเป็นต้น(จากhttp://www.ic-myhost.com) เนื้อหาที่มีประโยชน์ (จากทฤษฏีการออกแบบเว็บไซต์ อ.ชัยมงคล เทพวงษ์) *วิทยาลัยเซนต์หลุยส์ มีเนื้อหาที่ทาให้นักศึกษาในมหาวิทยาลัยได้ความรู้ได้ประโยชน์ทั้งงานวิชาการ งานด้านการศึกษาที่เป็นผลกับตัวนัก และงานประชาสัมพันธ์ให้บุคคลทั่วไปที่เข้ามาเยี่ยมชมเว็บไซต์ได้ประโยชน์ได้ความรู้ทั่วถึงกัน
- 22. ผู้จัดท่า นางสาวทิพวัลย์ วินทะวุธ 533410080309 นางสาวนิจพร ทรัพย์สมบัติ 533410080312 นางสาวปริญดา วารีศรี 533410080316 นางสาวสายสมร ชมพู่ทอง 533410080327 สาขาวิชาคอมพิวเตอร์ศึกษา หมู่ 3 ปี 4 คณะครุศาสตร์ เสนอ อาจารย์ปวริศ สารมะโน สมุดล่มเล็กนี้เป็นส่วนหนึ่งในรายวิชา โปรแกรมสร้างเวปเพื่อการศึกษา หลักการออกแบบ สาขาวิชาคอมพิวเตอร์ศึกษา คณะครุศาสตร์ มหาวิทยาลัยราชภัฏมหาสารคาม