77การเรียนการสอนบนเว็บ

3,318 views

Published on

การเรียนการสอนบนเว็บ

Published in: Education, Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
3,318
On SlideShare
0
From Embeds
0
Number of Embeds
9
Actions
Shares
0
Downloads
60
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

77การเรียนการสอนบนเว็บ

  1. 1. การเรียนการสอนบนเว็บ ระบบการเรียนอิเล็กทรอนิกส์ สาขาเทคโนโลยีและสื่อสารการศึกษา มหาวิทยาลัยมหาสารคาม
  2. 2. การจัดการเรียนการสอนโดยใช้เครือข่ายอินเทอร์เน็ต 2 เทคโนโลยีสารสนเทศ 1 การเรียนการสอนผ่านเว็บ 2 การจัดการเรียนการสอนในลักษณะ e-Learning 3 องค์ประกอบของ e-Learning 4 ประเภทของ e-Learning คอร์สแวร์ 5 ระบบบริหารจัดการรายวิชา 6
  3. 3. การจัดการเรียนการสอนโดยใช้เครือข่ายอินเทอร์เน็ต 3 การออกแบบโครงสร้างเว็บไซต์ 8 การออกแบบทางทัศนะ 10 การออกแบบ e-Learning คอร์สแวร์ 7 การออกแบบส่วนนำทาง 9 ฮาร์ดแวร์และซอฟต์แวร์ที่ใช้ในการสร้างบทเรียน 11
  4. 4. 1. การเรียนการสอนผ่านเว็บ <ul><ul><li>2.1 ความหมายการเรียนการสอนผ่านเว็บ </li></ul></ul><ul><ul><li>ราชบัณฑิตสถานได้บัญญัติคำศัพท์ &quot;Web-Based Instruction&quot; ไว้ว่า &quot; การสอนโดยใช้เว็บเป็นฐาน &quot; หรือ &quot; การสอนบนเว็บ &quot; เนื่องจากคำว่า &quot; การสอนบนเว็บ &quot; เป็นคำที่นิยมใช้กันมาก </li></ul></ul><ul><ul><li>สรรรัชต์ ห่อไพศาล (2544) กล่าวว่า “ เป็นการนำเอาระบบอินเทอร์เน็ตมาออกแบบ เพื่อใช้ในการศึกษาการจัดการเรียนการสอนผ่านเว็บ (Web-Based Instruction)” </li></ul></ul>4
  5. 5. การนำเสนอ (Presentation) การสื่อสาร (Communication) การก่อเกิดปฏิสัมพันธ์ การเรียนการสอนผ่านเว็บ จะต้องอาศัยคุณลักษณะของอินเทอร์เน็ต 3 ประการ 5
  6. 6. 2.2 ประโยชน์ของการเรียนการสอนผ่านเว็บ ไม่ต้องเสียค่าใช้จ่ายในการเรียนการสอน เช่น ค่าที่พัก ค่าเดินทาง 6 การเรียนการสอนสามารถเข้าถึงทุกหน่วยงานที่มีอินเทอร์เน็ตติดตั้งอยู่ 1 การเรียนการสอนกระทำได้โดยผู้เข้าเรียนไม่ต้องทิ้งงานประจำเพื่อมาเข้าชั้นเรียน 2 3
  7. 7. ประโยชน์ของการเรียนการสอนผ่านเว็บ การเรียนการสอนกระทำได้ตลอด 24 ชั่วโมง การจัดสอนหรืออบรมมีลักษณะที่ผู้เข้าเรียนเป็นศูนย์กลาง การเรียนรู้เกิดกับผู้เข้าเรียนโดยตรง การเรียนรู้เป็นไปตามความก้าวหน้าของผู้รับการเรียนการสอนเอง 7 4 5 6
  8. 8. 2.3 ประเภทของการเรียนการสอนผ่านเว็บ เว็บรายวิชา (Stand-alone Courses) 8 1 3 เว็บทรัพยากรการศึกษา (Web Pedagogical Resources) 2 เว็บสนับสนุนรายวิชา (Web Supported Courses)
  9. 9. 3. การจัดการเรียนการสอนในลักษณะ e-Learning <ul><li>ความหมายของ e-Learning สามารถแบ่งออกเป็น 2 ลักษณะด้วยกัน ได้แก่ ความหมายโดยทั่วไป และความหมายเฉพาะเจาะจง สำหรับความหมายโดยทั่ว ๆ ไป e-Learning จะครอบคลุมความหมายที่กว้างมาก กล่าวคือ จะหมายถึง การเรียนในลักษณะใดก็ได้ ซึ่งใช้การถ่ายทอดเนื้อหาผ่านทางอุปกรณ์อิเล็กทรอนิกส์ ไม่ว่าจะเป็นคอมพิวเตอร์ เครือข่ายอินเตอร์เน็ต อินทราเน็ต </li></ul>ความหมายของ e-Learning 9
  10. 10. <ul><li>- e-Learning, คอมพิวเตอร์ช่วยสอน (CAI) และการสอนบนเว็บ (WBI) </li></ul><ul><li>ในปัจจุบันมีคาศัพท์ต่าง ๆ ที่เกี่ยวข้องกับการเรียนจากสื่ออิเล็กทรอนิกส์อยู่มากมาย อาทิเช่น คอมพิวเตอร์ช่วยสอน (CAI) </li></ul><ul><li>e-Learning กับ CAI (Computer-Assisted Instruction) </li></ul><ul><li>บทเรียนคอมพิวเตอร์ช่วยสอนหรือ CAI ย่อมาจาก Computer-Assisted Instruction ภาษาไทยเรียกว่า &quot; คอมพิวเตอร์ช่วยสอน &quot; CAI </li></ul><ul><li>e-Learning กับ WBI </li></ul><ul><li>ทั้ง e-Learning และ WBI ต่างก็เป็นผลจากการผสมผสานระหว่างเว็บเทคโนโลยีกับกระบวนการออกแบบการเรียนการสอน เพื่อเพิ่มประสิทธิภาพทางการเรียนรู้และแก้ปัญหาในเรื่องข้อจากัดทางด้านสถานที่และเวลาในการเรียน </li></ul>10
  11. 11. บริบทที่เกี่ยวกับ e-Learning 11 การถ่ายทอดเนื้อหา การนำ e-Learning ไปใช้ประกอบการเรียน ตอบสนองการเรียน มิติการนำ เสนอเนื้อหา มิติการนำไปใช้ใน การเรียนการสอน มิติเกี่ยวกับผู้เรียน
  12. 12. ข้อได้เปรียบของ e-Learning 12 1) e-Learning ช่วยให้การจัดการเรียนการสอนมีประสิทธิภาพมากยิ่งขึ้น 2) e-Learning ช่วยทำให้ผู้สอนสามารถตรวจสอบความก้าวหน้าพฤติกรรมการเรียนของผู้เรียนได้อย่างละเอียดและตลอดเวลา 3) e-Learning ช่วยทำให้ผู้เรียนสามารถควบคุมการเรียนของตนเองได้
  13. 13. ลักษณะสำคัญของ e-Learning e-Learning ที่ดีควรประกอบด้วย 13 ลักษณะสำคัญ 1) Anywhere, Anytime 2) Multimedia 3) Non–linear 4) Interaction 5) Intermediate Response
  14. 14. ข้อพึงระวัง 14 1 ผู้สอนที่นำ e-Learning ไปใช้ในลักษณะของสื่อเสริม โดยไม่มีการปรับเปลี่ยนวิธีการสอนเลย 2 ผู้สอนจะต้องเปลี่ยนจากบทบาทการเป็นผู้ให้ (impart) เนื้อหาแก่ผู้เรียนมาเป็น ผู้ช่วยเหลือ (facilitator) 3 การลงทุนในด้านของ e-Learning ต้องคลอบคลุมถึงการจัดการให้ผู้สอนและผู้เรียนสามารถเข้าถึงเนื้อหา
  15. 15. แนวคิดเกี่ยวกับ e-Learning <ul><li>e-Learning เป็นรูปแบบการเรียนที่เกิดขึ้นเพื่อตอบสนองการเรียน </li></ul><ul><li>ในลักษณะทางไกล (Distance Learning) เพื่อลดปัญหาในด้าน </li></ul><ul><li>ต้นทุน การเรียนการสอนและการอบรม โดยผู้เรียนจะต้องศึกษา </li></ul><ul><li>เนื้อหาจาก e-Learning คอร์สแวร์ (Courseware) ซึงหมายถึงสื่อ </li></ul><ul><li>การสอนทางคอมพิวเตอร์ที่ได้รับการออกแบบและพัฒนาอย่างมี </li></ul><ul><li>ประสิทธิภาพเพื่อใช้ในการนำเสนอเนื้อหา </li></ul>15
  16. 16. ความรู้ ซึ่งแบ่งได้เป็น 3 ลักษณะ เน้นความเป็น มัลติมีเดีย เชิงโต้ตอบ 16 ความรู้ เน้นข้อความ เน้นสื่อประสม อย่างง่าย
  17. 17. 4. องค์ประกอบของ e-Learning 17 เนื้อหา ระบบบริหารจัดการรายวิชา โหมดการติดต่อสื่อสาร แบบฝึกหัด
  18. 18. องค์ประกอบของ e-Learning โฮมเพจ หรือเว็บเพจแรกของเว็บไซต์ หน้าแสดงรายชื่อวิชา เว็บเพจแรกของแต่ละวิชา 18 4.1 เนื้อหา
  19. 19. 4.2 ระบบบริหารจัดการรายวิชา <ul><li>องค์ประกอบที่สำคัญ มากสำหรับ e-Learning ได้แก่ ระบบบริหารจัดการรายวิชา ซึ่งเป็นเสมือนระบบที่รวบรวมเครื่องมือซึ่งออกแบบไว้เพื่อให้ความสะดวกแก่ผู้ใช้ในการจัดการกับการเรียนการสอนออนไลน์นั่นเอง ซึ่งผู้ใช้ในที่นี้อาจแบ่งได้เป็น 3 กลุ่ม ได้แก่ ผู้สอน (instructors) ผู้เรียน (students) และผู้บริหารระบบเครือข่าย (network administrators) </li></ul>19
  20. 20. 4.3 โหมดการติดต่อสื่อสาร (Modes of Communication) 20 ไปรษณีย์ อิเล็กทรอนิกส์ การประชุมทางคอมพิวเตอร์ เครื่องมือที่ e-Learning ควรจัดหาให้ผู้เรียน
  21. 21. 4.4 แบบฝึกหัด / แบบทดสอบ การจัดให้มีแบบฝึกสำหรับผู้เรียน การจัดให้มีแบบทดสอบผู้เรียน แบบฝึกหัด / แบบทดสอบ 21
  22. 22. 5. ประเภทของ e-Learning คอร์สแวร์ <ul><li>1. กระบวนการในการเรียนการสอน </li></ul><ul><li>ถนอมพร เลาหจรัสแสง (2545) ได้กล่าวเกี่ยวกับการออกแบบการเรียนการสอนทางคอมพิวเตอร์ว่าคล้ายกันกับการออกแบบการเรียนการสอนในชั้นเรียนนั่นเอง กล่าวคือ จะต้องประกอบด้วยขั้นตอนต่าง ๆ ซึ่งคอยช่วยผู้เรียนแต่ละคนให้เกิดการเรียนรู้ตามวัตถุประสงค์ที่ได้มีการกำหนดไว้ </li></ul>22
  23. 23. ประเภทของ e-Learning คอร์สแวร์ <ul><li>2. รูปแบบของ e-Learning คอร์สแวร์ </li></ul><ul><li>e-Learning คอร์สแวร์สามารถแบ่งออกคร่าว ๆ ได้เป็น 4 ประเภท ได้แก่ ประเภทเรียงลำดับการนำเสนอ แบบฝึกหัด การทดลองเสมือนจริง และเกม ดังนี้ ( ถนอมพร เลาหจรัสแสง 2545) การเรียงลำดับการนำเสนอ (Presentation Sequence) ความหมาย คอร์สแวร์การเรียงลำดับการนำเสนอ หมายถึงคอร์สแวร์ที่ออกแบบในลักษณะที่ผู้เรียนศึกษาเนื้อหาโดยการอ่าน ฟัง และสังเกต การบรรยาย และ / หรือการสาธิตต่าง ๆ ตามเวลาและจังหวะการเรียนของตน </li></ul><ul><li>เนื้อหาที่เหมาะสม การเรียงลำดับการนำเสนอเหมาะสำหรับการจัดเนื้อหาการบรรยาย (Lecture) ในลักษณะคุณภาพสูงที่มีความคงที่สำหรับผู้เรียนทุกคน </li></ul>23
  24. 24. รูปแบบการเรียนที่เหมาะสม <ul><li>ผู้เรียนรายบุคคลโต้ตอบกับคอร์สแวร์เพื่อศึกษาเนื้อหาในแต่ละหัวข้อของการเรียน โดยผู้เรียนจะได้รับการชี้แจงเกี่ยวกับวัตถุประสงค์ของการเรียน รวมทั้งการแนะนำเกี่ยวกับเนื้อหาที่จะเรียน ผู้เรียนศึกษาเนื้อหาและบทสรุป หลังจากนั้นผู้เรียนทดสอบความรู้ของตนที่ได้ศึกษามา </li></ul>24
  25. 25. คำแนะนำสำหรับการออกแบบ 2) ออกแบบให้ผู้เรียนมีความกระตือรือร้น 3) เลือกใช้สื่อที่หลากหลาย 25 1) ให้ผู้เรียนเป็นผู้ควบคุมการนำเสนอ 4) เชื่อมโยงมากกว่าการเขียน 5) ออกแบบให้อ่านง่าย
  26. 26. แบบฝึกหัด (Drill and Practice) <ul><li>คอร์สแวร์แบบฝึกหัด หมายถึงคอร์สแวร์ที่อนุญาตให้ผู้เรียนฝึกฝนซ้าแล้วซ้าอีกเพื่อประยุกต์ใช้ความรู้ใดความรู้หนึ่ง หรือทักษะใดทักษะหนึ่ง โดยความรู้และทักษะนั้น ๆ จะเป็นความรู้และทักษะขั้นพื้นฐาน เช่น คอร์สแวร์ฝึกการคำนวณอย่างง่าย โครงสร้างของคอร์สแวร์จะคล้ายกับวงจรแบบทดสอบ (testing cycle) นั่นเอง กล่าวคือจะเริ่มด้วยการนำเสนอปัญหาหรือคำถามให้ผู้เรียนตอบ </li></ul>26
  27. 27. รูปแบบการเรียนที่เหมาะสม <ul><li>รูปแบบการเรียนที่เหมาะสม คอร์สแวร์ประเภทแบบฝึกหัดจะเริ่มจากการนำเข้าสู่บทเรียน ซึ่งรวมถึงการต้อนรับผู้เรียนเข้าสู่เนื้อหา และอธิบายวิธีการที่ผู้เรียนต้องปฏิบัติ รวมทั้งวัตถุประสงค์ของการเรียน หลังจากนั้นจะมีการเสนอคำถาม ผู้เรียนจะคอยตอบคำถามและได้รับผลป้อนกลับ หลังจากได้ผลป้อนกลับก็จะมีข้อคำถามนำเสนอต่อไปเรื่อย ๆ จนกระทั่งครบทุกข้อ </li></ul>27
  28. 28. คำแนะนำสำหรับนักออกแบบ <ul><li>สร้างคลังคำถาม </li></ul><ul><li>/ คำตอบ </li></ul>2) จัดให้มีคำถามที่มี ระดับความง่าย – ความยาก คำแนะนำ 28
  29. 29. การทดลองเสมือนจริง (Virtual Lab) <ul><li>ความหมาย การทดลองเสมือนจริง เป็นคอร์สแวร์ประเภทหนึ่งซึ่งเป็นการนำเสนอการจำลองบนหน้าจอ (on-screen simulator) ผู้เรียนสามารถใช้การทดลองเสมือนจริงในการทดสอบสมมติฐานที่ได้ตั้งไว้ รวมทั้งสังเกตผลที่ได้จากการทดสอบ เนื้อหาที่เหมาะสม คอร์สแวร์ในลักษณะการทดลองเสมือนจริง </li></ul>29
  30. 30. คำแนะนำสำหรับนักออกแบบ <ul><li>เน้นในสิ่งที่ต้องการสอน ในการ </li></ul><ul><li>ออกแบบคอร์สแวร์ </li></ul>2) ใช้การทดลองเสมือนจริง ในหลาย ๆ กิจกรรม คำแนะนำ 30
  31. 31. 6. ระบบบริหารจัดการรายวิชา <ul><li>6.1 ความหมายของระบบบริหารจัดการรายวิชา ระบบบริหารจัดการรายวิชาหมายถึงระบบที่ได้รวบรวมเครื่องมือหลาย ๆ ประเภทที่เกี่ยวกับกระบวนการเรียนการสอนออนไลน์เข้าไว้ด้วยกัน โดยมีจุดประสงค์เพื่อช่วยสนับสนุนผู้ใช้ 3 กลุ่ม ได้แก่ ผู้เรียน ผู้สอน และผู้เชี่ยวชาญด้านเทคนิค </li></ul>31
  32. 32. 6.2 ส่วนประกอบหลักของระบบบริหารจัดการรายวิชา <ul><li>6.2.1 ส่วนในการใส่เนื้อหาการบรรยายของผู้สอน (Slots for lecture note) </li></ul><ul><li>6.2.2 กระดานข่าวเพื่อการอภิปราย (Asynchronous bulletin board) </li></ul><ul><li>6.2.3 ห้องสนทนา (Synchronous chat) </li></ul><ul><li>6.2.4 การทดสอบออนไลน์ (Online testing) </li></ul><ul><li>6.2.5 อิเล็กทรอนิกส์เมล์ (Electronics mails) </li></ul><ul><li>6.2.6 การจัดการแฟ้มข้อมูล (File management) </li></ul>32
  33. 33. 6.3 ส่วนประกอบรองของระบบบริหารจัดการรายวิชา <ul><li>6.3.1 ส่วนประกอบพิเศษอื่น (Many other tools) </li></ul><ul><li>6.3.2 ส่วนจัดการการลงทะเบียนของผู้เรียน (Manage student enrollment) </li></ul><ul><li>6.3.3 ส่วนของการเรียกดูและบันทึกคะแนนของผู้เรียนโดยผู้สอน (View and record student score – faculty) </li></ul><ul><li>6.3.4 ส่วนของการเรียกดูคะแนนของผู้เรียนโดยผู้เรียน (View student score – individual student) </li></ul><ul><li>6.3.5 ส่วนของการเรียกดูสถิติการเข้าเรียน (View student progress tracking) </li></ul>33
  34. 34. 7. การออกแบบ e-Learning คอร์สแวร์ <ul><li>7.1 ความหมายของคอร์สแวร์ </li></ul><ul><li>ถนอมพร เลาหจรัสแสง (2545) กล่าวถึงความหมายของคอร์สแวร์ไว้ว่า หมายถึงสื่ออิเล็กทรอนิกส์ ( คอมพิวเตอร์ ) ซึ่งเป็นการแลกเปลี่ยนรูปแบบการนำเสนอบทเรียนจากเอกสารตำราให้อยู่ในรูปของสื่อการเรียนการสอนทางคอมพิวเตอร์ </li></ul><ul><li>7.2 การออกแบบและพัฒนา e-Learning คอร์สแวร์ รูปแบบการเรียนการสอนที่เหมาะสมได้แก่ รูปแบบการออกแบบการเรียนการสอนในลักษณะพัฒนาชุดการเรียนและในลักษณะเชิงระบบเนื่องจากเหตุผลสำคัญคือ เป็นรูปแบบซึ่งเหมาะสำหรับงานซึ่งใช้วิธีการในการออกแบบพัฒนาสื่อขึ้นมาใหม่ </li></ul>34
  35. 35. การออกแบบคอร์สแวร์ e-Learning ประกอบด้วย 7 ขั้น ดังนี้ ขั้นที่ 1 ขั้นเตรียมตัว ขั้นที่ 2 ขั้นเลือกเนื้อหา ขั้นที่ 4 : ขั้นออกแบบหลักสูตร ขั้นที่ 3 : ขั้นการวิเคราะห์หลักสูตร ขั้นที่ 5 : ขั้นการพัฒนาการเรียนการสอน ขั้นที่ 6 : ขั้นการประเมินผล ขั้นที่ 7 : ขั้นบำรุงรักษา 35
  36. 36. 8. การออกแบบโครงสร้างเว็บไซต์ <ul><li>การออกแบบโครงสร้างเว็บไซต์ ผู้ออกแบบเว็บส่วนใหญ่จะมีรูปแบบการสร้างที่แตกต่างกัน โดยทั่วไปจะขึ้นอยู่กับความถนัด และความพอใจของตนเป็นหลัก (Arvanistis, 1997 อ้างจาก ถนอมพร เลาหจรัสแสง 2545) โดยไม่ได้คำนึงถึงหลักในการออกแบบที่ถูกต้อง เท่าที่ควร ลินช์และฮอร์ตัน (Lynch and Horton, 1999 อ้างจากถนอมพร เลาหจรัสแสง 2545) จึงได้เสนอแนวคิดสำหรับการออกแบบเว็บไซต์ ว่า การออกแบบเว็บไซต์ที่ดีควรจะต้องวางโครงสร้างให้มีความสมดุล มีการเชื่อมต่อสัมพันธ์กัน ระหว่างรายการ (Menu) หรือโฮมเพจ กับหน้าเนื้อหาอื่น ๆ </li></ul>36
  37. 37. โครงสร้างของเว็บสรุปออกเป็น 4 รูปแบบใหญ่ ๆ ได้ดังนี้ <ul><li>8.1 เว็บที่มีโครงสร้างแบบเรียงลำดับ (Sequential Structure) </li></ul>37
  38. 38. โครงสร้างของเว็บสรุปออกเป็น 4 รูปแบบใหญ่ ๆ ได้ดังนี้ <ul><li>8.2 เว็บที่มีโครงสร้างแบบลำดับขั้น (Hierarchical Structure) </li></ul>38
  39. 39. โครงสร้างของเว็บสรุปออกเป็น 4 รูปแบบใหญ่ ๆ ได้ดังนี้ <ul><li>8.3 เว็บที่มีโครงสร้างแบบตาราง (Grid Structure) </li></ul>39
  40. 40. โครงสร้างของเว็บสรุปออกเป็น 4 รูปแบบใหญ่ ๆ ได้ดังนี้ <ul><li>8.4 เว็บที่มีโครงสร้างแบบใยแมงมุม (Web Structure) </li></ul>40
  41. 41. 9. การออกแบบส่วนนำทาง <ul><li>9.1 การนำทาง (Navigation) </li></ul><ul><li>9.2 การใช้ไอคอนและเมนูเพื่อการนำทาง </li></ul><ul><li>9.3 พฤติกรรมการใช้เว็บกับการออกแบบเว็บไซต์ </li></ul><ul><li>9.4 หลักการในการออกแบบส่วนต่อประสานกับผู้ใช้ </li></ul>41
  42. 42. 10. การออกแบบทางทัศนะ <ul><li>10.1 ความหมายของการออกแบบทางทัศนะ การออกแบบทางทัศนะ (Visual Design) หมายถึง การออกแบบภาพและสีสันบนหน้าจอ ซึ่งคำว่าภาพในที่นี้ไม่จำกัดเฉพาะภาพถ่าย ภาพ กราฟิก 3D แอนิเมชัน หรือ วีดิทัศน์ เท่านั้นแต่รวมถึงข้อความ แผนที่ กราฟ ฯลฯ ที่ปรากฏบนหน้าเว็บด้วย ( ถนอมพร เลาหจรัสแสง 2545) </li></ul>42
  43. 43. 10. การออกแบบทางทัศนะ <ul><li>10.2 หลักการในการออกแบบทางทัศนะ ถนอมพร เลาหจรัสแสง (2545) กล่าวถึงหลักการในการออกแบบทางทัศนะไว้ว่า การออกแบบทางทัศนะนั้น หลักการที่ดูเหมือนจะธรรมดา ๆ แต่มักจะถูกมองข้าม ได้แก่ หลักการในการสร้างสมดุล ผู้ออกแบบต้องพิจารณาให้รอบคอบในด้านของการสร้างความสมดุลบนเว็บไซต์ของตนใน 3 มิติด้วยกัน ได้แก่ 1) มิติของเป้าหมายของเว็บไซต์ 2) มิติด้านความต้องการของผู้ใช้ ( ผู้เรียน ) และ 3) มิติทางด้านข้อจากัดด้านฮาร์ดแวร์ ตัวอย่างเช่น สมมติว่าเป้าหมายของเว็บไซต์ของเรา ได้แก่ การออกแบบพัฒนาเว็บไซต์เพื่อการเรียนการสอน </li></ul>43
  44. 44. 10. การออกแบบทางทัศนะ <ul><li>10.3 ความหมายของ Functional Areas Functional Areas คือ การแบ่งส่วนติดต่อระหว่างโปรแกรมกับผู้ใช้ออกเป็นส่วน ๆ อย่างชัดเจนตามหน้าที่การทางานของมัน เพื่อให้ง่ายต่อการทาความเข้าใจของผู้ใช้ ( ถนอมพร เลาหจรัสแสง 2545) </li></ul>44
  45. 45. 10. การออกแบบทางทัศนะ <ul><li>10.4 การออกแบบ Functional Areas </li></ul><ul><li>ถนอมพร เลาหจรัสแสง (2545) ได้เสนอวิธีการออกแบบ Functional area ไว้ดังนี้ </li></ul><ul><li>10.4.1 ผู้ออกแบบควรออกแบบชื่อหัวข้อบริเวณส่วนบนของหน้าจอ </li></ul><ul><li>10.4.2 การออกแบบ Functional Areas ที่ดีนั้นต้องเน้นในเรื่องของความชัดเจนและความสหม่ำเสมอ (Clarity and Consistency) </li></ul>45
  46. 46. 10. การออกแบบทางทัศนะ <ul><li>10.5 การออกแบบเว็บเพจอย่างสมดุล </li></ul><ul><li>ในการออกแบบเว็บเพจนั้นต้องคำนึงถึงความสมดุลระหว่างการใช้ </li></ul><ul><li>ภาพกราฟิกและข้อความเพื่อให้ผู้ใช้สามารถเปิดเว็บเพจได้รวดเร็วไม่ต้อง </li></ul><ul><li>เสียเวลาในการรอมากเกินไป นอกจากนี้ให้คำนึงอยู่เสมอว่าพื้นที่บนหน้าจอ </li></ul><ul><li>คอมพิวเตอร์นั้นเล็กกว่าหน้าที่พิมพ์ออกมาผู้ออกแบบควรคำนึงว่าผู้เรียน </li></ul><ul><li>สามารถเปิดดูเว็บเพจได้พอดี </li></ul>46
  47. 47. 10. การออกแบบทางทัศนะ <ul><li>10.6 การออกแบบกริด (grid) ในการออกแบบเว็บเพจ ความสหม่ำเสมอเป็นสิ่งสำคัญ เพราะผู้เรียนสามารถคาดเดาว่าจะทำสิ่งใดได้อย่างง่ายดาย การออกแบบกริดเป็นสิ่งสำคัญสาหรับการออกแบบสิ่งพิมพ์ที่ดีเช่นใด การออกแบบกริดก็สาคัญสำหรับการออกแบบเว็บเพจที่ดีเช่นนั้น กริดมีลักษณะเป็นเส้นตรงในแนวตั้งและแนวนอน กริดเป็นเสมือนโครงของเว็บเพจซึ่งจะช่วยให้เว็บเพจในเว็บไซต์เดียวกันมีความเป็นระเบียบและมีความคงที่ </li></ul>47
  48. 48. 10. การออกแบบทางทัศนะ <ul><li>10.7 หลักการสำหรับการออกแบบกราฟิกบนเว็บเพจ ในการออกแบบต้อง </li></ul><ul><li>คำนึงถึงปัจจัย 2 ข้อ คือ ( ถนอมพร เลาหจรัสแสง 2545) 1. ขนาดของ </li></ul><ul><li>จอคอมพิวเตอร์ที่ใช้ในการแสดงผลซึ่งมีความละเอียดที่ 800x600 pixels 2) </li></ul><ul><li>หากต้องการให้ผู้ใช้พิมพ์หน้าจอลงบนกระดาษในการออกแบบต้องให้อยู่ใน </li></ul><ul><li>พื้นที่ 595x842 pixels ซึ่งพื้นที่ในการแสดงผลที่มากที่สุดในการออกแบบ </li></ul><ul><li>กราฟิก คือ 760x420 pixels </li></ul>48
  49. 49. 10. การออกแบบทางทัศนะ <ul><li>10.8 การออกแบบตัวเพื่อการอ่านที่ชัดเจน (Readability) ข้อควรพิจารณาที่สำคัญที่สุดในการออกแบบและพัฒนาส่วนต่อประสานและการออกแบบทางทัศนะ ได้แก่ ความสามารถในการอ่านเนื้อหาของผู้เรียน (readability) เพราะการจัดเนื้อหาบทเรียนให้แก่ผู้เรียนเป็นประเด็นหนึ่ง แต่การชักชวนให้ผู้เรียนอ่านเนื้อหาบทเรียนนั้น ๆ เป็นอีกประเด็นหนึ่ง ดังนั้นจึงเป็นสิ่งสำคัญมากสำหรับเว็บไซต์เพื่อการเรียนการสอนที่จะต้องออกแบบให้อยู่ในรูปที่อ่านได้ง่ายและชัดเจนที่สุดเท่าที่จะทำได้ ( ถนอมพร เลาหจรัสแสง 2545) </li></ul>49
  50. 50. 10. การออกแบบทางทัศนะ <ul><li>10.9 เทคนิคในการเพิ่มศักยภาพในการอ่านของผู้เรียน มีเทคนิคบาง </li></ul><ul><li>ประการที่มีส่วนช่วยในการเพิ่มศักยภาพในการอ่านของผู้เรียน เทคนิค </li></ul><ul><li>เหล่านั้น ได้แก่ ( ถนอมพร เลาหจรัสแสง 2545) </li></ul><ul><li>10.9.1 ตัวพิมพ์ (Typeface) </li></ul><ul><li>10.9.2 ฟอนต์และตัวอักษรใหญ่ - เล็ก (Font and Case) </li></ul><ul><li>10.9.3 การจัดความ (Justification) </li></ul><ul><li>10.9.4 ความยาวของข้อความแต่ละบรรทัด (Line Length) </li></ul><ul><li>10.9.5 ความตัดกัน (Contrast) </li></ul><ul><li>10.9.6 การเบี่ยงเบนสมาธิของผู้เรียน (Distractions) </li></ul>50
  51. 51. 10. การออกแบบทางทัศนะ <ul><li>10.10 เทคนิคในการจูงใจผู้เรียน </li></ul><ul><li>นอกจากเทคนิคในการออกแบบเพื่อเพิ่มประสิทธิภาพในการอ่านของผู้เรียน </li></ul><ul><li>ในการออกแบบทางทัศนะยังมีเทคนิคบางประการซึ่งอาจช่วยจูงใจผู้เรียนให้ </li></ul><ul><li>ต้องการเข้ามาเรียนในเว็บไซต์มากขึ้น เทคนิคเหล่านั้นได้แก่ ( ถนอมพร </li></ul><ul><li>เลาหจรัสแสง 2545) </li></ul><ul><li>10.10.1 พื้นที่ว่าง (Blank Space) </li></ul><ul><li>10.10.2 สี (Colors) </li></ul><ul><li>10.10.3 การย่อยเนื้อหา (Chunking) </li></ul>51
  52. 52. เทคนิคในการออกแบบ ( ต่อ ) <ul><li>10.10.4 กราฟิก (Graphic) </li></ul><ul><li>10.10.5 ลำดับเลข (Numbering) </li></ul><ul><li>10.10.6 ตาราง (Table) </li></ul><ul><li>10.10.7 รูปแบบการมอง (Viewing Pattern) </li></ul><ul><li>10.10.8 จำนวนส่วนประกอบ (Number of Elements) </li></ul><ul><li>10.10.9 เสียง (Audio) </li></ul><ul><li>10.10.10 วีดิทัศน์ (Video) </li></ul>52
  53. 53. 11. ฮาร์ดแวร์และซอฟต์แวร์ที่ใช้ในการสร้างบทเรียน <ul><li>ในการสร้างบทเรียนอิเล็กทรอนิกส์ ต้องมีคอมพิวเตอร์ที่มีประสิทธิภาพสูง </li></ul><ul><li>เพื่อความสะดวกในการสร้างบทเรียนที่ประกอบด้วยข้อความตัวอักษร ภาพ </li></ul><ul><li>ภาพเคลื่อนไหว และงานกราฟิกอื่น ๆ นอกจากนี้ยังต้องมีการเชื่อมต่อ </li></ul><ul><li>เครือข่ายอินเทอร์เน็ต ซึ่งจะทำให้สามารถตรวจสอบผลการทางานของ </li></ul><ul><li>บทเรียนที่สร้างขึ้น เพราะบทเรียนที่สร้างขึ้นอาจทางานได้ดีเมื่อข้อมูลยังอยู่ </li></ul><ul><li>ในเครื่องคอมพิวเตอร์ แต่เมื่อนาข้อมูลขึ้นสู่เครือข่ายอินเทอร์เน็ต (upload) </li></ul><ul><li>อาจมีปัญหาก็ได้ จึงต้องมีการตรวจสอบตลอดเวลา ดังนั้นจึงต้องมี </li></ul><ul><li>ฮาร์ดแวร์และซอฟต์แวร์พื้นฐานที่จาเป็นดังนี้ </li></ul>53
  54. 54. 11.1 ฮาร์ดแวร์ (Hardware) <ul><li>11.1.1 ระบบบริหารจัดการ ( Course Management System : CMS ) </li></ul><ul><li>1 ) เซอร์ฟเวอร์ ( Server ) </li></ul><ul><li>2) คอมพิวเตอร์ปฏิบัติงาน </li></ul><ul><li>11.1.2 คอมพิวเตอร์เครือข่าย ( client network ) </li></ul><ul><li>1) คอมพิวเตอร์สาหรับการเรียนการสอน </li></ul><ul><li>2) คอมพิวเตอร์สาหรับการสืบค้นข้อมูลนอกเวลาเรียน </li></ul><ul><li>3) คอมพิวเตอร์ส่วนบุคคลที่ใช้ตามบ้านเรือน ( Home used ) และศูนย์บริการต่าง ๆ สาหรับการสืบค้นข้อมูลนอกเวลาเรียน </li></ul>54
  55. 55. 11.2 ซอฟต์แวร์ (Software) <ul><li>ในการสร้างบทเรียนบนเครือข่ายที่ผู้วิจัยได้สร้างขึ้นนี้ ได้ใช้ซอฟต์แวร์ </li></ul><ul><li>หลายชนิด ซึ่งตอบสนองานแต่ละประเภท ดังนี้ </li></ul><ul><li>11.2.1 ซอฟต์แวร์สาหรับสร้างเว็บเพจ เช่น FrontPage, Namo </li></ul><ul><li>WebEditor, Macromedia Dreamweaver เป็นต้น </li></ul><ul><li>11.2.2 ซอฟต์แวร์สร้างงานกราฟิก เช่น Adobe Photoshop, Adobe </li></ul><ul><li>Illustrator, Image Ready , Macromedia Flash, ChemDraw เป็นต้น </li></ul><ul><li>11.2.3 ซอฟต์แวร์สร้างฐานข้อมูล เช่น Microsoft Access </li></ul><ul><li>11.2.4 ซอฟต์แวร์สนับสนุนอื่น ๆ เช่น Microsoft Word, Excel, Windows </li></ul><ul><li>movie maker เป็นต้น </li></ul>55
  56. 56. ตอนที่ 2 ทฤษฎีการเรียนรู้ของมนุษย์ 1. ทฤษฎีพฤติกรรมนิยม 2. ทฤษฎีปัญญานิยม 3. ทฤษฎีโครงสร้างความรู้ 4. ทฤษฎีความยืดหยุ่นทางปัญญา 56
  57. 57. สาขาเทคโนโลยีและสื่อสารการศึกษา มหาวิทยาลัยมหาสารคาม Thank You ! 57
  58. 58. แบบฝึกหัดท้ายบท <ul><li>1. จงอธิบายความหมายของการเรียนการสอนผ่านเว็บมาพอเข้าใจ </li></ul><ul><li>2. จงบอกลักษณะสำคัญของ e-Learning ที่ดี ควรจะประกอบด้วย </li></ul><ul><li>ลักษณะสำคัญ อะไรบ้าง </li></ul><ul><li>3. เมื่อนิสิตเรียนเรื่อง e-Learning แล้ว นิสิตได้อะไรบ้างจงอธิบาย </li></ul>

×