เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่...

34
5 บทที่ 2 เอกสารและงานวิจัยที่เกี่ยวข้อง การศึกษาครั ้งนี ้ผู ้วิจัยได้ทาการศึกษาเรื่อง การพัฒนาเว็บไซต์ศาลาพุ ่มข้าวบิณฑ์ มหาวิทยาลัย สุโขทัยธรรมาธิราช ผู้วิจัยนาเสนอเอกสารวรรณกรรมที่เกี่ยวข้องตามลาดับดังต่อไปนี 1. มหาวิทยาลัยสุโขทัยธรรมาธิราช 1.1 ความเป็นมาของมหาวิทยาลัย 1.2 พระบาทสมเด็จพระปกเกล้าเจ้าอยู่หัว 1.3 อาคารศาลาพุ่มข้าวบิณฑ์ 1.4 สานักการศึกษาต่อเนื่อง 2. แนวคิดทฤษฎีเกี่ยวกับการพัฒนาเว็บไซต์ 2.1 เวิลด์ไวด์เว็บ 2.2 การออกแบบเว็บไซต์ 2.3 การออกแบบเว็บเพจ 2.4 โปรแกรมแมโครมีเดีย ดรีมวีพเวอร์ 2.5 โปรแกรมแมโครมีเดีย แฟลช 3. แนวคิดเกี่ยวกับความพึงพอใจ 3.1 ความหมายของความพึงพอใจ 3.2 ทฤษฎีการใช้ประโยชน์สื่อและความพึงพอใจ 3.3 การวัดระดับความพึงพอใจ 4. งานวิจัยที่เกี่ยวข้อง 1. มหาวิทยาลัยสุโขทัยธรรมาธิราช 1.1 ความเป็นมาของมหาวิทยาลัย 1.1.1 ประวัติมหาวิทยาลัย มหาวิทยาลัยสุโขทัยธรรมาธิราช เป็นสถาบันอุดมศึกษาที่เกิดขึ ้นด้วยแนวความคิดเรื่อง การขยายและกระจายโอกาสทางการศึกษาระดับอุดมศึกษาแก่ประชาชนให้กว้างขวางยิ่งขึ ้น โดยใชทรัพยากรที่มีจากัดให้เกิดประโยชน์สูงสุด รัฐบาลจึงได้ดาเนินการจัดตั ้งมหาวิทยาลัยสุโขทัยธรรมาธิราช ขึ ้นอีกแห่งหนึ ่ง มีลักษณะเป็นมหาวิทยาลัยในระบบเปิด ดาเนินการสอนโดยใช้ระบบการสอนทางไกล พระบาทสมเด็จพระเจ้าอยู่หัวภูมิพลอดุลยเดช ทรงพระกรุณาโปรดเกล้าฯ พระราชทานชื่อมหาวิทยาลัย สุโขทัยธรรมาธิราช ตามพระนามเดิมของพระบาทสมเด็จพระเจ้าอยู่หัวรัชกาลที่ 7 และทรงลงพระ

Upload: others

Post on 05-Sep-2019

15 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

5

บทท 2 เอกสารและงานวจยทเกยวของ

การศกษาครงนผวจยไดท าการศกษาเรอง การพฒนาเวบไซตศาลาพมขาวบณฑ มหาวทยาลย สโขทยธรรมาธราช ผวจยน าเสนอเอกสารวรรณกรรมทเกยวของตามล าดบดงตอไปน 1. มหาวทยาลยสโขทยธรรมาธราช 1.1 ความเปนมาของมหาวทยาลย 1.2 พระบาทสมเดจพระปกเกลาเจาอยหว 1.3 อาคารศาลาพมขาวบณฑ 1.4 ส านกการศกษาตอเนอง 2. แนวคดทฤษฎเกยวกบการพฒนาเวบไซต 2.1 เวลดไวดเวบ 2.2 การออกแบบเวบไซต 2.3 การออกแบบเวบเพจ 2.4 โปรแกรมแมโครมเดย ดรมวพเวอร 2.5 โปรแกรมแมโครมเดย แฟลช 3. แนวคดเกยวกบความพงพอใจ 3.1 ความหมายของความพงพอใจ 3.2 ทฤษฎการใชประโยชนสอและความพงพอใจ 3.3 การวดระดบความพงพอใจ 4. งานวจยทเกยวของ 1. มหาวทยาลยสโขทยธรรมาธราช 1.1 ความเปนมาของมหาวทยาลย 1.1.1 ประวตมหาวทยาลย มหาวทยาลยสโขทยธรรมาธราช เปนสถาบนอดมศกษาทเกดขนดวยแนวความคดเรองการขยายและกระจายโอกาสทางการศกษาระดบอดมศกษาแกประชาชนใหกวางขวางยงขน โดยใชทรพยากรทมจ ากดใหเกดประโยชนสงสด รฐบาลจงไดด าเนนการจดตงมหาวทยาลยสโขทยธรรมาธราชขนอกแหงหนง มลกษณะเปนมหาวทยาลยในระบบเปด ด าเนนการสอนโดยใชระบบการสอนทางไกล พระบาทสมเดจพระเจาอยหวภมพลอดลยเดช ทรงพระกรณาโปรดเกลาฯ พระราชทานชอมหาวทยาลย สโขทยธรรมาธราช ตามพระนามเดมของพระบาทสมเดจพระเจาอยหวรชกาลท 7 และทรงลงพระ

Page 2: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

6

ปรมาภไธยในพระราชบญญตมหาวทยาลยสโขทยธรรมาธราชเมอวนท 5 กนยายน พ.ศ. 2521 มหาวทยาลยก าหนดใหวนท 5 กนยายนเปนวนสถาปนามหาวทยาลย ในฐานะทเปนมหาวทยาลยของรฐ มหาวทยาลย สโขทยธรรมาธราชมอ านาจใหปรญญาและประกาศนยบตรทมศกดและสทธเชนเดยวกบมหาวทยาลยของรฐอนๆ ทกประการ ภารกจทส าคญทรบใชสงคม คอ การมงผลตบณฑตทกระดบเพอตอบสนองตอการพฒนาประเทศ การพฒนาทรพยากรมนษยรวมถงพฒนาชมชน องคกร สถาบนในสงคม เพอน าไปสสงคมแหงการเรยนร และสงคมฐานความร มงสรางผลงานวจยเพอสงเสรม และพฒนาองคความร และภมปญญาไทย ตลอดจนมงอนรกษสงเสรมพฒนาศลปะและวฒนธรรม (มหาวทยาลยสโขทยธรรมาธราช 2551:18-19) 1.1.2 การบรหารมหาวทยาลย มหาวทยาลยไดแบงสวนราชการออกเปนสาขาวชาตางๆ 12 สาขาวชา มฐานะเทยบเทาคณะรบผดชอบงานดานวชาการประกอบดวย สาขาวชาศลปศาสตร สาขาวชานเทศศาสตร สาขาวชาศกษาศาสตร สาขาวชาวทยาการจดการ สาขาวชานตศาสตร สาขาวชาวทยาศาสตรสขภาพ สาขาวชาพยาบาลศาสตร สาขาวชาเศรษฐศาสตร สาขาวชามนษยนเวศศาสตร สาขาวชารฐศาสตร สาขาวชาสงเสรมการเกษตรและสหกรณ สาขาวชาวทยาศาสตรและเทคโนโลย และมส านกสถาบนตางๆ 10 หนวยงาน รบผดชอบงานสนบสนนดานวชาการประกอบดวย ส านกทะเบยนและวดผล ส านกเทคโนโลยการศกษา ส านกบรการการศกษา ส านกวชาการ ส านกบรรณสารสนเทศ ส านกพมพ ส านกการศกษาตอเนอง ส านกคอมพวเตอร ส านกบณฑตศกษา และสถาบนวจยและพฒนา โดยมส านกงานอธการบดเปนหนวยงานบรหารสวนกลาง 1.1.3 การจดการศกษาในระบบการศกษาทางไกล มหาวทยาลยไดจดระบบการศกษาทเปดโอกาสใหนกศกษาทอยในทองถนตางๆ สามารถศกษาหาความรไดดวยตนเองตามความพรอม ความสะดวก และความสนใจของตนเอง จากสอประสมประเภทสงพมพในรปของเอกสารการสอน แบบฝกปฏบต ซดเสยงประกอบชดวชา วซดประจ าชดวชา ซดรอมประจ าชดวชา รายการวทยกระจายเสยง รายการวทยโทรทศน การศกษาจากรายการออนดมานด (On demand) การศกษาจากสอคอมพวเตอรออนไลน (Online) และออฟไลน (Offline) ทางเครอขายอนเทอรเนตของมหาวทยาลย www.stou.ac.th และการสอนเสรมตามศนยบรการการศกษา การจดหลกสตรของมหาวทยาลยใชหลกการบรณาการเนอหาเขาดวยกนในรปของชดการสอนเรยกวา ชดวชาแตละชดแบงหนวยการสอนออกเปน 15 หนวย ซงแตละหนวยใชเวลาศกษาประมาณ 12 ชวโมง มหาวทยาลยจดการศกษาเปนระบบทวภาค ปการศกษาหนงม 2 ภาคการศกษาตามปกต แตละภาคการศกษาปกตมระยะเวลาศกษาไมนอยกวา 15 สปดาห เพอชวยใหนกศกษาสามารถศกษาดวยตนเองไดอยางมประสทธภาพ โดยอาศยความชวยเหลอจากบคคลอนนอยทสด มหาวทยาลยใชระบบการถายทอดความร เนอหาสาระ ประสบการณ รวมทงการประเมนผลการศกษา

Page 3: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

7

การศกษาจากวสดการศกษา 1. เอกสารการสอนประจ าชดวชา ประกอบดวยค าอธบายชดวชา วตถประสงคของชดวชา รายชอหนวยการสอน วธการศกษา ตลอดจนแผนการสอนของหนวยตางๆ เนอหาสาระในเอกสารการสอนจดอยในรปบทเรยนแบบโปรแกรม ซงนกศกษาจะตองศกษาเอกสารการสอนทกหนวยอยางละเอยดพรอมทงท ากจกรรมตามทไดก าหนดไวในแตละหนวย 2. แบบฝกปฏบตประจ าชดวชา ประกอบดวยค าชแจงในการใชแบบฝกปฏบต รายละเอยดเกยวกบหนวยการสอน แบบประเมนผลตนเองกอนและหลงเรยน ทวางส าหรบบนทกสาระส าคญ ท ากจกรรม และท ารายงานรวมทงแบบทดสอบประจ าหนวย 3. ซดเสยงประจ าชดวชา มหาวทยาลยไดผลตซดเสยงประจ าชดวชาใชคกบเอกสารการสอน ซงเปนค าบรรยายเพอขยาย เสรม หรอสรปเนอหาสาระของเอกสารการสอนใหชดเจนยงขนโดยจดสงใหนกศกษาพรอมเอกสารการสอน 4. เอกสารประชาสมพนธ ซงจะแจงขาวสารทส าคญของมหาวทยาลยใหนกศกษาทราบ เชนตารางออกอากาศรายการวทยกระจายเสยงและวทยโทรทศนของชดวชาตางๆ ก าหนดการสอนเสรม ก าหนดการสอบ ระเบยบและประกาศตางๆ เปนตน (มหาวทยาลยสโขทยธรรมาธราช 2553 : 20 -21) 1.2 พระบาทสมเดจพระปกเกลาเจาอยหว 1.2.1 พระบาทสมเดจพระปกเกลาเจาอยหวกบมหาวทยาลย พระบาทสมเดจพระเจาอยหวรชกาลปจจบนทรงพระกรณาโปรดเกลาพระราชทานชอ มหาวทยาลยสโขทยธรรมาธราช ตามพระนามเดมของพระบาทสมเดจพระปกเกลาเจาอยหว รชกาลท 7 เมอครงด ารงพระอสรยยศเปนกรมหลวงสโขทยธรรมราชา และไดรบพระบรมราชานญาตใหใชตราพระราชลญจกรของพระบาทสมเดจพระปกเกลาเจาอยหว คอพระแสงศรสามองค ประกอบกบเจดยพมขาว บณฑ ซงเปนสญลกษณของอาณาจกรสโขทยใหเปนตราประจ ามหาวทยาลยสโขทยธรรมาธราช นบวามหาวทยาลยไดรบพระมหากรณาธคณเปนลนพนจากพระมหากษตรยราชวงศจกรถงสองพระองค เพอเปนการแสดงความจงรกภกดและกตเวทตาคณ ร าลกถงพระมหากรณาธคณอนยงใหญททรงมแกปวงชน ชาวไทย ตลอดจนเปนการเฉลมพระเกยรตพระบาทสมเดจพระปกเกลาเจาอยหว มหาวทยาลยจงไดขอรบพระบรมราชานญาตสรางพระบรมราชาอนสาวรยพระบาทสมเดจพระปกเกลาเจาอยหว เพอประดษฐานไว ณ อทยานการศกษารชมงคลาภเษกของมหาวทยาลย เพอเปนทเคารพส กการะและเปนสรมงคลแกขาราชการ บคลากร นกศกษา และประชาชน 1.2.2 พระราชกรณยกจ 1.2.2.1 พระราชกรณยกจดานการท านบ ารงบานเมอง เศรษฐกจ สบเนองจากผลของสงครามโลกครงท 1 ประเทศทวโลกประสบปญหาภาวะเศรษฐกจตกต า ซงมผลกระทบกระเทอนมาสประเทศไทย พระองคไดทรงพยายามแกไขการงบประมาณของประเทศใหงบดลอยางดทสด โดยทรง

Page 4: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

8

เสยสละตดทอนรายจายสวนพระองค โดยมไดขนภาษใหราษฎรเดอดรอน ขยายการสอสาร และการคมนาคม โปรดใหสรางสถานวทยกระจายเสยงแหงแรกในประเทศไทย การสงเสรมกจการสหกรณให ประชาชนไดมโอกาสรวมกนประกอบกจการทางเศรษฐกจ โดยทรงพระกรณาโปรดเกลาฯ ใหตราพระราชบญญตสหกรณ พ.ศ. 2471 ขน ทรงสละพระราชทรพยสวนพระองคสรางโรงภาพยนตรศาลา เฉลมกรง เพอเปนสถานบนเทงใหแกผคนในกรงเทพมหานคร ทรงจดงานเฉลมฉลองโดยท านบ ารงบรณปฏสงขรณสงส าคญหลายประการ เชน บรณะวดพระศรรตนศาสดาราม พระบรมมหาราชวง สราง สะพานปฐมบรมราชานสรณ และสรางพระบรมราชานสาวรยพระบาทสมเดจพระพทธยอดฟาจฬาโลก เปนตน 1.2.2.2 พระราชกรณยกจดานการปกครองทรงมพระราชปรารภจะพระราชทานรฐธรรมนญในป พ.ศ. 2475 จงทรงพระราชทานอ านาจและยนยอมใหปกครองแบบประชาธปไตย นบเปนการเปลยนแปลงการปกครองของชาตทรงยนยอมสละพระราชอ านาจ เปนพระมหากษตรยอยภายใตกฎหมาย ทรงใหตรวจตราตวบทกฎหมายรฐธรรมนญทจะเปนหลกในการปกครองอยางถถวน ทรงตราพระราชบญญตควบคมการคาขายอนกระทบถงความปลอดภยหรอความผาสกแหงสาธารณชน พ.ศ. 2471 เพอคมครองสวสดการของปวงชนชาวไทย เชน การประปา การไฟฟา การรถไฟ และการเดนอากาศ เปนตน 1.2.2.3 พระราชกรณยกจดานการศาสนา การศกษา ประเพณและวฒนธรรม ทรงสงเสรมการศกษาของชาตโปรดใหสรางหอพระสมดส าหรบพระนคร ทรงตงราชบณฑตยสภา โปรดตราพระราชบญญตคมครองวรรณกรรมและศลปกรรมใน พ.ศ. 2475 ทรงโปรดใหสรางหนงสอพระไตร ปฎกฉบบสมบรณ เรยกวาฉบบสยามรฐซงใชสบมาจนทกวนน ในดานศลปวฒนธรรมของชาตไดทรงสถาปนาราชบณฑตยสถานสภาขน เพอบรหารจดการหอพระสมดส าหรบพระนคร และสอบสวนพจารณาวชาอกษรศาสตร การพพธภณฑสถานตรวจรกษาโบราณสถานและโบราณวตถ และบ ารงรกษาวชาชางผลงานของราชบณฑตสภาเปนผลดตอการอนรกษและสงเสรมศลปวฒนธรรมของชาตเปนอยางมาก ทรงสนพระราชหฤทยในวชาดนตรไทย ทรงพระกรณาโปรดเกลาฯ ใหหลวงประดษฐไพเราะเขาถวายการฝกสอนจนสามารถพระราชนพนธท านองเพลงไทยไดถง 3 เพลง เพลงราตรประดบดาวเถา เพลงเขมรลออองคเถา และเพลงโหมโรงคลนกระทบฝง ทรงโปรดใหตราพระราชบญญตแกไขเพมเตมกฎหมายลกษณะผวเมย พ.ศ. 2471 รเรมใหมการจดทะเบยนสมรส ทะเบยนหยา ทะเบยนรบรองบตร เมอทรงวางจากพระราชภารกจ ทรงโปรดในการถายภาพนงและถายภาพยนตร ภาพยนตรเรองแหวนวเศษไดแสดงถงพระราชอจฉรยภาพดเยยมในการสรางโครงเรอง ก ากบภาพ ล าดบฉาก และอ านวยการแสดง 1.2.2.4 พระราชกรณยกจดานความสมพนธกบตางประเทศ ไดทรงด าเนนกจการส าคญททรงเกยวของกบตางประเทศทคางมาตงแตรชสมยพระบาทสมเดจพระมงกฎเกลาเจาอยหวใหส าเรจลลวงเชน การใหสตยาบนสนธสญญาตางๆ นอกจากนยงทรงท าสญญาใหมๆ กบประเทศเยอรมนหลง สถาปนาความสมพนธขนปกต เมอ พ.ศ. 2471 และท าสนธสญญากบฝรงเศสเกยวกบดนแดนในลมแมน า

Page 5: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

9

โขงเรยกวาสนธสญญาอนโดจน พ.ศ. 2469 เปนตน (มหาวทยาลยสโขทยธรรมาธราช 2536 : 11-18, วกพ- เดยสารานกรมเสร 2553: 1-5) 1.3 อาคารศาลาพมขาวบณฑ ศาสตราจารย ดร.วจตร ศรสอาน นายกสภามหาวทยาลยไดด ารใหมการสรางอาคารสญลกษณของมหาวทยาลย ในขณะเดยวกนนนรองศาสตราจารย ดร.ภญโญ สวรรณคร ศลปนแหงชาตสาขาทศนศลป ไดออกแบบอาคารศาลาพมขาวบณฑเปนอาคารสญลกษณของมหาวทยาลยสโขทยธรรมาธราช ทไดรบการออกแบบประยกตของสถาปตยกรรมสมยสโขทย มลกษณะเปนอาคารทรงไทยโดยมยอดเปนพมขาวบณฑอนเปนสญลกษณของกรงสโขทย โดยค านงถงองคประกอบทเหมาะสมตามแผนแมบทของมหาวทยาลย ไดก าหนดใหศาลาพมขาวบณฑเปนศนยกลางของโครงการอทยานการศกษารชมงคลาภเษก เนนลกษณะอาคารใหมจดเดนโดยก าหนดใหศาลาพมขาวบณฑตงอยกลางสระตะพงเขยวทอง อาคารศาลาพมขาวบณฑเปนอาคารสามชนคอนกรตเสรมเหลกประกอบดวย 3 สวนดงน สวนโถงกตตกรรมชน 1 น า เสนอนทรรศการถาวรเกยวกบประวต และพฒนาการของมหาวทยาลย สวนโถงกตตกรรมชน 2, 3 น า เสนอนทรรศการถาวรเกยวกบพระบาทสมเดจพระปกเกลาเจาอยหวกบการเรยนรตลอดชวต อาคารศาลาพมขาวบณฑไดด าเนนการกอสรางเมอวนท 10 สงหาคม 2531 ก าหนดแลวเสรจในวนท 4 สงหาคม 2532 รวมพนทใชสอยทงหมด 1,350 ตารางเมตร งบประมาณทใชในการกอสรางสวนหนงไดรบจากนกศกษาทรวมบรจาคโครงการอทยานการศกษารชมงคลาภเษก และงบประมาณเงนรายไดของมหาวทยาลย งบประมาณการกอสรางอาคารศาลาพมขาวบณฑรวมทงสน 21,286,000 บาท (มหาวทยาลยสโขทย ธรรมาธราช 2531) การศกษาถงโครงสรางทางสถาปตยกรรมของเจดยทรงพมขาวบณฑแลวจะเหนวาลกษณะของเจดยทรงพมขาวบณฑ เปนงานศลปใหมอยางหนงทชางสรางสรรคขนมาใหม โดยไดรบแนวความคดและพฒนาการมาจากรปทรงของสถาปตยกรรมแบบเกาของพระเจดย พระปรางค โดยประกอบกนของฐานลกษณะตางๆ เขาดวยกนเพอรองรบธาต เอาแบบอยางของตวอาคารของพระปรางค ทรองรบเครองบน มกาบขนน ซมจรนบ และคหา เปนการแสดงหลกฐานอยางเดนชดของการเอาแบบอยางพระปรางค ในสวนยอดไดเปลยนเอาทรงพมขาวบณฑหรอดอกบวตมมาตอยอดใหแหลม โดยใชปลองไฉนของเจดยทรงกลม สรปไดวาไดสรางขนใหมโดยเอาชนสวนของพระปรางค พระเจดย มาประกอบเขากบสญลกษณใหมคอดอกบวตม มาเปนสงกอสรางรปทรงใหมเนองในพทธศาสนาการใชดอกบวตมมาเปนเครองยอด แสดงเอกลกษณของเจดยทรงพมขาวบณฑนน เปนการสะทอนทเกยวของกบประวตศาสตรและความเปนชาตนยมของชาวสโขทย ในสมยของการเรมอาณาจกรของชนชาตไทยทนบถอพระพทธศาสนา ถงแมวาจะน าเอาสถาปตยกรรมแบบเกามาเปนรปแบบประกอบ กลาวคอยอดของพระปรางคอนเปนสญลกษณของศวะลงคในศาสนาพราหมณ ไดถกเปลยนมาเปนดอกบวอนเปนสญลกษณในพทธศาสนา สะทอนใหเหนถงการพยายามจะทงรปแบบวฒนธรรมแบบเกาของสโขทยสมยขอมไป และสรางสงใหมขนมาแทนท การก าหนดอายนนเนองจากหลกฐานมไมสมบรณทจะกลาวไดชดเจน สรปไดแตเพยงวาเจดยทรงพมขาว

Page 6: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

10

บณฑใน พ.ศ. 1900 นน ไดแพรหลายในสโขทยซงตรงกบสมยของพระเจากอนาแหงลานนาไทย เจดยทรงพมขาวบณฑไปปรากฏนอกอาณาจกรสโขทยเปนครงแรกและครงเดยวทวดสวนดอก จงหวดเชยงใหม สวนประกอบของเจดยทรงพมขาวบณฑ ดงแสดงในภาพท 2 สวนประกอบของเจดยทรงพมขาวบณฑ (มณฑล ทพยทศน 2515 : 42-45)

1.4 ส านกการศกษาตอเนอง ส านกการศกษาตอเนอง จดตงขนเมอวนพธท 28 ธนวาคม พทธศกราช 2531 ตามพระราชกฤษฎกาจดตงส านกการศกษาตอเนอง มหาวทยาลยสโขทยธรรมาธราช พ.ศ. 2531 โดยรบผดชอบพนธกจของมหาวทยาลยดานการบรการทางวชาการ และการท านบ ารงศลปวฒนธรรม วตถประสงคส าคญในการด าเนนงานคอ เพอการพฒนาคณภาพชวตของประชาชนตามหลกปรชญาการศกษาตลอดชวต และการศกษาตามอธยาศย โดยมฝายวเคราะหโครงการและหลกสตรการฝกอบรม ฝายพฒนาสอและเทคโนโลยการฝกอบรม ฝายบรหารการฝกอบรม และฝายบรการเผยแพรทางไกล เปนผรบผดชอบ ส าหรบวตถประสงคของการท านบ ารงศลปวฒนธรรมมฝายอทยานการศกษาเปนผรบผดชอบ การด าเนนงานของ ทกฝายอยภายใตการสนบสนนของส านกงานเลขานการ ส านกการศกษาตอเนองไดก าหนดวสยทศนไวดงน องคกรชนน าเพอใหบรการทางวชาการแกสงคมและสงเสรมศลปวฒนธรรมดวยทมงานและบรการทมคณภาพ (ส านกการศกษาตอเนอง มหาวทยาลยสโขทยธรรมาธราช 2551: 55) 2. แนวคดทฤษฎเกยวกบการพฒนาเวบไซต

ภาพท 2 สวนประกอบของเจดยทรงพมขาวบณฑ

เมดน าคาง

ปลองไฉน

ซมจรนบ

กาบขนน ชองคหา

พมขาวบณฑหรอดอกบวตม

Page 7: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

11

www.yahoo.com

IP Address

2.1 เวลดไวดเวบ (World Wide Web)

เวลดไวดเวบหรอเรยกส นๆ วาเวบ การใหบรการในรปแบบนคอการเรยกบราวเซอร เชน Internet Explorer หรอ Netscape จากเครองของเราและระบ URL เพอใชในการอางทอยทเกบเวบ เมอปอนชอ URL ขอมลจะถกสงไปท DNS Server (Domain Name Server) เปนเซรฟเวอรทใชในการเปลยนชอ URL เปนชอทมความหมาย เชน www.yahoo.com, www.google.com เปนตน ใหกลายเปนชอแบบตวเลขหรอ IP Address ดงแสดงในภาพท 3 DNS Server

ภาพท 3 DNS Server

หมายเลข IP Address นนจะถกใชในการอางองต าแหนงเครองในระบบอนเทอรเนต โดย

เครองทกเครองทอยในระบบอนเทอรเนตจะมหมายเลข IP Address ทไมซ ากน เมอมค ารองขอดเวบจาก

เครองคอมพวเตอรของเราจะถกสงไปทเครองเซรฟเวอร และเมอเครองเซรฟเวอรรบค ารองขอจากเราจะสง

เวบทเกบอยในเครองเซรฟเวอรมาแสดงผลทเครองของเราในการใหบรการของเวลดไวดเวบซงประกอบ

ไปดวยสวนตางๆ เชน เวบไซต โฮมเพจ เวบเพจ เวบบราวเซอร ปลกอน (พนจนทร ธนวฒนเสถยร, ธารา

วงศสรสน 2547 : 6-7)

2.1.1 เวบไซต (Web Site)

หมายถง กลมของเวบเพจทเกยวของสมพนธกน เชน กลมของเวบเพจทใหขอมลเกยวกบ

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

html แลวยงประกอบดวยไฟลชนดอนๆ ทจ าเปนส าหรบสรางเปนหนาเวบเพจ เชน รปภาพ มลตมเดย ไฟล

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

ของเวบไซต

202.215.211.28 โดเมนเนม

โฮมเพจ

Page 8: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

12

ภาพท 4 องคประกอบของเวบไซต

ชอของเวบไซต หรอ URL (Uniform Resource Locator) ต าแหนงทเกบเวบเพจเปรยบเสมอนทอยของเวบเพจ เมอตองการเปดเวบเพจใด จะตองระบต าแหนงทเกบเวบเพจนน หรอรหสสบคนแหลงขอมล ซงเปนการเชอมโยงขอมลในระบบเวลดไวดเวบ รปแบบของ URL เปนรปแบบมาตรฐานส าหรบระบบเวลดไวดเวบ โดยก าหนดใหขนตนดวยค าวา http:// หมายถงการเชอมโยงกบแหลงขอมลเวลดไวดเวบ โดยมระบบการโตตอบของการสอสารแบบ HTTP (Hypertext Transfer Protocol) หรอการแสดงขอมลแบบ Hypertext รปแบบของ URL ประกอบดวย http://host/path/file มความหมายดงน http หมายถง รปแบบการเชอมโยงขอมลแบบ Hypertext host หมายถง ชอโฮสตของเครองคอมพวเตอรทเชอมตอในระบบเครอขาย โดยใหบรการตางๆ แกผใชในเครอขายนน ซงเปนทอยในรปของ Domain Name ซงใน Domain Name ใชอางองแทนหมายเลขไอพ เพอใหผใชบรการคอมพวเตอรจดจ าไดงายขน จงมการก าหนดระบบชอคอมพวเตอรมาตรฐานในเครอขายอนเทอรเนตวา DNS (Domain Name Server) ประกอบดวยชอเครองคอมพวเตอร ชอเครอขายทองถน ชอสบโดเมน (Sub domain) สามารถแบงประเภทของโดเมนไดดงน 1) edu หรอ ac คอ ประเภทสถาบนการศกษา 2) org หรอ or คอ ประเภทขององคกรไมหวงผลก าไร 3) com หรอ co คอ หนวยงานเอกชน องคกรการคา หรอองคกรทหวงผลก าไร 4) net หรอ in คอ ประเภทผใหบรการอนเทอรเนต 5) gov หรอ go คอ ประเภทหนวยงานของรฐหรอหนวยงานราชการ 6) mil หรอ mi คอ ประเภทหนวยงานทางทหาร เชน (www.tat.or.th) tat หมายถง เครอขายทองถนทระบวาระบบดงกลาวเปนของการ

เวบไซต

Page 9: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

13

ทองเทยวแหงประเทศไทย or หมายถง ชอสบโดเมนทบอกประเภทขององคกรทไมหวงผลก าไร และ thหมายถง ชอโดเมนเปนชอยอของประเทศไทย เปนตน path หมายถง เสนทางส าหรบไดเรกทอรบนคอมพวเตอรในระบบยนกซ file หมายถง ไฟลทตองการโอนยายหรอไฟลขอมล 2.1.2 โฮมเพจ (Home Page) หมายถง เวบเพจหนาแรกซงเปนทางเขาหลกของเวบไซต ปกตเวบเพจทกๆ หนาในเวบไซตจะถกลงคโดยตรงหรอโดยออมกตามมาจากโฮมเพจ ดงนนบางครงจงมผใชค าวาโฮมเพจโดยหมายถงเวบไซตทงหมด แตความจรงแลวโฮมเพจ หมายถง หนาแรกเทานน ดงนนจงมกถกออกแบบใหโดดเดนและนาสนใจมากทสด 2.1.3 เวบเพจ (Web Page) หมายถง เปนหนาเอกสารของบรการเวลดไวดเวบซงตามปกตจะถกเกบอยในรปแบบไฟล html (Hyper Text Markup Language) โดยไฟล html 1ไฟลกคอเวบเพจ 1หนานนเองภายในเวบเพจอาจประกอบไปดวยขอความ ภาพ เสยง วดทศน และภาพเคลอนไหวแบบมลตมเดย นอกจากนเวบเพจ แตละหนาจะมการเชอมโยงหรอลงค (Link) กนเพอใหผชมเรยกดเอกสารหนาอนๆ ทเกยวของไดสะดวกอกดวย นอกจากรปแบบไฟล html แลว ปจจบนเวบเพจบางสวนจะถกเกบอยในรปไฟลโปรแกรมภาษาสครปต เชน php ไฟล .php หรอ asp ไฟล .asp ซงเปนภาษาทใชส าหรบสรางเวบเพจออกมาโดยขนกบเงอนไขการท างาน หรอขอมลทมอยในฐานขอมล 2.1.4 เวบบราวเซอร (Web Browser) หมายถง เปนโปรแกรมส าหรบเรยกดเวบเพจ เชน โปรแกรม Internet Explorer (IE), Netscape, Opera, Fire fox และปลาวาฬบราวเซอร เปนตน บราวเซอรท างานโดยการตความค าสงภาษา html รวมถงภาษาอนทแทรกอยในเวบเพจดวย เชน Java Script และ css แลวสรางเปนหนาเอกสารขนมาบนจอภาพ บราวเซอรสามารถแสดงองคประกอบพนฐานตางๆ ของเวบเพจไดเอง เชน ขอความ ภาพนงแบบ gif และ jpeg ภาพเคลอนไหวแบบ gif รวมทงไฟลเสยงแบบ wav และ midi 2.1.5 ปลกอน (Plug-in) หมายถง เปนโปรแกรมเสรมท าหนาทเพมคณสมบตบางอยางใหกบบราวเซอร การแสดงผลขอมลประเภททบราวเซอรไมรจก โดยสวนใหญสามารถดาวนโหลดโปรแกรมเหลานมาใชงานไดปลกอนส าหรบอนเทอรเนต เอกซพลอเรอร (Internet Explorer) มกจะอยในรปแบบเฉพาะของไมโคร ซอฟททเรยกวา ActiveX Control ตวอยางของปลกอนซงเปนทนยมประกอบดวย

Page 10: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

14

2.1.5.1 ปลกอนส าหรบเลนไฟลเสยงและวดโอ เชน Windows Media Player, Real Player และ QuickTime 2.1.5.2 ปลกอนส าหรบเลนไฟลมลตมเดย เชน Flash Player และ Shockwave Player 2.1.5.3 ปลกอนส าหรบแสดงเอกสารทมรปแบบเฉพาะ เชน Acrobat Reader ส าหรบเปดดไฟลประเภท pdf (ดวงพร เกยงค า 2551 : 23-24) 2.2 การออกแบบเวบไซต การพฒนาเวบไซตใหเปนทนยมและสะดดตาของผเขาชมนบวาเปนสงส าคญประการหนง ดงนนบคคลหรอองคกรใดๆ ทตองการพฒนาเวบไซตเพอเผยแพรสารสนเทศตางๆ จงจ าเปนตองศกษาแนวทางในการออกแบบเวบไซตของตนใหเปนทสะดดตาและมประโยชนกบผชมมากทสด 2.2.1 การออกแบบโครงสรางเวบไซต (Site Structure Design) การจดวางต าแหนงเวบเพจทงหมด ซงจะท าใหรวาทงเวบไซตประกอบไปดวยเนอหาอะไรบาง และมเวบเพจหนาไหนทเกยวของเชอมโยงถงกน ดงนนการออกแบบโครงสรางเวบไซตจงเปนเรองส าคญ เพราะจะท าใหมองเหนหนาตาของเวบไซตเปนรปธรรมมากขน สามารถออกแบบระบบ เนวเกชนไดเหมาะสม และมแนวทางการท างานทชดเจนส าหรบขนตอนตอๆ ไป นอกจากนโครงสรางเวบไซตทดยงชวยใหผชมไมสบสนและคนหาขอมลทตองการไดอยางรวดเรว และสามารถวางรปแบบโครงสรางเวบไซตไดดงน 2.2.1.1 แบบเรยงล าดบ (Sequence) เปนโครงสรางแบบธรรมดาทใชกนมากทสดเนองจากงายตอการจดระบบขอมล เปนขอมลลกษณะเปนเรองราวตามล าดบเวลา หรอในลกษณะการด าเนนเรองทวๆ ไป ไปสการเฉพาะเจาะจงเรองใดเรองหนง อยางไรกตามเหมาะส าหรบเวบไซตทมจ านวนเวบเพจไมมากนก เนอหาไมซบซอนหรอเวบไซตทมการน าเสนอขอมลแบบทละขนตอน ดงแสดงใน ภาพท 5 โครงสรางเวบไซตแบบเรยงล าดบ

ภาพท 5 โครงสรางเวบไซตแบบเรยงล าดบ

Page 11: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

15

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

ภาพท 6 โครงสรางเวบไซตแบบระดบชน

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

ภาพท 7 โครงสรางเวบไซตแบบผสม

(ณฐกร สงคราม 2548 : 10-11)

Page 12: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

16

2.2.2 หลกการและแนวทางในการผลตเวบไซต เวบไซต เปนสอทเปดโอกาสใหกลมเปาหมายไดมสวนในการโตตอบ ตวสอเปนตวกลางในการตดตอสอสาร มลกษณะการสรางและการน าเสนอดวยคอมพวเตอร ในรปแบบของสอหลายมต (Hypermedia) การผสมผสานของสอหลายชนดเขาดวยกน คอ ขอความ ภาพ และเสยง มคณสมบตทส าคญ คอ เปดโอกาสใหใชไดโดยไมจ ากดเวลา และสถานท สามารถสบคนขอมลตาง ๆ ไดอยางรวดเรว สามารถปรบปรงขอมลไดงาย ใชเปนเครองมอหรอสอกลางในการสอสารทงในแบบเวลาตรงกน และแบบไมตรงเวลากน หลกในการผลตเวบไซตนนตองพจารณาหลกของการผลตสอดวย คอ หลก 3P+1E โดยประกอบดวยขนตอนตาง ๆ ดงน (สนทด ทองรนทร 2548 : 413-414) 2.2.2.1 ขนตอนกอนการผลต (Pre-Production) เปนขนตอนของการเตรยมตวกอนการผลตเวบไซต ประกอบดวย 3 ขนตอน คอ 1) การก าหนดเปาหมายและวางแผนไวลวงหนา เพอใหการท างานในขนตอๆ ไปมแนวทางทชดเจนประกอบดวยประเดนหวขอ ก าหนดวตถประสงคของเวบไซต ก าหนดกลมผชมเปาหมาย เตรยมแหลงขอมล เตรยมทกษะหรอบคลากร เตรยมทรพยากรตางๆ ทจ าเปน 2) วเคราะหและจดโครงสรางขอมล โดยค านงถงคณลกษณะขอจ ากดของกลมผชมเปาหมาย รวมทงเนอหาหลกของเวบไซต น ามาประเมน วเคราะห และจดระบบ เพอใหไดโครงสรางขอมล และขอก าหนดซงจะใชเปนกรอบส าหรบการออกแบบและด าเนนการในขนตอๆ ไป 3) การออกแบบเวบเพจและเตรยมขอมล เปนขนตอนการออกแบบเคาโครงและลกษณะดานกราฟกของหนาเวบเพจ เพอใหผชมเกดอารมณการรบรตอเวบเพจตามทเราตองการ 2.2.2.2 ขนการผลต (Production) เปนขนตอนทเวบเพจจะถกสรางขนมาทละหนาๆ โดยอาศยเคาโครงและองคประกอบกราฟกตามทออกแบบไวเนอหาตางๆ จะถกน ามาใสและจดรปแบบ ลงคและระบบน าทางถกสราง องคประกอบเสรมตางๆ ถกวางเขาทโปรแกรมทใชในขนตอนนคอโปรแกรมส าหรบสรางเวบไซต เชน Macromedia Dreamweaver, Macromedia Flash, Adobe Go Live, Microsoft FrontPage และ Web Expression เปนตน 2.2.2.3 ขนหลงการผลต (Post-Production) เปนการน าเวบไซตทผลตเสรจแลวขนเผยแพรบนอนเทอรเนต จะท าดวยการอพโหลดไฟลทงหมด คอ HTML และไฟลอนๆ ทเกยวของขนไปเกบบนเวบเซรฟเวอรทเปดบรการไว รวมถงการบ ารงดแลรกษาและปรบปรงอยางตอเนอง 2.2.2.4 การประเมนผล (Evaluation) การประเมนผลการผลตเวบไซตประกอบดวยการประเมนระหวางการผลต การประเมนหลงการผลต และการประเมนผลจากการใชงาน เพอตรวจหาปญหาบางอยางทไมสามารถทดสอบบนคอมพวเตอรได เชน การลงคของเวบเพจกบเวบไซตอน และการท างานของโปรแกรมสครปตกบฐานขอมล เปนตน

Page 13: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

17

2.2.3 กระบวนการในการพฒนาเวบไซต กระบวนการพฒนาเวบไซตแบงออกเปนขนตอนตางๆ เพอใหเหมาะส าหรบใชเปนแนวทางในการพฒนาเวบไซต ดงแสดงในภาพท 8 กระบวนการพฒนาเวบไซต (ดวงพร เกยงค า 2551 : 28-32)

ภาพท 8 กระบวนการพฒนาเวบไซต

2.2.3.1 ก าหนดเปาหมายและวางแผน (Site Definition and Planning) การพฒนาเวบไซตควรมการก าหนดเปาหมายและวางแผนไวลวงหนา เพอใหการท างานในขนตอนตอๆ ไปมแนวทางทชดเจน ประกอบดวยขนตอนดงน 1) ก าหนดวตถประสงคของเวบไซต เพอใหเหนภาพทชดเจนวาเวบไซตนตองการน าเสนอหรอตองการใหเกดผลอะไร เชน เปนเวบไซตส าหรบใหขอมลหรอขายสนคา ซงวตถประสงคนจะเปนตวก าหนดรายละเอยดอนๆ ทจะตามมาไมวาจะเปนโครงสรางของเวบไซต รวมทงลกษณะหนาตา และสสนของเวบเพจ 2) ก าหนดกลมผชมเปาหมาย เพอจะไดรวาผชมหลกคอใคร และออกแบบเวบไซตใหตอบสนองความตองการผ ชมกลมนนใหมากทสด ไมวาจะเปนการเลอกเนอหา โทนส กราฟก เทคโนโลยทน ามาสนบสนนและอนๆ

2.2.3.1 ก าหนดเปาหมายและวางแผน (Site Definition and Planning)

2.2.3.2 วเคราะหและจดโครงสรางขอมล (Analysis and Information Architecture)

2.2.3.3 ออกแบบเวบเพจและเตรยมขอมล (Page Design and Content Editing)

2.2.3.4 ลงมอสรางและทดสอบ (Construction and Testing)

2.2.3.5 เผยแพรและสงเสรมใหเปนทรจก (Publishing and Promotion)

2.2.3.6 ดแลและปรบปรงตอเนอง (Maintenance and Innovation)

Page 14: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

18

3) เตรยมแหลงขอมล เพอน าเสนอสาระส าคญทแทจรงของเวบไซต ตองรวาขอมลทจ าเปนตองใชจะมาจากแหลงใดไดบาง เชน ถาเปนเวบไซตของบรษท ใครทจะเปนผใหขอมล หรอถาเปนเวบไซตขาวสาร ขาวสารนนจะมาจากแหลงใด มลขสทธหรอไม 4) เตรยมทกษะหรอบคลากร การสรางเวบไซตตองอาศยทกษะหลายๆ ดาน เชน ในการเตรยมเนอหา ออกแบบกราฟก เขยนโปรแกรม และการดแลเวบเซรฟเวอร เปนตน ถาเปนเวบไซตขนาดใหญอาจจะตองใชบคลากรเปนจ านวนมาก แตส าหรบเวบไซตเลกๆ ทดแลเพยงคนเดยวกจะตองศกษาหาความรในเรองนนๆ เพอเตรยมพรอมเอาไว 5) เตรยมทรพยากรตางๆ ทจ าเปน เชน โปรแกรมส าหรบสรางเวบไซต โปรแกรมส าหรบสรางกราฟก ภาพเคลอนไหว และมลตมเดย โปรแกรมยทลตอนๆ ทตองใช การจดทะเบยนโดเมน-เนม ตลอดจนการเตรยมหาผใหบรการรบฝากเวบไซต (Web Hosting) และเลอกแผนบรการทเหมาะสม 2.2.3.2 วเคราะหและจดโครงสรางขอมล (Analysis and Information Architecture) โดยค านงถงคณลกษณะขอจ ากดของกลมผชมเปาหมาย รวมท งเนอหาหลกของเวบไซต น ามาประเมน วเคราะห และจดระบบ เพอใหไดโครงสรางขอมล และขอก าหนดซงจะใชเปนกรอบส าหรบการออกแบบและด าเนนการในขนตอๆ ไป องคประกอบทควรมในขนตอนน ไดแก 1) แผนผงโครงสรางของเวบไซต (Site Structure) สารบญ (Table of Content) ล าดบการน าเสนอ (Storyboard) หรอผงงาน (Flowchart) 2) ระบบน าทางหรอเนวเกชน (Navigation) ซงผชมจะใชส าหรบเปดเขาไปยงสวนตางๆ ของเวบไซต เชนโครงสรางและรปแบบของเมน 3) องคประกอบตางๆ ทจะน ามาใชในเวบเพจมอะไรบาง เชน รปภาพ ภาพกราฟก เสยง วดทศน มลตมเดย และแบบฟอรม เปนตน อะไรบางทบราวเซอรของผชมสนบสนนและอะไรบางทตองอาศยโปรแกรมเสรม 4) ขอก าหนดเกยวกบลกษณะหนาตาและรปแบบของเวบเพจ 5) ขอก าหนดของโปรแกรมภาษาสครปตหรอเวบแอพพลเคชนและฐานขอมลทใชในเวบไซต 6) คณสมบตของเวบเซรฟเวอร รวมถงขอจ ากดและบรการเสรมตางๆ ทมให 2.2.3.3 ออกแบบเวบเพจและเตรยมขอมล (Page Design and Content Editing) เปนขนตอนการออกแบบเคาโครงและลกษณะดานกราฟกของหนาเวบเพจ เพอใหผชมเกดอารมณการรบรตอเวบเพจตามทเราตองการ โปรแกรมทเหมาะสมใชในการออกแบบคอ โปรแกรมโฟโตชอป (Photoshop) หรอโปรแกรมไฟรเวรกส (Fireworks) ซงผลทไดจะประกอบดวยไฟลกราฟกตางๆ ทใชบนเวบเพจ เชน ภาพโลโก ปมเมน ไอคอนทเปนหวคอลมภ และแบนเนอรโฆษณา เปนตน

Page 15: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

19

การออกแบบเวบเพจยงรวมไปถงการก าหนดสสน และรปแบบของสวนประกอบตางๆ ทไมใชภาพกราฟก เชน ฟอนต ขนาด และสขอความ สพนบรเวณทวาง สและลวดลายของเสนกรอบ เปนตน นอกจากนองคประกอบเสรมอนๆ ของเวบเพจกตองถกเตรยมไวดวย เชน ภาพเคลอนไหวโปรแกรมแมโครมเดย แฟลช (Macromedia Flash) และโปรแกรมจาวา สครป (Java Script) ทใชโตตอบกบผชมหรอเลน เอฟเฟคตตางๆ ในสวนของเนอหาขนตอนนจะเปนการน าเนอหาทเลอกไวมาปรบแก และตรวจทานความถกตอง เพอใหพรอมส าหรบจะน าไปใสเวบเพจแตละหนา 2.2.3.4 ลงมอสรางและทดสอบ (Construction and Testing) เปนขนตอนทเวบเพจจะถกสรางขนมาทละหนาๆ โดยอาศยเคาโครงและองคประกอบกราฟกตามทออกแบบไว เนอหาตางๆ จะถกน ามาใสและจดรปแบบ ลงคและระบบน าทางถกสราง องคประกอบเสรมตางๆ ถกวางเขาท อยางไรกตาม เมอลงมอสรางเวบเพจจรงอาจพบวาสงทออกแบบไวแลว บางอยางไมเหมาะสม หรอควรไดรบการปรบแตงกสามารถท าได โปรแกรมทใชในขนตอนนคอโปรแกรมส าหรบสรางเวบไซต เชน Macromedia Dreamweaver, Macromedia Flash, Adobe Go Live, Microsoft FrontPage และ Web Expression เวบไซตทสรางขนมาควรไดรบการทดสอบกอนทจะน าออกเผยแพร ไมวาจะเปนในเรองความถกตองของเนอหา การท างานของลงคและระบบน าทาง ตรวจหาความผดพลาดของโปรแกรมสครปตและฐานขอมล นอกจากนควรทดสอบโดยใชสภาพแวดลอมทเหมอนกบของกลมผชมเปาหมาย เกยวกบเรองของเวอรชนของบราวเซอร ความละเอยดของจอภาพและความเรวทเชอมตอกบอนเทอรเนต เพอดวาผชมเวบไซตไดอยางสมบรณและมประสทธภาพหรอไม 2.2.3.5 เผยแพรและสงเสรมใหเปนทรจก (Publishing and Promotion) โดยทวไปการน าเวบไซตขนเผยแพรบนอนเทอรเนต จะท าดวยการอพโหลดไฟลทงหมด คอ HTML และไฟลอนๆ ทเกยวของขนไปเกบบนเวบเซรฟเวอรทเปดบรการไว การอพโหลดเวบไซตหรอบางครงเรยกวา พบลช (Publish) อาจท าดวยโปรแกรมสรางเวบไซตเอง ซงมคณสมบตนอยในตว หรออาจใชโปรแกรมยทลตประเภท FTP เชน Cute FTP และ WS_FTP หรอใชเครองมออนๆ บนเวบเซรฟเวอร หลงจากนนเวบไซตควรไดรบการทดสอบอกครง เพอตรวจหาปญหาบางอยางทไมสามารถทดสอบบนคอมพวเตอรได เชน การลงคของเวบเพจกบเวบไซตอน และการท างานของโปรแกรมสครปตกบฐานขอมล เปนตน 2.2.3.6 ดแลและปรบปรงตอเนอง (Maintenance and Innovation) เวบไซตทเผยแพรออกไปควรดแลโดยตลอด ซงหนาทนครอบคลมหลายเรอง ตงแตการตรวจสอบเวบเซรฟเวอร วาไมหยดท างานบอยๆ ลงคทเชอมโยงไปภายนอกยงคงใชไดหรอไม คอยตอบอเมลหรอค าถามทมผฝากไวบน เวบเพจ ถาเปนเวบขาวสารกตองปรบปรงขอมลใหทนสมยตลอดเวลา ถามการใชฐานขอมลกตองแบคอพขอมลอยางสม าเสมอ นอกจากนควรตรวจสอบสถตของการเขาชมเปนระยะๆ หลงจากทเวบไซตไดรบการเผยแพรไประยะหนง ควรปรบปรงเพอใหผชมรสกวา มความเปลยนแปลง มความสดใหมทนสมย โดยอาจ

Page 16: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

20

น าขอมลสถตทรวบรวมไวมาพจารณาประกอบดวย การเปลยนแปลงท าไดท งในสวนของเนอหา โครงสรางเวบไซต การออกแบบหนาตา และการน าเทคโนโลยใหมๆ เขามาเสรม 2.2.4 คณภาพของเวบไซต การสรางเวบไซตไมไดเปนเรองยากในปจจบนเพราะมโปรแกรมส าหรบสรางเวบไซตมากมายทมความสะดวก แตการสรางเวบไซตใหดเปนเรองยากกวา จะเหนไดวาเวบไซตทปรากฏอยมากมายนน บางครงไมไดสะทอนใหเหนถงประเดน หรอภาพแกผทเขาไปชม มเวบไซตอยจ านวนมากทเปดเขาไปดแลว บอกไมไดเลยวาเปนเวบไซตเกยวกบอะไร หรอตองการแสดงอะไร นอกจากนบางเวบไซตอาจมขอมลมากเกนไป จนรกรงรง การสรางสรรคเวบไซตเปรยบเสมอนการจดบาน หรอการตกแตงส านกงาน ซงควรจดใหดดนาอยนามอง และมการวางขาวของเครองใชอยางมระเบยบและเปนหมวดหม เพอสะดวกในการหยบใช คณภาพเปนเรองส าคญ และมอทธพลในการดงดดใหผเขาเยยมชมเวบไซตอยากกลบมาเยยมชมอกในภายหลง คณภาพนนครอบคลมถงเรองตางๆ ใน 3 ประเดน ดงน 1) รปแบบ เปนสวนของภาพกราฟก เลยเอาท และภาพรวมของเวบไซตรปแบบจะเปนดานแรกทผเขาเยยมจะพบเหน ดงนนการสรางความรสกทด ความพงพอใจใหกบผเขาเยยมชม เรองของรปแบบเปนสงจ าเปนและไมควรมองขาม 2) เนอหา ขอมลตางๆ ทปรากฏอยบนเวบไซต จะตองเปนขอมลทไดรบการคดเลอกมาเปนอยางด วามความถกตอง เหมาะสม และทนสมย ทส าคญคอ จะตองมการเขากนไดกบเนอหาสวนตางๆ ของเวบไซตไดเปนอยางด 3) ความเรว แมวาเวบไซตจะมรปแบบ และเนอหาทดแลว เรองของความเรวเปนปจจยทส าคญประการหนง (เชาวรตน เชาวพลกรง 2548 : 21) 2.2.5 บคลากรในการพฒนาเวบไซต การพฒนาเวบไซตสามารถท าเพยงคนเดยวหรอท าเปนทมกได ขนอยกบวาเปนเวบไซตขนาดใหญ หรอเปนเวบไซตขนาดเลก โดยทวไปแลวทมงานพฒนาเวบไซตจะประกอบดวยบคลากรตางๆ ดงน 2.2.5.1 เวบ มาสเตอร (Web Master) เปนผรบผดชอบและดแลเวบไซตทไดรบมอบ- หมายในภาพรวมหรออาจจะมหนาทออกแบบและพฒนาเวบไซต ดงนนจงตองเปนผทมความรในเรองตางๆ อยางกวางขวาง 2.2.5.2 เวบ ดไซนเนอร (Web Designer) เปนผออกแบบลกษณะหนาตาทงหมดของเวบไซต ไมวาจะเปนการวางเคาโครงของหนาเวบเพจ การเลอกส การออกแบบภาพกราฟกทเปนสวนประกอบตางๆ ดงนนจะตองเปนผทมความรดานศลปะและการน ามาประยกตใชอยางเหมาะสม

Page 17: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

21

2.2.5.3 เวบ โปรแกรมเมอร (Web Programmer) เปนนกเขยนโปรแกรมซงสามารถพฒนาโปรแกรมดวยภาษาตางๆ ทใชในเวบไซต เชน JavaScript, VBScript, ASP, NET และ PHP บคลากรดานนมความส าคญมาก เนองจากปจจบนมการใชโปรแกรมเขามาชวยเสรมการท างานของเวบไซตมากขน เชน ใชจดการระบบฐานขอมลหรอเพมลกเลนบนเวบเพจใหนาสนใจ 2.2.5.4 คอนเตนท ไรตเตอร อดเตอร (Content Writer Editor) เปนนกเขยนและบรรณาธการทดแลดานเนอหา (Content) ของเวบไซต เปนผรบผดชอบในการจดเตรยมเนอหา ตรวจสอบความถกตองและปรบปรงเมอมการเปลยนแปลง (ดวงพร เกยงค า 2551 : 27 - 48) 2.2.6 การหาคณภาพของเวบไซต การพฒนาสอการเรยนการสอน ไมวาจะเปนการเลอกหรอการผลตสอ ขนตอนหนงของการด าเนนการดงกลาวคอ การพจารณาคณภาพตางๆ ของสอนนเพอจะไดแกไขปรบปรงใหไดผลตามจดมงหมาย กอนทจะน าสอนนไปใชในระบบการเรยนการสอน และการเผยแพร ดงนนจงจ าเปนตองมการประเมนสอเพอหาคณภาพของสอนน ซงในกระบวนการประเมน ผประเมนจะตองก าหนดจดมงหมาย วธการประเมน วธการเกบรวมรวบและวเคราะหขอมล ตลอดจนการสรปเพอชแนวทางปรบปรงสอนนๆ ดวยเหตน การประเมนสอจงเปนการวจยอกแบบหนงทเรยกวา การวจยประเมน (Evaluation Research) ซงไดแบงวธการประเมนสอไว 5 วธ ดงน (ไชยยศ เรองสวรรณ 2547:127-130) 2.2.6.1 การประเมนโดยผสอน เปนผทมประสบการณในการสอน เคยรบการฝกอบรมจนมความรความช านาญเกยวกบการผลตและการใชสอในการเรยนการสอนมาเปนอยางด ผสอนทมความเชยวชาญเกยวกบสอและวธการสอนอาจจะจดเปนผช านาญกได 2.2.6.2 การประเมนโดยผช านาญ เปนผช านาญดานการสอการเรยนการสอนและมประสบการณดานการประเมนดวย ดงนนผช านาญอาจเปนผสอน เปนอาจารยในมหาวทยาลยทสอนในสาขาวชาสอและเทคโนโลยการศกษา รวมท งอาจารยดานการวดผลและการประเมนผลทมความรความสามารถดานสอการเรยนการสอน 2.2.6.3 การประเมนโดยคณะกรรมการเฉพาะกจ เปนกลมบคคลทหนวยงานแตงตงขนมาเพอประเมนสอ กรรมการประเมนสอจะประเมนคณลกษณะประสทธภาพการใชงาน และคณลกษณะดานอนๆ ของสอการเรยนการสอน 2.2.6.4 การประเมนโดยผเรยน เปนผรบรและเรยนรจากสอ ดงนนการใหผเรยนไดมโอกาสประเมนสอ จงชวยใหไดขอคดในการปรบปรงสออยางเหมาะสมกบผเรยน การประเมนสอ โดยผเรยนควรจดท าขนทนทเมอใชสอแลว และใหประเมนเฉพาะตวสอ ไมใหเอาวธสอนของผสอนเขามาเกยวของ อยางไรกตาม การประเมนสอโดยผเรยนอาจมปญหาอยบางในแงผเรยนอาจมประสบการณนอย ผสอนควรชแจงเกณฑหรอหวขอการประเมนใหผเรยนเขาใจกอนใหประเมน

Page 18: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

22

2.2.6.5 การประเมนประสทธภาพของสอ การประเมนสออกวธหนง เปนการประเมนประสทธภาพของสอ ซงสอทจะไดรบการประเมนประสทธภาพ จะค านงถงจดมงหมายของสอการเรยนการสอนและวดผลสมฤทธในการเรยนของผเรยนภายหลงทเรยนจากสอนน เกณฑการประเมนเวบเพจประกอบดวยประเดนดงน (วรษญา วลมาล 2551 : 47) 1) ความถกตองในเนอหาของเวบเพจ เนองจากมผน าเสนอขอมลอยภายในเวบเพจเปนจ านวนมาก การประเมนจ าเปนตองค านงถงความถกตองของเนอหาเปนส าคญ 2) ความนาเชอถอของเวบเพจ เปนการยากทจะพจารณาวาควรจะเชอถอเนอหาไดในระดบใดจ าเปนตองพจารณาผเขยนเวบเพจ ซงเปนสงทตองประเมนวามการแจงชอสถาบนสถานทตดตอหรอไมเพราะเปนการแสดงความรบผดชอบและสรางความนาเชอถอ 3) ความมงหมายของเวบเพจ เวบจะตองมเปาหมายและวตถประสงคทชดเจนตงแตเรมตนน าเสนอ โดยใหรายละเอยดและขอมลของบคคลหรอกลมบคคลทจดท า 4) ความทนสมย เปนการบงบอกวนเวลา ทเรมน าเสนอ พนทของเวบเพจ การปรบปรงและขอมลลาสดเมอใด เปนการบงชถงคณภาพของขาวสารขอมลในแงทนตอสถานการณ 5) ความครอบคลม เวบมความแตกตางจากสงพมพในดานของความครอบคลม ซงจ าเปนทเวบจะตองท าใหสมบรณทงการเชอมโยงเนอหา การใชภาพ ขอความ ขอมล การออกแบบหนาจอการเขาถงขอมลหรอการคนหา ลวนเปนองคประกอบทตองด าเนนการใหครอบคลม 2.3 การออกแบบเวบเพจ การวางเคาโครงของหนาเวบเพจและสรางองคประกอบตางๆ ขนมาใหครบสมบรณในไฟลเดยวไมวาจะเปน โลโก ชอเวบไซต ปมเมน รปไอคอน แถบส ภาพเคลอนไหว และอนๆ โดยใชโปรแกรมสรางเวบเพจ อกทงในขนสดทายยงสามารถบนทกองคประกอบทงหมดแยกเปนไฟลกราฟกยอยๆ พรอมกบไฟล html ซงสามารถจะน าไปใชเปนตนแบบในสรางเวบเพจไดทนท 2.3.1 เวบเพจ (Web Page) การออกแบบหนาเวบเพจโดยค านงถงเรองของแนวคดการออกแบบ การใชส ขอความ กราฟก การจดองคประกอบศลป รวมไปถงเทคนคทใชในการสรางเวบเพจ สวนประกอบของหนาเวบเพจประกอบดวยสวนตางๆ ดงน (วรษญา วลมาล 2551 : 20) 1) เทกต (Text) เปนขอความปกต โดยเราสามารถตกแตงใหสวยงาม และมลกเลนตางๆ ดงเชน โปรแกรมประมวลค า 2) กราฟก (Graphic) ประกอบดวยลายเสน รปภาพ ลายพนตางๆ 3) มลตมเดย (Multimedia) ประกอบดวยรปภาพ ภาพเคลอนไหว และแฟมเสยง 4) เคานเตอร (Counter) ใชนบจ านวนผทเขามาเยยมชมเวบเพจ 5) คล ลงค (Cool Links) ใชเชอมโยงไปยงเวบเพจของตนเอง หรอเวบเพจของคนอน

Page 19: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

23

6) ฟอรม (Forms) เปนแบบฟอรมทใหผเยยมชมกรอกรายละเอยด แลวสงกลบมายงระบบฐานขอมล 7) เฟรม (Frames) เปนการแบงจอภาพเปนสวนๆ แตละสวนกจะแสดงขอมลทแตก- ตางกนและเปนอสระจากกน 8) อมเมจ แมพ (Image Maps) เปนรปภาพขนาดใหญทก าหนดสวนตางๆ บนรป เพอเชอมโยงไปยงเวบเพจอนๆ 9) จาวา แอพพรตส (Java Applets) เปนโปรแกรมส าเรจรปทใสลงในเวบเพจ เพอใหการใชงานเวบเพจมประสทธภาพมากยงขน นอกจากสวนประกอบดงกลาวแลว องคประกอบทนยมใสไวในเวบเพจอก 2 สวน คอ สมดเยยม และเวบบอรด ทชวยใหเวบเพจกลายเปนสอทมปฎสมพนธระหวางผใชกบผสราง และระหวางผใชดวยกนเอง องคประกอบหลกของหนาเวบเพจทน าเสนอโดยทวไป แบงออกเปน 3 สวน ดงน (ดวงพร เกยงค า 2552 : 40) 1) สวนหว (Page Header) อยตอนบนสดของหนาเวบเพจเปนบรเวณทส าคญทสด เนองจากผชมจะมองเหนกอนบรเวณอน สวนใหญนยมใชวางโลโก ชอเวบไซต ปายโฆษณา ลงคส าหรบการตดตอหรอลงคทส าคญ และระบบน าทาง 2) สวนของเนอหา (Page Body) อยตอนกลางหนาใชแสดงเนอหาภายในเวบเพจนน ซงอาจจะประกอบไปดวยขอความ ภาพกราฟก ตารางขอมลและอนๆ บางครงเมนหลกหรอเมนเฉพาะกลมอาจมาอยในสวนนกได โดยมกจะวางไวดานซายมอสดเนองจากผใชจะมองเหนงายกวา 3) สวนทาย (Page Footer) อยดานลางสดของหนา สวนใหญจะนยมใชวางระบบน าทางภายในเวบไซตแบบทเปนลงคขอความงายๆ นอกจากนอาจจะมชอของเจาของขอความแสดงลขสทธและอเมลแอดเดรสของผดแลเวบไซต ดงแสดงในภาพท 9 องคประกอบหลกของหนาเวบเพจ

Page 20: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

24

ภาพท 9 องคประกอบหลกของหนาเวบเพจ

2.3.2 หลกการออกแบบเวบเพจ การออกแบบเวบเพจ เวบเพจทจดแบบเรยบงายแตดด จะสรางความนาสนใจและนาเชอถอกบผชม นอกจากนการวางต าแหนงของเนอหาตางๆ อยางมระเบยบ เปนสดสวน จะชวยผชมหาขอมลทตองการไดอยางรวดเรว ประกอบดวยหลกการออกแบบเวบเพจ ดงน (ดวงพร เกยงค า 2552 : 30) 2.3.2.1 จดสดสวนระหวางขอความและภาพกราฟกใหพอด เปนการจดสดสวนระหวางขอความและภาพกราฟกใหเหมาะสม โดยพจารณาจากเนอหาทจะน าเสนอและกลมผชมเปาหมาย เชน เวบไซตทมกลมผชมเปาหมายเปนเดก และวยรน จะตองจดสดสวนของภาพกราฟกใหมากกวาขอความ เปนตน 2.3.2.2 ใหความส าคญกบสวนบนของเวบเพจ เปนดานบนสดของหนาโฮมเพจ ซงผชมจะสมผสไดทนทเมอเปดเขามาทหนานน เวบเพจสวนใหญนยมจดวางองคประกอบเปนรปแบบคลายๆ กนคอ ชอและโลโกของเวบไซต ระบบเนวเกชน เครองมอเสรมส าหรบคนหาขอมลในเวบไซต และลงคส าคญ ปายแบนเนอรโฆษณา หรอขอความทส าคญ 2.3.2.3 สรางระดบความส าคญของเนอหา เปนการสรางระดบความส าคญขององค ประกอบตางๆ ภายในเวบเพจจะชวยเนนใหผชมเหนวาสวนไหนส าคญมาก สวนไหนส าคญนอย ซงผชมจะรบรดวยสายตาไดอยางรวดเรว เชน หวขอขนาดใหญแสดงวาส าคญกวาขอความขนาดเลก เปนตน

สวนหว (Page Header)

สวนของเนอหา (Page Body)

สวนทาย (Page Footer)

Page 21: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

25

2.3.2.4 การออกแบบขนาดของเวบเพจใหพอดกบหนาจอ จะตองค านงถงกลมผชมเปาหมายสวนใหญ วาใชจอภาพทมความละเอยด (Resolution) เทาใด ซงจะมผลตอการปรากฏของเวบเพจความละเอยดของจอภาพทใชกนโดยทวไปในเมองไทย ปจจบนม 3 ขนาดคอ 1) 800 x 600 พกเซล มผใชประมาณ 20% 2) 1024 x 768 พกเซล มผใชประมาณ 70% 3) 1280 x 1024 และ1152x864 มผใชประมาณ 10% 2.3.2.5 เลอกใชสอยางเหมาะสม การออกแบบเวบเพจใหสวยงามนน สวนใหญจะขนอยกบการเลอกชดสใหผสมกลมกลนกน ท าใหเวบเพจออกมาดด สพนเวบเพจ สขอความ และสขององคประกอบอนๆ 2.3.2.6 การออกแบบระบบเนวเกชน (Web Site Navigation Design) เปาหมายของระบบน าทางหรอเนวเกชน คอชวยใหผชมเขาถงขอมลทตองการไดอยางรวดเรวและไมหลงทาง ดงนนองคประกอบของระบบน าทางจงม 2 สวนดงน 1) เครองน าทาง (Navigation Control) เปนเครองมอส าหรบใหผชมเปดไปยงเวบเพจตางๆ ภายในเวบไซต โดยแยกไดเปนดงน (1) เมนหลก เปนเมนส าหรบไปยงหวขอเนอหาหลกของเวบไซต มกอยในรปของลงคทเปนขอความหรอภาพกราฟกและจะตองมปรากฏอยบนเวบเพจทกหนา (2) เมนเฉพาะกลม เปนเมนทเชอมโยงเฉพาะเวบเพจภายในกลมยอยๆ ทมเนอหาเกยวเนองกนเทานน มกอยในรปของลงคขอความหรอภาพกราฟก (3) เครองมอเสรมส าหรบชวยเสรมการท างานของเมน มหลายรปแบบ เชน ชองคนหาขอมล (Search Box) เมนแบบดรอปดาวน (Drop down Menu) อมเมจแมพ (Image Map) แผนทเวบไซต (Site Map) 2) เครองบอกต าแหนง (Location Indicator) เปนสงทใชแสดงวาขณะนผชมก าลงอยทต าแหนงใดในเวบไซต เครองบอกต าแหนงมหลายรปแบบ เชน ขอความหรอภาพกราฟกทแสดงชอเวบเพจ และเครองบอกต าแหนงอาจถกรวมไวกบตวเมน เปนตน ลกษณะของเครองบอกต าแหนงทดประกอบดวยประเดนดงน (1) อยในต าแหนงทเหนไดชดและเขาถงงาย เชน สวนบนหรอดานซายของเวบเพจ (2) เขาใจงายหรอมขอความก ากบชดเจน ผชมใชไดทนทโดยไมตองเสยเวลาศกษา (3) มความสม าเสมอและเปนระบบไมชวนใหสบสนหรอกลบไปกลบมา (4) มการตอบสนองเมอใชงาน เชน เปลยนสเมอผชมชเมาสหรอคลก (5) มจ านวนรายการพอเหมาะไมมากเกนไป (6) มหลายทางเลอกใหใช เชน เมนกราฟก เมนขอความ ชองคนหาขอมล (Search Box) เมนแบบดรอปดาวน (Drop down Menu) แผนทเวบไซต (Web Site Map) (7) มลงคใหคลกกลบไปยงโฮมเพจไดเสมอ เพอใหผชมกลบไปเรมตนใหมในกรณทหลงทางไมรวาตวเองอยทต าแหนงใดของเวบไซตกกลบไปเรมตนทหนาแรกใหมได

Page 22: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

26

2.3.2.7 การใชภาพกราฟกในเวบเพจ เปนองคประกอบทส าคญและจ าเปนส าหรบการสรางเวบเพจ เพราะจะชวยท าใหเวบเพจสวยงาม มสสนนาสนใจและสอความหมายตางๆ ใหกบผชม ภาพกราฟกทน ามาใชบนเวบเพจอาจจะเปนภาพถาย ภาพวาดลายเสนหรอลวดลายตางๆ รวมท งภาพเคลอนไหว ส าหรบชนดไฟลกราฟกสวนใหญทน ามาใชคอ GIF หรอ JPG ส าหรบภาพนง และ GIF หรอ SWF ส าหรบภาพเคลอนไหวซงไฟลแตละชนดจะมขอจ ากดและความเหมาะสมส าหรบลกษณะภาพทแตกตางกน มขอทจะตองพจารณาหลายดาน เชน ความจ าเปน ประโยชนในการใชงาน ขนาดภาพ ขนาดไฟล ความเรวในการเชอมตออนเทอรเนต และคณสมบตคอมพวเตอรของผชม เปนตน ประเภทของภาพกราฟกทใชในเวบเพจ มดงน (กฤตญา สกลเสาวภาค และคณะ 2552 : 5-12) 1) ภาพบตแมพ (Bitmap) เปนภาพทประกอบขนจากจดสขนาดเลก ทเรยกวาพกเซล (Pixel) จ านวนมากเรยงไลสกนจนเรามองเหนเปนภาพๆ หนง ถาเราขยายภาพประเภทนจะท าใหภาพดหยาบและเหนรอยจดสอยางชดเจน 2) ภาคเวคเตอร (Vector) เปนภาพทประกอบดวยเสนตรง เสนโคงและรปทรงเรขาคณตทถกเกบอยในรปของค าสงโปรแกรมและคาตวเลขซงจะมการค านวณเมอแสดงผล ดงนนภาพประเภทนจงมความคมชดเชนเดม ไมวาจะขยายภาพใหใหญขนเทาใด ภาพกราฟกส าหรบใชบนเวบเพจมอย 4 ชนด แตละชนดเหมาะส าหรบภาพทมลกษณะแตกตางกนออกไปดงน 1) GIF (Graphic Interchange Format) ไฟลกราฟกชนด GIF ทนยมน ามาสรางเปนภาพโลโก การตน ภาพวาดลายเสน ตวอกษร และภาพเคลอนไหว มจดเดนตรงทสามารถก าหนดใหฉากหลงของวตถ หรอพนทบางสวนโปรงใส (Transparent) จนมองทะลไปดานหลงไดนยมน ามาท าภาพ เคลอนไหว GIF animation ภาพชนด GIF มนามสกลของไฟลเปน .gif 2) JPG (Joint Photographic Expert Group) ภาพชนดนสามารถแสดงสไดถง 16.7 ลานส (24 บท) จงเหมาะส าหรบภาพถายหรอภาพทใชสจ านวนมาก แตไมสามารถท าภาพโปรงใสหรอภาพเคลอนไหวได นอกจากนเราสามารถก าหนดระดบการบบอดขอมล ซงจะท าใหไฟลมขนาดเลกลงมากๆ ได แตคณภาพของภาพกจะลดลงดวย ภาพชนด JPG มนามสกลของไฟลเปน .jpg หรอ .jpeg 3) PNG (Portable Network Graphic) ภาพชนดนมคณสมบตเดนคอ สนบสนนระบบสหลายรปแบบ โดย PNG-8 เปนรปแบบทใชสไดเพยง 256 ส และมคณสมบตคลายกบไฟล GIF จงเหมาะส าหรบภาพทมสเรยบๆ เชน ภาพโลโก การตน และภาพวาดลายเสน เปนตน 4) ภาพกราฟกไฟล Flash นามสกล .swf เปนภาพมาตรฐานไฟลชนดนสามารถเกบไดทงภาพบทแมพและเวคเตอร แตสวนใหญจะเปนภาพเวคเตอร ใชท าภาพเคลอนไหวทตองการความคมชดสง มลกเลนหลากหลาย และสามารถโตตอบกบผชมได เชน ปายแบนเนอร เมนของเวบไซต เปนตน

Page 23: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

27

2.3.3 ขนตอนการออกแบบเวบเพจ ประกอบดวยขนตอนตางๆ ดงน (จตเกษม พฒนาศร2549 : 32) 2.3.3.1 มรายการสารบญแสดงรายละเอยดของเวบเพจ การเขาไปในเวบเพจนนเปรยบ เสมอนการอานหนงสอ การทผใชจะเขาไปคนหาขอมลได ผสรางเวบเพจควรแสดงรายการทงหมดท เวบเพจนนมอยใหผใชทราบ โดยอาจจะท าเปนรปแบบของสารบญ หรอการเชอมโยงชวยใหผใชสามารถคนหาขอมลภายในเวบเพจไดอยางรวดเรว ปองกนไมใหผใชหลงทางไดดทสด 2.3.3.2 เชอมโยงขอมลไปยงเปาหมายใหตรงกบความตองการใหมากทสด ถาขอมลทน ามาแสดงเนอหามากเกนไป และเวบเพจทสรางขนไมสามารถน าขอมลทงหมดมาแสดงได ถาทราบแหลงขอมลอนวาสามารถใหความกระจางแกผใชได ควรทจะน าเอาแหลงขอมลนนมาสรางเปนจดเชอมโยงเพอผใชจะไดคนหาขอมลไดอยางถกตอง 2.3.3.3 เนอหาส น กระชบ และทนสมย เนอหาทน าเสนอควรเปนเรองทอยในความสนใจของผคน หรอเปนเรองทตองการใหผใชทราบ และควรปรบปรงใหทนสมยอยเสมอ 2.3.3.4 สามารถโตตอบกบผใชไดอยางทนทวงท ควรก าหนดจดทผใชสามารถแสดงความคดเหน หรอใหค าแนะน ากบผสรางได เชน ใสอเมลของผท าลงในเวบเพจ เปนตน 2.3.3.5 การใสภาพประกอบ การเลอกใชรปภาพท าหนาทแทนค าบรรยายนนเปนสวนส าคญประการหนง ควรใชรปภาพทสามารถสอความหมายกบผใชไดตรงตามวตถประสงค การใชรปภาพเพอเปนพนหลงไมควรเนนสฉดฉาดมากนก เพราะอาจจะไปลดความเดนของเนอหา ควรใชภาพทมสออนไมสวางจนเกนไป ขนาดของรปภาพไมควรมขนาดใหญหรอจ านวนมากเกนไป เพราะอาจจะท าใหเนอหาสาระของเวบเพจนนถกลดความส าคญลง ตวอกษรกเชนกนควรเลอกขนาดทอานงาย ไมมสสนหรอลวดลายเกนความจ าเปน 2.3.3.6 เขาสกลมเปาหมายไดอยางถกตอง การก าหนดกลมเปาหมายอยางชดเจนจะท าใหผสรางสามารถก าหนดเนอหา และเรองราวเพอใหตรงกบความตองการของผใชไดมากกวา 2.3.3.7 ใชงานงาย การสรางเวบเพจใหงายตอการใชงานนน ขนอยกบเทคนคตางๆ รวมทงประสบการณของผสราง เมอเวบเพจทสรางใชงานไดงายโอกาสทจะประสบความส าเรจยอมสงขนตามล าดบ 2.3.3.8 เปนมาตรฐานเดยวกน เวบเพจทสรางขนมานนอาจจะมขอมลมากมายหลายหนา จ าเปนตองจดขอมลใหเปนมาตรฐานเดยวกน โดยจดเปนกลม เปนหมวดหม เพอความเปนระเบยบ นาใชงาน ผใชงานไมเกดความสบสนกบขอมลนน

Page 24: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

28

2.3.4 โปรแกรมทใชในการสรางเวบเพจ การสรางเวบเพจในปจจบนนมโปรแกรมส าเรจรปทมคณสมบตพรอมส าหรบการสรางเวบเพจซงประกอบไปดวยโปรแกรมแมโครมเดย ดรมวพเวอร (Macromedia Dreamweaver) เปนโปรแกรมชวยใหการจดวางโครงสรางและออกแบบเวบเพจไดอยางอสระ โดยอาศยเครองมอตางๆ ทโปรแกรมเตรยมไวใหโดยไมตองรภาษา html แตอยางใด โปรแกรมแมโครมเดย แฟลช (Macromedia flash) เปนโปรแกรมทใชในการสรางภาพเคลอนไหวไมวาจะเปนการสรางเมน แบบเนอร ไอคอน และสอมลตมเดย โดยมรายละเอยดดงน 2.3.4.1 โปรแกรมแมโครมเดย ดรมวพเวอร เปนโปรแกรมส าหรบออกแบบและพฒนาเวบไซตทไดรบความนยมอยางมากในปจจบน เนองดวยสามารถใชงานไดงาย มเครองมอใหใชงานมากมาย ซงสามารถพฒนาเวบเพจไดอยางรวดเรว และงายดาย เออประโยชนส าหรบผท าเวบเพจอยางเตมท ไมวาจะเปนระบบการจดการเกยวกบ Site และการจดเกบไฟล นอกจากนยงมระบบชวยจดการเกยวกบการ Upload ไฟลไปยงเซรฟเวอรอกดวย และยงสนบสนนการใชงานเวบเพจแบบไดนามคเพมมากขน มการรองรบสครปภาษาตางๆ เชน CSS, Java Script, XML และรองรบลกเลนเกยวกบการท าภาพเคลอนไหว Gif Animation และสนบสนนการใชงานโปรแกรม Flash เพมขนอกดวย (กตต ภกดวฒนกล และกลชน รกษ-ประเทอง 2547 : 5) โปรแกรมแมโครมเดย ดรมวพเวอร ไดมการพฒนามาหลายรน โดยมจดเดนของโปรแกรมแมโครมเดย ดรมวพเวอร ดงน (บญเลศ อรณพบลย 2552 : 1-5) 1) สนบสนนรปแบบการจดการเวบไซตในลกษณะแผนแบบ (Cascading style sheets หรอ CSS)

2) สามารถใชงานกบเอกซเอมแอล (Xtensible Markup Language หรอ XML) ได 3) สนบสนนรหสค าสง (Code) ภาษาเอเอสพ (ASP) พเอชพ (PHP) และเจเอสพ (JSP) 4) สามารถจดเกบรหสค าสงสนๆ (Code snippets) ทมการใชเปนประจ าไวใชได 5) สามารถแปลงขอมลทเปนขอความใหอยในรปตารางได 6) สามารถท าใหรปภาพเปลยนแปลงเมอน าเมาสผาน (Roller image) 7) สามารถท าใหภาพเคลอนไหวไดโดยโปรแกรมคนดตงแตรน 4.0 ขนไปไดโดยไมตองใชซอฟตแวรเสรม 8) มความสามารถในการปรบปรงและการรกษาเวบไซต เชน การตรวจสอบการเชอมโยงและการถายโอนขอมลลงสตวบรการเวบไซต 9) ปมควบคมการท างานแบงเปนหมวดหม ท าใหการสงงานสะดวกและรวดเรว 10) สามารถใชงานภาษาไทยไดด

Page 25: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

29

นอกจากนยงมคณลกษณะทส าคญทชวยอ านวยความสะดวกแกผใชโปรแกรม สามารถท างานกบหนาเวบเพจไดงายขน ใชกลมเครองมอจากแถบสถานะ (Status Bar) ชวยในการท างานกบหนา เวบเพจไดงายขน เชน การซมหนาเวบเพจเขามาเพอใหเหนรายละเอยดขณะท างานดวย ซม ทล (Zoom Tool) หรอเลอนดหนาเวบเพจไปมาดวย แฮนด ทล (Hand Tool) สามารถขยายมมมองหนาเวบเพจในรปแบบเปอรเซนตเปนจ านวนเทาของหนาเวบเพจเดมได ซอนโคดบางสวนเพอชวยใหงายตอการท างานในกรณทหนาเวบเพจ มรายละเอยดคอนขางมาก ตวโคดค าสงกตองมรายละเอยดมากตามไปดวย โดยเฉพาะเวลาเปดดเวบไซตทมโคดยาวๆ การจะคนหาต าแหนงแกไข หรอเลอนดสวนตางๆ มตวชวยใหการเขยนโคดสะดวกขน โดยสามารถซอนโคดไดปรบคาการท างานกบ CSS สามารถตงรายละเอยดกบ CSS ไดงายขน โดยเลอกจากปม Visual Aids เพอใหมความสะดวกมากขนในการออกแบบหนาเวบเพจตวอยาง เชน สามารถเลอกใหมสสนในแตละเฟรม แตละเลยเอาทไดเพอชวยใหคนมปญหาทางดานการมองเหน สามารถจดการเลยเอาทไดอยางชดเจน แสดงคณสมบตของ CSS ในสวนทเลอก สามารถปรบคณสมบตของ CSS ไดสะดวกมากยงขน โดยใชพาเนล CSS ซงเปนพาเนลใหมทแมโครมเดย ดรมวพเวอรไดก าหนดขนมา ซงจะสะดวกกวาในอดตทตองจดจ าชอคณสมบตของ CSS และคาทสามารถก าหนดใสในคณสมบตนนได เพมหนาจอทใชกบไฟลนามสกล flv (Flash Video เปนไฟลวดโอในรปแบบของ Streaming Video ซงวดโอประเภทนจะพบเหนโดยทวๆ ไป คอวดโอทสามารถโหลดและดไปดวยพรอมๆ กนได ถาเปนวดโอธรรมดาตองโหลดใหเสรจกอนแลวจงคอยเปดด) จดเดนของโปรแกรมแมโครมเดย ดรมวพเวอร ไดแก ผใชไมจ าเปนตองศกษาภาษา html มากอนกสามารถสรางเอกสารเวบเพจได เพราะตวโปรแกรมมฟงกชนการท างานแบบ html Generator ปมควบคมการท างาน ไดจดแบงเปนหมวดหมชวยใหการสงงานกระท าไดสะดวก และรวดเรวสามารถใชงานภาษาไทยไดด สรางภาพเคลอนไหว Animation โดยใชรปแบบของ Director ดวยคณสมบต Animate Netscape และ CSS-P Layers ท าใหไดภาพเคลอนไหวบนเบราเซอร โดยไมตองอาศย Plug in ใดๆ ความ สามารถในการสรางตาราง โดยการอมพอรทจาก Text File สนบสนน CSS (Cascading Style Sheet) ความ สามารถในการตรวจสอบเบราเซอร ความสามารถในการปรบปรง ดแลรกษาเวบไซต เชน การตรวจสอบลงค สรางรายงานแสดงผลการทดสอบการท างาน มฟงกชนในการโอนถายขอมล FTP ขนเครองแมขาย Server ความสามารถในการท า อมเมจ รอลเลอร (Image Roller) หรอรปภาพทสามารถเปลยนแปลงเมอ น าเมาสมาผาน Mouse Over Mouse Out กรณทตองการควบคมค าสง html มฟงกชนใหปอน หรอแกไขรหสค าสง html ดวย html Inspector รวมทงสามารถก าหนดโปรแกรมแกไขเอกสารเวบอนๆได เชน Home Site (for Windows) และ BBEdit (for MAC) ไวดวยกนและความสามารถในการสรางเฟรมอตโนมต เปนตน (สถาบนออกแบบกราฟกอไทยดไซน 2553: 1-5) 2.3.4.2 โปรแกรมแมโครมเดย แฟลช เปนโปรแกรมส าหรบสรางภาพกราฟก ภาพ เคลอนไหว และมลตมเดยบนเวบไซตทสรางจากโปรแกรมแมโครมเดย แฟลช เรยกวา มฟว (Movie) สามารถน าไปใชงานไดรปแบบตางๆ ไดแก (พนจนทร ธนวฒนเสถยร 2551 : 3-6)

Page 26: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

30

1) งานดานแอนเมชน (Animation) เชน แบนเนอร การดอวยพร การตน เปนตน 2) ยสเซอรอนเตอรเฟช (User interfaces) มอยหลายเวบไซตทสรางและออกแบบโดยใชโปรแกรมแมโครมเดย แฟลช เชน เวบไซตภาพยนตร เวบไซตสวนสนก เปนตน 3) เกม (Game) สามารถสรางจากแอนเมชน และแอกชนสครปตของโปรแกรมแมโครมเดย แฟลช 4) การควบคมขอมลผานอนเทอรเนต (Rich Internet applications) เชน คนหาราคาสนคา แคตาลอกสนคา การทดสอบบทเรยน เปนตน ขนตอนการสรางภาพเคลอนไหวหรอมฟว การจดท าภาพเคลอนไหวหรอมฟวอาจมหลายขนตอน ขนอยกบความซบซอนของชนงาน การสรางมฟวเปนการสรางหรอน าองคประกอบตางๆ เขามารวมกน แลวก ากบใหเกดการเคลอนไหวและตอบโตกบผใช จากนนกน าไปเผยแพรในทสด โดยมขนตอนการท างานดงแสดงในภาพท 10 ขนตอนการสรางภาพเคลอนไหว (สธร นวกล 2552 : 15-19)

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

1) การวางโครงเรองชนงาน

2) การจดเตรยมองคประกอบชนงาน

3) การสรางชนงานและทดสอบการท างาน

4) การแปลงไฟลเปนชนงานส าหรบการเผยแพร

Page 27: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

31

2) การจดเตรยมองคประกอบชนงาน เปนการก าหนดวาจะตองเตรยมอะไรบางเพอน ามาประกอบกนเปนชนงาน สามารถวาดภาพกราฟกโดยใชเครองมอในโปรแกรมแมโครมเดย แฟลช หรอสรางภาพจากโปรแกรมกราฟก เชน โปรแกรม Photoshop และโปรแกรม Illustrator แลวน าไปใชในโปรแกรมแมโครมเดย แฟลชกได ถางานทจะสรางเปนมลตมเดยกจะตองเตรยมไฟลเสยงและไฟลภาพยนตรเพอน าเขามาใชในโปรแกรมแมโครมเดย แฟลช 3) การสรางชนงานและทดสอบการท างาน เปนการน าไฟลภาพภาพยนตรและเสยงทไดเตรยมไวมาประกอบกนเปนชนงาน และทดสอบการท างานใหตรงตามวตถประสงค 4) การแปลงไฟลชนงานส าหรบการเผยแพร เปนขนตอนสดทายเปนการพบลช (Publish) ชนงานทสรางเสรจสมบรณเปนไฟลมฟว หรอเปนไฟลในรปแบบทตองการ เพอน าไปเผยแพรตอไป โปรแกรมแมโครมเดย แฟลช สามารถน าไปใชงานได 2 ประเภทดวยกนไดแก งานออนไลน (Online) งานบนเวบไซตทตองดผานระบบอนเทอรเนต และงานออฟไลน (Offline) งานทเปดบนคอมพวเตอรไมตองตอระบบอนเทอรเนต โดยมรายละเอยดดงน (อศวน โอกาดา 2551 : 4-8) งานออนไลน (Online) ประกอบดวยประเภทชนงาน เชน เวบ แบนเนอร เวบ แอน-เมชน เวบ อนทรอดคชน แฟลช เวบไซต เปนตน 1) เวบ แบนเนอร (Web Banner) งานปายโฆษณาบนเวบไซตพฒนาจาก (Gif Animation) ทโหลดชาและคณภาพต าในสมยกอนมาเปน Animation ของโปรแกรม Macromedia flash ทเคลอนไหวตอเนอง มขนาดเลกและยงม Graphic ทสวยงาม 2) เวบ แอนเมชน (Web Animation) สวนประกอบของเวบไซตทเคยใชเปนภาพนง สามารถสอสารและดงดดความสนใจไดมากขนดวยโปรแกรม Macromedia flash 3) เวบ อนทรอดคชน (Web Introduction) การใชภาพเคลอนไหวอธบายบนเวบไซตเปนอกอยางทโปรแกรม Macromedia flash ท าไดดและไดรบความนยมอยางสง 4) แฟลช เวบไซต (Flash Website) โปรแกรม Macromedia flash สามารถใชท าเวบไซตทงกระบวนการไดดวย ไมจ ากดแคเพยง Animation และเนอหาอยางเดยว หากยงรวมถงการเชอมโยงกบฐานขอมลและการสราง Application ทมรปแบบเฉพาะตวอกดวย งานออฟไลน (Offline) ประกอบดวยประเภทชนงาน เชน โปรดค อนทรอดคชน พร-เซนตเตชน แอพพลเคชน เปนตน 1) โปรดค อนทรอดคชน (Product Introduction) งานเปดตวสนคา งานคอนเสรต งานแตงงานทจะตองมการน าเสนอความนาสนใจของสนคาหรอกจกรรมตางๆ การท า Animation อธบายวธการใชหรอแนะน ากจกรรมลกคาดวยโปรแกรม Macromedia flash กเปนทางเลอกใหมทก าลงมาแรง ดวยวธการทสะดวกและประหยดคาใชจายนอยกวางานดานวดทศน

Page 28: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

32

2) พรเซนตเตชน (Presentation, CD Interactive) ทสรางดวยโปรแกรม Macromedia flash สามารถตอบโตกบผใชงานได การสรางงานแบบ Presentation กไมเปนปญหาส าหรบ Macromedia flash อกท งยงมประโยชนในเรองความยดหยนของการเขยนโปรแกรม จงเปดโอกาสใหสรางงาน Interactive แบบจนตนาการกวางไกล โดยไมยดตดอยในโครงรางตายตวเหมอนกบโปรแกรม MS Power Point 3) แอพพลเคชน (Application) เปนการสราง Cartoon บนเวบไซต หรอการท า Music Video รวมถง Animation ทสงไปตามอเมล ในลกษณะของ Electronic Cards งานประเภทเหลานจะใชโปรแกรม Macromedia flash เปนตวเลอกแรกๆ ดวยเหตผลทกลาวมาขางตน Games การพฒนาในสวนของการเขยนโปรแกรมในชวงหลงๆ ท าให Macromedia flash สามารถสรางเกมทมประสทธภาพมากขนเรอยๆ จดเดนของโปรแกรมแมโครมเดย ดรมวพเวอร เปนเครองมอส าหรบใชงานออกแบบกราฟกแอนเมชน และงานดานการพฒนาโปรแกรมแอปพลเคชนทรองรบการโตตอบกบผใชงาน ในสวนของชนงานจะประกอบไปดวยงานแอนเมชน ขอมลวดทศน แอปพลเคชน รปภาพ เสยง เอฟเฟกตพเศษตางๆ และกไฟลทมขนาดเลก จากการศกษาคณสมบตตางๆ ของโปรแกรมแมโครมเดย ดรมวพเวอร และโปรแกรมแมโครมเดยแฟลช พบวา เปนโปรแกรมสรางและพฒนาเวบไซตทใชงานงาย สะดวก ผใชไมจ าเปนตองรและเขาใจภาษา html มาก สนบสนนภาษาไทยไดด มโปรแกรมคนดภายในตวเองท าใหสามารถดผลงานทสรางไดทนท มเครองมอชวยในการบรรจขนเวบไซตทสรางเสรจเขาสตวบรการเวบทใชงานงาย ซงคณสมบตดงกลาวชวยสนบสนนการสรางเวบไซตไดอยางมประสทธภาพ ดงนนผวจยจงเลอกใชโปรแกรมแมโครมเดย ดรมวพเวอร และโปรแกรมแมโครมเดย แฟลช ในการสรางเวบไซตศาลาพมขาวบณฑ มหาวทยาลยสโขทยธรรมาธราช 3. แนวคดเกยวกบความพงพอใจ 3.1 ความหมายของความพงพอใจ ไดมผใหความหมายของความพงพอใจไวหลายทานดวยกนสรปได ดงน ความพงพอใจ หมายถง การแสดงออกทางพฤตกรรมไมสามารถมองเหนเปนรปรางได การทเราจะทราบวาบคคลมความพงพอใจหรอไม สามารถสงเกตโดยการแสดงออกทคอนขางสลบซบซอน และมสงเราทตรงตอความตองการของบคคลจงจะท าใหบคคลเกดความพงพอใจ ดงนนการสรางสงเราจงเปนแรงจงใจของบคคลนนใหเกดความพงพอใจ (กาญจนา อรณสขรจ 2546 : 57) ความพงพอใจ หมายถง ความพอใจ ชอบใจ และมความสขทความตองการหรอเปาหมายทตงใจไวบรรลผลหรอสมหวงนนเอง เชน นกเรยนใชสอคอมพวเตอรชวยสอนสวนใหญกยอมจะมความตองการหรอความคาดหวงวาสอคอมพวเตอรชวยสอนจะสามารถชวยใหตวเองสามารถเขาใจบทเรยนไดด

Page 29: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

33

ยงขนหรอไดผลการเรยนดขนนนเอง ซงสามารถวดไดจากแบบสอบถามวดระดบความพงพอใจหรอผลการสอบ (ราชบณฑตยสถาน 2542 : 775) ความพงพอใจ หมายถง ทศนคตและความพงพอใจในสงหนงสงใด สามารถใชแทนกนได เพราะทงสองค านหมายถง ผลทไดจากการทบคคลเขาไปมสวนรวมในสงนน ทศนคตทางบวกจะแสดงให เหนสภาพความพงพอใจในสงนน และทศนคตดานลบจะแสดงใหเหนสภาพความไมพอใจในสงนน วรม (Vroom 1964 : 99) กลาวโดยสรปไดวา ความพงพอใจ หมายถง ความรสก ความชอบ ความพอใจตอสงใดสง หนง หรอทศนคตในทางทดของบคคลทมตอสงใดสงหนง เมออยในภาวะของการมความสข เมอไดผลส าเรจตามความมงหมาย ตามความตองการตามสงทคาดหวงไว หรอแรงจงใจทตนเองไดต งใจไว ทศนคตและความพงพอใจเปนค าทสามารถใชแทนกนได 3.2 ทฤษฎการใชประโยชนสอและความพงพอใจ (Use and Gratification Theory) ทฤษฎการใชประโยชนและความพงพอใจ หมายถง ทฤษฏทเนนการศกษาโดยใหความส าคญตอผรบสารในฐานะผกระท าการสอสารโดยผรบสารก าหนดตนเองวามความตองการสารอะไร เพอตอบสนองความพงพอใจของตน ดงนนผรบสารจะเปนผเลอกใชสอและเลอกรบสารเพอตอบสนองความตองการตนเอง (กาญจนา แกวเทพ 2545 : 306) ทฤษฎการใชประโยชนและความพงพอใจ หมายถง สภาวะของสงคมและจตใจทมตอความตองการของบคคลน าไปสการคาดคะเนเกยวกบสอและแหลงทมาของสาร การคาดคะเนนน าไปสความแตกตางในการใชสอและพฤตกรรมของแตละคน ยงผลใหเกดความพอใจทไดจากสอและผลอนๆ ทบางครงมไดคาดหมายมากอน (ศภลกษณ หนนภกด 2546 : 40) การใชประโยชนและการไดรบความพงพอใจจากสอมวลชนของบคคลผรบสารวาเปนการศกษาผรบสารเกยวกบสภาวะทางสงคมและจตใจทกอใหเกดความตองการ และความจ าเปนของบคคล และเกดมความคาดหวงจากสอมวลชนและแหลงสารอนๆ แลวน าไปสการเปดรบสอมวลชนในรปแบบตางๆ กน อนกอใหเกดผล คอ การไดรบความพงพอใจตามทตนตองการและผลอนทตามมา ซงอาจไมใชผลทตงเจตนาไวกได ดงแสดงในภาพท 11 แบบจ าลองการสอสารของแคทซ (Katz 1974 อางถงในวรษญา วลมาล 2551: 11)

Page 30: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

34

ภาพท 11 แบบจ าลองการสอสารของแคทซ จากแบบจ าลองขางตน อาจถอไดวาเปนรปแบบหนงของการศกษาบทบาทหนาทของสอ

(Functionalism) แทนทจะตอบค าถามวา สอมบทบาทหนาทตอสงคมอยางไร กเปลยนมาเปนมมมองของปจเจกบคคลวา คนแตละคนใชสอเพอท าหนาทอะไรบาง โดยใหความสนใจตอตวผรบสารใชสาร (Media users) มากกวาตวสาร (Media content) และจะไมคอยนยมเรยกผรบสารวา Audience receive แตมกจะเรยกวา User ซงหมายถงผรบสารเปนฝายกระท าในกระบวนการสอสาร พฤตกรรมของบคคลในการใชสอมวลชนเพอสนองความตองการมดงน (วลเลยม William อางถงใน สราวธ สธรรมาสา และคณะ 2550 : 35-37) 1) การตดตอสอสารกบผอน เพอมเพอน และท าใหไมรสกโดดเดยว โดยการเปดโทรทศนทงไวเพอไมใหเหงา การพดคยกบผอน 2) การตดตามเหตการณ โดยการตดตามเหตการณทอาจมความเกยวของกบตนเอง 3) การเขาใจสงคมและวฒนธรรม เรยนรวาเราเปนสมาชกของสงคมแบบไหน และมวถการด าเนนชวตอยางไร 4) การหลบหลกหรอผอนคลาย โดยหลบหลกจากชวตประจ าวนทนาเบอ และหลกเลยงการคดถงสงทรบกวนจตใจ 5) การสรางเอกลกษณใหแกบคคล โดยการเรยนรเกยวกบตนเองมากขน เพอรสกเชอมนในตนเอง และเขาใจตนเองมากขน 6) การไดรบความพงพอใจโดยทนททนใด คอการไดรบความรสกดๆ เชน ความตนเตน มความสข เปนตน 7) การไดรบความร วธการปฏบต เพอความเขาใจในสวนตาง ๆ 8) การเปนแรงบนดาลใจในการสรางสรรคความคดใหม

สภาวะทางจตและ

สงคมของบคคล

ความตองการ

ความคาดหวง

สอและแหลง ของสาร

ความแตกตางในการใชสอ

ผลทเปนความ พงพอใจจากสอ

ผลอนๆ ทเกดตามมา

Page 31: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

35

ปจจยทท าใหบคคลเลอกรบสารอยางใดอยางหนง มดงตอไปน (วลเบอร ชแรมม Wilbur Schramm อางถงใน มารยา ไชยเศรษฐ 2546 : 24-26) 1) ประสบการณตางกนเปนตวแปรท าใหผรบสารแสวงหาขาวสารทเคยเหนแตกตางกน 2) การประเมนสาร ประโยชนของขาวสาร เนองจากผรบสารจะแสวงหาขาวสารทตองการเพอสนองจดประสงคอยางใดอยางหนง การประเมนสาร ประโยชนของขาวสารชวยใหผรบสารเรยนรวาขาวสารอยางหนงมประโยชนแตกตางจากขาวสารอกอยางหนง จงกอใหเกดพฒนาการและปรบปรงอปนสยและรปแบบการแสวงหาขาวสาร 3) ภมหลงทแตกตาง เนองจากธรรมชาตของมนษยมกจะสนใจสงทตนไมเคยพบเหนมากอน รวมทงสนใจความแตกตางหรอการเปลยนแปลงจากสภาพทเปนอยขณะนน ท าใหมความสนใจเนอหาขาวสารแตกตางกน 4) การศกษาและสถานภาพทางสงคม เปนองคประกอบพนฐานทกอใหเกดประสบการณขนในตวบคคล เปนตวชพฤตกรรมการเลอกรบสารและเนอหาสาร 5) ความสามารถในการรบสาร ทงสภาพรางกายและจตใจของบคคลจะมความสมพนธกบความสามารถในการรบขาวสารของบคคล นอกจากนนสภาพรางกายยงมความสมพนธกบสตปญญาของบคคล การเปลยนแปลงทางอายทสงขน ระยะเวลาทไดรบในการศกษา การเจรญเตบโตทางความคดยอมมความสมพนธทงทางบวกและทางลบตอการโนมนาวใจในการเปดรบสารทแตกตางกน 6) บคลกภาพของผรบสารแตละบคคลเปนตวแปรทมความสมพนธกบการเปดรบขาวสาร ซงมผลตอการเปลยนแปลงทศนคต การโนมนาวใจและพฤตกรรมของผรบสาร 7) อารมณ สภาพทางอารมณของผรบสารแตละคนเปนตวแปรส าคญทท าใหผรบสารเขาใจความหมายของสาร หรออาจเปนอปสรรคตอความเขาใจความหมายของขาวสาร 8) ทศนคต เปนตวแปรทมอยระหวางการรบและการตอบสนองตอขาวสารหรอสงเราตางๆ ดวยการแสดงออกทางพฤตกรรมของผรบสารทมตอขาวสารแตละประเภททพบ

3.3 การวดระดบความพงพอใจ การวดระดบความพงพอใจ ซงสามารถกระท าไดดงน (โยธน คนสนยทธ 2550 : 31) 3.3.1 การใชแบบสอบถาม ซงเปนวธทนยมใชกนอยางแพรหลายวธหนง โดยการขอรอง

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

Page 32: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

36

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

การประเมนความพงพอใจ เครองมอประเภทมาตรวดทศนคต เปนขอความทใชเพอเกบขอมลทางดานจตพสย เชน ความคดเหน ทศนคตตางๆ เปนตน วธหนงทนยมน ามาใชมากคอ วธของลเครต (Likert) การวดทศนคตตามวธนจะก าหนดชวงความรสกของคนออกเปน 5 ชวง หรอ 5 ระดบ ซงมวธการสรางมาตรวดทศนคตตามวธของลเครต ไดดงน (วรษญา วลมาล 2551 : 93-94)

1) ตงจดมงหมายของการศกษา วาตองการศกษาทศนคตของใคร ทมตอสงใด 2) ใหความหมายของทศนคต ตอสงทจะศกษานนใหชดเจน 3) สรางขอความใหครอบคลมคณลกษณะทส าคญๆ ของสงทจะศกษาใหครบถวน 4) ตรวจสอบขอความทสรางขน ซงท าไดโดยผสรางขอความเอง และน าไปใหผเชยวชาญ

ในเรองนนๆ ตรวจสอบ 5) ท าการทดลองขนกอนทจะน าไปใชจรง โดยการน าขอความทไดตรวจสอบแลวไป

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

ตองค านงถงความเหมาะสม ความสะดวก และเปาหมายของการวด จงจะท าใหไดขอมลทมคณภาพและตรงกบความตองการของผส ารวจไดมากทสด 4. งานวจยทเกยวของ กลยาณ สงหดวง (2548 : บทคดยอ) ไดท าการศกษาเรอง การสรางเวบไซตเกยวกบพระบาท สมเดจพระปกเกลาเจาอยหว จากการศกษาท าใหไดเวบไซตเกยวกบพระบาทสมเดจพระปกเกลาเจาอยหว ทประกอบดวยเนอหา 3 สวน คอ พระราชประวต หองสมด และพพธภณฑ โดยน าเสนอในลกษณะของขอความหลายมต และสอหลายมต และเมอสอบถามความพงพอใจตอเวบไซตในดานเนอหา ตวอกษร และการน าเสนอ จากผใชทเปนกลมตวอยางซงประกอบดวย นสต นกศกษา นกวชาการทางประวตศาสตร และบคคลทวไป พบวา ผใชมความพงพอใจตอเวบไซตทกดานในระดบมาก นภาพร ยมสรอย (2546 : บทคดยอ) ไดท าการศกษาเรอง การออกแบบเวบเพจเพอการประชาสมพนธกองบญชาการศกษา ส านกงานต ารวจแหงชาต ผลการศกษาพบวา การประเมนประสทธ- ภาพเวบเพจโดยผเชยวชาญอยในระดบดมาก และความคดเหนของกลมตวอยางในประเดนเนอหา และการออกแบบอยในระดบด ในดานเนอหาสอดคลองกบภาพ ความชดเจนของตวอกษร ภาพชวยสอความหมาย ใหเขาใจเนอหาไดดยงขน ขอมลมความเชอมโยงตอเนองและชดเจน นอกจากนในการน าเสนอมการจดองคประกอบของภาพและขอมลอยในระดบดมาก

Page 33: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

37

เชาวรตน เชาวพลกรง (2548 : บทคดยอ) ไดท าการศกษาเรอง การพฒนาเวบไซตของโรง พยาบาลจตเวชนครราชสมาราชนครนทร ผลการศกษาพบวา เพศหญงใหความสนใจมากกวาเพศชาย และมชวงอายระหวาง 31-40 ป สวนใหญมการศกษาอยในระดบปรญญาตรขอมลพนฐานพบวา สวนใหญมคอมพวเตอรทบาน และสามารถเชอมตออนเทอรเนตไดเขาชมเวบไซตเพราะตองการคนหาขอมลดานสขภาพจต ความพงพอใจสารสนเทศ ดานการออกแบบ ดานขอมลขาวสาร ดานการเขาถงขอมล และดานผลการใหบรการ มความพงพอใจในระดบสง ดานการปฏสมพนธระหวางผใชกบเวบมาสเตอรอยในระดบปานกลาง ขอเสนอแนะในการสรางเวบไซตในความเปนจรงไมจ าเปนตองมทมงานครบทง 7 ต าแหนงกได ใชบคลากรทมความสามารถเพยง 2-3 คน กสามารถสรางเวบไซตใหสวยงามได กญญา วงศร และพลพทกษ พวงมาลา (2544 : บทคดยอ) ไดท าการศกษาเรอง การพฒนาเวบไซตของโรงพยาบาลศรนครนทร คณะทนตแพทย มหาวทยาลยขอนแกน โดยท าการศกษาระบบและรปแบบเวบไซตของโรงพยาบาลศรนครนทร ต งแตอดตจนถงปจจบน รวบรวมขอมลสารสนเทศของโรงพยาบาลจากแผนกตางๆ ทงขอมลขอความ และขอมลรปภาพ เตรยมพรอมส าหรบการพฒนา และไดพฒนาเวบไซตในรปแบบ html ไดสอบถามความคดเหนจากผใชระบบสารสนเทศของโรงพยาบาล ศรนครนทรจากเวบไซตทพฒนาขนมาใหม จ านวน 44 คน ผบรหาร 19 คน และผปฏบตงานในโรงพยาบาล 28 คน ผลการศกษาพบวา มความพงพอใจกบการพฒนาระบบเวบไซตอยในระดบมาก ความคดเหนตอเวบไซตทพฒนาขนมความเหมาะสม รอยละ 81 และความตองการใหบ ารงรกษาและพฒนาเวบไซตตอไปในระดบมากทสด จตรา วชาชาง (2545 : บทคดยอ) ไดท าการศกษาเรอง การออกแบบและพฒนาเวบเพจเพอการสงเสรมสมนไพรไทย ผลการศกษาพบวา ผใชอนเทอรเนตมความคดเหนตอการออกแบบและพฒนา เวบเพจดานเนอหาอยในระดบมากทสด คอเนอหามความสอดคลองกบวตถประสงค มความถกตองและครอบคลมเนอหาตามล าดบ ดานเทคนคการผลต ผใชอนเทอรเนตมความคดเหนตอดานเทคนคการผลตอยในระดบมากทสด คอตวอกษรทใชมความชดเจน รปภาพมความสอดคลองกบเนอหา การเชอมโยงขอความมความถกตองและเหมาะสม ดานโครงสรางของเวบเพจมความสวยงาม ดานการเขาถงขอมล ผใชอนเทอรเนตมความคดเหนตอดานการเขาถงขอมลอยในระดบมากทสด คอ ความรวดเรวในการเขาถงขอมลภายในเวบเพจ และความรวดเรวในการโหลดขอมล และดานประโยชนและคณคาอยในระดบมากทสด คอผใชอนเทอรเนตไดรบความรเพมเตมจากขอมลบนเวบเพจและขอมลทไดรบมประโยชนตอผใช นพรตน รตนพงศผาสข (2545 : บทคดยอ) ไดท าการศกษาเรอง การพฒนาเวบเพจเรอง พนทชมน าบงบอระเพด ผลการการศกษาพบวา ภายหลงการศกษาเวบเพจกลมตวอยางมความรเพมขนอยางมนยส าคญทางสถตทระดบ 0.05 ผลการประเมนความพงพอใจทมตอเวบเพจ กลมตวอยางสวนใหญเหนวาเวบเพจมเนอหา และการใชภาษาในระดบด และมรปแบบการน าเสนอในระดบดมาก ดงนนเวบเพจเรอง พนทชมน าบงบอระเพด จงมความเหมาะสมตอการเพมพนความรความเขาใจเรอง พนทชมน า ส าหรบบคคลทศกษาตงแตระดบปรญญาตรขนไป และสมควรทจะน าไปเผยแพรบนเครอขายอนเทอรเนต

Page 34: เอกสารและงานวิจัยที่เกี่ยวข้องird.stou.ac.th/dbresearch/uploads/29/บทที่ 2.pdf · 5 บทที่ 2. เอกสารและงานวิจัยที่เกี่ยวข้อง

38

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

วงศสร จนทรเงน (2548 : บทคดยอ) ไดท าการศกษาเรอง การพฒนาเวบไซตอทยานแหงชาตในภาคตะวนออกเฉยงเหนอไทย ผลการศกษาพบวา นกศกษาภาควชาการทองเทยวและการโรงแรม มหาวทยาลยมหาสารคาม มความคดเหนโดยรวมอยในระดบด สวนนกศกษาอนๆ บคคลทวไปและอาสาสมคร มความคดเหนโดยรวมในระดบดเชนเดยวกน จากผลการวจยแสดงใหเหนวา กลมเปาหมาย มความคดเหน ดานขอมลทน าเสนอบนเวบไซต ดานการเขาถงขอมล ดานการออกแบบหนาเวบเพจ ดานระบบน าทาง ดานกราฟกและภาพเคลอนไหว ดานตวอกษรและการจดรปแบบขอความ และดานการใชสในเวบเพจอยในระดบดทกดาน สรปไดวาการพฒนาเวบไซตศาลาพมขาวบณฑ มหาวทยาลยสโขทยธรรมาธราช ไดค านงถงองคประกอบตางๆ ในการออกแบบและพฒนาเวบไซต เชน ก าหนดเปาหมายและวางแผน วเคราะหและจดโครงสรางขอมล ออกแบบเวบเพจและเตรยมขอมล ลงมอสรางและทดสอบ เผยแพรและสงเสรมใหเปนทรจก ดแลและปรบปรงอยางตอเนอง เปนตน นอกจากนไดวดความพงพอใจทมตอเวบไซต ผานระบบอนเทอรเนต โดยมขอค าถามทสอดคลองกบงานวจยของนกวชาการทานอนๆ ครอบคลมทง 7 ดานดวยกน ไดแก 1) ดานการออกแบบหนาเวบเพจ 2) ดานระบบน าทาง 3) ดานกราฟกและภาพเคลอนไหว 4) ดานตวอกษรและการจดรปแบบขอความ 5) ดานการใชสในเวบเพจ 6) ดานการเขาถงขอมลในเวบเพจ และ 7) ดานขอมลทน าเสนอบนเวบไซต