กระบวนการพฒนา

กระบวนการพฒนาเวบไซต เปนกระบวนการทอาศยหลกการจดระบบโครงสราง ขอมล (Information Architecture) อยในหลาย ๆ สวน ตงแตขนแรกจนถงขนทไดเปนรปแบบโครงสรางสดทาย (Final Architecture Plan) ซงถอเปนกระบวนการทส าคญมากทจะทาใหเวบไซตบรรลตามเปาหมายทตงไว การจดระบบโครงสรางขอมล คอ การพจารณาวาเวบไซตควรจะมขอมลและการทางานใดบาง ดวยการสรางเปนแผนผงโครงสรางกอนทจะเรมลงมอพฒนาเวบเพจ โดยเรมจากการก าหนดเปาหมายเวบไซต และกลมผใชเปาหมาย ตอมากพจารณาถงเนอหาและการใชงานทจาเปน แลวนามาจดกลมใหเปนระบบ จากนนกถงเวลาในการออกแบบโครงสรางขอมลในหนาเวบ ใหพรอมทจะนาไปออกแบบกราฟก และหนาตาใหสมบรณตอไป

การจดทาระบบโครงสรางขอมลเปนพนฐานส าคญในการออกแบบเวบไซตทด ทจะชวยพฒนาแบบแผนรายละเอยดขอมลในการออกแบบเวบไซต ซงไดแก รปแบบการนาเสนอระบบการทางาน แบบจาลอง ระบบเนวเกชน และอนเตอรเฟสของเวบ ดงนนการจดระบบโครงสรางขอมลจงเปนสงส าคญทเกยวของอยในกระบวนการออกแบบเวบไซต

ทมา : สาวตร เตชะคา. การออกแบบเวบไซตสาหรบองคกรพฒนาสงคม: กรณศกษา มลนธรกษเดก. วทยานพนธศลปะศาสตรมหาบณฑต. สาขาวชาสอศลปะและการออกแบบสอ. มหาวทยาลยเชยงใหม, 2551

ประเภทของเวบไซต

อนเตอรเนตเปนศนยรวมขอมลขาวสารทสามารถเชอมโยงสอสารถงกนไดทกมมโลก อนเตอรเนตแสดงใหเหนถงความแตกตางและความหลากหลายของเวบทลวนแลวแตสรางขนมาเพอตอบสนองความตองการของลกคาและผใหบรการ เราสามารถแบงประเภทของเวบไซตไดดงน 1. Information sites คอ เวบไซตผใหบรการเกยวกบขอมลขาวสาร เชน หนงสอพมพ โทรทศน วทย นตยสาร วารสาร หรอหนวยงานเกยวกบผใหบรการขอมลขาวสารอนๆ ขององคกร เวบประเภทนมจานวนมากทสดในอนเตอรเนต 2. Transactional sites คอ เวบไซตประเภททสามารถใชเพอการตดตอทางธรกจการคาการลงทนของภาคธรกจโดยเปนผชกนา แนะนานกลงทน 3. Community sites คอ เวบไซตของกลมบคคล สมาคม ชมรม คณะบคคล ซงมลกษณะนตบคคลและการสนบสนนหนวยงานตางๆเกยวกบสงคมหรอชมชน ลทธ ความเชอ ศาสนา กลมเพอน 4. Entertainment sites คอ เวบไซตทใหความบนเทง เกมส ดนตร เพลง เรองตลขบขน ภาพยนตร เครองเสยงหรอแนวบนเทงตางๆ รวมไปถงกลมชมรมและหนอยขอมลขาวสารดานความบนเทง 5. Other sites ประกอบดวย เวบไซตเกยวกบศลปะ การแสดงออก รสนยม ศาสนาสถาน ประตมากรรม หรอเวบการทดลองความสามารถ เวบไซตสวนบคคล เชน เวบไซตของสามญชนทวไป เวบไซตการจดประชม ฯลฯ

ทมา : สายธาร สเมธอธคม และคณะ. ปญหาและความตองการของนกศกษาและอาจารยในการใชเวบไซตงานทะเบยน. วจยกลมทะเบยนและประมวลผล สานกสงเสรมวชาการและงานทะเบยน. มหาวทยาลยเทคโนโลยพระนคร, 2552

การประเมนเวบไซต

การประเมนเวบไซต เปนการวดประสทธภาพและประสทธผลของเวบไซต อนจะเปนแนวทางในการปรบปรงและพฒนาเวบไซต หองสมดสามารถวางแผนการประเมนผลในดานตางๆ เชน การประเมนผลการออกแบบ การประเมนเนอหา การประเมนประสทธภาพ การเขาถงสารสนเทศ เปนตน งานวจยทเกยวของกบการประเมนเวบไซตสามารถจ าแนกการประเมนดานตางๆ ไดดงตอไปน 1. การประเมนความพงพอใจและความตองการของผใชทมตอเวบไซต 2. การประเมนผลการใชงานเวบไซต 3. การประเมนผลการออกแบบเวบไซต 4. การประเมนผลคณภาพเวบไซต 5. การประเมนผลบรการ การประเมนเวบไซตเพอการศกษา การประเมนเวบไซตสาหรบผใชทออกแบบตองค านงถงนน สรรรชต หอไพศาล (2544 : 71-75) ไดกลาวไววา จะตองอยบนฐานทวา ผใชเปนศนยกลางโดยค านงถงเสมอวาเวบไซตควรเนนใหผใชสามารถเขาใชไดสะดวก ไมพบประสบปญหาตดขดใดๆ การประเมนเวบไซต มหลกการทตองประเมนคอ 1. การประเมนวตถประสงค (Purpose) เวบไซตทดตองมวตถประสงควาเพอ อะไร เพอใคร และกลมเปาหมายคอใคร 2. การประเมนคณลกษณะ (Identification) เวบไซตควรจะทราบไดทนทเมอเปดขาไปวาเกยวของกบเรองใด ซงในหนาแรก (Homepage) จะทาหนาทเปนปกหนงสอ (Title) ทบอกลกษณะและรายละเอยดของเวบนน 3. การประเมนภารกจ (Authority) ในหนาแรกของเวบจะตองบอกขนาดของเวบและรายละเอยดของโครงสรางของเวบ เชน แสดงทอยและเสนทางภายในเวบ และควรบอกชอผออกแบบ 4. การประเมนการจดรปแบบและการออกแบบ (Layout and Design) ผออกแบบควรประยกตแนวคดตามมมมองของผใช ความซบซอน เวลา รปแบบทตองการใช 5. การประเมนการเชอมโยง (Links) การเชอมโยงถอเปนหวใจของเวบ เปนสงจาเปนและมผลตอการใช การเพมจานวนเชอมโยง โดยไมจาเปนจะไมเปนประโยชนตอผใช ควรใชเครองมอสบคนแทนการเชอมโยงทจาเปน

6. การประเมนเนอหา (Content) เนอหาทเปนขอความ ภาพหรอเสยงจะตองเหมาะสมกบเวบและใหความสาคญกบองคประกอบทกสวนเทาเทยมกน

ทมา : จตอารย คาพนธ. การวเคราะหเวบไซตสาหรบหองสมดโรงเรยนคาทอลก. วทยานพนธศลปะศาสตร มหาบณฑต. สาขาบรรณารกษศาสตรและสารสนเทศศาสตร. มหาวทยาลยราชภฏบานสมเดจเจาพระยา, 2551

การวเคราะหและประเมนเวบไซต 1. เกณฑการวเคราะหเวบไซตของบอราสก (Borasky 1997) ไดพจารณาในเรองตอไปน 1.1 ความถกตอง (accuracy) พจารณาวา เนอหาและแหลงขอมลมความถกตอง แมนย า 1.2 ความนาเชอถอ (authority) พจารณาวา ใครเปนผรบผดชอบและมความเชยวชาญดานใด 1.3 วตถประสงค (objectivity) มวตถประสงคในการจดทาเพออะไร กลมเปาหมายเปนใครขอมลเสนอความคดเหนหรอไม 1.4 ความทนสมย (currency) พจารณาวาวนทจดทาขอมลหรอปรบปรงขอมล หรอมการยายไปเวบไซตอน 1.5 ขอบเขต (coverage) พจารณาวาขอบเขตของเนอหาครอบคลมดานใด และขอบเขตของการเผยแพรในลกษณะใดบาง เชน เผยแพรในรปของหนงสอ CD – ROM หรอเวบ เปนตน 1.6 การเขาถง (accessibility) พจารณาถงความยากงายในการเขาถง ความยากงายในการคนหาขอมลและการก าหนดตวเลอกในการคนหา 1.7 โครงสรางและองคประกอบภายในเวบ (structure) พจารณาถงการเพมหรอลดขอมลการจดเรยง การเชอมโยงขอมลทเกยวของ 2. เกณฑการวเคราะหเวบไซตของดเซมเบอร (December 2001) ไดพจารณาจากองคประกอบตอไปน 2.1 วตถประสงค (objectivity) พจารณาวานาเสนอเวบไซต เพอวตถประสงคใดกลมเปาหมายทตองการนาเสนอคอใคร

2.2 ลกษณะเฉพาะ (specification) พจารณาวาเวบนนนาเสนอขอมลอะไร ใชรปแบบใดนาเสนอหรอเผยแพรขอมล 2.3 รปแบบการออกแบบ (manner) พจารณาวา การออกแบบเวบเปนลกษณะใด ระยะเวลาในการดงขอมล การเชอมโยงไปยงเวบไซตอน 2.4 ความถกตอง (accuracy) พจารณาวา นาเสนอขอมลถกตอง แมนยา มการปรบปรงขอมลใหทนสมยหรอสมบรณมากขน 3. เกณฑการวเคราะหเวบไซตของอเลกซานเดอรและเทต (Alexander และ Tate 1996–1998) พจารณาเกณฑในเรองตอไปน 3.1 ความถกตอง (accuracy) พจารณาจาก ผจดทาเวบไซตและเวบไซตนนมการตรวจสอบความถกตองของเนอหาหรอไม 3.2 ความนาเชอถอ (authority) พจารณาวา ผจดทาหรอผผลตมความรและชอเสยงทางดานใด 3.3 วตถประสงค (objectivity) พจารณาวาเวบไซตนนมวตถประสงคเผยแพรขอมลเพออะไร และกลมเปาหมายในการเผยแพรขอมลเปนใคร 3.4 ความทนสมย (currency) พจารณาการปรบปรงเนอหาใหทนสมย และวนทจดทาหรอปรบปรงขอมลชดเจน 3.5 ขอบเขต (coverage) พจารณาขอบเขตการนาเสนอขอมลในสอใดบาง เชน สงพมพเวบ CD-ROM เปนตน และขอบเขตของเนอหาทนาเสนอ 4. เกณฑการวเคราะหเวบไซต ศรพร ชตพนธ (2542) ไดกลาววาเกณฑการวเคราะหเวบไซตพจารณาไดจากองคประกอบตอไปน 4.1 ผรบผดชอบ/ผผลต / ผแตง (author) พจารณาผรบผดชอบหรอผผลตสารสนเทศเชน บคคล หนวยงานราชการ บรษทเอกชน สถาบนการศกษา เปนตน มความเชยวชาญและช านาญดานใด และวตถประสงคในการนาเสนอ 4.2 เนอหา (content) พจารณาจาก - ความเทยงตรง ถกตอง แมนยา (accuracy) การสะกด การพมพถกพมพผดตวเลข สถตตางๆ และความละเอยดของสารสนเทศ (precision) - ความทนสมย (timeliness) วนทปรบปรงขอมลครงสดทาย วนเวลาในการบนทกสารสนเทศไวในอนเทอรเนต วนเวลาในการรวบรวมเนอหา วนเวลาในการโฆษณา และวนเวลาในการสงอเมล

- ความสมบรณของเนอหา (completeness) - ความสมพนธกบความตองการของผใช (relevance) ขนอยกบความตอง การของผใชแตละคน - ความพอเพยงของเนอหา (sufficiency) ทสามารถคนหาสารสนเทศเรองเดยวกนไดจากหลายๆ เวบไซต และสามารถนาขอมลมาเปรยบเทยบกนได - ความเขาใจงายของเนอหา (understandability) การใชภาษาเหมาะสมและถกตองกบเนอหาระดบความยากงายของศพททใช เนอหานนมการสอความหมายหรอแปลความหมายทเขาใจตรงกน มการแบงหวขออยางชดเจน มการเรยงลาดบเนอหาจากงายไปหายากหรอตามลาดบเหตการณ - สามารถตรวจสอบได (verification) จากเอกสารและเนอหาทมการอางองตามหลกวชาการผแตงหรอผรบผดชอบขอมลมการกลาวถงในแหลงขอมลหรอแหลงความรใด 4.3 ความยตธรรมไมลาเอยง (freedom from Bias) 4.4 คณธรรมและจรยธรรม (morals and Virtue) 5. เกณฑการวเคราะหเวบไซต สมช (Smith 1997) ไดเสนอเกณฑการประเมนสารสนเทศบนอนเทอรเนตไวโดยพจารณาจากเรองตอไปน 5.1 ขอบเขต (scope) พจารณาการครอบคลมของเนอหาใหสอดคลองกบวตถประสงคทจดทาเนอหาหรอขอมลทเกยวของกวาง เจาะลกและเหมาะสมกบกลมผใชเพยงใด ครอบคลมระหวางชวงเวลาใดบาง 5.2 เนอหา (content) พจารณาดงตอไปน - พจารณาวาเปนขอเทจจรงหรอความคดเหนของเนอหาโดยตรงหรอเปนเพยงรายการของการเชอมโยง - พจารณาความถกตอง แมนยา (accuracy) โดยตรวจสอบจากแหลงวจารณวรรณกรรมหรอขอมลในเนอหามความเปนอคตทางความคดหรออดมการณหรอประชาสมพนธ เรองใดเรองหนงหรอไม - ความมอ านาจ (authority) ของผจดทา โดยพจารณาจากความเชยวชาญหรอชอเสยงในเรองทเผยแพร - ความทนสมย (currency) จากวนเวลาทปรบปรงขอมล - ลกษณะพเศษ (uniqueness) ของเนอหาทแตกตางกนจากสอรปแบบอน - การเชอมโยง (links) ภายในเนอหาหรอแหลงขอมลอน

- คณภาพการนาเสนอ (quality of writing) ในเรองการใชภาษาไดชดเจนและมเหตผล 5.3 การออกแบบกราฟกและสอประสม (graphic and multimedia design) พจารณาความนาสนใจของเวบ การนาเสนอภาพ เสยง และภาพเคลอนไหวเหมาะสมกบเนอหา 5.4 วตถประสงค (purpose) พจารณาวามการนาเสนอเพอวตถประสงคใด และกลมผใชคอใคร 5.5 บทวจารณ (reviews) พจารณาจากแหลงวจารณอนๆ ทกลาวถงเกยวกบเวบไซตนน 5.6 การใชงาน (workability) พจารณาจาก - ความสะดวกและประสทธภาพตอการใชงาน การทาจดเชอมโยงหรอนาขอมลบนเวบเพจมาลงในเวบไซตของหองสมด เพอใหผใชสามารถเรยกใชไดโดยตรง - การเขาใชงานไดงาย (user Friendly) และสะดวก โดยไมตองใชคาสง เชน มเมนคาสง ปมชวยเหลอ เปนตน - สามารถใชไดกบอปกรณคอมพวเตอรและโปรแกรมทใชในรปของเครอขายหรอทตองการใหผใชมรหสผาน (password) หรอใชไดกบเบราเซอรหลายชนด - การสบคน มเครองมอชวยในการสบคนขอมลจากแหลงสารสนเทศอน ซงมลกษณะคลายเซรชเอนจน(search engine) - เวบไซตสามารถโตตอบหรอสามารถสอสารสองทางกบผใชได 5.7 คาใชจาย (Cost) พจารณาจากราคาและคาใชจายในการเขาใชขอมลบนเวบหรอคาใชจายในดานลขสทธของการใชขอมล 6. เกณฑการวเคราะหเวบไซต สนสรนทร บวเลศ (2543) กลาวถงเกณฑการประเมน คณคาของสารสนเทศบนอนเทอรเนต ดงน 6.1 เจาของสารสนเทศหรอผรบผดชอบ (authorship/authority) พจารณาจากขอมลของผรบผดชอบหรอเจาของสารสนเทศ เพอทราบถงความเชยวชาญในเรองทนาเสนอ วฒการศกษาในสาขาเดยวกบเรองทนาเสนอ และเปนทรจกและยอมรบอยางกวางขวางจากบคคลในวงวชาชพเดยวกน 6.2 วตถประสงคในการนาเสนอ (purpose) พจารณาจากกลมเปาหมายทตองการนาเสนอวตถประสงคการนาเสนอ เชน เพอใหความร โฆษณาประชาสมพนธ ความบนเทง เปนตน

6.3 เนอหาของสารสนเทศ (contents) พจารณาจากความถกตอง ความทนสมยในเนอหาของสารสนเทศ การอางองถงแหลงทมาของขอมล ลกษณะการนาเสนอทอานเขาใจงายการสะกด การพมพทถกตอง ครอบคลมขอมลในเรองทนาเสนออยางครบถวน 6.4 มมมองหรอทศนคต (point of view or bias) พจารณาจากความเปนกลางของเนอหาลกษณะการนาเสนอ แหลงทมาของสารสนเทศ เชน จากรานคา ผจดจาหนายขอมลนาเสนอขอมลในลกษณะการโฆษณาชวนเชอเพอเสนอขายสนคา เปนตน 6.5 โครงสรางและองคประกอบของขอมล (structure & elements) พจารณาจากองคประกอบของขอมลทครบถวน เหมาะสมกบกลมเปาหมาย ความยากงายในการเขาถง เชน เวลาทใชในการดงขอมล ฐานขอมลหรอเครองมอในการคนหา ปรมาณสารสนเทศ การวางรปแบบ สารสนเทศ และภาพประกอบทเหมาะสมกบเนอหาและกลมเปาหมาย มการเชอมโยงไปยงแหลงขอมลอนทมความสมพนธในเนอหาเดยวกน

ทมา : มะลวรรณ ระหภา. การพฒนาเวบไซตและฐานขอมลโบราณวตถ: กรณศกษาพพธภณฑสถานแหงชาตบานเชยง. วทยานพนธศลปะศาสตรมหาบณฑต. แขนงวชาสารสนเทศศาสตร สาขาศลปศาสตร. มหาวทยาลยสโขทยธรรมาธราช, 2554

การออกแบบและพฒนาเวบไซต

เวบไซตคอแหลงทรวมหนาเวบจ านวนมากมายหลายหนาในเรองเดยวกนมารวมอยดวยกน แตสงหนงในการน าเสนอเรองรวมทอยบนเวบไซตทแตกตางไปจากโปรแกรมโทรทศนเนอหาในนตยสารหรอหนงสอพมพ คอการท างานบนเวบจะไมมวนสนสดลง ทงนเนองจากเราสามารถเพมหนาเวบไซตเพมเตมสารสนเทศททนสมย เปลยนภาพกราฟก ฯลลฯ ไดอยตลอดเวลา จงนบเปนการทายทายความคดสรางสรรคของนกออกแบบอยางมากในงานทขยายวงกวางเชนน ดงนนการออกแบบเวบไซตจงเปนสงส าคญมากอยางหนงทควรค านงกอนทจะลงราบละเอยดในเวบไซตแตละหนาตอไปตามลกษณะทแทจรงแลว เวลดไวดเวบประกอบดวยหนาเอกสารจ านวนมากมายหลายลานหนา ซงมลกษะเชนเดยวกบหนาเอกสารทใชพมพดวยโปรแกรมประมวลค านนเอง หนาเอกสารแตละหนาเหลานจะมการเชอมโยงกนเพอใหผอานสามารถอานไดในเวลาอนรวดเรว เอกสารทมความเกยวของและเชอมโยงกนเหลานจะอยรวมกนเรยกวา “เวบไซต” หรอทอยเวบซงเปนทรวบรวมเอกสารนนอยในเครองบรการอนเตอรเนตปกตแลวในแตละเวบไซตจะม “โฮมเพจ” หรอเรยกอกชอหนงวา “หนาตอนรบ” ซงปรากฎเปนหนาแรกเมอเปดเวบไซตนนขนมาในหนาโฮมเพจจะเปรยบเสมอนเปนหนาสารบญเพอบอกกลาวหวขอเรองราวเกยวกบเวบไซตนน แตในบางเวบไซตจะมหนาน าเขารวมอยดวย หนาน าเขาเปรยบเสมอนเปนชอเรองของหนงสอกอนทจะน าเขาไปสหนาโฮมเพจ

หลกในการออกแบบเวบไซต ตามทไดกลาวมาแลววา เวบไซตเปนแหลงรวบรวมหนาเวบจ านวนมากมายหลายหนาในเรองเดยวกนมารวมอยดวยกน แตการท างานบนเวบจะไมมวนสนสดเนองจากนกออกแบบสามารถปรบปรงทกอยางบนหนาเวบไซตไดตลอดเวลา ดงนนการออกแบบเวบไซตจงตองการเรมตนทดโดยค านงถงหลกการตางๆ ซงแบงเปนหวขอใหญไดดงน 1. การวางแผนลวงหนา การท างานใดๆกตามยอมตองมการวางแผนไวเพอจดขนตอนในการท างานและเปนแนวทางใหสามารถด าเนนงานไปไดดวยความสะดวกรวดเรว ถาไมมการวางแผนไวกอน คอ มการสรางเคาโครง การสรางเคาโครงนจะชวยใหเราเหนสวนตางๆของโครงการไดอยางรวดเรวโดยยงไมตองสรางหนาเวบจรง และชวยใหสามารถรวบรวมจดระเบยบโครงสรางตางๆของเวบไซตไดอยางรวดเรวและงายดาย มการเกบรวบรวมวสด เพราะเราจ าเปนทจะตองเกบรวบรวมเนอหาตางๆใหเรยบรอยกอนเรมท างานจรง ทงนยอมขนอยกบเคาโครงทรางไววาตองการสงใดบางในการท างานน แลวสรางรายการของสงตางๆทตองการใชในเวบไซต

2.รวบรวมจดระเบยบ ภายหลงเมอวางแผนและเกบรวบรวมวสดตางๆ ทจ าเปนตองใชในการสรางเวบไซตเรยบรอยแลวสงแรกกอนทจะมการสรางเวบไซตไดนน นกออกแบบจ าเปนตองท าการจดระเบยบเพอความสะดวกในการท างาน คอ ควรมการรวบรวมแฟมซงในการรวบรวมแฟมขอมลตางๆ ควรท าการจดเกบรวมกนไวในโฟลเดอรใหญ แตส าหรบเวบไซต เราควรจะสรางโฟลเดอรยอยตางหากหรอเวบไซตนนมขนาดใหญเพยงพอทจะแตกยอยลงไป เปนสวนตางๆอกโดยแตละสวนนนจะมแฟมเฉพาะของตนเอง 3. การน าทาง การออกแบบเครองมอน าทางเพอใหการส ารวจเวบไซตเปนไปดวยความสะดวกรวดเรวและไมเกดการหลงทางนบวาเปนสงจ าเปนอยางยงทงน เพราะจะเปนประโยชนแกผอานในการเขาถงขอมลตางๆ ไดโดยงาย และเปนสงดงดดใจเพอมใหผอานเกดความเบอหนายจนคลกผานเวบไซตนนไปเลย และจะเปนการดกวาถาจะใชเครองมอน าทางทเปนขอความในการเชอมโยง เพราะฉะนนแลวเครองมอน าทางทเปนกราฟกนนจะมขนาดใหญมากเกนไปและจะท าใหเสยเวลาในการดาวโหลด 4. เกณฑมาตรฐาน การออกแบบเวบไซตทดนนควรมเกณฑมาตรฐานของสงตางๆ ทอยในโครงสรางเวบนนเพอไมสรางความสบสนใหแกผออกแบบเองและผอานดวย เชน ควรมความคงตงทงเวบไซต เนองจาก ความคงตวนบเปนสงส าคญในการออกแบบและเปนสงส าคญมากสงสดในการออกแบบหรอมการก าหนดความกวางมาตรฐานโดยผออกแบบควรจะตดสนใจใหไดวาจะใชความกวางจดภาพเทาใดในเวบไซตนนกอนเรมการออกแบบหนาแตละหนา รวมถงในสวนของแบบการพมพหรอแบบตวอกษรเพอความคงตวในเวบไซต โดยการล าดบขนของการพมพหวเรอง หวขอใหญ หวขอยอย และเนอเรองใหมความแตกตางกนและใชตรงกนในทกๆหนาเพอใหผอานสงเกตเหนไดงายในล าดบขนความส าคญของเนอหา 5. ผอาน เนองจากเวลดไวดเวบเปนสงททกคนในสวนตางๆของโลกสามารถเขาถงไดโดยไมมขดจ ากด จงอาจเปนความล าบากของนกออกแบบในการทจะตอบสนองความตองการของผอานในทกระดบได แตถานกออกแบบค านงถงแนวทางบางประการเกยวกบผอานแลวสามารถออกแบเวบไซตนนใหเปนประโยชนกบผอานสวนมากไดโดยเราตองค านงถงลกษณะผอาน ดงนน ถาเปนไปไดแลวควรจะมการทดลองเวบไซตนนกบวสดและอปกรณทแตกตางกนและพยายามคนหาใหทราบวาผอานสวนมาก เขาถงเวบไซตของเราดวยวสดและอปกรณสงใดทงหมดทกลาวมาน นบเปนแนวทางเบองตนกอนทจะถงการออกแบบหนาเวบทงนเพราะการออกแบบเวบไซต โดยค านงถงรายละเอยดตางๆ กอนทจะลงลกหนาเวบแตละหนานบเปนแกนหลกส าคญในการ

ด าเนนการทงหมด ถาผออกแบบไมสามารถรกษาแนวทางหรอก าหนดสงๆในเวบไซตไวไดแลว กอาจท าใหเกดความล าบากและขดของในการออกแบบหนาเวบในภายหลง

การใชสบนเวบไซต การเลอกใชสทดทสดในการสรางเวบไซต คอ เลอกสทแสดงถงความรสกและคณลกษณะทงหมดของเวบไซตนน เมอมการสรางภาพกราฟกส าหรบชอเรอง หวเรองยอย และลกษณรปน าทางเราควรใชสจากแบบแผนส เพอเปนสน าของกราฟก สงนจะชวยใหในแตละหนามองดและใหความรสกทคลายคลงกนไมวาเนอหาในแตละหนาจะมความแตกตางกนเพยงใดกตามสงทควรค านงถงอยางหนงในการท างานเกยวกบส คอ ความเปรยบตาง เชนขอความควรมความเปรยบตางทดระหวางสของตวอกษรและสพนหลง การใชสรวมกนของขอความและพนหลงบางสจะไมท าใหเกดความไมสบายตาเวลาอาน เชน การใชขอความสมวงเขมบนพนหลงสด าท าใหมองดนาตกใจและท าใหไมนาอาน เราสามารถทจะเสนอสงพมพหลากสสนบนเวบไซตได แตการทจะเพมสสนบนเวบไซตนเราตองทราบถงเทคโนโลยของสทใชบนเวบไซตเสยกอน

ทมา : (วระ ไวษยด ารง.โครงการออกแบบเวบไซต เพอประชาสมพนธผลงาน นกศกษาสาขาวชาศปกรรม (ออกแบบนเทศศลป).มหาวทยาลยจนทรเกษม.2551)

การออกแบบเวบไซต การออกแบบเวบไซตควรค านงถงการใชหลกเพอก าหนดองคประกอบภายในเวบไมวาจะออกแบบอยางไร ความรเบองตนเกยวกบการสรางเวบเพจเปนสงจะเปนซงปจจบนสามารถท าไดงายโดยไมจ าเปนตองพงพาความรทางการเขยนโปรแกรม HTML อยางแตกอน เพยงรหลกเบองตนบางเลกนอยกเยงพอทจะพฒนาเวบเพจไดดในระดบหนงแลว โปรแกรมทจะชวยพฒนาเวบมอยมากมายพอสมควรทจะเลอกใชไดตามความถนดของผททจะลองพฒนาเวบเพจ ดงนนเมอจะลองเรมตนสรางเวบเพจใหมความเหมาะสมควรค านงถงสงตอไปน

สงทตองค านงถงในการออกแบบโฮมเพจ ความแปลก ความแตกตาง (Contrast) คอแยกความแตกตางทอยบนจอภาพใหเหนชดเจน เชน การใชตวหนงสอ สน ส ขนาด ฯลฯ เพราะจะสามารถดงดดความสนใจไดด

1. การย าซ า (Repetition) คอ แบบแผนหรอสไตลของผออกแบบ จะตองมลกษณะรปแบบ สอดคลองกนทงหมด

2. การจดแถว การวางแนว (Alignment) คอ การจดการองคระกอบตางๆ ตองไมสะเปะสะปะ ไรเหตผล ไมขดกบความรสกของผอาน จดใหดหนาอาน

3. ความใกลเคยง ความเกยวเนอง (Proximity) คอการจดการองคประกอบทเกยวเนองกนใหเปนกลมกอนเดยวกน

หลกการออกแบบเวบไซต การออกแบบเวบไซตนนไมไดหมายถงลกษณะหนาตาของเวบไซตเพยงอยางเดยว แตเกยวของตงแตการเรมตนก าหนดเปาหมายของเวบไซต ระบกลมผใช การจดระบบขอมล การสรางระบบเนวเกชนการออกแบบหนาเวบ รวมไปถงการใชกราฟก การเลอกใชส และการจดรปแบบตวอกษร นอกจากนนยงตองค านงถงความแตกตางของสอกลางในการแสดงผลเวบไซตดวย สงเหลานไดแก ชนดและรนของบราวเซอร ขนาดของหนาจอมอนเตอร ความละเอยดของสในระบบ รวมไปถง Plug-in ชนดตาง ๆ ทผใชมอย เพอใหผใชเกดความสะดวกและความพอใจทจะทองไปในเวบไซตนน ดงนนทกสงทกอยางในเวบไซตทงทคณมองเหนและมองไมเหนลวนเปนผลมาจากกระบวนการออกแบบเวบไซตทงสน เวบไซตทดสวยงามหรอมลกเลนมากมายนน อาจจะไมนบเปนการออกแบบทดกได ถาความสวยงามและลกเลนเหลานนไมเหมาะสมกบลกษณของเวบไซต ดวยเหตนจงเปนเรองยากทจะระบวาการออกแบบเวบไซตทดนนเปนอยางไร

เนองจากไมมหลกเกณฑแนนอนทจะใชไดกบทกเวบไซต แนวทางการออกแบบบางอยางทเหมาะสมกบเวบไซตหนง อาจจะไมเหมาะกบอก เวบไซตหนงกได ท าใหแนวทางในการออกแบบของแตละเวบไซตนนแตกตางกนไปตามเปาหมาย และลกษณะของเวบไซตนน เวบไซตบางแหงอาจตองการความสนกสนาน บนเทง ขณะทเวบอนกลบตองการความถกตอง นาเชอถอเปนหลก ดงนนอาจสรปไดวาการออกแบบทดกคอ การออกแบบใหเหมาะสมกบเปาหมายและลกษณะของเวบไซต โดยค านงถงความสะดวกในการใชงานของผใชเปนหลก 1. องคประกอบของการออกแบบเวบไซตอยางมประสทธภาพ องคประกอบตอไปนถอเปนพนฐานทส าคญของเวบไซตทไดรบการออกแบบมาอยางมประสทธภาพ 1) ความเรยบงาย (Simplicity) หลกทส าคญของความเรยบงาย คอ การสอสารเนอหาถงผใชโดยจ ากดองคประกอบเสรม ทเกยวของกบการน าเสนอใหเหลอเฉพาะสงทจ าเปนเทานน เชน การใชรปภาพทเกยวกบองคกรเพยงอยางเดยวในการน าเสนอ 2) ความสม าเสมอ (Consistency) คอ การใชรปแบบเดยวกนตลอดทงเวบไซต เนองจากผใชจะรสกกบเวบไซตวาเปนเสมอนสถานทจรง ถาลกษณะของแตละหนาในเวบไซตเดยวกนนนแตกตางกนมาก ผใชกจะเกดความสบสนและไมแนใจวาก าลงอยในเวบเดมหรอไม ดงนนรปแบบของหนา สไตลของกราฟกระบบเนวเกชน และโทนสทใชควรจะมความคลายคลงกนตลอดทงเวบไซต การมรปแบบในแตละหนาทไมเหมอนกน จนท าใหไมแนใจวายงอยในเวบเดมหรอเปลา เมอออกแบบโครงสรางของหนาเวบเพจ รปแบบของกราฟก ลกษณะตวอกษร โทนส และองคประกอบอน ๆ เปนทเรยบรอยแลว กควรน าลกษณะดงกลาวไปใชกบทก ๆ หนาใหเปนมาตรฐานเดยวกนตลอดทงเวบไซต เพอเปนเอกลกษณใหผใชสามารถจดจ าลกษณะของเวบไซตไดดยงขน นอกจากนนความสม าเสมอของโครงสรางหนาเวบ และระบบเนวเกชนกจะท าใหผใชรสกคนเคย และสามารถคาดการณลกษณะของเวบไดลวงหนา ซงจะชวยใหการทองเวบเปนไปอยางสะดวก ในทางเทคนคสามารถใช Cascading Style Sheet (CSS) ชวยในการก าหนดสไตลมาตรฐานใหกบองคประกอบตาง ๆ เชน ตวอกษร ส หรอตาราง โดยทก าหนดรปแบบเพยงครงเดยว แลวสามารถน าไปใชไดกบขอมลทงหมดในเวบไซต ท าใหเกดความสะดวกในการออกแบบ และยงงายตอการเปลยนแปลงในภายหลง 3) ความเปนเอกลกษณ (Identity) การออกแบบตองค านงถงลกษณะขององคกร เนองจากรปแบบของเวบไซตสามารถสะทอนถงเอกลกษณ และลกษณะขององคกรนนได โดยการใชส และสญลกษณขององคกรเปนสวนประกอบ

4) เนอหาทมประโยชน (Useful Content) เนอหาถอเปนสงทส าคญทสดในเวบไซต ดงนนในเวบไซตควรจดเตรยมเนอหาและขอมล ทผใชตองการใหถกตองและสมบรณ โดยมการปรบปรงและเพมเตมใหทนตอเหตการณอยเสมอ เนอหาทส าคญทสดคอ เนอหาทสรางขนมาเองโดยทมงานของคณและไมซ ากบเวบอนเพราะจะเปนสงทดงดดผใชใหเขามาในเวบไซตอยเสมอ 5) ระบบเนวเกชนทใชงานงาย (User-Friendly Navigation) ระบบเนวเกชนเปนองคประกอบทส าคญมากของเวบไซต จะตองออกแบบใหผใชเขาใจไดงายและใชงานสะดวก โดยใชกราฟกทสอความหมายรวมกบค าอธบายทชดเจน รวมทงมรปแบบและล าดบของรายการทสม าเสมอ 6) มลกษณะทนาสนใจ (Visual Appeal) เปนเรองยากทจะตดสนวาลกษณะหนาตาของเวบไซตนาสนใจหรอไม เพราะเกยวของกบความชอบของแตละบคคลอยางไรกตามหนาตาของเวบไซตจะมความสมพนธกบคณภาพขององคประกอบตาง ๆ 7) การใชงานอยางไมจ ากด (Compatibility) ควรออกแบบเวบไซตใหผใชสวนใหญเขาถงไดมากทสด โดยไมมการบงคบใหผใชตองตดตงโปรแกรมใด ๆ เพมเตม หรอตองเลอกใชบราวเซอรชนดใดชนดหนงจงจะสามารถเขาถงเนอหาได สามารถแสดงผลไดในทกระบบปฏบตการและทความละเอยดหนาจอตางกนอยาง ไมมปญหา 8) คณภาพในการออกแบบ (Design Stability) ถาตองการใหผใชรสกวาเวบไซตทมคณภาพ ถกตอง และเชอถอได กควรใหความส าคญกบการออกแบบเวบไซตเปนอยางมาก เชน การรกษาคณภาพความเปนเอกลกษณขององคกร การออกแบบสวนเชอมโยง การออกแบบชดส การออกแบบกลองโตตอบ ฯลฯ เหลานลวนเปนสงจ าเปนทงสน 9) ระบบการใชงานทถกตอง (Functional Stability) ระบบการท างาน ในเวบไซตจะตองมความแนนอน และท าหนาทไดอยางถกตองท าใหผใชไมรสกหลงทางขณะใชงานเวบไซต ซงระบบการท างานทถกตองเปนสวนทเกยวเนองกบการออกแบบระบบเนวเกชน 2. กระบวนการพฒนาเวบไซต กระบวนการพฒนาเวบไซต เปนกระบวนการทอาศยหลกการจดระบบโครงสรางขอมล (Information Architecture) อยในหลาย ๆ สวน ตงแตขนแรกจนถงขนทไดเปนรปแบบ โครงสรางสดทาย (Final Architecture Plan) ซงถอเปนกระบวนการทส าคญมากทจะท าใหเวบไซตบรรลตามเปาหมายทตงไว การจดระบบโครงสรางขอมล คอ การพจารณาวาเวบไซตควรจะมขอมลและการท างานใดบาง ดวยการสรางเปนแผนผงโครงสรางกอนทจะเรมลงมอพฒนาเวบ

เพจ โดยเรมจากการก าหนดเปาหมายเวบไซต และกลมผใชเปาหมาย ตอมากพจารณาถงเนอหาและการใชงานทจ าเปนแลวน ามาจดกลมใหเปนระบบ จากนนกถงเวลาในการออกแบบโครงสรางขอมลในหนาเวบ ใหพรอมทจะน าไปออกแบบกราฟก และหนาตาใหสมบรณตอไปการจดท าระบบโครงสรางขอมลเปนพนฐานส าคญในการออกแบบเวบไซตทด ทจะชวยพฒนาแบบแผนรายละเอยดขอมลในการออกแบบเวบไซต ซงไดแก รปแบบการน าเสนอระบบการท างาน แบบจ าลอง ระบบเนวเกชน และอนเตอรเฟสของเวบ ดงนนการจดระบบ โครงสรางขอมลจงเปนสงส าคญทเกยวของอยในกระบวนการออกแบบเวบไซต ประโยชนของสในเวบไซต สเปนเครองมออเนกประสงคอยางหนงทมความส าคญมากในการออกแบบเวบไซต เนองจากสสามารถสอถงความรสกและอารมณ และยงชวยสรางความสมพนธระหวางสถานทกบเวลาอกดวย ดงนนสจงเปนปจจยส าคญอยางหนงทจะชวยเสรมสรางความหมายขององคประกอบใหกบเวบเพจได อยางด ประโยชนของสในรปแบบตางๆ มดงน - สสามารถชกน าสายตาผอานใหไปยงทกบรเวณในหนาเวบเพจ ผอานจะมการเชอมโยงความรสกกบบรเวณของสในรปแบบทคาดหวงได การเลอกเฉดสและต าแหนงของสอยางรอบคอบในหนาเวบ สามารถน าทางใหผอานตดตามเนอหาในบรเวณตางๆ ตามทเราก าหนดได วธนจะเปนประโยชนอยางมากเมอคณตองการใหผอานใหความสนใจกบสวนใดสวนหนงในเวบไซตเปนพเศษ เชน ขอมลใหม โปรโมชนพเศษ หรอบรเวณทไมคอยไดรบความสนใจมากอน - สชวยเชอมโยงบรเวณทไดรบการออกแบบเขาดวยกน ผอานจะมความรสกวาบรเวณทมสเดยวกนจะมความส าคญเทากน วธการเชอมโยงแบบนชวยจดกลมของขอมลทมความสมพนธอยางไมเดนชดเขาดวยกนได - สสามารถน าไปใชในการแบงบรเวณตางๆ ออกจากกน ท านองเดยวกบการเชอมโยงบรเวณทมสเหมอนกนเขาดวยกน แตในขณะเดยวกนกเปนการแบงแยกบรเวณทมสตางกนออกจากกน - สสามารถใชในการดงดดความสนใจของผอานสายตาผอานมกจะมองไปยงสทมลกษณะเดน หรอผดปกตเสมอ การออกแบบเวบไซตดวยการเลอกใชสอยางรอบคอบ ไมเพยงแตจะกระตนความสนใจของผอานเพยงเทานน แตยงชวยหนวงเหนยวใหพวกเขาอยในเวบไซตไดนานยงขน สวนเวบไซตทใชสไมเหมาะสม เสมอนเปนการขบไลผชมไปสเวบอนทมการออกแบบทดกวา - สสามารถสรางอารมณโดยรวมของเวบเพจ และกระตนความรสกตอบสนองจากผชมไดนอกเหนอจากความรสกทไดรบจากสตามหลกจตวทยาแลว ผชมยงอาจมอารมณและความรสกสมพนธกบสบางสหรอบางกลมเปนพเศษ

ทมา : (ประพฒน ศรสวสด.โครงการออกแบบเวบไซตส านกศลปะและวฒนธรรม.สาขาศลป กรรม.มหาวทยาลยจนทรเกษม.2550)

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

การออกแบบเวบไซตเปนการก าหนดรปแบบการน าเสนอเนอหาของเวบไซตสามารถด าเนนงานไดดงน 1.การออกแบบโฮมเพจ (Homepage) เปนหนาแรกของเวบไซต ประกอบดวยชอ เวบไซตตวอกษรรปภาพ เสยงและหวขอหลกของเวบไซตทเชอมโยงไปยงเวบเพจหนาตางๆ ซงประกอบดวย 3หวขอหลกคอ ประวตและพฒนาการของมหาวทยาทยาลยสโขทนธรรมาธราชพระบาทสมเดจ พระปกเกลาเจาอยหวกบการเรยนรตลอดชวต การเชอมโยงหรอลงคไปยงแหลงเรยนรออนไลนดานศลปวฒนธรรมของมหาวทยาลย

1.2 การออกแบบเวบเพจ (Webpage) เปนการสรางหนาเนอหาสวนตางๆ ทเชอมโยงจากโฮมเพจ ประกอบดวย 1) ประวตและพฒนาการของมหาวทยาลยสโขทยธรรมาธราช น าเสนอเนอหาเปน4 สวน ไดแก พระบรมวงศานวงศกบมหาวยาทยาลยความเปนมาของมหาวทยาลยการจดการศกษารางวลเกยรตยศ ชงแตละเวบเพจประกอบดวยขอความภาพประกอบทมความสมพนธกบเนอหาเสยงประกอบ การน าเสนอเปนตน

2) พระบาทสมเดจพระปกเกลาเจาอยหวกบการเรยนรตลอดชวต น าเสนอเนอหาเปน 5 สวน ไดแกพระราชประวตพระราชกรณยกจดานการศกษา พระราชกรณยกจดานการปกครอง พระราชกรณยกจดานศลปวฒนธรรม พระราชกรณยกจดานสารสนเทศ ซงแตละเวบเพจประกอบดวยขอความภาพประกอบทมความสมพนธกบเนอหาเสยงประกอบการน าเสนอ และวดทศนเปนตน

1.3องคประกอบภายในเวบเพจ เปนการจดวางองคประกอบของแตละเวบเพจตาม ต าแหนงทเหมาะสมและสวยงาม จดสดสวนระหวางขอความและภาพกราฟกใหเหมาะสม ไดแก ขอความเสยง ภาพนง ภาพกราฟกและภาพเคลอนไหวเปนตน

1.4 การเชอมโยงเปนการก าหนดการเชอมโยงจากขอความรปภาพ ภายในเวบเพจเดยวกน และไปยงเวบเพจอนทอยภายในเวบไซตเดยวกน รวมถงการเชอมโยงไปยงเวบไซตอนๆ

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

สสนมความสอดคลองและไปในทางเดยวกบรปแบบ และกรอบความคดของเวบไซตการใชสสนในเวบไซตมความกลมกลนและสอดคลองกน, รปภาพในหนาแรกของเวบไซต มขนาดภาพทเหมาะสมกบเวบไซต, รปภาพในเวบไซตทใชมขนาดไฟลไมใหญ, รปภาพมความสอดคลองกบรปแบบของเวบไซต, การใชรปแบบตวหนงสอทเปนมาตรฐาน, รปแบบการออกแบบทมความกลมกลนกนทงเวบไซต, การใชสสนหรอการมสไตลของเวบตวเองไดอยางโดดเดนชด, โลโกและชอเวบไซตมความโดดเดนและสอดคลองกบรปแบบของเวบไซต, การออกแบบภายในเวบไซตมความสอดคลองกนอยางกลมกลนทางดานรปแบบและมมมองรวมถงสสนทใชและมความสามารถในการรองรบเปดชมไดอยางถกตองในเบราเซอรทนยมใชแสดงผลไดถกตอง

ทมา : (เจมพงศ ใจหลา.การพฒนาและการประเมนผลเวบไซต.คณะสารสนเทศและการสอสาร.มหาวทยาลยแมโจ จงหวดเชยงใหม)

การพฒนาเวบไซต

การพฒนาเวบไซตเปนการก าหนดโครงสรางหลกทใชในการพฒนาเวบไซตทประกอบดวยขอความเสยง ภาพนง ภาพวดทศนทเกยวของกบประวตและพฒนาการของมหาวทยาลยพระบาทสมเดจพระปกเกลาเจาอยหวกบการเรยนรตลอดชวตและเชอมโยงหรอลงคไปยงแบนเนอร(Banner) แหลงเรยนรออนไลนดานศลปวฒนธรรม กระดานสนทนา (Web board) และสมดเยยม (Guest- book) ในเครอขายซงประกอบดวยการเชอมโยงภายในเวบเพจเดยวกนการเชอมโยงกบเวบเพจอนทอยภายในเวบไซต เดยวกน การเชอมโยงไปยงเวบไซตอนๆ ในสวนของเสยงและวดทศนใชโปรแกรมเรยลเพลเยอรในการเปดฟงหรอชมโดยมขนตอนในการพฒนาเวบไซต

แนวทางในการพฒนาเวบไซต

ไวเลย (Wiley. 1998 : 24) มแนวคดเกยวกบแนวทางในการพฒนาเวบไซต 3 แนวทาง คอ การพฒนาเวบไซตทเกดขนโดยมไดตงใจ เปนการพฒนาเวบไซตในระยะแรกทมการใชระบบเครอขายอนเทอรเนต ซงเกดจากการทผพฒนาไดมประสบการณในการใชประโยชนจากอนเทอรเนต และเกดความประสงคทจะน าเสนอสารสนเทศของตน จงไดพฒนาเวบไซตขนการพฒนาเวบไซตตามความตองการของผบรหารหรอความกาวหนาของเทคโนโลยเปนการพฒนาเวบไซตขนตามแนวทางนมความตองการเพยงการน าเสนอสารสนเทศขององคกรผานเครอขายอนเทอรเนตเทานนการพฒนาเวบไซตอยางมแบบแผน เปนการพฒนาเวบไซตทผพฒนาตระหนกถงประโยชนของเวบไซตในการน าเสนอสารสนเทศ มการวางแผน การออกแบบ และการพฒนาตามวตถประสงคขององคกรอยางเปนกจจะลกษณะ

ไคลด (Clyde. 2000 : 98) ผเชยวชาญแหงมหาวทยาลยไอซแลนด ไดแนะน าวฏจกรของการพฒนาเวบไซต คอ การก าหนดจดมงหมาย/วตถประสงค การวเคราะหความตองการของผใช การก าหนดเนอหาและหรอการบรการ การจดการขอมล การออกแบบ การลงรหสเอชทเอมแอล การทดสอบและแกไขปรบปรง การเผยแพร การบ ารงรกษาเวบไซต และการประเมน ฮจซตน (Houghton. 2000 : 269-280) หวหนาโครงการหองสมดดจทล มหาวทยาลยเดอมองทฟอรท ไดอธบายขนตอนในการพฒนาเวบไซตของหองสมดมหาวทยาลยเดอมอนทฟอรท โดยมขนตอนในการพฒนาเวบไซต 5 ขนตอน คอการวางแผน การออกแบบระบบการรกษาความปลอดภย การบ ารงรกษา และการพฒนาในอนาคต การลอค และเพยนเทค (Garlock and Piontek. 1996 : 3-5) ไดแนะน าขนตอนในการสรางบรการพนฐานบนเวบไซตของหองสมด 5 ขนตอน คอ การวางแผน การน าเสนอแผนและใหความรแกเจาหนาท การจดเตรยมเนอหา การออกแบบ และการบ ารงรกษาเวบไซต โกลดดง, คารเตอร และโคอนา (Golding, Carter and Koina. 2000 : 51) ไดแนะแนวทางในการจดการเวบไซต 5 ขนตอน คอ การสรปเกยวกบการบรหาร การวเคราะหความตองการ การออกแบบและการปรบปรง การวางแผนในการบ ารงรกษา และการพฒนาเวบไซตในอนาคต ธวชชย ศรสเทพ (2544 : 31) กลาววามกระบวนการในการพฒนาเวบไซต ดงน 1. ส ารวจปจจยส าคญ (Research) ซงมปจจยหลก 3 ประการดงน 1.1 ก าหนดเปาหมายและส ารวจความพรอมของทรพยากรทมอย เชน บคลากรเงนทน

1.2 เรยนรกลมผชมโดยการระบกลมผชมและศกษาความตองการของกลมผชม 1.3 ศกษาเวบไซตของคแขงโดยการส ารวจและเรยนรเพอวางกลยทธในการแขงขน

2. พฒนาเนอหา (Site content) 2.1 สรางกลยทธการออกแบบเพอใหไดแนวทางในการออกแบบเวบไซต 2.2 หาขอสรปขอบเขตเนอหาเพอใหไดขอบเขตของเนอหาและการใชงานรวมถงไดขอมลทถกจดอยางเปนระบบ

3. พฒนาโครงสรางเวบไซต (Site structure) 3.1 จดกลมขอมลใหเปนระบบเมอมขอมลเปนจ านวนมากทจะน ามาใชในเวบไซตจะตองน าขอมลเหลานนมาจดใหเปนระบบเพอใหไดเปนรางแผนผงโครงสราง (Draft architectureplan) ดวยการทดลองใชแนวคดหลาย ๆ แบบ มาใชเปนเกณฑในการจดกลม และลองตงชอกลมขอมลเหลานน จากนนใหเปรยบเทยบแนวทางการจดกลมขอมลของผเกยวของ ทกคนเพอหาขอสรปทคนสวนใหญเขาใจไดงายระบบโครงสรางขอมลทดจะมสวนชวยใหผใชเขาใจภาพรวมของเนอหาไดด การเลอกใชระบบขอมลแบบใดนนขนอยกบวตถประสงคและแนวคดในการจดแบงขอมลเปนส าคญ ส าหรบเวบไซตทวไปควรจะหาการตอบสนอง ความตองการของผใช ซงกคอ ผใชอยากรวาขอมลทตองการนนอยทไหนและจะเขาถงขอมลนนไดอยางไร ดงนน การจดระบบขอมลในเวบไซตเพอใหงายตอการคนหา จงเปนสงส าคญทจะชวยสงเสรมหรอชวยขดขวางความส าเรจของเวบไซตนน ๆ ได การจดระบบขอมลนนจงมผลตอเนองมายงระบบเนวเกชน อกดวย 3.2 จดท าโครงสรางขอมลดวยการท าแผนผงโครงสรางของเวบไซต หลงจากไดจดกลมขอมลเปนระบบแลว และน าขอมลทไดมาจดเปนโครงสรางเนอหาทแสดงถงกลมขอมลและล าดบขนของหวขอ ขนตอมา คอ การน ารายการโครงสรางของเวบไซตทไดจดขอมลไวแลวมาจดใหเปนแบบแผนโดยสรางเปนแผนผงทแสดงถงโครงสรางขอมล ล าดบขนและการเชอมโยงของแตละสวนอยางชดเจนเรยกวาแผนผงโครงสรางเวบไซต ซงเปนการแสดงภาพรวมของเวบไซตในเชงกราฟก โดยเรมจากหนาโฮมเพจหรอหนาเกรนน าไปจนถงหนายอย ๆ ทงหมดนอกจากนยงมการเขยนโครงสรางเวบไซตอยางงายอกรปแบบหนงทเรยกวา Site mapซงแสดงถงภาพรวมของเนอหาหลก ๆ ภายในเวบไซต แตไมมรายละเอยดมากเทากบแผนผงโครงสรางเวบไซต โดยอาจจดท าเปนแบบตวหนงสอหรอแบบกราฟกแผนผงชนดน เหมาะทจะน าไปแสดงบนเวบไซตเพอใหผใชเขาใจโครงสรางเนอหาของเวบไซตไดงายขน

3.3 พฒนาระบบเนวเกชนเพอวางแนวทางในการทองเวบ 4. ออกแบบและพฒนาเวบไซต (Visual design) 4.1 ออกแบบลกษณะเวบเพจ 4.2 พฒนาเวบไซตตนแบบและโครงสรางเวบไซตครงสดทาย

5. พฒนาและด าเนนการ (Production and operation) 5.1 ลงมอพฒนาเวบเพจเพอใหไดเวบไซตทสมบรณ 5.2 เปดตวเวบไซต

5.3 ดแลและพฒนาเวบไซตอยางตอเนอง ชยยทธ ลมลาวลย (2544 : 27) ไดกลาวถงขนตอนตาง ๆ ในการพฒนาเวบไซตวาจะตองประกอบไปดวยองคประกอบหลาย ๆ สวน ดงน

1. การวเคราะหและการวางแผนการพฒนาเวบไซต 1.1 ก าหนดวตถประสงคของเวบไซตใหชดเจน (Objective) มองภาพรวมของเวบไซตออกมาใหไดกอนวาเปนลกษณะอยางไร การก าหนดวตถประสงคของเวบไซต เพอเปนการหาจดเดนของเวบไซตนนออกมา ถาเวบไซตมความโดดเดนเปนเอกเทศในเรองใดเรองหนง ใหท าระบบงานนนใหดทสดและพฒนาอยางตอเนอง 1.2 รปแบบเนอหาทจะน าเสนอ (Content) สวนเนอหาเปนสวนทส าคญ เพราะถาขอมลทน ามาเสนอมความถกตอง อานเขาใจงาย ไมนาเบอและมการปรบปรงใหทนสมยอยตลอดเวลา จะท าใหผเขามาเยยมชม คอยตดตาม 1.3 เปาหมายของเวบไซตทพฒนา (Target) ก าหนดเปาหมายของเวบไซต และพยายามหากระบวนการและขนตอนการปฏบตงาน ใหบรรลเปาหมาย หาวธการหรอเทคนคตาง ๆมาผสมผสานใหงานเกดประสทธภาพมากทสด 1.4 น าเทคนค กลยทธตาง ๆ มาใชกบเวบไซต (Technical) ใชเทคนคทางดานตาง ๆ มาชวยการท างานในระบบ เชน การปองกนการสงไฟลทมจ านวนมากเกนไป เปนตนมขอมลสาระทนาสนใจใหกบสมาชก ไมวาจะเปนขาวสารตาง ๆ การสมมนา เพราะสมาชกนาจะไดรบขางสารททนสมยทนเหตการณจากผพฒนา 1.5 สถาปตยกรรมหรอโครงสรางของเวบไซต (Site architecture)การวางสถาปตยกรรม เมอมองเหนระบบงานทงหมดแลวเขยนออกมาเปนภาพอยางละเอยด เพอจะไดเหนกระบวนการ

ขนตอนการท างานทงหมดวามจดเรมตนและสนสดตรงจดใด เพอใหการด าเนนงานเกดประสทธภาพมากทสด 1.6 การก าหนดตารางเวลาท างาน (Timing) การก าหนดระยะเวลาการท างานใหชดเจน ไมวาจะเปนดานการออกแบบ ดานการเขยนโปรแกรม หรอการใสเทคนคตาง ๆ พรอมทงการทดสอบระบบ ทงนเพอใหระบบด าเนนงานมความกาวหนาและไมเกดการหยดชะงก

2. การพฒนาเวบไซต (Web developing)

2.1 การเตรยมขอมลเนอหา 2.2 การออกแบบโครงสรางและกราฟก เมอไดแนวคดส าหรบการออกแบบรปรางหนาตาของเวบไซตแลว ขนตอนตอไป คอการเลอกใชเครองมอในการสรางสรรคงาน ซงในปจจบนมใหเลอกใชมากมายดงน 2.2.1 เครองมอทางดานโครงสรางการใช Editor ตาง ๆ แลวแตความถนดของแตละคน ซงบางคนถนดเขยนแบบค าสงทงหมด แบบ HTML อาจใช Notepad มขอเสยคอชาและเสยเวลา Microsoft Frontpage,Homesite, Golive จะงายและรวดเรวมากกวา2.2.2 เครองมอทางดานกราฟกเครองมอกราฟกมใหเลอกมากมายหลายประเภท เชน ซอฟตแวร Adobe Photoshop ส าหรบการตกแตงภาพใหออกมาในรปแบบทตองการ เชน ท าใหภาพสวางขนผสมผสานภาพถายหลาย ๆ ภาพใหเปนภาพเดยวกน การน าภาพขนเวบไซตนน ถามขนาดใหญสามารถใชเครองมอในการซอยภาพใหออกเปนสวน ๆ แลวน าไปประกอบบนเวบไซตไดอกครง Adobe Ready ส าหรบการบบอดภาพ ท าใหมขนาดเลกลงแตคณภาพยงใกลเคยงตนฉบบซงเปนสงส าคญมาก การน าภาพขนเวบไซตนน ขนาดของภาพยงเลกเทาไหร ยงด เพราะจะท าใหการเรยกดภาพใชเวลานอยลง Adobe Image Styler ส าหรบการออกแบบภาพตาง ๆ ทจะน ามาใชบนเวบไซต เชนการออกแบบตวอกษรใหมลกษณะตาง ๆ การสรางวตถขนมาใชงานรวมกบภาพถาย เปนตน 2.3 การพฒนาทางดานโปรแกรม (Web programming) โปรแกรมทจะน ามาใชนนถาเปนระบบเฉพาะทไมมทอนใช ตองเขยนหรอพฒนาขนเอง ซงโปรแกรมทจะพฒนาขนอยกบระบบเครองคอมพวเตอรแมขายดวย เชน ถาเครองแมขายเปน Microsoft Window NT โปรแกรมทใชเขยนจะเปน ASP หรอถาพฒนา บนเครองแมขายทเปนระบบ UNIX, Linux จะใชโปรแกรม Perl Script, PHP เปนตน ทงนผทพฒนาทางดานโปรแกรมควรทราบวาควรจะใชภาษาอะไรในการพฒนาจงจะเหมาะสมทสด 2.4 การน าเทคนคตาง ๆ มาเสรม (Web technical) เทคนคตาง ๆ ทน ามาใชจะเปนสสน

ทท าใหเวบไซตมชวตชวามากขน การเลอกใชเทคนคตาง ๆ นนควรค านงถงความเหมาะสมดวยวา น ามาใชแลวสงผลตอเวบอยางไรGif Animation เปนโปรแกรมส าหรบสรางภาพเคลอนไหว เชน การท าตวอกษรกระพรบท าใหวตถเคลอนไหวFlash เปนโปรแกรมส าหรบสรางภาพทไดรบความนยมมาก สามารถสรางชนงานใหเปนเรองเปนราว มสสน การใสเสยง Effect ตาง ๆ ท าใหดตนตาตนใจ มขอเสยคอ เครองนนจะตองมโปรแกรมรองรบ Flash ไวดวย และควรมความเรวสง เพราะใชเวลาในการโหลดขอมลนาน ควรดวา Flash เหมาะสมกบเนอหาทจะพฒนาหรอไม Java script เปนสครปตโปรแกรมทน ามาแทรกไวกบ HTML เพอใหเวบเพจออกมาตามวตถประสงคทตองการ เชน ตองการใหตวอกษรเลอนจากดานลางขนดานบน การใหเวบเพจแสดงวนท หรอดงขอมลมาแสดงทหนาเวบเพจ เปนตน

3. การตรวจสอบคณภาพเวบไซต (Web quality)เมอการตรวจสอบครบทงขอมล กราฟก และโปรแกรม ถงขนตอนของการตรวจสอบหาขอบกพรองตาง ๆ และแกไขกอนทจะน าขนสระบบแมขายเพอใชงานจรง ขนตอนหรอกระบวนการของการพฒนาเวบไซตทผเชยวชาญตาง ๆ น าเสนอ สามารถสรปไดเปน 5 ขนตอนดงน

1. ขนการวางแผนพฒนาเวบไซต

1.1 ก าหนดวตถประสงคของเวบไซตใหชดเจนในการก าหนดวตถประสงคใหกบเวบไซต กเพอหาจดเดนของเวบไซตนนออกมา เพอเปนจดขายของเวบไซตนน ถาเวบไซตมความโดดเดนเปนเอกเทศในเรองใดเรองหนงหรอระบบงานระบบใดเปนหลกแลวใหท าระบบงานนนใหดทสด และพฒนาในเรองนน ๆ อยางตอเนอง ทงนจะเปนการสรางภาพพจน ของเวบไซต 1.2 รปแบบเนอหาทจะน าเสนอนนเปนอยางไร ส าหรบในสวนของเนอหาเปนสวนทส าคญไมนอย เพราะถาขอมลทน าเสนอนนมความถกตอง ท าใหอานเขาใจงายไมนาเบอ และมการปรบปรงขอมลใหทนสมยอยตลอดเวลา จะท าใหผทเขามาเยยมชมคอยตดตามอยางตอเนองเชนกน

1.3 เปาหมายของเวบไซตทพฒนาขนคออะไร ควรจะก าหนดเปาหมายของเวบไซตและพยายามหากระบวนการและขนตอนการปฏบตงานนนใหบรรลเปาหมายใหได แมจะเกดอปสรรคมากเพยงใดกตาม ทงนผพฒนาระบบงานนนจะตองหาวธการหรอเทคนคตาง ๆ น ามาชวยหรอผสมผสานกบงานนนใหเกดประสทธภาพมากทสด 2. ขนการวเคราะหความตองการของผใชปจจบนจะเหนวามเวบไซตใหม ๆ เกดขนเปนจ านวนมาก

และจะมเพมมากขนเรอย ๆทกวน อยางนอยไมต ากวาวนละ 1,000 เวบไซต การสรางเวบไซตไมไดเปนเรองยากแลวในปจจบนทกคนสามารถสรางได แตการสรางเวบไซตใหดเปนเรองยากกวา เวบไซตทดตองเปนเวบไซตทจะตองน าเสนอในสงทสรางสรรค จะบอกวาเวบไซตไหนดหรอไมดนนคงจะเปนเรองยากขนอยกบสถานะของผทเกยวของกบเวบไซตนน วตถประสงคหลกในการสรางเวบไซตกเพออยากใหคนเขามาชมใชบรการ และอยในเวบไซตของเราใหนานทสด ซงจ าเปนตองสรางสงทนาสนใจหลาย ๆ อยาง เพอดงดดใจผชมใหไดรบรและไดเหน แตตองศกษาและเขาใจถงธรรมชาตของสงทผชมสวนใหญคาดหวงวาจะไดรบจากการเขาไปในเวบไซตแลวเขาหวงจะไดอะไรบาง เชน2.1 ขอมล ผชมสวนใหญทเขาไปทเวบไซตตาง ๆ หวงวาจะไดพบขอมลเกยวกบหนวยงาน และรายละเอยดตาง ๆ ของเวบไซตนน ๆ อยางครบถวนสมบรณ 2.2 ขาวสารความเคลอนไหว เกยวกบสนคา/บรการ หรอกจกรรมทหนวยงานของคณ

2.3 การโตตอบกบผชมเวบไซตทมการโตตอบได เชน การถาม/ตอบ 3. ขนการเตรยมเนอหา เนอหาถอวาเปนสงส าคญทสดส าหรบเวบไซต ดงนน ควรจดเตรยมเนอหาใหกบเวบไซตโดยน าเสนอเนอหาทถกตอง ครบถวนและสมบรณและควรมการปรบปรงใหทนตอเหตการณอยเสมอ

4. ขนการออกแบบและการสรางเวบไซต เวบไซตของโรงเรยนเปนเครองมอทใชในการเผยแพรประชาสมพนธเกยวกบขอมลตาง ๆ ดงนน การออกแบบหนาจอแสดงผลของเวบไซตจงเปนสงทผพฒนาเวบไซตตองค านงถง เนองจากเปนปจจยส าคญในการดงดดความสนใจของผใชใหเขาถงสารสนเทศ

5. ขนการพฒนาเวบไซตในอนาคตใหมความทนสมยอยเสมอ เปนอกกระบวนการหนงของการพฒนาเวบไซต ซงหลงจากทสถานศกษาไดใหบรการสารสนเทศผานเครอขายอนเทอรเนตผพฒนาเวบไซตจะตองปรบปรง แกไขสารสนเทศภายในเวบไวใหมความถกตอง ทนสมยอยเสมอรวมถงการตรวจสอบการเชอมโยงแหลงทรพยากรตาง ๆ การพฒนาบรการใหม หรอการเปลยนแปลงรปแบบการน าเสนอเวบไซต เพอใหเกดความนาสนใจแกผใชทเขามาเยยมชม 6. ปญหาในการพฒนาเวบไซตปญหาและอปสรรคทเกดขนในการพฒนาเวบไซต ซงจากการศกษาของ จส (Just. 1999: 67) ; กลลคสน และคณะ (Gullickson and others. 1999 : 298) สามารถสรปปญหาในดานตาง ๆ

ไดดงน

1. ปญหาดานบคลากร เชน จ านวนบคลากรในการพฒนาเวบไซตมจ านวนไมเพยงพอบคลากรไมมเวลาพฒนาความรความสามารถในการพฒนาเวบไซต และบคลากรตองรบผดชอบงานมากกวา 1 อยาง

2. ปญหาดานเทคนค เชน มรปภาพมากและแฟมขอมลมขนาดใหญ ท าใหเขาถงสารสนเทศไดชา การจดท าเวบไซตไมมมาตรฐานเนองจากตางฝายตางรบผดชอบในการท าเวบไซตของตนเอง 3. ปญหาดานงบประมาณ เชน ขาดแคลนงบประมาณสนบสนนการพฒนาความรความสามารถของบคลากร

ทมา: (วชราภรณ คชสห. แนวทางการพฒนาเวบไซต.สถานศกษาขนพนฐานสงกดส านกงานเขตพนทการศกษา.พระนครศรอยธยา เขต 1 และเขต 2.2551)

กระบวนการพฒนาเวบไซต กระบวนการพฒนาเวบไซต เปนกระบวนการทอาศยหลกการจดระบบโครงสราง ขอมล (Information Architecture) อยในหลาย ๆ สวน ตงแตขนแรกจนถงขนทไดเปนรปแบบโครงสรางสดทาย (Final Architecture Plan) ซงถอเปนกระบวนการทส าคญมากทจะท าใหเวบไซตบรรลตามเปาหมายทตงไว การจดระบบโครงสรางขอมล คอ การพจารณาวาเวบไซตควรจะมขอมลและการท างานใดบาง ดวยการสรางเปนแผนผงโครงสรางกอนทจะเรมลงมอพฒนาเวบเพจ โดยเรมจากการก าหนดเปาหมายเวบไซต และกลมผใชเปาหมาย ตอมากพจารณาถงเนอหาและการใชงานทจ าเปนแลวน ามาจดกลมใหเปนระบบ จากนนกถงเวลาในการออกแบบโครงสรางขอมลในหนาเวบ ใหพรอมทจะน าไปออกแบบกราฟก และหนาตาใหสมบรณตอไป การจดท าระบบโครงสรางขอมลเปนพนฐานส าคญในการออกแบบเวบไซตทด ทจะชวยพฒนาแบบแผนรายละเอยดขอมลในการออกแบบเวบไซต ซงไดแก รปแบบการน าเสนอระบบการท างาน แบบจ าลอง ระบบเนวเกชน และอนเตอรเฟสของเวบ ดงนนการจดระบบโครงสรางขอมลจงเปนสงส าคญทเกยวของอยในกระบวนการออกแบบเวบไซต

การออกแบบเพอผใช

การท าเวบไซตจ าเปนตองรกลมผใชเปาหมายทจะเขามาใชบรการในเวบไซตอยางชดเจน เพอทจะตอบสนองความตองการของผใชไดอยางถกตอง โดยผออกแบบจะตองค านงถง 1) สงทผใชตองการจากเวบไซต - ขอมลและการใชงานทเปนประโยชน - การตอบสนองตอผใช - ความบนเทง 2) ขอมลหลกทควรมอยในเวบไซต - ขอมลเกยวกบองคกร (About the company)

- รายละเอยดผลตภณฑ/กจกรรม (Product information)

- ขาวความคบหนาและขาวจากสอมวลชน (News/Press releases)

- ค าถามยอดนยม (Frequently Asked Questions)

- ขอมลในการตดตอ (Contact information)

การจดระบบขอมลในเวบไซต การจดระบบขอมลในเวบไซตเปนสงส าคญตอความส าเรจของเวบไซต เนองจากโครงสรางขอมลมความส าคญอยางมากตอการพฒนาระบบเนวเกชน เนองจากขอมลในแตละล าดบชนจะมความสมพนธอยางใกลชดกบรายการในระบบเนวเกชน นอกจากนนชอของกลมขอมลตางๆ กจะเปนตวก าหนดชนดและลกษณะของขอมลภายในกลมนน ๆ ดวยการจดระบบขอมลในเวบไซตประกอบดวย แบบแผนระบบขอมล (Organizational Scheme) และโครงสรางระบบขอมล (Organizational Structure) โดยทแบบแผนระบบขอมลในกลม ซงจะมผลตอการจดแบงขอมลเขาในแตละกลมภายหลง สวนโครงสรางระบบขอมลจะก าหนดรปแบบความสมพนธระหวางกลมขอมล 1) แบบแผนระบบขอมล (Organizational Scheme) แบบแผนระบบขอมล คอ การก าหนดลกษณะพนฐานของขอมลภายในกลมเดยวกน เปนสงทตองค านงถง เพราะในชวตประจ าวนการไดสมผสกบแบบแผนการจดระบบตางๆมากมายโดยไมรตว เชน ในการคนหาเบอรโทรศพทจากสมดโทรศพท ซงใชรปแบบการจดระบบตามตวอกษร หรอการเลอกซอของในหางสรรพสนคาทมการแบงหมวดหมสนคาทแตกตางกนไป 2) โครงสรางระบบขอมลในเวบไซต โครงสรางระบบขอมล คอ รปแบบความสมพนธระหวางกลมขอมล ซงจะมผลตอความสะดวกในการทองเวบของผใช ระบบขอมลทมโครงสรางดจะชวยเพมความชดเจนใหกบเนอหา โครงสรางหลกของระบบขอมลส าหรบเวบไซต มดวยกน 3 รปแบบ ไดแก แบบล าดบชน(Hierarchy) แบบไฮเปอรเทกซ (Hypertext) และแบบฐานขอมล (Database Model) โดยทโครงสรางแตละแบบมจดเดนและจดดอยแตกตางกน บางครงกสามารถใชโครงสรางรปแบบเดยวได แตโดยสวนใหญแลวควรใชโครงสรางทง 3 รปแบบรวมกน เพอใหเกดประโยชนสงสด (1) โครงสรางระบบขอมลแบบล าดบชน (Hierarchy) พนฐานของโครงสรางระบบขอมลทด โดยสวนใหญจะจดอยในรปของล าดบชน เนองจากมการแบงแยกกลมอยางชดเจน อกทงความสมพนธระหวางชนขอมลกเปนสงทเราคนเคยและไมยากเกนจะเขาใจ เชน ในทท างานทคณมหวหนา รองหวหนา อยชนตน ๆ ของโครงสรางตอจากนนกเปนพนกงาน ลกนอง ฯลฯ รองลงไปเรอย ๆ เนองจากความแพรหลายในการใชโครงสรางระบบขอมลแบบน เมอน ามาใชกบขอมลในเวบไซตกจะท าใหผใชเขาใจโครงสรางของขอมลทซบซอนในเวบไดงายและรวดเรว ซงถอเปนโครงสรางทเหมาะสมกบขอมลบนเวบมาก เพราะในทกวน ๆ เวบจะเรมจากหนาโฮมเพจ กอนเสมอ แลวจงแบงแยกออกเปนสวนยอย ๆ และดวยวธการจดล าดบชนจากบนลงลาง ท าใหผใช สามารถก าหนด

ขอบเขตของเนอหาภายในเวบไซตไดอยางรวดเรว โดยเรมจากการก าหนดหวขอหลกของขอมล แลวจงเลอกใชแบบแผนระบบขอมล (Organizational scheme) ทเหมาะสมกบขอมลขององคกรมากทสด (2) โครงสรางระบบขอมลแบบไฮเปอรเทกซ (Hypertext) ไฮเปอรเทกซเปนโครงสรางระบบขอมลแบบใหมทมลกษณะคลายเครอขายโยงใยโครงสรางระบบนประกอบดวยองคประกอบ 2 สวน คอ รายการหรอกลมขอมลทถกลงค กบลงคทเชอมโยงขอมลเหลานน องคประกอบ 2 สวนนเมอรวมกน จะเกดเปนระบบการเชอมโยงขอมลประเภทตาง ๆ ไมวาจะเปนตวอกษร ขอมล รปภาพ เสยง หรอภาพยนตร โดยการเชอมโยงนน อาจเปนไปตามล าดบชนขอมลหรอไมตามล าดบชนขอมล หรอทงสองอยางรวมกนกเปนได จากความยดหยนอยางสงของระบบไฮเปอรเทกซ จงเปนไปไดงายทคณจะท าการเชอมโยงซบซอนเกนไปจนท าใหผใชสบสน และไมสามารถนกถงโครงสรางรวมของเวบไซตได แตจากการทระบบไฮเปอรเทกซไดเปดชองทางใหมการเชอมโยงระหวางรายการใด ๆ ในล าดบชน ขอมลทตางกน เราจงมกน าระบบไฮเปอรเทกซมาใชเปนสวนเสรมใหกบโครงสรางขอมลแบบ

ล าดบชนทมอยแลวมากกวาจะใชเปนโครงสรางหลกเสยเอง

(3) โครงสรางขอมลแบบฐานขอมล (Database Model) โครงสรางขอมลแบบนมกน าไปใชกบเวบขนาดใหญทมผรบผดชอบเรองระบบฐานขอมลโดยเฉพาะ ฐานขอมลเปนการจดระบบขอมลทเปนทนยมมากประเภทหนง โดยขอมลจะถกจดอยในรปแถวและคอลมนดวยกฎเกณฑบางอยางทมการก าหนดไวเฉพาะฐานขอมลนนๆ การน าระบบฐานขอมลมาใชในเวบไซตจะชวยเพมความสามารถในการคนหาขอมลไดอยางถกตองและรวดเรว นอกจากนนการใชระบบฐานขอมลยงชวยเพมความสะดวกในการดแลและปรบปรงเนอหาอยางมประสทธภาพอกดวยเนองจากความซบซอนของกฎเกณฑและขอจ ากดตาง ๆ ในระบบฐานขอมล จงเปนเรองยากในการจดเนอหาทงหมดของเวบไซต ซงมทงตวอกษร ลงค รปภาพ และสออน ๆ ไวในฐานขอมลเดยวกนไดทงหมด หรอถาจะท าจรงกตองใชเวลาและความพยายามอยางมาก ดวยเหตดงกลาวระบบฐานขอมลควรน าไปใชกบบางสวนในเวบไซต หรอเวบไซตยอย (Sub site) ทมกลมของขอมลประเภทเดยวกน

การออกแบบระบบเนวเกชน ระบบเนวเกชนเปนสวนเสรมในการสรางสงแวดลอมทสอความหมาย เพอชวยใหผใชทองเวบไดอยางคลองตวโดยไมหลงทาง ท าใหผใชรสกสบายขณะททองเวบ โดยสามารถรวาตวเองก าลงอยท

ไหน ไดผานทใดมาบาง และควรจะไปทางไหนตอ การเขาถงขอมลอยางสะดวกเปนหวใจส าคญของระบบเนวเกชน การมเนอหาในเวบไซททดจะเปนสงดงดดใหผใชเขามาใชบรการอยางสม าเสมอแตเนอหานนจะไมมประโยชนเลยถาผใชคนหาสงทตองการไมพบ ความส าเรจของเวบไซทสวนหนงมาจากการทผใชสามารถพงพาระบบเนวเกชนในการน าทางไปถงทหมายได ระบบเนวเกชนนนอาจประกอบดวยองคประกอบหลาย ๆ อยาง เชน เนวเกชนบาร หรอ Pop-up menu ซงมกจะมอยในทกๆ หนาของเวบเพจ และอาจอยในหนาเฉพาะทมรปแบบเปนระบบสารบญ ระบบดชน หรอ site map ทสามารถใหผใชคลกผานโครงสรางขอมลไปยงสวนอนๆ ได การเขาใจถงรปแบบและองคประกอบของระบบเนวเกชนเหลาน จะท าใหคณออกแบบระบบเนวเกชนดวยองคประกอบทเหมาะสมไดอยางมประสทธภาพ 1) รปแบบของเนวเกชน ระบบเนวเกชนส าหรบเวบไซตขนาดใหญมกใชหลายรปแบบรวมกนเพอเพมชองทางการเขาถงขอมลใหมากขน ซงผออกแบบควรมความเขาใจและเลอกใชอยางเหมาะสม โดยไมใหหลากหลายหรอจ ากดเกนไป ระบบเนวเกชนแบงออกเปน 4 รปแบบดงน 1. ระบบเนวเกชนแบบล าดบขน (Hierarchical)

2. ระบบเนวเกชนแบบโกลบอล (Global)

3. ระบบเนวเกชนแบบโลคอล (Local)

4. ระบบเนวเกชนแบบเฉพาะท (Ad Hoc) 2) องคประกอบของระบบเนวเกชนหลก (Main Navigation Elements) ระบบเนวเกชนทส าคญและพบไดมากทสดคอ เนวเกชนทอยในหนาเดยวกบเนอหา ไมใชเนวเกชนทอยในหนาแรก เนองจากเมอผใชผานหนาแรกเขาไปสภายในเวบไซตแลว กไมอยากจะกลบมาเรมตนใหมทหนาแรกทกครงกอนจะเขาไปดเนอหาในสวนอน ๆ ตอ ระบบเนวเกชนหลกทงแบบโกลบอล (Global) และแบบโลคอล (Local) จงชวยใหผใชสามารถยายจากหนาใดๆ ไปสสวนอนในเวบไซตไดอยางคลองตว องคประกอบของเนวกเกชนมไดหลายรปแบบ ไดแกเนวเกชนบาร เนวเกชนเฟรม Pull down, menu, pop-up menu, image map และ search box

ทมา : (สาวตร เตชะค า.การออกแบบเวบไซตส าหรบองคกรพฒนาสงคม: กรณศกษา มลนธรกษเดก.ศลปศาสตรมหาบณฑต สาขาวชาสอศลปะและการออกแบบสอ.มหาวทยาลยเชยงใหม. 2551)

ความหมายของเวบไซต บญสบ โพธศร ( 2545, หนา 3 ) ใหความหมายวา เวบไซต (Web Site) หมายถง เวบเพจทงหลายทมอยในอเทอรเนตและบรรจไวในเครองคอมพวเตอรหนงๆ สวนเวบเพจ (Web Page) หมายถง ขอมลทแสดงบนเครอขายอนเทอรเนตเปนเอกสารทสามารถเชอมโยงไปยงหนาอนๆ ได ปยวท เจนกจจาไพบลย ( อางใน วระกานต มาชมพ, 2250 ) ไดกลาววาเวบไซตถกเรยกเปนต าแหนงทอยของผทมเวบเพจเปนของตวเองบนระบบอนเทอรเนต ซงไดจากการลงทะเบยนกบผใหบรการเชาพนทบนระบบอนเทอรเนตเมอลงทะเบยนในชอทตองการแลวกสามารถจดท า เวบเพจและสงใหศนยบรการน าขนไปไวบนอนเทอรเนต ซงถอวามเวบไซตเปนของตนเองแลว นรจ อ านวยศลป ( อางใน วระกานต มาชมพ, 2550 ) กลาวถงเวบไซตวา เปนชอเรยก Host หรอ Server ทไดจดทะเบยนอยในเวลดไวดเวบ ซงกคอชอ Host ทถกก าหนดใหมชอในเวลดไวดเวบและขนตนดวย http โดยมโดเมนหรอนามสกลเปน .com, .net, .org หรออนๆ

เวบไซต (Website) หมายถง สายใยครอบคลมทวโลก หรอเครอขายใยแมงมม หรออกความหมายหนงคอ การสอสารขอมลโดยไมจ ากดระยะทาง ชวยยอโลกใหเลกลง โดยเวบไซตเปนรปแบบการใหบรการชนดหนงในระบบอนเตอรเนต ประกอบดวยหนาเวบเพจทมตวหนงสอ (Text) ภาพ เสยง รปภาพเคลอนไหว มลตมเดย และสามารถเชอมโยงไปสหนาอน ๆได

ภายในเวบไซตประกอบดวยเวบเพจจ านวนมาก ซงเวบเพจหนาแรกเรยกวา โฮมเพจเปรยบเสมอนหนาหลกและเปนหนาตาของเวบไซตนนๆ โดยมการเชอมโยงจากหนาโฮมเพจไปสหนาอน ๆ เราเรยกการเชอมโยงนวา การ Link ซงตองอาศยเทคนคการเชอมโยงของ Hyper Text เชอมโยงไปสอกเพจหนงโดยอาศยการเชอมโยงของ Hypermedia

(องกฤษ: Website, Web site หรอ Site) หมายถง หนาเวบเพจหลายหนา ซงเชอมโยงกนผานทางไฮเปอรลงก สวนใหญจดท าขนเพอน าเสนอขอมลผานคอมพวเตอร โดยถกจดเกบไวในเวลดไวดเวบ หนาแรกของเวบไซตทเกบไวทชอหลกจะเรยกวา โฮมเพจ เวบไซตโดยทวไปจะใหบรการตอผใชฟร แตในขณะเดยวกนบางเวบไซตจ าเปนตองมการสมครสมาชกและเสยคาบรการ เพอทจะดขอมล ในเวบไซตนน ซงไดแกขอมลทางวชาการ ขอมลตลาดหลกทรพย หรอขอมลสอตางๆ ผท าเวบไซตมหลากหลายระดบ ตงแตสรางเวบไซตสวนตว จนถงระดบเวบไซตส าหรบธรกจหรอองคกรตางๆ การเรยกดเวบไซตโดยทวไปนยมเรยกดผานซอฟตแวรในลกษณะ

ของ เวบเบราวเซอรเวบไซตแหงแรกของโลกสรางขนเมอ 30 เมษายน พ.ศ. 2536 โดยวศวกรของเซรน[1] ค าวา เวบไซต ในภาษาองกฤษ มการสะกดค าวา เวบไซตหลายแบบ ตงแต Web site, website และ web site เรมแรกสดค าวาเวบไซตนน สะกดดวยการแยกค า และใชตว W พมพใหญ เปน Web site เนองจากค าวา "Web" เปนค านามเฉพาะ ยอมาจากค าวา "World Wide Web" ดงนนจงใชค าวา "Web site" ซงสามารถเหนไดทวไปตามสอมวลชน และพจนานกรมภาษาองกฤษ และภายหลงไดม ค าวา "web site" และ "website"(เวบไซด) เกดขนตามมา

การเรยนการสอนผานเวบ

(Web-Based Instruction) เปนการผสมผสานกนระหวางเทคโนโลย ปจจบนกบกระบวนการออกแบบการเรยนการสอน เพอเพมประสทธภาพทางการเรยนรและแกปญหาในเรองขอจ ากดทางดานสถานทและเวลา โดยการสอนบนเวบจะประยกตใชคณสมบตและทรพยากรของเวลด ไวด เวบ ในการจดสภาพแวดลอมทสงเสรมและสนบสนนการเรยนการสอน ซงการเรยนการสอนทจดขนผานเวบนอาจเปนบางสวนหรอทงหมดของกระบวนการเรยนการสอนกได

ความหมายของการเรยนการสอนผานเวบ

การใชเวบเพอการเรยนการสอนเปนการน าเอาคณสมบตของอนเทอรเนต มาออกแบบเพอใชในการศกษา การจดการเรยนการสอนผานเวบ (Web-Based Instruction) มชอเรยกหลายลกษณะ เชนการจดการเรยนการสอนผานเวบ(Web-Based Instruction) เวบการเรยน(Web-Based Learning) เวบฝกอบรม (Web-Based Training) อนเทอรเนตฝกอบรม (Internet-Based Training) อนเทอรเนตชวยสอน(Internet-Based Instruction) เวลดไวดเวบฝกอบรม (WWW-Based Training) และเวลดไวดเวบชวยสอน (WWW-Based Instruction) (สรรรชต หอไพศาล. 2545) ทงนมผนยามและใหความหมายของการเรยนการสอนผานเวบเอาไวหลายนยาม ไดแก

คาน (Khan, 1997) ไดใหค าจ ากดความของการเรยนการสอนผานเวบ (Web-Based Instruction)ไววาเปนการเรยนการสอนทอาศยโปรแกรมไฮเปอรมเดยทชวยในการสอน โดยการใชประโยชนจากคณลกษณะและทรพยากรของอนเทอรเนต มาสรางใหเกดการเรยนรอยางมความหมายโดยสงเสรมและสนบสนนการเรยนรอยางมากมายและสนบสนนการเรยนรในทกทาง

คลารก (Clark, 1996) ไดใหค าจ ากดความของการเรยนการสอนผานเวบวา เปนการ

เรยนการสอนรายบคคลทน าเสนอโดยการใชเครอขายคอมพวเตอรสาธารณะหรอสวนบคคล และแสดงผลในรปของการใชเวบบราวเซอรสามารถเขาถงขอมลทตดตงไวไดโดยผานเครอขาย

รแลน และกลลาน (Relan and Gillani, 1997) ไดใหค าจ ากดความของเวบในการสอนเอาไววาเปนการกระท าของคณะหนงในการเตรยมการคดในกลวธการสอนโดยกลมคอนสตรคตวซมและการเรยนรในสถานการณรวมมอกน โดยใชประโยชนจากคณลกษณะและทรพยากรในเวลดไวดเวบ

พารสน (Parson, 1997) ไดใหความหมายของการเรยนการสอนผานเวบวา เปนการสอนทน าเอาสงทตองการสงใหบางสวนหรอทงหมดโดยอาศยเวบ โดยเวบสามารถกระท าไดในหลากหลายรปแบบและหลายขอบเขตทเชอมโยงกน ทงการเชอมตอบทเรยน วสดชวยการเรยนรและการศกษาทางไกล

ดรสคอล (Driscoll, 1997) ไดใหความหมายของการเรยนการสอนผานเวบวา เปนการใชทกษะหรอความรตางๆ ถายโยงไปสทใดทหนงโดยการใชเวลดไวดเวบเปนชองทางในการเผยแพรสงเหลานน

แฮนนม (Hannum, 19100) กลาวถงการเรยนการสอนผานเวบวาเปนการจดสภาพการเรยน การสอนผานระบบอนเทอรเนตหรออนทราเนต บนพนฐานของหลกและวธการออกแบบการเรยนการสอนอยางมระบบ

คารลสนและคณะ (Carlson et al., 19100) กลาววาการเรยนการสอนผานเวบเปนภาพทชดเจนของการผสมผสานระหวางเทคโนโลยในยคปจจบนกบกระบวนการออกแบบการเรยนการสอน (Instructional Design) ซงกอใหเกดโอกาสทชดเจนในการน าการศกษาไปสทดอยโอกาส เปนการจดหาเครองมอใหมๆส าหรบสงเสรมการเรยนรและเพมเครองมออ านวยความสะดวกทชวยขจดปญหา เรองสถานทและเวลา

แคมเพลสและแคมเพลส (Camplese and Camplese, 19100) ใหความหมายของการเรยนการสอนผานเวบวาเปนการจดการเรยนการสอนทงกระบวนการหรอบางสวน โดยใชเวลดไวดเวบ เปน สอกลางในการถายทอดความรแลกเปลยนขาวสารขอมลระหวางกน เนองจากเวลดไวดเวบมความ สามารถในการถายทอดขอมลไดหลายประเภทไมวาจะเปน ขอความ ภาพนง

ภาพเคลอนไหว และเสยง จงเหมาะแกการเปนสอกลาง ในการถายทอดเนอหาการเรยนการสอน

ลานเพยร (Laanpere, 1997) ไดใหนยามของการเรยนการสอนผานเวบวา เปนการจดการเรยนการสอนผานสภาพแวดลอมของเวลดไวดเวบ ซงอาจเปนเพยงสวนหนงของการเรยนการสอนในหลกสตรมหาวทยาลย สวนประกอบการบรรยายในชนเรยน การสมมนาโครงการกลมหรอการสอสารระหวางผเรยนกบผสอนหรออาจเปนลกษณะของหลกสตรทเรยนผานเวลดไวดเวบโดยตรงทงกระบวนการเลยกได การเรยนการสอนผานเวบนเปนการรวมกนระหวางการศกษาและการฝกอบรมเขาไวดวยกนโดยใหความสนใจตอการใชในระดบ การเรยนทสงกวาระดบมธยมศกษา

ส าหรบประโยชนทางการศกษาแกผเรยนภายในประเทศไทย การเรยนการสอนผานเวบถอเปนรปแบบใหมของการเรยนการสอนทเรมน าเขามาใช ทงนนกการศกษาหลายทานใหความหมายของการเรยนการสอนผานเวบไวดงน

กดานนท มลทอง (2543) ใหความหมายวา การเรยนการสอนผานเวบเปนการใชเวบในการเรยนการสอนโดยอาจใชเวบเพอน าเสนอบทเรยนในลกษณะสอหลายมตของวชาทงหมดตามหลกสตร หรอใชเพยงการเสนอขอมลบางอยางเพอประกอบการสอนกได รวมทงใชประโยชนจากคณลกษณะตางๆของการสอสารทมอยในระบบอนเทอรเนต เชน การเขยนโตตอบกนทางไปรษณยอเลกทรอนกสและการพดคยสดดวยขอความและเสยงมาใชประกอบดวยเพอใหเกดประสทธภาพสงสด

ถนอมพร เลาจรสแสง (2544) ใหความหมายวา การสอนบนเวบ (Web-Based Instruction) เปนการผสมผสานกนระหวางเทคโนโลยปจจบนกบกระบวนการออกแบบการเรยนการสอนเพอเพมประสทธภาพทางการเรยนรและแกปญหาในเรองขอจ ากดทางดานสถานทและเวลา โดยการสอนบนเวบจะประยกตใชคณสมบตและทรพยากรของเวลด ไวด เวบ ในการจดสภาพแวดลอมทสงเสรมและสนบสนนการเรยนการสอน ซงการเรยนการสอนทจดขนผานเวบนอาจเปนบางสวนหรอทงหมดของกระบวนการเรยนการสอนกได

ใจทพย ณ สงขลา (2542) ไดใหความหมายการเรยนการสอนผานเวบวาหมายถง การผนวก คณสมบตไฮเปอรมเดยเขากบคณสมบตของเครอขายเวลดไวดเวบ เพอสรางสงแวดลอม

แหงการเรยนในมตทไมมขอบเขตจ ากดดวยระยะทางและเวลาทแตกตางกนของผเรยน (Learning without Boundary)

วชดา รตนเพยร (2542) กลาววาการเรยนการสอนผานเวบเปนการน าเสนอโปรแกรมบทเรยนบนเวบเพจโดยน าเสนอผานบรการเวลดไวดเวบในเครอขายอนเทอรเนต ซงผออกแบบและสรางโปรแกรมการสอนผานเวบจะตองค านงถงความสามารถและบรการทหลากหลายของอนเทอรเนต และน าคณสมบตตางๆเหลานนมาใชเพอประโยชนในการเรยนการสอนใหมากทสด

จากนยามและความคดเหนของนกวชาการและนกการศกษา ทงในตางประเทศและภายใน ประเทศไทยดงทกลาวมาแลวนนสามารถสรปไดวา การเรยนการสอนผานเวบเปนการจดสภาพการเรยนการสอนทไดรบการออกแบบอยางมระบบ โดยอาศยคณสมบตและทรพยากรของเวลดไวดเวบ มาเปนสอกลางในการถายทอดเพอสงเสรมสนบสนนการเรยนการสอนใหมประสทธภาพ โดยอาจจด เปนการเรยนการสอนทงกระบวนการ หรอน ามาใชเปนเพยงสวนหนงของกระบวนการทงหมดและชวยขจดปญหาอปสรรคของการเรยนการสอนทางดานสถานทและเวลาอกดวย

การประชาสมพนธ “การประชาสมพนธ” มาจากค าวา “ประชา” กบ “สมพนธ” ซงตรงกบภาษาองกฤษวา “public relations” หรอทเรยกกนทวไปวา “PR” ตามค าศพทนหมายถงการมความสมพนธเกยวของ กบประชาชน ตามพจนานกรมฉบบราชบณฑตยสถาน พ.ศ.2525 หมายถง การตดตอสอสาร เพอ สงเสรมความเขาใจอนถกตองตอกน และถาจะขยายความหมายใหเปนรปธรรมยงขน จะหมายถง “ความพยายามทมการวางแผนและเปนการกระท าทตอเนอง ในอนทจะมอทธพลเหนอความคด จตใจของประชาชน กลมเปาหมายโดยการกระท าสงทดมคณคาใหกบสงคม เพอใหประชาชน เหลานเกดทศนคตทดตอหนวยงานกจกรรม และบรการ หรอสนคาของหนวยงานน และเพอทจะ ไดรบการสนบสนนและรวมมอทดจากประชาชนเหลานในระยะยาว”