ทฤษฎีการออกแบบเว็บ
- 1. 1
การออกแบบเว็บไซต
ความหมายของเว็บไซต
อเนก ปนศรี (2552 : 9) กลาววา “เว็บไซต หมายถึง แหลงที่เก็บรวบรวมขอมูลเอกสารและสื่อ
ประสมตางๆ เชน ภาพ เสียง ขอความ เปนตน ของแตละหนวยงานบนอินเทอรเน็ต”
เว็บไซตสามารถแบงได2สวน ไดแก (โซนซา, 2549 : ไมปรากฏหนา)
1.โฮมเพจ คือขอมูลหนาแรกของเว็บไซต หรือหนาปกของนิตยสาร ดังนั้นโฮมเพจ ควรมีรูปแบบที่
นาสนใจ สีสันสวยงามมีภาพเคลื่อนไหว และเพลงที่เหมาะสมกับตัวเว็บ แตเนื่องจากไฟลเพลงอาจทําใหโหลด
เว็บไดชา ดังนั้น ปจจุบันจึงไมนิยมใสเพลง แตจะใชภาพเคลื่อนไหวแทน เพราะเปนสวนสําคัญที่จะทําใหผู
เยี่ยมชมเว็บสนใจในตัวเว็บมากขึ้น
2.เว็บเพจ คือรายละเอียดของเว็บแตละหนาตอๆกันไป เหมือนหนากระดาษแตละหนาภายใน
นิตยสารนั่นเอง ในหนาโฮมเพจจะมีลิงคเพื่อเชื่อมโยงไปยังหนานั้นๆดวย เพื่อความสะดวก รวดเร็ว โยอยูใน
รูปแบบไฟล HTML
สรุป เว็บไซต หมายถึง หนาเว็บเพจหลายหนา ซึ่งเชื่อมโยงผานทางไฮเปอรลิงค สวนใหญจัดทําขึ้น
เพื่อนําเสนอขอมูลผานคอมพิวเตอร โดยถูกจัดเก็บไวใน www
การจัดการเรียนการสอนผานเว็บ
1.ความหมายของการจัดการเรียนการสอนผานเว็บ
วรัท พฤกษากลนันท (2548 : ไมปรากฎหนา) กลาววา “การจัดการเรียนผานเว็บ มีลักษณะการเรียน
การสอนที่แตกตางไปจากการเรียนการสอนในชั้นเรียนปกติที่คุนเคยกันดี ซึ่งการจัดการเรียนการสอนแบบ
ดั้งเดิมในชั้นเรียนสวนใหญจะมีลักษณะที่เนนใหผูสอนเปนผูปอนความรูใหแกผูเรียนทําใหผูเรียนไมใฝที่จะหา
ความรู เพิ่มเติม
การจัดการเรียนการสอนโดยการใชเว็บชวยสอนจะมีวิธีการจัดที่แตกตางไปจากการจัดการเรียนการ
สอนตามปกติ เพราะคุณลักษณะและรูปแบบของเว็บเปนสื่อที่มีลักษณะเฉพาะของตนเอง ซึ่งแตกตางไปจาก
การจัดการเรียนการสอนดวยสื่อแบบอื่น ๆ จึงตองคํานึงถึงการออกแบบระบบการสอนที่สอดคลองกับ
คุณลักษณะของเว็บ เชน การสื่อสารระหวางผูเรียนกับครู การสื่อสารระหวางผูเรียนกับผูเรียน ที่กระทําได
แตกตางไปจากการเรียนการสอนแบบเดิม เชน การใชเว็บชวยสอนสามารถสื่อสารกันไดโดยผานเว็บโดยตรงใน
รูปคุยกันในหองสนทนา(Chat Room) การฝากขอความบนกระดานอิเล็กทรอนิกสหรือกระดานขาวสาร
(Bulletin Board) หรือจะสื่อสารกันโดยผานไปรษณียอิเล็กทรอนิกส (e-mail) ก็สามารถกระทําไดในระบบนี้
ความเปนเว็บชวยสอนจึงไมใชแคการสรางเว็บไซตเนื้อหาวิชาหนึ่งหรือรวบรวมขอมูลซักเรื่องหนึ่งแลวบอกวา
เปนเว็บชวยสอน เว็บชวยสอนมีความหมายกวางขวางอันเกิดจากการรวมเอาคุณลักษณะของเว็บ โปรแกรม
- 2. 2
และเครื่องมือสื่อสารในระบบอินเทอรเน็ตและการออกแบบระบบการเรียนการสอนเขาดวยกัน ทําใหเกิดการ
เรียนรูขึ้นอยางมีความหมายไมเปนเพียงแคแหลงขอมูลเทานั้น (ปรัชญนันท นิลสุข,2543 : 56)
สามารถสรุปหลักการพื้นฐานของการจัดการเรียนการสอนกับการเรียนการสอนผานเว็บ 5 ประการ
ดังนี้ คือ (ครูบานนอก, 2552 : ไมปรากฏหนา)
1.1ในการจัดการเรียนการสอนโดยทั่วไปแลว ควรสงเสริมใหผูเรียนและผูสอนสามารถติดตอ
สื่อสารกันไดตลอดเวลา การติดตอระหวางผูเรียนและผูสอนมีสวนสําคัญในการสรางความกระตือรือรนกับการ
เรียนการสอน โดยผูสอนสามารถใหความชวยเหลือผูเรียนไดตลอดเวลาในขณะกําลังศึกษา ทั้งยังชวย
เสริมสรางความคิดและความเขาใจ ผูเรียนที่เรียนผานเว็บสามารถสนทนาแลกเปลี่ยนความคิดเห็นรวมทั้ง
ซักถามขอของใจกับผูสอนไดโดยทันทีทันใด เชน การมอบหมายงานสงผานอินเทอรเน็ตจากผูสอน ผูเรียนเมื่อ
ไดรับมอบหมายก็จะสามารถทํางานที่ไดรับมอบหมายและสงผานอินเทอรเน็ต กลับไปยังอาจารยผูสอน
หลังจากนั้นอาจารยผูสอนสามารถตรวจและใหคะแนนพรอมทั้งสงผลยอนกลับไปยังผูเรียนไดในเวลาอัน
รวดเร็วหรือในทันทีทันใด
1.2การจัดการเรียนการสอนควรสนับสนุนใหมีการพัฒนาความรวมมือระหวางผูเรียน ความรวมมือ
ระหวางกลุมผูเรียนจะชวยพัฒนาความคิดความเขาใจไดดีกวาการทํางานคนเดียว ทั้งยังสรางความสัมพันธเปน
ทีมโดยการแลกเปลี่ยนความคิดเห็นระหวางกันเพื่อหาแนวทางที่ดีที่สุด เปนการพัฒนาการแกไขปญหาการ
เรียนรูและการยอมรับความคิดเห็นของคนอื่นมาประกอบเพื่อหาแนวทางที่ดีที่สุด ผูเรียนที่เรียนผานเว็บแมวา
จะเรียนจากคอมพิวเตอรที่อยูกันคนละที่ แตดวยความสามารถของเครือขายอินเทอรเน็ตที่เชื่อมโยงเครือขาย
คอมพิวเตอรทั่วโลกไวดวยกัน ทําใหผูเรียนสามารถติดตอสื่อสารกันไดทันทีทันใด เชน การใชบริการสนทนา
แบบออนไลนที่สนับสนุนใหผูเรียนติดตอสื่อสารกันไดตั้งแต 2 คนขึ้นไปจนถึงผูเรียนที่เปนกลุมใหญ
1.3ควรสนับสนุนใหผูเรียนรูจักแสวงหาความรูดวยตนเอง (Active Learners) หลีกเลี่ยงการกํากับ
ใหผูสอนเปนผูปอนขอมูลหรือคําตอบ ผูเรียนควรเปนผูขวนขวายใฝหาขอมูลองคความรูตางๆ เองโดยการ
แนะนําของผูสอน เปนที่ทราบดีอยูแลววาอินเทอรเน็ตเปนแหลงขอมูลที่ใหญที่สุดในโลก ดังนั้นการจัดการเรียน
การสอนผานเว็บนี้ จะชวยใหผูเรียนสามารถหาขอมูลไดดวยความสะดวกและรวดเร็ว ทั้งยังหาขอมูลไดจาก
แหลงขอมูลทั่วโลกเปนการสรางความกระตือรือรนในการใฝหาความรู
1.4การใหผลยอนกลับแกผูเรียนโดยทันทีทันใดชวยใหผูเรียนไดทราบถึงความสามารถของตน อีก
ทั้งยังชวยใหผูเรียนสามารถปรับแนวทางวิธีการหรือพฤติกรรมใหถูกตองได ผูเรียนที่เรียนผานเว็บ สามารถ
ไดรับผลยอนกลับจากทั้งผูสอนเองหรือแมกระทั่งจากผูเรียนคนอื่นๆ ไดทันทีทันใด แมวาผูเรียนแตละคนจะ
ไมไดนั่งเรียนในชั้นเรียนแบบเผชิญหนากันก็ตาม
1.5ควรสนับสนุนการจัดการเรียนการสอนที่ไมมีขีดจํากัด สําหรับบุคคลที่ใฝหาความรู การเรียนการ
สอนผานเว็บเปนการขยายโอกาสใหกับทุกๆคนที่สนใจศึกษา เนื่องจากผูเรียนไมจําเปนจะตองเดินทางไปเรียน
ณ ที่ใดที่หนึ่ง ผูที่สนใจสามารถเรียนไดดวยตนเองในเวลาที่สะดวก จะเห็นไดวาการเรียนการสอนผานเว็บนี้มี
คุณลักษณะที่ชวยสนับสนุนหลักพื้นฐานการจัดการเรียนการสอนทั้ง 5 ประการไดอยางมีประสิทธิภาพ
- 3. 3
การเรียนการสอนผานเว็บไดมีการดําเนินการอยางจริงจังทั่วโลก โดยเฉพาะอยางยิ่งในกลุม ประเทศ
ทางซีกโลกตะวันตก สําหรับวงการการศึกษาในประเทศไทยเริ่มมีความเปลี่ยนแปลงจากเปนเพียงผูรับขอมูล
และสังเกตการณการเรียนการสอนบนเครือขายเปนความพยายามในการจัดการเรียนการสอนและใชเครื่องมือ
บนเครือขายเวิลดไวดเว็บเสริมในชั้นเรียนปกติ และบางมหาวิทยาลัยที่ดําเนินการเรียนการสอนแบบทางไกล
กําลังดําเนินการที่จะสรางชั้นเรียนเสมือนใหเกิดขึ้นจริง การดําเนินการเรียนการสอนผานเว็บมีรายละเอียด
ดังตอไปนี้ (ใจทิพย ณ สงขลา, 2542 : 67-68)
1.1ความพรอมของเครื่องมือและทักษะการใชงานเบื้องตน ความไมพรอมของเครื่องมือและ การ
ขาดทักษะทางเทคนิคที่จําเปนในการใชเครื่องมือหรือโปรแกรมเปนสาเหตุสําคัญที่กอใหเกิดความ สับสนและ
ผลทางลบตอทัศนคติของผูใช จากการศึกษาการนําเทคโนโลยีเครือขายมาใชพบวาผูใชที่ ไมมีความพรอมทาง
ทักษะการใชจะพยายามแกปญหาและศึกษาเรื่องของเทคนิค มากกวาจํากัด ความสนใจอยูที่เนื้อหา
นอกจากนั้น
1.2การสนับสนุนจากฝายบริหารและผูใชเชนเดียวกับการนําเทคโนโลยีอื่นเขาสูองคกรตองอาศัย
การสนับสนุนอยางจริงจังจากฝายบริหาร ทั้งในการสนับสนุนดานเครื่องมือและนโยบายสงเสริมการใช
เครือขายเวิลดไวดเว็บเพื่อประโยชนทางการศึกษา การกําหนดการใชเครื่องมือดังกลาวจึงไมสามารถเปนไปใน
ลักษณะแนวดิ่ง (Top down) โดยการกําหนดจากฝายบริหารเพียงฝายเดียว แตตองเปนการประสานจากทั้ง
สองฝายคือฝายบริหารและผูใชจะตองมีการประสานจากแนวลางขึ้นบน ผูใชจะตองมีทัศนะที่ยอมรับการใชสื่อ
ดังกลาวเพื่อประโยชนทางการศึกษา ฝายบริหารสามารถสรางนโยบายที่กระตุนแรงจูงใจของผูใช เชน สราง
แรงจูงใจจากภายในของผูใชใหรูสึกถึงความทาทายและประโยชนที่จะไดรับหรือสรางแรงจูงใจจากภายนอก
เชน สรางเงื่อนไขผลตอบแทนพิเศษทั้งในรูปนามธรรมและรูปธรรม
1.3การเปลี่ยนพฤติกรรมผูเรียนจากการเรียนรูแบบตั้งรับ (Passive) โดยพึ่งพิงการปอนจาก
ครูผูสอนมาเปนพฤติกรรมการเรียนที่สอดคลองกับการเรียนรูแบบผูเรียนเปนศูนยกลาง กลาวคือ เปนผูเรียนที่
เรียนรูวิธีการเรียน (Learning How to learn) เปนผูเรียนที่กระตือรือรนและมีทักษะที่สามารถเลือกรับขอมูล
วิเคราะห และสังเคราะหขอมูลไดอยางมีระบบนั้น ผูสอนจะตองสรางวุฒิทางการเรียนใหเกิดกับผูเรียนกอน
กลาวคือจะตองเตรียมการใหผูเรียนพัฒนาทักษะพื้นฐานที่จําเปนตอการเลือกสรร วิเคราะหและสังเคราะหใน
การเรียนผานเครือขายทักษะดังกลาว ไดแก ทักษะการอานเขียน ทักษะในเชิงภาษา ทักษะในการอภิปราย
และที่จําเปนคือ ทักษะในการควบคุมตรวจสอบการเรียนรูของตนเอง
1.4บทบาทของผูสอนในการเรียนการสอนบนเครือขาย จะตองมีการเปลี่ยนแปลงไปสูบทบาทที่เอื้อ
ตอการเรียนการสอนที่ผูเรียนเปนศูนยกลาง โดยในเบื้องตนจะเปนบทบาทผูนําเพื่อสนับสนุนกลุมและ
วัฒนธรรมการเรียนรูบนเครือขาย ผูสอนตองใชเวลามากไปกวาการเรียนการสอนในชั้นเรียนธรรมดา
1.5การสรางความจําเปนในการใช ผูสอนที่จะนําการเรียนการสอนผานเครือขายมาใชควรคํานึงถึง
ความจําเปนและผลประโยชนที่ตองการจากกิจกรรมบนเครือขาย ซึ่งจะเปนตัวกําหนดรูปแบบการใชวาผูสอน
เพียงตองการใชเครือขายเพื่อเสริมการเรียนหรือเปนการศึกษาทางไกล ผูสอนตองสรางสภาวะใหผูใชมีความ
- 4. 4
จําเปนที่ตองใชเชน การสงผานขอมูลที่จําเปนทางการเรียนใหกับผูใชผานทางเครือขายหรือสรางแรงจูงใจที่เปน
ผลประโยชนทางการเรียนใหกับผูใช
1.6ผูสอนตองออกแบบการเรียนการสอนและใชประโยชนของความเปนเครือขายอยางสูงสุด และ
เหมาะสมวิธีออกแบบการเรียนการสอนควรตองพัฒนาใหเขากับคุณสมบัติความเปนคอมพิวเตอรเครือขายซึ่งมี
ความแตกตางจากการออกแบบสําหรับโปรแกรมชวยสอนในคอมพิวเตอรทั่วไป นอกเหนือจากเนื้อหาบทเรียน
ที่ผูสรางเสนอสงผานเครือขาย ผูสอนสามารถสรางการเชื่อมโยงแหลงขอมูลอื่นที่สนับสนุนเนื้อหาหลักที่ผูสอน
สรางเปนการแนะแนวทางใหผูเรียนไดศึกษา ทั้งนี้เนื้อหาและการเชื่อมโยง ควรจะตองปรับปรุงใหทันสมัย
ตลอดเวลาและควรจะตองมีการจัดกิจกรรมการปฏิสัมพันธใหผูเรียนไดประโยชนจากการศึกษารวมกับผูอื่น
การจัดการเรียนการสอนผานเว็บนั้น ผูสอนและผูเรียนจะตองมีปฏิสัมพันธกันโดยผานระบบเครือขาย
คอมพิวเตอร ที่เชื่อมโยงคอมพิวเตอรของผูเรียนเขาไวกับเครื่องคอมพิวเตอรของผูใหบริการเครือขาย (File
Server) และเครื่องคอมพิวเตอรของผูใหบริการเว็บ (Web Server) อาจเปนเปนการเชื่อมโดยระยะใกลหรือ
เชื่อมโยงระยะไกลผานทางระบบการสื่อสารและอินเทอรเน็ต
2.ประโยชนการเรียนการสอนผานเว็บ
ประโยชนของการเรียนการสอนผานเว็บมีมากมายหลายประการ ทั้งนี้ขึ้นอยูกับวัตถุประสงคของการ
นําไปใชในการจัดการเรียนการสอน ซึ่งประโยชนของการเรียนการสอนผานเว็บไวดังนี้ (สุริยันต เงาะเศษ,
2549 :34-35)
2.1 การสอนบนเว็บเปนการเปดโอกาสใหผูเรียนที่อยูหางไกล หรือไมมีเวลาในการมาเขาชั้นเรียนได
เรียนในเวลาและสถานที่ ๆ ตองการ ซึ่งอาจเปนที่บาน ที่ทํางาน หรือสถานศึกษาใกลเคียงที่ผูเรียนสามารถเขา
ไปใชบริการทางอินเทอรเน็ตได การที่ผูเรียนไมจําเปนตองเดินทางมายังสถานศึกษาที่กําหนดไวจึงสามารถชวย
แกปญหาในดานของขอจํากัดเกี่ยวกับเวลา และสถานที่ศึกษาของผูเรียนเปนอยางดี
2.2การสอนบนเว็บยังเปนการสงเสริมใหเกิดความเทาเทียมกันทางการศึกษา ผูเรียนที่ศึกษาอยูใน
สถาบันการศึกษาในภูมิภาคหรือในประเทศหนึ่งสามารถที่จะศึกษา ถกเถียง อภิปราย กับอาจารย ครูผูสอนซึ่ง
สอนอยูที่สถาบันการศึกษาในนครหลวงหรือในตางประเทศก็ตาม
2.3การสอนบนเว็บนี้ ยังชวยสงเสริมแนวคิดในเรื่องของการเรียนรูตลอดชีวิต เนื่องจากเว็บเปน
แหลงความรูที่เปดกวางใหผูที่ตองการศึกษาในเรื่องใดเรื่องหนึ่ง สามารถเขามาคนควาหาความรูไดอยาง
ตอเนื่องและตลอดเวลาการสอนบนเว็บ สามารถตอบสนองตอผูเรียนที่มีความใฝรูรวมทั้งมีทักษะในการ
ตรวจสอบการเรียนรูดวยตนเอง (Meta-cognitive Skills) ไดอยางมีประสิทธิภาพ
2.4การสอนบนเว็บ ชวยทลายกําแพงของหองเรียนและเปลี่ยนจากหองเรียน 4 เหลี่ยมไปสูโลก
กวางแหงการเรียนรู เปดโอกาสใหผูเรียนสามารถเขาถึงแหลงขอมูลตางๆไดอยางสะดวกและมีประสิทธิภาพ
สนับสนุนสิ่งแวดลอมทางการเรียนที่เชื่อมโยงสิ่งที่เรียนกับปญหาที่พบในความเปนจริง โดยเนนใหเกิดการ
เรียนรูตามบริบทในโลกแหงความเปนจริง(Contextualization) และการเรียนรูจากปญหา (Problem-based
Learning) ตามแนวคิดแบบConstructivism
- 5. 5
2.5การสอนบนเว็บเปนวิธีการเรียนการสอนที่มีศักยภาพ เนื่องจากที่เว็บไดกลายเปนแหลงคนควา
ขอมูลทางวิชาการรูปแบบใหมครอบคลุมสารสนเทศทั่วโลกโดยไมจํากัดภาษา การสอนบนเว็บชวยแกปญหา
ของขอจํากัดของแหลงคนควาแบบเดิมจากหองสมุดอันไดแก ปญหาทรัพยากรการศึกษาที่มีอยูจํากัดและเวลา
ที่ใชในการคนหาขอมูล เนื่องจากเว็บมีขอมูลที่หลากหลายและเปนจํานวนมาก รวมทั้งการที่เว็บใชการ
เชื่อมโยงในลักษณะของไฮเปอรมิเดีย (สื่อหลายมิติ) ซึ่งทําใหการคนหาทําไดสะดวกและงายดายกวาการคนหา
ขอมูลแบบเดิม
2.6การสอนบนเว็บจะชวยสนับสนุนการเรียนรูที่กระตือรือรน ทั้งนี้เนื่องจากคุณลักษณะของเว็บที่
เอื้ออํานวยใหเกิดการศึกษา ในลักษณะที่ผูเรียนถูกกระตุนใหแสดงความคิดเห็นไดอยูตลอดเวลา โดยไม
จําเปนตองเปดเผยตัวตนที่แทจริง ตัวอยางเชน การใหผูเรียนรวมมือกันในการทํากิจกรรมตาง ๆ บนเครือขาย
การใหผูเรียนไดมีโอกาสแสดงความคิดเห็นและแสดงไวบนเว็บบอรดหรือการใหผูเรียนมีโอกาสเขามาพบปะกับ
ผูเรียนคนอื่น ๆ อาจารย หรือผูเชี่ยวชาญในเวลาเดียวกันที่หองสนทนา เปนตน
2.7การสอนบนเว็บเอื้อใหเกิดการปฏิสัมพันธ ซึ่งการเปดปฏิสัมพันธนี้อาจทําได 2 รูปแบบ คือ
ปฏิสัมพันธกับผูเรียนดวยกันและ/หรือผูสอน ปฏิสัมพันธกับบทเรียนในเนื้อหาหรือสื่อการสอนบนเว็บ ซึ่ง
ลักษณะแรกนี้จะอยูในรูปของการเขาไปพูดคุย พบปะ แลกเปลี่ยน ความคิดเห็นกัน สวนในลักษณะหลังนั้นจะ
อยูในรูปแบบของการเรียนการสอน แบบฝกหัดหรือแบบทดสอบที่ผูสอนไดจัดหาไวใหแกผูเรียน
2.8การสอนบนเว็บยังเปนการเปดโอกาสสําหรับผูเรียนในการเขาถึงผูเชี่ยวชาญสาขาตาง ๆ ทั้งในและ
นอกสถาบันจากในประเทศและตางประเทศทั่วโลก โดยผูเรียนสามารถติดตอสอบถามปญหาขอขอมูลตาง ๆ ที่
ตองการศึกษาจากผูเชี่ยวชาญจริงโดยตรงซึ่งไมสามารถทําไดในการเรียนการสอนแบบดั้งเดิม นอกจากนี้ยัง
ประหยัดทั้งเวลาและคาใชจายเมื่อเปรียบเทียบกับการติดตอสื่อสารในลักษณะเดิม ๆ
2.9การสอนบนเว็บเปดโอกาสใหผูเรียนไดมีโอกาสแสดงผลงานของตน สูสายตาผูอื่นอยางงายดาย
ทั้งนี้ไมไดจํากัดเฉพาะเพื่อนๆ ในชั้นเรียนหากแตเปนบุคคลทั่วไปทั่วโลกได ดังนั้นจึงถือเปนการสรางแรงจูงใจ
ภายนอกในการเรียนอยางหนึ่งสําหรับผูเรียน ผูเรียนจะพยายามผลิตผลงานที่ดีเพื่อไมใหเสียชื่อเสียงตนเอง
นอกจากนี้ผูเรียนยังมีโอกาสไดเห็นผลงานของผูอื่นเพื่อนํามาพัฒนางานของตนเองใหดียิ่งขึ้น
2.10การสอนบนเว็บเปดโอกาสใหผูสอนสามารถปรับปรุงเนื้อหาหลักสูตร ใหทันสมัยไดอยาง
สะดวกสบายเนื่องจากขอมูลบนเว็บมีลักษณะเปนพลวัตร ( Dynamic ) ดังนั้นผูสอนสามารถอัพเดตเนื้อหา
หลักสูตรที่ทันสมัยแกผูเรียนไดตลอดเวลา นอกจากนี้การใหผูเรียนไดสื่อสารและแสดงความคิดเห็นที่เกี่ยวของ
กับเนื้อหา ทําใหเนื้อหาการเรียนมีความยืดหยุนมากกวาการเรียนการสอนแบบเดิมและเปลี่ยนแปลงไปตาม
ความตองการของผูเรียนเปนสําคัญ การสอนบนเว็บสามารถนําเสนอเนื้อหาในรูปของมัลติมีเดีย ไดแก
ขอความ ภาพนิ่ง เสียง ภาพเคลื่อนไหว วีดีทัศน ภาพ 3 มิติ โดยผูสอนและผูเรียนสามารถเลือกรูปแบบของ
การนําเสนอเพื่อใหเกิดประสิทธิภาพสูงสุดทางการเรียน
- 6. 6
ความสําคัญของสีที่มีตอการออกแบบเว็บไซต
สีเปนองคประกอบที่มีความละเอียดซับซอน และตองอาศัยความเชี่ยวชาญในการผสมผสานความ
แตกตางของสี ใหสามารถเขากันไดอยางลงตัว โดยสามารถสรุปความสําคัญในการเลือกใชสีเพื่อการออกแบบ
เว็บ ไดดังนี้ (เสถียร พลวงศ, 2549 :ไมปรากฏหนา)
1.การดึงดูดความสนใจของผูเยี่ยมชม เนื่องจากสิ่งแรกที่มองเห็นไดจากเว็บคือ สี ซึ่งเปนสิ่งที่ชวย
กําหนดบรรยากาศ และความรูสึกโดยรวมของเว็บไซต
2.การนําสีมาใชกับองคประกอบตางๆของเว็บเพจ เนื่องจากในหนาเว็บมีขอมูลปริมาณมาก
ผูออกแบบมักใชโทนสีในการจัดกลุมขอมูล เชน ตัวอักษร รูปภาพ ลิงค และพื้นหลัง เปนตน เพื่อความสะดวก
ตอการเขาใชงานของผูเยี่ยมชมเว็บไซต
3.การเชื่อมโยงองคประกอบหนาเว็บเขาดวยกัน ผูออกแบบสามารถใชการไลระดับสีหรือโทนสี เพื่อ
เชื่อมโยงองคประกอบแตละสวนไวดวยกัน ใหหนาเว็บมรความเปนเอกภาพได
4.การสรางอารมณและความรูสึก การเลือกใชสีแตละสี ลวนมีผลตอความรูสึกของผูเยี่ยมชมเว็บไซต
เชน สีแดงกระตุนใหเกดความสนใจ อยากรู มีชีวิตชีวา หรือสีดํา กระคุนใหเกิดความนาลึกลับ นาคนหา เปน
ตน
5.การสรางสัญลักษณหรือเปนตัวแทนขององคกร สวนใหญองคกรขนาดใหญจะมีการสราง
สัญลักษณที่เปนตัวแทนขององคกร ทั้งนี้อาจอยูในรูปแบบเครื่องหมายการคาหรือสีสันตางๆ ที่ผูเยี่ยมชม
เว็บไซตมองเห็นแลวทราบทันทีวาเปนสัญลักษณองคกรใด โดยใชสีประจําองคกรมาใชรวมกับการออกแบบ
หนาเว็บ เชน มหาวิทยาลัยสุโขทัยธรรมมาธิราช สีประจํามหาวิทยาลัยคือ สีเขียวกับสีทอง
อยางไรก็ตาม การเลือกใชสีในการออกแบบเว็บเพจนั้น หากเลือกใชสีไมเหมาะสมอาจสรางความ
ลําบากในการอานหรือรบกวนสายตาผูเยี่ยมชม รวมทั้งอาจทําใหการสื่อความหมายไมถูกตอง การเลือกใชสี
ตางๆนั้น ตองเขาใจถึงการแสดงผลของเว็บเพจในสภาพแวดลอมที่แตกตางกัน
การวางแผนเพื่อการออกแบบเว็บไซต
เว็บไซตเปนสื่อที่ไดรับความนิยมอยางมากบนอินเทอรเน็ต ผูใชงานเว็บไซตสามารถตัดสินใจไดวาจะ
เลือกเยี่ยมชมเว็บไซตใดหรือไมเยี่ยมชมเว็บไซตใดไดตามตองการ ถาผูใชเห็นวาเว็บไซตที่กําลังเยี่ยมชมอยูนั้น
ไมมีประโยชน หรือไมเขาใจวาเว็บไซตนี้ใชงานอยางไร เนื่องจากใชงานไดไมสะดวก ผูใชอาจเปลี่ยนไปเยี่ยมชม
เว็บไซตอื่นๆได เนื่องจากปจจุบันมีเว็บไซตตางๆอยูจํานวนมาก และยังมีเว็บไซตเกิดขึ้นใหมๆทุกวัน ผูใชจึงมี
ทางเลือกมากขึ้น และสามารถเปรียบเทียบคุณภาพของเว็บไซตตางๆไดเอง (ฐิติรัศญาณ แกนเพชร, 2551 :
6-9)
- 7. 7
เว็บไซตที่ไดรับการออกแบบอยางสวยงาม มีการใชงานที่สะดวก ยอมไดรับความสนใจมากกวา
เว็บไซตที่มีความสับสนวุนวาย มีขอมูลมากมายแตหาสาระสําคัญไมพบ หรือใชเวลาในการแสดงผลแตละหนา
นานเกินไป ปญหาเหลานี้ลวนมาจากการออกแบบเว็บไซตไมดีทั้งสิ้น ดังนั้นการออกแบบเว็บไซตจึงเปน
กระบวนการสําคัญในการสรางเว็บไซตใหประทับใจผูใช ทําใหผูใชอยากกลับเขามาในเว็บไซตเดิมอีกในอนาคต
ซึ่งนอกจากตองพัฒนาเว็บไซตที่ดีมีประโยชนแลว ยังตองคํานึงถึงการแขงขันกับเว็บไซตอื่นๆอีกดวย (วนิจศรา
อุนผา, 2548 : 37)
1.ขอควรคํานึงในการออกแบบเว็บไซต
การออกแบบเว็บไซตนั้นไมไดหมายถึงลักษณะหนาตาของเว็บไซตเพียงอยางเดียว แตเกี่ยวของ
ตั้งแตการเริ่มตนกําหนดเปาหมายของเว็บไซต ระบุกลุมผูใช การจัดระบบขอมูล การสรางระบบเนวิเกชั่น การ
ออกแบบหนาเว็บ รวมไปถึงการใชกราฟก การเลือกใชสี การจัดรูปแบบตัวอักษร นอกจากนั้นยังตองคํานึงถึง
ความแตกตางของสื่อกลางในการแสดงผลเว็บไซตดวย ซึ่งไดแก ชนิดและรุนของบราวเซอร ขนาดของหนาจอ
ความละเอียดของสีในระบบ รวมไปถึงเครื่องมืออํานวยความสะดวกในการใชงาน (plug-in) ชนิดตางๆที่ผูใชมี
อยู เพื่อใหผูใชเกิดความสะดวกและพอใจที่จะทองไปในเว็บไซตนั้น ดังนั้นทุกสิ่งทุกอยางในเว็บไซตทั้งที่
มองเห็นและมองไมเห็น ลวนเปนมาจากกระบวนการออกแบบเว็บไซตทั้งสิ้น เว็บไซตที่ดูสวยงามและมีลูกเลน
มากมายนั้น อาจจะไมนับวาเปนการออกแบบที่ดีก็ได ถาความสวยงามและลูกเลนเหลานั้น ไมเหมาะสมกับ
ภาพลักษณของเว็บไซต
ดวยเหตุนี้ จึงเปนเรื่องยากที่จะระบุวาการออกแบบเว็บไซตที่ดีนั้นเปนอยางไร เนื่องจากไมมี
หลักเกณฑแนนอนที่จะใชไดกับทุกเว็บไซต แนวทางการออกแบบบางอยางที่เหมาะสม กับเว็บไซตหนึ่ง อาจจะ
ไมเหมาะสมกับอีกเว็บไซตหนึ่งก็ได ทําใหแนวทางการออกแบบของแตละเว็บไซตนั้น แตกตางกันไปตาม
เปาหมายและลักษณะของเว็บไซตนั้น เว็บไซตบางแหงอาจตองการนําเสนอความสนุกสนานหรือความบันเทิง
ในขณะที่เว็บไซตอื่นกลับตองการนําเสนอเนื้อหาที่ถูกตอง นาเชื่อถือเปนหลัก ดังนั้นการออกแบบเว็บไซต
โดยรวม ควรคํานึงถึงสิ่งตอไปนี้ (วิราวรรณ ธันธา, 2550 : 35)
1.1ความเรียบงาย ไดแก มีรูปแบบที่เรียบงาย ไมซับซอน และใชงานไดสะดวก ไมมีกราฟกหรือ
ภาพที่เคลื่อนไหวอยูตลอดเวลา ชนิดและสีของตัวอักษรไมมากจนเกินไปทําใหวุนวาย
1.2ความสม่ําเสมอ ไดแก ใชรูปแบบเดียวกันตลอดเว็บไซต เชนรูปแบบของกราฟก ระบบเนวิ
เกชั่นและโทนสี ควรมีความคลายคลึงกันตลอดทั้งเว็บไซต
1.3ความเปนเอกลักษณ การออกแบบเว็บไซตควรคํานึงถึงลักษณะขององคกร เพราะรูปแบบของ
เว็บไซตจะสะทอนถึงเอกลักษณและลักษณะขององคกรนั้นๆ เชน ถาเปนเว็บไซตของทางราชการจะตองดู
นาเชื่อถือ
- 8. 8
1.4เนื้อหาที่มีประโยชน เนื้อหาเปนสิ่งที่สําคัญที่สุดในเว็บไซต ดังนั้นควรจัดเตรียมเนื้อหาและ
ขอมูลที่ผูใชตองการใหถูกตอง และสมบูรณ มีการปรับปรุงและเพิ่มเติมใหทันเหตุการณอยูเสมอ เนื้อหาไมควร
ซ้ํากับเว็บไซตอื่น จึงจะดึงดูดความสนใจ
1.5ระบบเนวิเกชั่นที่ใชงานงาย ตองออกแบบใหผูใชเขาใจงายและใชงานสะดวก ใชกราฟกที่สื่อ
ความหมายรวมคําอธิบายที่ชัดเจน มีรูปแบบและลําดับของรายการสม่ําเสมอ เชนวางไวที่ตําแหนงเดียวกันของ
ทุกหนา
1.6ลักษณะที่นาสนใจ หนาตาของเว็บไซตจะตองมีความสัมพันธกับคุณภาพขององคประกอบ
ตางๆ เชน คุณภาพของกราฟกที่สมบูรณ การใชสี การใชตัวอักษรที่อานงาย สบายตา การใชโทนสีที่เขากัน
ลักษณะหนาตาที่นาสนใจนั้นขึ้นอยูกับความชอบของแตละบุคคล
1.7การใชงานอยางไมจํากัด ผูใชสามารถเขาถึงเว็บไซตโดยใชเบราวเซอรชนิดใดชนิดหนึ่งในการ
เขาถึงเนื้อหา และสามารถแสดงผลไดทุกระบบปฏิบัติการและความละเอียดหนาจอตางกัน
1.8คุณภาพในการออกแบบ การออกแบบและเรียบเรียงเนื้อหาอยางรอบคอบ และถูกตอง บง
บอกถึงคุณภาพ และความนาเชื่อถือของเว็บไซต
1.9ลิงคตางๆจะตองเชื่อมโยงไปยังหนาที่มีอยูจริงและถูกตอง ระบบการตางๆในเว็บไซตจะตองมี
ความแนนอน และทําหนาที่ไดอยางถูกตอง
ดังนั้น อาจสรุปไดวา การออกแบบที่ดี คือ การออกแบบใหเหมาะสมกับเปาหมายและลักษณะของ
เว็บไซต โดยคํานึงถึงความสะดวกของผูใชเปนหลัก
2.ขั้นตอนการวางแผนเพื่อการออกแบบเว็บไซต
การออกแบบเว็บไซตไมวาจะเปนเว็บไซตประเภทใด ลวนแตมีการวางแผนเพื่อการออกแบบ
เว็บไซตที่คลายๆกัน ไดแก (วิทยาลัยสารพัดชางพระนคร, 2549 :ไมปรากฏหนา)
2.1การกําหนดวัตถุประสงคของเว็บไซต เว็บไซตสวนใหญจะมีการกําหนดวัตถุประสงคชัดเจน ผู
เขาชมเว็บไซตตองการขอเท็จจริง เมื่อเขาชมแลวจะพยายามคนหาขอมูลหรือขอเท็จจริงที่ตองการ เว็บไซตที่มี
วัตถุประสงคที่ชัดเจน จะทําใหผูเขาชมยอมรับเว็บไซตโดยงาย เชน ขอมูลเพื่อการศึกษาจะใหขอมูลดาน
การศึกษาอยางชัดเจน ผูที่เขามาเยี่ยมชมสวนใหญจะเปนนักศึกษาหรือผูสนในในการศึกษาหลากหลาย
สาขาวิชา เปนตน การกําหนดวัตถุประสงคเว็บไซตที่ชัดเจนกอนการสรางเว็บไซต จะทําใหผูสรางเว็บไซตมั่นใจ
ไดวาเว็บไซตจะประสบผลสําเร็จตรงตามวัตถุประสงคของเว็บไซต คําถามแรกในการตั้งวัตถุประสงค คือ ทําไม
ตองการสรางเว็บไซตนี้ วัตถุประสงคสวนใหญของการสรางเว็บไซตเพื่อ
2.1.1เพื่อใหบริการ
- 9. 9
2.1.2เพื่อขายสินคา
2.1.3เพื่อแสดงขอมูลในหัวขอตางๆ
2.1.4เพื่อประกาศหรือประชาสัมพันธ
2.1.5เพื่อแนะนําตัวเอง(เจาของเว็บไซต)
2.1.6เพื่อสรางเครือขายชุมชน
2.1.7เพื่อเผยแพรขาวสารที่มีความเฉพาะเจาะจง
การกําหนดวัตถุประสงคของเว็บไซตอาจเปนเรื่องปกติทั่วไป แตการสรางวัตถุประสงคใหมีเอกลักษณ
ที่โดดเดนเปนเรื่องยาก เชน ถาจะสรางเว็บไซตใหบริการจะตองใหขอมูลทางการตลาดและเนื้อหาสวนที่
เกี่ยวของ ควรเขาใจหลักการในการกําหนดวัตถุประสงคของเว็บไซตในกรณีที่จะใหบริการดวย ตองยึดมั่นใน
วัตถุประสงค เชน บางเว็บไซตจะมีขอความบอกพันธกิจของเว็บไซตหรือหนาเว็บเพจที่อธิบายวัตถุประสงคของ
เว็บไซต บอกวาเว็บไซตนี้เกี่ยวกับอะไร มีวัตถุประสงคอยางไร คาดวาผูเยี่ยมชมเว็บไซตจะไดรับอะไรบาง สิ่ง
เหลานี้เปนวิธีการที่จะสามารถเชื่อมโยงใหผุเขาชมเว็บไซตไดเขาใจวัตถุประสงคของเว็บไซตที่สรางขึ้น เมื่อผู
เยี่ยมชมเขาใจวัตถุประสงคของผูใชแลวก็จะสามารถตอบขอสงสัยตางๆได
2.2การกําหนดกลุมเปาหมาย ผูที่จะออกแบบเว็บไซตจะตองคํานึงถึงผูที่จะเขาชมเว็บไซตวาเปน
กลุมเปาหมายที่สําคัญ ดังนั้นกอนที่จะออกแบบเว็บไซตจะตองวิเคราะหกลุมเปาหมายของเว็บไซตใหชัดเจน
วาตองการใหใครมาเยี่ยมชม โดยดูวัตถุประสงคของเว็บไซต วาเว็บไซตนั้นๆมีการถายทอดอะไรกับผูเยี่ยมชม
เว็บไซตก็จะทราบวากลุมเปาหมายของเว็บไซตคือกลุมใด สิ่งสําคัญที่ผูออกแบบเว็บไซตตองตระหนัก คือการ
พัฒนาเว็บไซต ตองคํานึงวาใครเปนผูอานขอมูลเหลานี้ ภาพและเสียงที่เหมาะสมกับกลุมเปาหมายเปนอยางไร
คําสําคัญที่จะจูงใจกับกลุมเปาหมายคืออะไร สิ่งเหลานี้จะมีความสัมพันธกันกับกลุมเปาหมายซึ่งมีความสําคัญ
ยิ่งในการออกแบบเว็บไซต เพื่อที่จะทําใหกลุมเปาหมายของเว็บไซตเขาใจความหมายไดตรงกัน หมายความวา
ถากลุมเปาหมายเปนผูหญิงแลวปรากฏวามีผูชายเขามาในเว็บไซต อานขอความเหลานี้ก็จะไมเปนประโยชน
สําหรับผูชาย ดังนั้น การออกแบบเว็บไซตควรวิเคราะหขอดี ขอเสียของวัตถุประสงคในการออกแบบเว็บไซต ก็
จะทราบวา ไมวาจะเปนเว็บไซตชนิดใด ก็ลวนจะมีการติดตอสื่อสารกับผูที่เขาชมเว็บไซตทั้งสิ้น ดังนั้นจึงควร
ออกแบบในการสื่อสารกับกลุมเปาหมายไวตั้งแตตอนเริ่มตน การออกแบบเว็บไวตจะประสบผลสําเร็จถามี
ปฏิสัมพันธกับผูเขาชมเว็บไซตใหตรงตามความตองการของผูเขาชม การสัมภาษณหรือการสํารวจผูเขาชม
เว็บไซต จะชวยใหผูออกแบบเว็บไซตเขาใจความตองการของผูเขาชม และสามารถนําความตองการตางๆ
เหลานั้นมาปรับปรุงและพัฒนาเว็บไซตได
2.3การวางแผนดานเนื้อหา การออกแบบเว็บไซตจะตองมีการวางแผนใหชัดเจนตั้งแตเริ่มตน
เพราะถาหากมีการวางแผนดานเนื้อหาไมดี จะทําใหเว็บไซตไมเปนระเบียบ สงผลใหผูเขาชมเว็บไซตเกิดความ
- 10. 10
สับสน การวางแผนดานเนื้อหาควรตอบคําถามดานตางๆใหได เชน ใครเปนผุรับผิดชอบเนื้อหา มีการบันทึก
ขอมูลไวที่ใด รูปแบบแฟมขอมูลเปนแบบใด ควรตั้งชื่อเนื้อหาอยางไร การติดตามแกะรอยทําไดอยางไร สิ่ง
เหลานี้เปนสิ่งจําเปนที่จะตองตระหนักถึงอยางมาก หากมองขามสิ่งเหลานี้จะทําใหการจัดการกับเนื้อหาจํานวน
มากที่จะเพิ่มขึ้นในภายหลังนั้นไดยาก จึงควรวางแผนเนื้อหาตางๆเปนลําดับ จัดการแฟมขอมูลอยางมีตรรกะ
เมื่อผูออกแบบเว็บไซตตัดสินใจใหมีการไหลของขอมูลก็ควรจัดการใหเปนขั้นตอน โดยตองมั่นใจวามีทิศทางที่
ถูกตอง และตั้งชื่อแฟมใหสอดคลองกับเนื้อหา ซึ่งเปนสิ่งสําคัญอยางยิ่ง จากนั้นจะเปนการเก็บแฟมตางๆ
การสรางแผนผังของเนื้อหาจะทําใหเราทราบวา มีจํานวนเว็บเพจที่เกี่ยวของปริมาณเทานั้น หาก
เปนเว็บไซตขนาดใหญ มีเว็บเพจจํานวนมาก ควรมีการจัดกลุมของเนื้อหาทั้งหมดที่ความสัมพันธกันเปนกลุมๆ
เชน การศึกษา กีฬา บันเทิง เปนตน ควรทําบัญชีกลุมเนื้อหาตางๆ รวมทั้งเนื้อหายอยๆของแตละกลุมให
ครอบคลุมเนื้อหาทั้งหมด โดยการวาดภาพโครงรางเนื้อหา ดังภาพที่20 การทําโครงรางเนื้อหาเชนนี้ จะชวยให
ผูออกแบบเห็นภาพรวมของการไหลของเนื้อหาและเขาใจกระบวนการไหลของเนื้อหา วาเมื่อเขาไปที่เนื้อหานี้
จะพบเนื้อหายอยๆอยางไรบาง
ภาพที่20 ตัวอยางการสรางแผนผังของเนื้อหา
ที่มา : http://buildinternet.com/2009/10/how-to-plan-a -content-heavy-site/ คนเมื่อวันที่14
มิถุนายน 2556
2.4การวางแผนโครงสรางของเว็บไซต ในที่นี้ขออธิบายตามระบบการจัดการเนื้อหา(Content
Management System : CMS) ในการสรางและจัดการเนื้อหาของเว็บไซตที่ไดออกแบบไว ประกอบดวย
การสรางเนื้อหา(creation) การปรับปรุงเนื้อหา(updating) การกระจายเนื้อหา(distribution) การตีพิมพ
เนื้อหา(publishing) การคนหาเนื้อหา(discovery) CMS เปดทางใหผูใชงานสามารถตีพิมพไดหลายลักษณะ
เชน ขาว การประกาศ กรณีศึกษา ประวัติบุคคล บทความ หนังสือพิมพ ขอมูลสินคา หนังสือรับรอง ลิงคที่
สําคัญ แหลงขอมูลออนไลน รวมทั้งการดาวนโหลด CMSจะใหสิทธิ์ในการเขาถึงขอมูลเปนลําดับขั้น โดยCMSมี
คุณลักษณะ ดังนี้
2.1.1สามารถสรางและบริหารจัดการเว็บเพจได
2.1.2lมารถควบคุมระบบเนวิเกชั่นและเนื้อหาจํานวนมากของเว็บไซตได
- 12. 12
เปรียบเสมือนเข็มทิศที่จะชี้นําทางหรือบงบอกใหผูพัฒนาเว็บไซตทราบวา ควรจะตองเดินทางไปใน
ทิศทางใด ซึ่งขั้นตอนนี้จะประกอบดวย การเตรียมกอนการดําเนินการ การวางแผนการดําเนินการ รวมทั้งการ
รวบรวมและวิเคราะหโครงสราง
1.1การเตรียมกอนการดําเนินการ ประกอบดวย
1.1.1กําหนดวัตถุประสงคและเปาหมายของเว็บไซต เพื่อใหเห็นภาพที่ชัดเจน วาเว็บไซตตองการ
นําเสนอสิ่งใด มีวัตถุประสงคอยางไร โดยวัตถุประสงคของเว็บไซตสามารถจําแนกไดหลากหลายประเภท
ไดแก เว็บไซตสวนบุคคล เว็บไซตเผยแพรขอมูลสําหรับบริษัท/หางราน/องคกรตางๆ/สถาบัน/โรงเรียน
เว็บไซตเพื่อการทําธุรกรรมคาขาย เว็บไซตเพื่อการโฆษณารายการสินคา เว็บไซตเพื่อการศึกษาทางไกล
เว็บไซตเพื่อศูนยรวมและชองทางนําไปสูแหลงขอมูลอื่น เว็บไซตเพื่อเปนศูนยรวมชุมชนคนออนไลน และเว็บ
แอพลิเคชั่นเพื่อการใชงานเฉพาะทาง ทั้งนี้การกําหนดวัตถุประสงคของเว็บไซต จะมีผลตอการกําหนด
โครงสรางรูปแบบ รวมถึงหนาตา และสีสันของเว็บไซตดวย
1.1.2กําหนดชื่อเว็บไซต และชื่อยูอารแอล
1.1.3กําหนดกลุมเปาหมายที่จะใหเขาชมเว็บไซต เพื่อจะไดทราบวาผูที่จะเขาชมเว็บคือใคร จะ
ไดดําเนินการออกแบบและดําเนินการจัดทําเว็บไซต เพื่อใหตอบสนองความตองการผูชมกลุมนั้นไดทากที่สุด
1.1.4ศึกษากลุมคูแขง เพื่อจะไดทราบวา คูแขงของเว็บที่จะพัฒนาคือใคร จะไดศึกษาแนว
ทางการออกแบบ และการดําเนินดารของคูแขง เพื่อเปนตัวอยางหรือแนวทางในการออกแบบและดําเนินการ
ในการจัดทําเว็บไซตตอไป
1.2การวางแผนการดําเนินการ หลังการเตรียมกอนการดําเนินการ ควรมีการวางแผนไวลวงหนา
เพื่อใหการพัฒนาเว็บไซตมีแนวทางที่ชัดเจน
1.3การรวบรวมและวิเคราะหโครงสราง เปนขั้นตอนที่ตอจากการวางแผนการดําเนินการ
เนื่องจากเนื้อหาและขอมูลเปนสิ่งที่เชิญชวนใหผูอื่นเขามาเยี่ยมชมเว็บไซต ฉะนั้น ขั้นตอนนี้จึงเปนการรวบรวม
ขอมูลที่จําเปนในการสรางเว็บเพจตามหัวขอที่กําหนดไว เพื่อจะไดทราบวา จําเปนตองใชขอมูลอะไร จาก
แหลงใดบาง
2.การทํางานจริงในการออกแบบและพัฒนาเว็บเพจ(on- production) แบงไดเปน2สวน คือ
2.1การออกแบบเว็บเพจ นับเปนขั้นตอนในการออกแบบรูปราง โครงสรางและลักษณะทางดาน
กราฟกทางหนาเว็บเพจ โดยโปรแกรมที่นิยมนํามาใชในการออกแบบคือ โฟโตชอป หรือ ไฟลเวิรก ซึ่งจะชวย
- 13. 13
ในการสรางเคาโครงของหนาเว็บและองคประกอบตางๆ เชน ชื่อเว็บไซต โลโก รูปไอคอน ภาพเคลื่อนไหว แบ
รนเนอรโฆษณา เปนตน
สิ่งสําคัญที่ตองคํานึงถึงในการออกแบบและคํานึงถึงในการสรางเว็บเพจ คือวัตถุประสงคในการ
จัดทําเว็บไซต และเปาหมายของกลุมผูเขาชม เว็บเบราวเซอรที่ใชแสดงผลเว็บไซต เพื่อที่จะไดทําการกําหนด
รูปแบบและลักษณะเว็บเพจ ไดแก ขนาดของหนาเว็บเพจ และลักษณะการวางองคประกอบของเว็บไซตให
สวยงามและแสดงผลไดเร็ว รวมทั้ง ควรกําหนดและวางโครงรางของเว็บเพจ ทั้งในสวนของจํานวนเว็บเพจ
และเนื้อหาในแตละเว็บเพจ เปนแผนผังเว็บไซตออกมาบนกระดาษ
2.2การพัฒนาเว็บเพจ หลังจากออกแบบโครงรางของเว็บเพจและแตละหนาเว็บเพจแลว ขั้นตอน
ตอไปคือ การดําเนินการสรางเว็บเพจ ซึ่งรวมถึงการจัดหาองคประกอบที่ตองนํามาใช เชน สื่อมัลติมีเดีย
ภาพกราฟก แบบฟอรมตางๆ และการสรางไฟลรูปภาพ/เสียง ที่เกี่ยวของกับเนื้อหา ซึ่งตองคํานึงถึงรูปแบบ
ของไฟลที่นํามาใชและสอดคลองกับซอฟตแวรที่ใชในการพัฒนาดวย จากนั้นนําภาพและเสียงมาเก็บไวในได
เร็กทอรี่หรือโฟลเดอรที่กําหนดไว แลวนําขอมูลทั้งหมดที่รวบรวมไวจากที่กลาวมาขางตน มาสรางเปนเว็บไซต
ดวยภาษา HTML หรือเครื่องมือในการสรางเว็บเพจอื่นตามแนวคิดที่ไดออกแบบไวแลว ซึ่งรวมถึงการเขียน
โปรแกรมสคริปตในการใชงานดวย
3.การสรุปงานเพื่อสงมอบ(post- production) ประกอบดวย
3.1การทดสอบและปรับปรุงเว็บไซต หมายถึง การทดสอบเว็บเพจที่สรางขึ้นแบบออฟไลน โดยยัง
ไมไดมีการนําเว็บไซตเขาสูอินเทอรเน็ต แตก็สามารถแสดงผลไดเหมือนจริงผานเว็บเบราวเซอร เชน ใช
โปรแกรมอินเทอรเน็ตเอ็กซพลอเรอร ตรวจสอบตัวอยางเว็บเพจหนาตางๆที่สรางไว เชน ขนาดตัวอักษร ขนาด
รูปภาพ เสียง การใชสี ตาราง เปนตน วามีความเหมาะสมหรือไม พรอมกับทําการแกไขปรับปรุงจนเปนที่นา
พอใจ
3.2การเผยแพรเว็บไซต เมื่อทดสอบเว็บไซตจนสมบูรณแลว ขั้นตอนในการเผยแพรผานเว็บไซต
คือ การเผยแพรใหคนทั่วไปไดรูจัก หรือเรียกวาการนําเว็บไซตขึ้นเซิรฟเวอร หรือการอัพโหลด ซึ่งเปนการถาย
โอนเว็บเพจและสวนประกอบอื่น เชน ไฟลภาพ ไฟลเพลงประกอบ เปนตน ไปฝากไวที่โฮสต โดยเจาของเว็บ
อาจตองจดทะเบียนโดเมนเนม และเชาพื้นที่โฮสตจากผูใหบริการอินเทอรเน็ต(Internet Service Provider :
ISP) รายใดรายหนึ่ง เมื่อเลือกโฮสตไดแลว ขั้นตอไปก็เปนการถายโอนเว็บเพจไปฝากไวที่โฮสต ซึ่งโดยทั่วไปจะ
ใชซอฟตแวรถายโอนขอมูลเปนเครื่องมือ ซอฟตแวรประเภทนี้ เรียกวา ซอฟตแวรเอฟทีพีไคลเอนด(FTP
client) ผูพัฒนาก็สามารถนําเว็บเพจอัพโหลดขึ้นสูอินเทอรเน็ตและประชาสัมพันธใหคนทั่วไปไดรูจักได ซึ่งการ
ทําใหคนทั่วไปรับรูและใชบริการเว็บไซตไดมากนั้น จําเปนตองมีการประชาสัมพันธอยางตอเนื่องและใช
ระยะเวลาพอสมควร ซึ่งอาจทําโดยมีปายโฆษณาประชาสัมพันธออนไลนในหนาเว็บไซตอื่นๆ หรือการ
แลกเปลี่ยนปายโฆษณาระหวางกัน การโฆษณาผานเครื่องมือคนหา การโฆษณาผานจดหมายอิเล็กทรอนิกส
การตลาดแบบไวรัล ซึ่งคลายกับกลยุทธการบอกแบบปากตอปาก หากแตเปนการประชาสัมพันธโดยสื่อ
- 14. 14
ประเภทเครือขายสังคมที่มีอยู และควรมีการเก็บสถิติของผูเขาชมดวย ก็สามารถทําใหประเมินไดวา เว็บไซตที่
พัฒนาขึ้นนั้นไดรับความสนใจมากนอยเพียงใด
3.3การบํารุงรักษาเว็บไซต เปนการปรับปรุงเนื้อหา ภาพประกอบ หรือการปรับปรุงเว็บไซตให
เปนปจจุบัน ซึ่งถือเปนขั้นตอนที่สําคัญ เพราะในโลกอินเทอรเน็ตมีการเปลี่ยนแปลงอยางรวดเร็วอยูตลอดเวลา
ผูเขาชมเว็บมักใชเวลาในการคนหาและเปดผานเว็บไซตตางๆอยางรวดเร็ว หากพบวาเว็บไซตที่ผูสรางนําเสนอ
ไมไดมีการปรับปรุงเปลี่ยนแปลงหรือมีขอมูลใหมๆเพิ่มขึ้นเลย ผูเขาชมเว็บก็อาจลดจํานวนลงเรื่อยๆ จน
กลายเปนเว็บที่ไมมีคนเขามาเยี่ยมชมเลยหรือเปนเว็บที่ตายแลว
ดังนั้น การปรับปรุงเว็บไซตอยูเสมอ โดยมีการเพิ่มขอมูลขาวสารใหมๆอยูเปนประจํา ก็จะทําให
เว็บไซตทันสมัย มีผูชมเขาชมเปนประจําและมากขึ้น จนพัฒนาเปนเว็บไซตยอดนิยมไดในที่สุด
การออกแบบโครงสรางเว็บไซต
1.ความหมายของโครงสรางเว็บไซต
ประสาน จันทะคาม(2552 :12) กลาววา “การออกแบบโครงสรางเว็บไซต คือ การวางแผนการ
จัดลําดับ เนื้อหาสาระของเว็บไซต ออกเปนหมวดหมู เพื่อจัดทําเปนโครงสรางในการจัดวางหนาเว็บเพจ
ทั้งหมด เปรียบเสมือนแผนที่ ที่ทําใหเห็นโครงสรางทั้งหมดของเว็บไซต ชวยในนักออกแบบเว็บไซตไมใหหลง
ทาง การจัดโครงสรางของเว็บไซต มีจุดมุงหมายสําคัญคือ การที่จะทําใหผูเขาเยี่ยมชม สามารถคนหาขอมูลใน
เว็บเพจไดอยางเปนระบบ ซึ่งถือวาเปนขั้นตอนที่สําคัญ ที่สามารถสรางความสําเร็จใหกับผูที่ทําหนาที่ในการ
ออกแบบและพัฒนาเว็บไซต (Webmaster) การออกแบบโครงสรางหรือจัดระเบียบของขอมูลที่ชัดเจน แยก
ยอยเนื้อหาออกเปนสวนตาง ๆ ที่สัมพันธกันและใหอยูในมาตรฐานเดียวกัน จะชวยใหนาใชงานและงาย ตอ
การเขาอานเนื้อหาของผูใชเว็บไซต”
2.ประเภทของโครงสรางเว็บไซต
โครงสรางเว็บไซตสามารถแบงได4ประเภท ดังนี้ (วิชาการพัฒนางานบนเว็บ, 2551:ไมปรากฏหนา)
2.1โครงสรางเว็บไซตแบบเรียงลําดับ มีลักษณะเปนโครงสรางแบบธรรมดาที่นิยมใชกันมากที่สุด
เนื่องจากงายตอการจัดระบบขอมูล เปนโครงสรางที่ใชเก็บขอมูลที่เปนเรื่องราวตามลําดับเวลา หรือดําเนิน
เนื้อหาไปตามลําดับ หรือดําเนินเนื้อหาจากเรื่องทั่วๆไป กวางๆ ไปสูเรื่องที่จําเพาะเจาะจงมากขึ้น หรือมี
รายละเอียดมากขึ้น หรือการเรียงลําดับตามตัวอักษร เชน ดรรชนี สารานุกรม หรืออภิธานศัพท เปนตน
2.1.1ประโยชนของเว็บไซตแบบเรียงลําดับ ผูออกแบบเว็บไซตออกแบบไดงายในการจัดระบบ
โครงสราง และงายตอการปรับปรุงแกไข เนื่องจากมีโครงสรางที่ไมซับซอน การเพิ่มเติมเนื้อหาเขาไปสามารถ
- 15. 15
ทําไดงาย เพราะมีผลกระทบตอบางสวนของโครงสรางเทานั้น แตขอเสียของโครงสรางระบบนี้คือ ผูใชไม
สามารถกําหนดทิศทางการเขาสูเนื้อหาของตนเองได
2.1.2การนําเว็บไซตแบบเรียงลําดับไปใช โครงสรางนี้เหมาะกับเว็บที่มีขนาดเล็ก เนื้อหาไม
ซับซอน เหมือนการอานหนังสือเรียงลําดับไปแตละหนา ดังภาพที่22
ภาพที่22 ตัวอยางเว็บไซตแบบเรียงลําดับที่มีการเพิ่มเนื้อหายอย
ที่มา : http://e-learning.nectec.or.th/ คนเมื่อวันที่ 14 มิถุนายน 2556
2.2โครงสรางเว็บไซตแบบลําดับขั้น
เปนโครงสรางที่ดีวิธีหนึ่งในการจัดระบบโครงสรางที่มีความซับซอนของขอมูล โดยแบงเนื้อหา
ออกเปนสวนตางๆ และมีรายละเอียดยอยๆลดหลั่นกัน โดยใชแนวคิดเดียวกันกับแผนภูมิองคกร จึงงายตอการ
ทําความเขาใจกับโครงสรางของเนื้อหา ลักษณะเดน คือ การมีจุดเริ่มตนที่จุดรวมจุดเดียว นั่นคือ โฮมเพจ และ
เชื่อมโยงไปสูเนื้อหาในลักษณะจากบนลงลาง
2.2.1ประโยชนของเว็บไซตแบบลําดับชั้น คือ ผูชมเว็บไซตสามารถแยกแยะเนื้อหาไดงาย และ
สะดวกตอการจัดระบบขอมูลของผูออกแบบ นอกจากนี้ผูดูแลเว็บไซตสามารถดูแลและปรับปรุงแกไขเว็บไซต
ไดงาย เนื่องจากมีการแบงเปนหมวดหมูชัดเจน สวนขอเสีย คือในสวนของการออกแบบโครงสราง ตองระวัง
อยาใหโครงสรางที่ไมสมดุล นั่นคือ มีลักษณะการจัดการขอมูลในแตละหัวขอไมสมดุลกัน โดยมีบางหัวขอที่มี
เนื้อหานอยเกินไป หรือบางหัวขอมีเนื้อหามากเกินไป ทําใหโครงสรางของเว็บไมสมดุล
2.2.2การนําเว็บไซตแบบลําดับชั้นไปใช โครงสรางแบบนี้เหมาะกับเว็บไซตที่มีขนาดใหญ มี
เนื้อหามาก แตมีโครงสรางไมซับซอน สวนใหญจะใชกับเว็บไซตการเรียนการสอน
2.3โครงสรางเว็บไซตแบบตาราง
มีความซับซอนมากกวารูปแบบที่ผานมา การออกแบบเพิ่มความยืดหยุนใหแกการเขาสูเนื้อหาของ
ผูใช โดยเพิ่มการเชื่อมโยงซึ่งกันและกัน ระหวางเนื้อหาแตละสวน เหมาะแกการแสดงใหเห็นถึงความสําพันธ