Important Announcement
PubHTML5 Scheduled Server Maintenance on (GMT) Sunday, June 26th, 2:00 am - 8:00 am.
PubHTML5 site will be inoperative during the times indicated!

Home Explore ชุดการสอน รายวิชา การพัฒนาเว็บไซต์ทางธุรกิจ รหัสวิชา 30204-2103

ชุดการสอน รายวิชา การพัฒนาเว็บไซต์ทางธุรกิจ รหัสวิชา 30204-2103

Published by weratham thesprasit, 2020-12-29 07:19:10

Description: รหัสวิชา 30204-2103 ชื่อวิชา การพัฒนาเว็บไซต์ทางธุรกิจ
จุดประสงค์รายวิชา
1. เข้าใจเกี่ยวกบการออกแบบ พัฒนาเว็บไซต์ในงานธุรกิจ
2. สามารถประยุกต์ใช้โปรแกรมสร้างเว็บไซต์ในงานธุรกิจ
3. มีเจตคติและกิจนิสัยที่ดีในการปฏิบัติงานด้วยความรับผิดชอบ ซื่อสัตย์ ละเอียด รอบคอบสมรรถนะรายวิชา
1. แสดงความรู้เกี่ยวกบการออกแบบเพื่อพัฒนาเว็บไซต์
2. สามารถพัฒนาเว็บไซต์ทางธุรกิจ คำอธิบายรายวิชา
ศึกษาและปฏิบัติเกี่ยวกบพื้นฐานและการทำงานของบริการเว็บบนระบบอินเทอร์เน็ต (World Wide Web)การพัฒนาเว็บไซต์แบบ Dynamic ด้วยโปรแกรมพัฒนาเว็บด้านการจัดการเนื้อหา (CMS) โปรแกรมสำเร็จรูปหรือโปรแกรมพัฒนาเว็บอื่น ๆ การติดตั้ง การบำรุงรักษาระบบ ติดต่อกบฐานข้อมูลและจัดทำคู่มือ

Search

Read the Text Version

Page | 1 ชุดการสอน วชิ า การพฒั นาเวบ็ ไซตท์ างธรุ กจิ (Website Development in Business) รหสั วิชา 30204 - 2103 หลักสูตรประกาศนยี บัตรวิชาชีพชนั้ สูง (ปวส.) พทุ ธศกั ราช 2563 ชดุ การสอนที่ 1 เรอื่ ง พื้นฐานการพฒั นาเว็บไซต์ทางธรุ กจิ จดั ทำโดย นายวีรธรรม เทศประสิทธ์ิ ครู คศ.1 แผนก/สาขาวิชา เทคโนโลยธี ุรกิจดจิ ทิ ลั วิทยาลัยเทคนิคสกลนคร สำนกั งานคณะกรรมการการอาชีวศกึ ษา กระทรวงศึกษาธกิ าร

ห น้ า | 2 ชุดการสอน วชิ า การพฒั นาเวบ็ ไซตท์ างธรุ กจิ (Website Development in Business) รหสั วิชา 30204 - 2103 หลักสูตรประกาศนยี บัตรวิชาชีพชนั้ สูง (ปวส.) พทุ ธศกั ราช 2563 ชดุ การสอนที่ 1 เรอื่ ง พื้นฐานการพฒั นาเว็บไซต์ทางธุรกจิ จดั ทำโดย นายวีรธรรม เทศประสิทธ์ิ ครู คศ.1 แผนก/สาขาวิชา เทคโนโลยธี ุรกิจดจิ ทิ ลั วิทยาลัยเทคนิคสกลนคร สำนกั งานคณะกรรมการการอาชีวศกึ ษา กระทรวงศึกษาธกิ าร

ห น้ า | 3

ห น้ า | 4

ห น้ า | 5 คำนำ ชุดการสอนวิชาการพัฒนาเว็บไวต์ทางธุรกิจ รหัส 30204 - 2103 หลักสูตรประกาศนียบัตร วิชาชีพ (ปวส.) พุทธศักราช 2563 สำนักงานคณะกรรมการการอาชีวศึกษา กระทรวงศึกษาธิการ จัดทำ ขึ้นเพ่ือใชเ้ ปน็ ชดุ การสอนสำหรับครูผสู้ อนและผูเ้ รยี น สาขาวิชาเทคโนโลยธี รุ กิจดิจิทลั ซ่ึงไดม้ ีการวิเคราะห์ สาระการเรียนรู้ ให้สอดคล้องกับจุดประสงค์รายวิชา สมรรถนะรายวิชา และคำอธิบายรายวิชาของ หลักสูตร มีจำนวนทั้งหมด 10 ชุด ได้แก่ พื้นฐานการพัฒนาเว็บไซต์ทางธุรกิจ การพัฒนาเว็บไซต์ด้วย โปรแกรม Adobe Dreamweaver CC2017 การจัดรูปแบบการแสดงผลเอกสารเว็บไซต์ หลักการ ออกแบบกราฟกิ สำหรับเวบ็ ไซต์ การจัดการตารางออกแบบหนา้ เวบ็ เพจ็ การเช่อื มโยงหนา้ เพ็จด้วย Hyper Link การออกแบบหน้าเว็บเพ็จลักษณะ Responsive Web Design การออกแบบและพัฒนาเว็บไซตแ์ อ พลิเคช่นั ด้วย PHP กรณศี ึกษาเว็บไซตข์ ายสินค้าออนไลน์ การเผยแพรเ่ วบ็ ไซตบ์ นอนิ เทอร์เนต็ ชดุ การสอนชุดนี้เปน็ ชุดการสอนที่ 1 เร่ือง พื้นฐานการพัฒนาเว็บไซต์ทางธุรกิจเนื้อหาสาระการ เรยี นรู้ ภายในชดุ การสอนน้ี ประกอบดว้ ย คูม่ อื ครู โครงการสอน แผนการจัดการเรยี นรู้ แบบทดสอบก่อน เรียน เอกสารประกอบการเรียน เรื่อง พื้นฐานการพัฒนาเว็บไซต์ทางธุรกิจ ความรู้เกี่ยวกับเว็บไซต์ ความรหู้ ลกั การออกแบบเว็บไซต์ สว่ นประกอบของเว็บไซต์ การเลือกใช้สี รปู แบบไฟลท์ ่เี หมาะสมสำหรับ การพัฒนาเวบ็ ไซต์ ภาษาทเี่ หมาะสมในการพฒั นาเวบ็ ไซต์ รูปแบบของเวบ็ ไซตแ์ บบชัก แบบฝกึ หดั ใบงาน แบบประเมนิ ผลการปฏิบัตงิ าน บรรณานกุ รม แบบทดสอบหลงั เรียน คำแนะนำการใชส้ ่ือ ตวั อยา่ งสอ่ื และ ภาคผนวก เฉลยแบบฝึกหัด เฉลยแบบทดสอบก่อนเรียน-หลงั เรียน และแบบประเมินกิจกรรมรายบุคคล กิจกรรมกลุ่มและแบบประเมินคณุ ธรรม จรยิ ธรรมและคุณลักษณะอนั พงึ ประสงค์ หวังเป็นอย่างยิ่งวา่ ชุดการสอนที่ 1 พื้นฐานการพัฒนาเวบ็ ไซต์ทางธุรกจิ การพัฒนาเว็บไซตท์ าง ธุรกิจ ที่ผู้จัดทำเรียบเรียงจัดทำขึ้นนั้น จะเป็นประโยชน์ต่อครูผู้สอนและผู้เรียนในวิชานี้ และนำไปเป็น แบบอย่างในการจดั ทำชุดการสอนวชิ าอื่นต่อไป หากมีข้อเสนอแนะใดๆ ผเู้ รยี บเรียงนอ้ มรบั ด้วยความยินดี ยงิ่ ลงชื่อ (นายวีรธรรม เทศประสิทธิ์) ตำแหน่ง ครู คศ.1

ห น้ า | 6 สารบญั เรอ่ื ง หน้า คำนำ..................................................................................................................................................... 5 สารบัญ.................................................................................................................................................. 6 รายละเอยี ดของหลกั สูตรรายวชิ า.......................................................................................................... 7 ตารางท่ี 1 วเิ คราะหห์ ลกั สูตรและระดับความสำคัญของหนว่ ยการเรียนรู้............................................ 8 ตารางท่ี 2 วิเคราะหห์ น่วยการเรียนรู้และเวลาท่ใี ช้ในการจดั การเรยี นรู้............................................... 9 ตารางที่ 3 วิเคราะห์ หวั ขอ้ หลัก/หัวข้อรอง/หัวขอ้ ย่อยและเวลาจัดการเรียนรู้.................................... 10 ตารางที่ 4 วิเคราะห์ จุดประสงค์เชิงพฤตกิ รรมกับหวั ขอ้ การเรยี นรู้และระดับพฤติกรรมท่ตี ้องการ..... 14 ค่มู ือครูชุดการสอนท่ี 1 เรอ่ื ง พืน้ ฐานการพัฒนาเว็บไซต์ทางธุรกจิ .................................................... 24 โครงการสอนหนว่ ยท่ี 1 เรอื่ ง พนื้ ฐานการพฒั นาเวบ็ ไซตท์ างธุรกิจ.................................................... 31 แผนการจดั การเรยี นรู้หนว่ ยที่ 1 เร่อื ง พื้นฐานการพฒั นาเว็บไซตท์ างธุรกจิ ....................................... 33 เอกสารประกอบการเรียนหนว่ ยท่ี 1 เรอ่ื ง พนื้ ฐานการพฒั นาเว็บไซต์ทางธุรกิจ................................ 38 บรรณานกุ รม……………………………………………………………………………………………………………………….. 54 ขอ้ แนะนำในการเตรยี มส่อื และการใชส้ ่ือการสอน…………………………………………………………………..… 52 ตวั อยา่ งส่อื PowerPoint หน่วยที่ 1 เร่อื ง พนื้ ฐานการพฒั นาเว็บไซต์ทางธุรกิจ………………………….. 53 ภาคผนวก…………………………………………………………………………………………………………………….……… 55 แบบทดสอบก่อนเรยี นหนว่ ยท่ี 1 เรื่อง พื้นฐานการพัฒนาเวบ็ ไซตท์ างธรุ กิจ…………………… 42 ใบความรู้ที่ 1 เรื่อง พื้นฐานการพฒั นาเวบ็ ไซต์ทางธรุ กจิ ……………………………………………… 43 แบบทดสอบท้ายหน่วยท่ี 1 เรอ่ื ง พื้นฐานการพัฒนาเวบ็ ไซตท์ างธุรกจิ ………..………………… 45 ใบสั่งงานท่ี 1 เร่ือง พ้นื ฐานการพฒั นาเวบ็ ไซตท์ างธุรกิจ…………………………….………………… 47 ใบลำดับขน้ั ตอนการปฏบิ ัตงิ าน ……………………………………………………………….………………… 49 เฉลยแบบทดสอบท้ายหน่วยท่ี 1 เร่อื ง พน้ื ฐานการพฒั นาเว็บไซต์ทางธุรกิจ........................ 56 เฉลยแบบทดสอบหลงั เรยี นหน่วยท่ี 1 เรอื่ ง พื้นฐานการพฒั นาเว็บไซต์ทางธุรกิจ................ 57 แบบสงั เกตพฤติกรรมการเรียนรู้รายบคุ คล............................................................................ 58 แบบสังเกตพฤตกิ รรมการเขา้ ร่วมกจิ กรรมกลุ่ม...................................................................... 59 แบบประเมนิ การนำเสนอผลงานรายบุคคล............................................................................ 60 แบบประเมินคุณธรรม จรยิ ธรรม คา่ นิยม และคุณลกั ษณะอนั พึงประสงค์............................ 61

ห น้ า | 7 รายละเอยี ดของหลกั สตู รรายวิชา หลกั สตู ร ประกาศนียบตั รวชิ าชีพชน้ั สูง พทุ ธศักราช 2563 ประเภทวชิ บรหิ ารธรุ กิจ รหสั วชิ า 30204-2103 ชื่อวิชา การพฒั นาเว็บไซตท์ างธรุ กจิ ทฤษฎี 2 ชั่วโมง/สปั ดาห์ ปฏบิ ัติ 2 ชัว่ โมง/สปั ดาห์ จำนวน 3 หน่วยกติ จุดประสงคร์ ายวชิ า 1. เขา้ ใจเกีย่ วกบการออกแบบ พัฒนาเวบ็ ไซต์ในงานธรุ กิจ 2. สามารถประยุกต์ใชโ้ ปรแกรมสร้างเวบ็ ไซต์ในงานธุรกิจ 3. มีเจตคตแิ ละกจิ นิสยั ทดี่ ใี นการปฏิบัติงานดว้ ยความรับผดิ ชอบ ซื่อสตั ย์ ละเอยี ด รอบคอบ สมรรถนะรายวิชา 1. แสดงความรู้เกีย่ วกบการออกแบบเพอ่ื พฒั นาเวบ็ ไซต์ 2. สามารถพฒั นาเว็บไซตท์ างธุรกิจ คำอธิบายรายวิชา ศึกษาและปฏบิ ัติเก่ียวกบพื้นฐานและการทำงานของบริการเว็บบนระบบอนิ เทอร์เนต็ (World Wide Web)การพฒั นาเว็บไซต์แบบ Dynamic ด้วยโปรแกรมพฒั นาเว็บด้านการจดั การเน้อื หา (CMS) โปรแกรมสำเรจ็ รูปหรือโปรแกรมพัฒนาเว็บอื่น ๆ การตดิ ตัง้ การบำรงุ รกั ษาระบบ ติดตอ่ กบฐานขอ้ มูล และจัดทำคมู่ อื

ห น้ า | 8 ตารางที่ 1. วเิ คราะหห์ ลกั สูตรและระดับความสำคญั ของหน่วยการเรยี นรู้ รหัสวิชา 30204-2103ช่อื วชิ า การพัฒนาเวบ็ ไซตท์ างธุรกจิ จำนวน 3 หน่วยกิต ทฤษฎี 2 ชั่วโมง/สปั ดาห์ ปฏบิ ัติ 2 ช่ัวโมง/สปั ดาห์ พุทธิพิสยั ทกั ษะพสิ ัย จติ พิสยั พฤติกรรม ความจำ ความเ ้ขาใจ นำไปใช้ วิเคราะ ์ห ัสงเคราะ ์ห ประเมินค่า การเลียนแบบ ทำตามแบบ ความ ูถก ้ตองแม่นยำ กระทำ ่ตอเนื่องผสมผสาน กระทำเคย ิชน อัตโน ัม ิต การ ัรบ ู้ร การตอบสนอง การส ้รางคุณค่าอัตโน ัม ิต การ ัจดระเ ีบยบ การส ้รางลักษณะ ินสัย รวม คิดเ ็ปน ้รอยละ ลำ ัดบความสำคัญ จำนวน ่ัชวโมง ชอื่ หนว่ ย น้ำหนัก 10 10 10 10 10 10 10 10 10 10 10 10 10 10 10 10 100 - พนื้ ฐานการพัฒนาเวบ็ ไซตท์ าง 44- 5- 4 ธุรกิจ 3 6 3 4 5 -ตารา 6- 25 6.68 9 566 6- การพัฒนาเว็บไซตด์ ้วยโปรแกรม 556 58 4 556 69 Adobe Dreamweaver 457 -8 31 8.29 8 CC2017 358 458 -8 8 558 5- การจดั รูปแบบการแสดงผล 688 6 10 38 10.16 6 558 5- เอกสารเวบ็ ไซต์ 465 4 หลักการออกแบบกราฟิกสำหรับ 48 12.83 3 เว็บไซต์ 667 4 การจดั การตารางออกแบบหน้า 667 50 13.37 2 เวบ็ เพจ็ 4 การเชื่อมโยงหนา้ เพจ็ ดว้ ย 558 42 11.23 5 Hyper Link 8 การออกแบบหนา้ เวบ็ เพจ็ 43 11.50 4 ลักษณะ Responsive Web 558 8 Design 35 9.36 7 การออกแบบและพัฒนาเว็บไซต์ 345 24 แอพลิเคช่ัน ด้วย PHP 62 16.58 1 กรณศี ึกษาเวบ็ ไซต์ขายสนิ คา้ 6 8 10 4 ออนไลน์ 35 8.56 7 การเผยแพรเ่ วบ็ ไซต์บน 345 อินเทอร์เนต็ ลำดบั ความสำคญั 321 321 12 409 100 72

ห น้ า | 9 ตารางท่ี 2. วิเคราะหห์ น่วยการเรียนรู้และเวลาที่ใชใ้ นการจดั การเรียนรู้ รหัสวชิ า 30204-2103ช่อื วิชา การพฒั นาเว็บไซต์ทางธุรกจิ ทฤษฎี 2 ช่วั โมง/สัปดาห์ ปฏบิ ัติ 2 ช่ัวโมง/สปั ดาห์ จำนวน 3 หน่วยกติ หนว่ ยท่ี ช่อื หนว่ ยการเรยี นรู้ สปั ดาห์ ชวั่ โมงที่ ท่ี 1 พ้นื ฐานการพฒั นาเวบ็ ไซตท์ างธุรกจิ 14 2 การพฒั นาเวบ็ ไซตด์ ว้ ยโปรแกรม Adobe Dreamweaver CC2017 2 4 3 การจดั รปู แบบการแสดงผลเอกสารเวบ็ ไซต์ 3-4 8 4 หลกั การออกแบบกราฟกิ สำหรับเว็บไซต์ 54 5 การจัดการตารางออกแบบหนา้ เวบ็ เพ็จ 64 6 การเชื่อมโยงหนา้ เพ็จด้วย Hyper Link 74 7 การออกแบบหนา้ เว็บเพ็จลักษณะ Responsive Web Design 8-9 8 8 การออกแบบและพฒั นาเว็บไซต์แอพลเิ คชั่น ด้วย PHP 10-11 8 9 กรณีศกึ ษาเวบ็ ไซต์ขายสนิ ค้าออนไลน์ 12-17 24 10 การเผยแพร่เวบ็ ไซตบ์ นอนิ เทอรเ์ นต็ 18 4 รวม

ห น้ า | 10 ตารางที่ 3. วิเคราะห์ หัวข้อหลกั /หัวขอ้ รอง/หวั ข้อย่อย และเวลาจดั การเรยี นรู้ รหัสวชิ า 30204-2103 ช่อื วชิ า การพฒั นาเวบ็ ไซตท์ างธรุ กจิ ทฤษฎี 2 ช่ัวโมง/สัปดาห์ ปฏบิ ัติ 2 ชว่ั โมง/สปั ดาห์ จำนวน 3 หนว่ ยกิต สัปดาห์ หนว่ ย เวลาจัดการเรียนรู้ ท่ี ท่ี ชอื่ หน่วยการเรยี นรู้/หวั ข้อการเรยี นรู้ ทฤษฎี ปฏบิ ตั ิ รวม (ชม.) 1 1 พ้นื ฐานการพฒั นาเว็บไซต์ทางธุรกจิ 31 4 1.1).ความรเู้ ก่ยี วกบั เว็บไซต์ 1.2).ความรหู้ ลกั การออกแบบเวบ็ ไซตเ์ พ่อื ธุรกิจ 1.3).ส่วนประกอบของเวบ็ ไซต์ 1.4).การเลือกใช้สี 1.5).รูปแบบไฟล์ทีเ่ หมาะสมสำหรับการพัฒนาเว็บไซต์ 1.6).ภาษาท่ีเหมาะสมในการพฒั นาเวบ็ ไซต์ 1.7).รูปแบบของเวบ็ ไซต์เพ่ือธุรกจิ 2 2 การพัฒนาเว็บไซต์ด้วยโปรแกรม Adobe 31 8 Dreamweaver CC2017 2.1).ความสามารถ Adobe Dreamweaver CC2017 2.2).Feature โปรแกรม Adobe Dreamweaver CC2017 2.3X.สว่ นประกอบโปรแกรม Adobe Dreamweaver CC2017 2.4).การสรา้ ง Site 2.5).การสร้างหน้า เวบ็ เพ็จ 2.6).การบันทึก ปิด เปดิ ไฟลเ์ วบ็ เพ็จ 2.7).การกำหนดคณุ สมบัตพิ น้ื ฐานโปรแกรม Adobe 2 6 16 Dreamweaver CC2017 3-4 3 การจดั รูปแบบการแสดงผลเอกสารเวบ็ ไซต์ 3.1).ลักษณะขอ้ ความบนเว็บไซต์ 3.2).ภาษาจดั รปู แบบการแสดงผลเอกสาร HTML 3.3).โครงรา่ งจัดรูปแบบการแสดงผลเอกสารเว็บเพ็จ

ห น้ า | 11 สัปดาห์ หนว่ ย เวลาจดั การเรยี นรู้ ท่ี ท่ี ชือ่ หนว่ ยการเรยี นรู้/หัวขอ้ การเรยี นรู้ ทฤษฎี ปฏิบัติ รวม 5 (ชม.) 6 3.4).แม่แบบเอกสารเว็บไซต์ 7 3.5).การสรา้ งข้อความ จัดรปู แบบข้อความ 3.6).การสร้าง CSS จดั การรปู แบบการแสดงผลเว็บเพ็จ 3.7).การใช้ Bootstrap Framework จัดการรปู แบบการ แสดงผลเวบ็ เพจ็ 3.8).การแทรกรปู ภาพในเว็บเพจ็ 3.9).สร้างหน้าเว็บเพจ็ จากเอกสารแมแ่ บบเว็บไซต์ 4 หลักการออกแบบกราฟกิ สำหรับเวบ็ ไซต์ 1 3 20 4.1).กราฟิกในงานเว็บไซต์ 4.2).รูปแบบกราฟิกเพื่องานเว็บไซต์ 4.3).การสรา้ ง Header 4.4).การสร้าง Navgitionbar 4.5).การสร้าง Banner 4.6).การสร้างแอนเิ มช่ันเพ่อื งานเวบ็ ไซต์ 4.7).บันทกึ กราฟกิ เพอื่ งานเวบ็ ไซต์ 5 การจัดการตารางออกแบบหน้าเว็บเพจ็ 1 3 24 5.1).คุณสมบตั ิของตาราง 5.2).การสร้างตารางและการปรบั แตง่ ตาราง 5.3).การจัดการตาราง 5.4).การวางโครงร่างเวบ็ เพ็จดว้ ยตาราง 6 การเชอื่ มโยงหนา้ เพจ็ ด้วย Hyper Link 1 3 28 6.1).รูปแบบการเชอื่ มโยงในหนา้ เวบ็ เพ็จ 6.2).เทคนิค Map Link 6.3).การเชอื่ มโยงภายในเว็บเพ็จ

ห น้ า | 12 สปั ดาห์ หน่วย เวลาจัดการเรยี นรู้ ท่ี ท่ี 8-9 ช่อื หน่วยการเรียนรู้/หวั ข้อการเรียนรู้ ทฤษฎี ปฏิบัติ รวม (ชม.) 10-11 6.4).การเชอ่ื มโยงภายนอกเวบ็ เพ็จ 12-17 6.5).การสรา้ งจุดเชอ่ื มโยงดาว์นโหลดไฟล์ 6.6).การเชอ่ื มโยงดว้ ยเทคนิค Map Link 6.7).การแก้ไขจุดเชือ่ มโยง 7 การออกแบบหนา้ เว็บเพจ็ ลกั ษณะ Responsive Web 2 6 36 Design 7.1).ความรู้เก่ยี วกบั Responsive Web Design 7.2).หลกั การสร้าง Layout ด้วย Fluid Grid Layout 7.3).ความรเู้ ก่ยี วกบั Div Tag และ Cascading Style Sheet 7.4).การออกแบบ Layout หน้าเวบ็ เพจ็ ลักษณะ Responsive Web Design ด้วย Fluid Grid Layout 7.5).การใช้ Bootstrap Frameworks 8 การออกแบบและพัฒนาเวบ็ ไซตแ์ อพลิเคช่นั ด้วย PHP 2 6 44 8.1).ร้จู กั ภาษา PHP 8.2).รูปแบบคำสงั่ PHP 8.3).การทำงานของ PHP กบั การจัดการฐานขอ้ มูล 8.4).การติดตั้ง PHP และโปรแกรมทจ่ี ำเปน็ 8.5).การใชโ้ ปรแกรมจัดการฐานขอ้ มลู 8.6).การใช้ PHP ตอิ ต่อกบั ฐานข้อมูล 8.7).การสร้างฟอร์มเพ่ือส่งคา่ และรบั ค่าลงในฐานข้อมูล 9 กรณศี กึ ษาเวบ็ ไซต์ขายสนิ ค้าออนไลน์ 6 18 68 9.1).ความรู้เกยี่ วกับการขายสินค้าออนไลน์ 9.2).การเตรียมข้อมูลเพอ่ื สร้างเว็บไซต์ขายสินคา้ ออนไลน์ 9.3).การสรา้ ง Sitemap

ห น้ า | 13 สัปดาห์ หน่วย เวลาจัดการเรียนรู้ ท่ี ท่ี ชือ่ หนว่ ยการเรยี นรู้/หวั ขอ้ การเรยี นรู้ ทฤษฎี ปฏิบัติ รวม (ชม.) 9.4).การออกแบบฐานข้อมลู ขายสินค้าออนไลน์ 1 3 72 9.5).การสรา้ งระบบนับจำนวนผู้เขา้ ชม 9.6).การสรา้ งระบบสมาชกิ 9.7).ระบบคลงั สินคา้ 9.8).ระบบบรหิ ารจัดการรา้ น 18 10 การเผยแพรเ่ ว็บไซตบ์ นอนิ เทอร์เนต็ 10.1).เว็บเซริ ์ฟเวอร์ 10.2).เวบ็ โฮสติง้ 10.3).วิธกี ารอพั โหลดเวบ็ ไซต์ 10.4).โปรแกรม FTP สำหรบั อัพโหลดเว็บไซต์ 10.5).ตรวจสอบขนาดของไฟลเ์ ว็บเพจ 10.6).อพั โหลดเว็บไซต์ไปยงั โฮสต้ิง

ตารางท่ี 4. วิเคราะห์ จุดประสงคเ์ ชิงพฤติกรร รหัสวิชา 30204-2103 ชอ่ื วิชา การพฒั นาเว็บไซตท์ างธุรกจิ ทฤษฎ หน่วยท่ี 1 พนื้ ฐานการออกแบบและพัฒนาเว็บไซต์ รายการความรู้ (Knowledge) จดุ ประสงคเ์ ชิงพฤตกิ รรม 1). ความรูเ้ ก่ยี วกับเวบ็ ไซต์ 1). อธบิ ายความรเู้ บือ้ งตน้ พื้น เวบ็ ไซต์ตามมาตรฐาน W3C ไ 2). ความรหู้ ลักการออกแบบเว็บไซต์ 3). รปู แบบไฟล์ที่เหมาะสมสำหรับการพัฒนาเวบ็ ไซต์ 2). บอกส่วนประกอบของเวบ็ 4). ภาษาท่ีเหมาะสมในการพฒั นาเว็บไซต์ 3). อธิบายรปู แบบไฟลท์ ี่เหมา 5). รูปแบบของเวบ็ ไซต์เพ่ือธุรกิจ ตามาตรฐานภาพได้ 4). บอกภาษาที่เหมาะกบั การ รายการทกั ษะ (Skills) 5). อธบิ ายรูปแบบของเว็บไซต 1). การออกแบบโครงสร้างเวบ็ ไซต์ ออกแบบออกแบบเว็บไซตไ์ ด้ 2). การเลือกใช้สี จดุ ประสงคเ์ ชิงพฤติกรรม 1). ออกแบบโครงสรา้ งเว็บไซ เวบ็ ไซต์ได้ 2). เลือกใช้ไฟล์ สี สำหรบั เวบ็ จำลองเฉดสีได้

P a g e | 14 รมกับหวั ข้อการเรยี นรู้และระดับพฤตกิ รรมที่ตอ้ งการ ฎี 2 ชวั่ โมง/สปั ดาห์ ปฏิบัติ 2 ชั่วโมง/สปั ดาห์ จำนวน 3 หนว่ ยกิต ด้านพุทธิพิสัย ดา้ นทักษะพิสยั ด้านจิตพิสยั ม (Behavioral Objectives) ความรู้ ความจำ ความเข้าใจ การนำไปใช้ ิวเคราะ ์ห สังเคราะ ์ห ประเ ิมนค่า การเ ีลยนแบบ การทำตามแบบ การทำถูกต้องแ ่มนยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโนมัติ การรับรู้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การ ีมลักษณะเฉพาะตน นฐานการออกแบบและพฒั นา ✓ ✓✓ ได้ ✓ ✓✓ ✓✓ บไซต์ได้ตามมาตรฐานเวบ็ ไซต์ได้ ✓ ✓✓ ✓✓ าะสมสำหรบั การพฒั นาเวบ็ ไซต์ รพัฒนาเว็บไซต์ได้ ✓ ต์เพื่อธุรกจิ ตามมาตรฐานการ ✓ ม (Behavioral Objectives) ✓ ✓ ซต์ได้อย่างถกู ตอ้ งมาตรฐาน ✓ บไซต์ดว้ ยโปรแกรมเลือกสีและ ✓

ตารางท่ี 4. (ต่อ) วิเคราะห์ จุดประสงคเ์ ชิงพฤตกิ รหัสวิชา 30204-2103 ชอื่ วิชา การพัฒนาเวบ็ ไซต์ทางธรุ กิจ ทฤษฎ หนว่ ยที่ 2 การพัฒนาเวบ็ ไซตด์ ้วยโปรแกรม Adobe Dreamweaver CC2017 รายการความรู้ (Knowledge) จุดประสงคเ์ ชิงพฤตกิ รรม ( 1). ความสามารถ Adobe Dreamweaver CC2017 1). อธบิ ายเกย่ี วกบั โปรแกรม A CC2017 ได้ 2). Feature โปรแกรม Adobe Dreamweaver CC2017 2). บอก Feature โปรมแกรม 3). ส่วนประกอบโปรแกรม Adobe Dreamweaver CC2017 ได้ CC2017 3). อธิบายสว่ นประกอบโปรแก CC2017 ได้ รายการทกั ษะ (Skills) จุดประสงคเ์ ชิงพฤตกิ รรม ( 1). สรา้ ง Site จดั เก็บเว็บเพ็จได 1). การสร้าง Site 2). บันทกึ เปิด ปดิ ไฟล์เวบ็ ไซต Dreamweaver CC2017 ได้ถกู 2). การใชโ้ ปรแกรม Adobe Dreamweaver CC2017

ห น้ า | 15 กรรมกับหวั ข้อการเรียนรแู้ ละระดับพฤติกรรมทต่ี อ้ งการ ดา้ นจติ พิสยั ฎี 2 ชั่วโมง/สัปดาห์ ปฏิบตั ิ 2 ชวั่ โมง/สปั ดาห์ จำนวน 3 หนว่ ยกติ 7 ด้านพทุ ธิพสิ ยั ด้านทกั ษะพสิ ยั (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ วิเคราะ ์ห สังเคราะ ์ห ประเ ิมนค่า การเลียนแบบ การทำตามแบบ การทำถูกต้องแม่นยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโน ัมติ การ ัรบ ูร้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การมี ัลกษณะเฉพาะตน Adobe Dreamweaver ✓ ✓✓ Adobe Dreamweaver ✓ ✓✓ ✓✓ กรม Adobe Dreamweaver ✓ (Behavioral Objectives) ✓ ✓ ด้ถกู ต้องตามคู่มือการใชง้ าน ✓ ✓ ตด์ ว้ ยโปรแกรม Adobe กตอ้ งตามคมู่ อื การใชง้ าน

ตารางท่ี 4. (ต่อ) วิเคราะห์ จุดประสงคเ์ ชงิ พฤติก รหสั วิชา 30204-2103 ชื่อวิชา การพัฒนาเวบ็ ไซตท์ างธรุ กิจ ทฤษฎ หน่วยท่ี 3 การจัดรปู แบบการแสดงผลเอกสารเว็บไซต์ รายการความรู้ (Knowledge) จดุ ประสงค์เชิงพฤติกรรม ( 1). ลักษณะข้อความบนเวบ็ ไซต์ 1). อธิบายลกั ษณะขอ้ ความบน 2). ภาษาจัดรปู แบบการแสดงผลเอกสาร HTML 2). บอกภาษาจัดรูปแบบเอกสา 3). การจดั รูปแบบการแสดงผลเอกสารเว็บเพจ็ ตามมาตรฐาน W3C 4). แมแ่ บบเอกสารเวบ็ ไซต์ 3). อธบิ ายรูปแบบการจดั โครงร รายการทักษะ (Skills) 4). จำแนกแม่แบบเอกสารเวบ็ ไ 1). การสร้างข้อความและจัดรปู แบบขอ้ ความ 2). การแทรกรปู ลงในเอกสารเวบ็ เพจ็ ได้ จุดประสงค์เชงิ พฤติกรรม ( 3). การใช้คำสั่ง CSS 1). สร้างข้อความและจดั รูปแบ 4). การใช้ Bootstrap Framework 2). แทรกรปู ลงในเอกสารเว็บเพ 3). ใช้คำสั่ง CSS จัดแตง่ เอกสา มาตรฐาน W3C 4). สรา้ งหน้าเวบ็ ไซตด์ ้วย Boo ถกู ต้องตามมาตรฐาน W3C

ห น้ า | 16 กรรมกบั หวั ข้อการเรยี นรแู้ ละระดับพฤตกิ รรมท่ตี อ้ งการ ฎี 2 ชั่วโมง/สปั ดาห์ ปฏิบตั ิ 2 ช่วั โมง/สปั ดาห์ จำนวน 3 หนว่ ยกติ ดา้ นพุทธพิ สิ ัย ด้านทกั ษะพสิ ยั ด้านจติ พสิ ยั (Behavioral Objectives) ความรู้ ความจำ ความเข้าใจ การนำไปใช้ ิวเคราะ ์ห สังเคราะ ์ห ประเ ิมนค่า การเ ีลยนแบบ การทำตามแบบ การทำถูกต้องแ ่มนยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโน ัมติ การรับรู้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การ ีมลักษณะเฉพาะตน นเวบ็ ไซต์ได้ ✓ ✓✓ ารด้วยคำส่ัง HTML ได้ถกู ตอ้ ง ✓✓ ✓ ✓✓ ✓✓ ร่างแสดงผลเอกสารเว็บเพ็จได้ ✓ ✓ ✓ ไซต์รูปแบบตา่ งๆ ได้ ✓ ✓ ✓ (Behavioral Objectives) ✓ ✓ บบข้อความถกู ตอ้ งได้ ✓ พ็จได้ ารเวบ็ เพ็จได้ถูกตอ้ งตาม otstrap Framework ได้ ✓

ตารางที่ 4. (ต่อ) วิเคราะห์ จุดประสงค์เชงิ พฤตกิ รหสั วชิ า 30204-2103 ชอ่ื วิชา การพัฒนาเว็บไซต์ทางธรุ กจิ ทฤษฎ หนว่ ยที่ 4 หลกั การออกแบบกราฟกิ สำหรบั เว็บไซต์ รายการความรู้ (Knowledge) จุดประสงคเ์ ชิงพฤตกิ รรม ( 1). กราฟกิ ในงานเวบ็ ไซต์ 1). อธิบายกราฟกิ ในงานเวบ็ ไซ 2). ลักษณะกราฟกิ ในงานเว็บไซต์ 2). บอกลักษณะกราฟิกในงานเ 3). รูปแบบกราฟกิ เพอ่ื งานเว็บไซต์ 3). จำแนกรูปแบบกราฟิกเพือ่ ง รายการทักษะ (Skills) จดุ ประสงคเ์ ชิงพฤติกรรม ( 1). การสรา้ ง Header 1). สรา้ ง Header ได้ถูกตอ้ งตา 2). การสรา้ ง Navgitionbar 2). สรา้ ง Navigation bar ไดถ้ 3). การสร้าง Banner 3). สร้าง Banner ได้ถูกตอ้ งตา 4). การสร้างแอนเิ มชั่นเพ่ืองานเวบ็ ไซต์ 4). ใช้โปรแกรมสร้าง แอนเิ มชนั่ การใช้งาน

ห น้ า | 17 กรรมกับหวั ข้อการเรียนรแู้ ละระดับพฤติกรรมทต่ี ้องการ ฎี 2 ชวั่ โมง/สัปดาห์ ปฏิบตั ิ 2 ช่วั โมง/สัปดาห์ จำนวน 3 หนว่ ยกิต ด้านพทุ ธิพิสยั ดา้ นทกั ษะพสิ ยั ด้านจิตพสิ ัย (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ ิวเคราะห์ สังเคราะห์ ประเมินค่า การเลียนแบบ การทำตามแบบ การทำ ูถก ้ตองแม่นยำ การทำอ ่ยางผสมผสาน การทำอ ่ยางอัตโนมั ิต การรับรู้ การตอบสนอง การเห็นคุณค่า การจัดกระบวนการคิด การมีลักษณะเฉพาะตน ซต์ได้ถูกต้องตามมาตรฐาน ✓ ✓✓ เวบ็ ไซต์ได้ ✓ ✓✓ งานเว็บไซต์ได้ ✓ ✓✓ (Behavioral Objectives) ✓ ✓ ✓ ✓ ามคู่มือการใช้งาน ✓ ✓ ถูกต้องตามคมู่ ือการใชง้ าน ามคู่มือการใช้งาน ✓ ✓ นเพื่องาน ได้ถูกต้องตามค่มู ือ

ตารางที่ 4. (ต่อ) วิเคราะห์ จุดประสงค์เชิงพฤตกิ รหัสวิชา 30204-2103 ชอื่ วิชา การพัฒนาเว็บไซตท์ างธรุ กจิ ทฤษฎ หนว่ ยที่ 5 การจัดการตารางออกแบบหนา้ เวบ็ เพจ็ รายการความรู้ (Knowledge) จุดประสงคเ์ ชิงพฤติกรรม ( 1). คณุ สมบตั ิของตาราง 1). อธบิ ายคุณสมบัตขิ องตาราง 2). จดั การตารางเพือ่ งานเว็บไซต์ 2). บอกการจดั การตารางเพอ่ื ง รายการทักษะ (Skills) จุดประสงค์เชงิ พฤติกรรม ( 1). การสร้างตารางและการปรบั แตง่ ตาราง 1). สร้างตารางและการปรบั แต ใชง้ าน 2). การออกแบบวางโครงร่างเวบ็ เพ็จด้วยตาราง 2). ออกแบบโครงร่างเวบ็ เพ็จด การใช้งาน

ห น้ า | 18 กรรมกบั หวั ข้อการเรียนร้แู ละระดบั พฤติกรรมที่ต้องการ ฎี 2 ชั่วโมง/สัปดาห์ ปฏิบัติ 2 ช่วั โมง/สปั ดาห์ จำนวน 3 หนว่ ยกติ ดา้ นพทุ ธิพสิ ยั ดา้ นทกั ษะพสิ ยั ด้านจิตพิสยั (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ วิเคราะ ์ห สังเคราะ ์ห ประเ ิมนค่า การเลียนแบบ การทำตามแบบ การทำถูกต้องแม่นยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโน ัมติ การ ัรบ ูร้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การมี ัลกษณะเฉพาะตน งได้ ✓ ✓✓ งานเว็บไซต์ได้ ✓ ✓✓ (Behavioral Objectives) ✓ ✓ ✓ ✓ ตง่ ตารางไดถ้ กู ต้องตามคู่มือการ ด้วยตารางไดถ้ ูกตอ้ งตามคูม่ อื

ตารางที่ 4. (ต่อ) วเิ คราะห์ จุดประสงคเ์ ชงิ พฤตกิ รหสั วชิ า 30204-2103 ชื่อวิชา การพัฒนาเวบ็ ไซต์ทางธรุ กจิ ทฤษฎ หน่วยที่ 6 การเช่ือมโยงหน้าเพจ็ ด้วย Hyper Link รายการความรู้ (Knowledge) จุดประสงคเ์ ชิงพฤตกิ รรม ( 1). รปู แบบการเชื่อมโยงในหน้าเวบ็ เพ็จ 1). อธิบายคุณสมบัติ และการท (Hyperlink)ได้ถกู ต้องตามคูม่ อื 2). เทคนิค Map Link 2). บอกเทคนคิ Map link ไดถ้ รายการทกั ษะ (Skills) จดุ ประสงคเ์ ชิงพฤติกรรม ( 1).การเช่ือมโยงภายในเวบ็ เพจ็ 1). สรา้ งจดุ เชอ่ื มโยง (Hyperlin 2).การเช่ือมโยงภายนอกเวบ็ เพ็จ 3).การสร้างจดุ เช่อื มโยงดาว์นโหลดไฟล์ 2). สรา้ งจดุ เช่อื มโยง (Hyperlin 4).การเช่อื มโยงดว้ ยเทคนิค Map Link 5).การแก้ไขจดุ เช่อื มโยง 3). สรา้ งจุดเชอื่ มโยง (Hyperlin 4). สรา้ งจดุ เช่อื มโยง (Hyperlin 5).แกไ้ ขจุดเช่ือมโยง

ห น้ า | 19 กรรมกับหวั ข้อการเรียนรู้และระดับพฤติกรรมทตี่ ้องการ ฎี 2 ช่ัวโมง/สปั ดาห์ ปฏิบตั ิ 2 ชว่ั โมง/สัปดาห์ จำนวน 3 หนว่ ยกติ ดา้ นพุทธพิ ิสัย ด้านทักษะพิสัย ด้านจิตพิสยั (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ วิเคราะ ์ห สังเคราะ ์ห ประเ ิมนค่า การเลียนแบบ การทำตามแบบ การทำถูกต้องแม่นยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโน ัมติ การ ัรบ ูร้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การมี ัลกษณะเฉพาะตน ทำงานของจุดเชือ่ มโยง ✓ ✓✓ อการใช้งาน ✓ ✓✓ ถกู ตอ้ งตามคู่มอื การใชง้ าน (Behavioral Objectives) ✓ ✓ nk) ภายในเวบ็ เพจ็ ✓ ✓ ✓ ✓ nk) นอกเว็บเพจ็ ✓ ✓ ✓ ✓ nk) ดาวน์ โหลดไฟล์ nk) เทคนิค Map Link

ตารางที่ 4. (ต่อ) วเิ คราะห์ จุดประสงค์เชิงพฤติก รหัสวชิ า 30204-2103 ชอื่ วิชา การพัฒนาเวบ็ ไซตท์ างธุรกจิ ทฤษฎ หนว่ ยท่ี 7 การออกแบบหนา้ เว็บเพ็จลักษณะ Responsive Web Design รายการความรู้ (Knowledge) จุดประสงค์เชิงพฤติกรรม ( 1). ความรเู้ ก่ียวกับ Responsive Web Design 1). อธบิ าย Responsive Web มาตรฐาน W3C 2). หลักการสร้าง Layout ด้วย Fluid Grid Layout 2). บอกการสร้าง Layout ด้วย 3). ความร้เู กย่ี วกบั Div Tag และ Cascading Style Sheet ทใี่ ช้กบั Responsive Web Design 3). อธิบาย Div Tag และ Casc Responsive Web Design ได รายการทักษะ (Skills) จดุ ประสงค์เชิงพฤติกรรม ( 1). Layout ดว้ ย Fluid Grid Layout 1). ออกแบบ Layout ดว้ ย Flu 2). คำสง่ั CSS Bootstrap Framework ตามค่มู อื การใช้งาน 2). ใช้คำส่ัง CSS Bootstrap F 3). ประยุกต์ Bootstrap Framework มาใชง้ านใน เพจ็ ไดถ้ ูกต้องตามคูม่ อื การใช้งา เวบ็ เพจ็ 3). ใช้ Bootstrap Framewor Responsive Web Design ได

ห น้ า | 20 กรรมกบั หัวข้อการเรยี นรแู้ ละระดบั พฤตกิ รรมทีต่ ้องการ ฎี 2 ชัว่ โมง/สัปดาห์ ปฏิบัติ 2 ชวั่ โมง/สัปดาห์ จำนวน 3 หนว่ ยกิต ดา้ นพุทธพิ สิ ัย ดา้ นทกั ษะพสิ ยั ด้านจติ พิสยั (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ วิเคราะ ์ห สังเคราะ ์ห ประเมินค่า การเลียนแบบ การทำตามแบบ การทำถูกต้องแม่นยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโน ัมติ การ ัรบรู้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การมี ัลกษณะเฉพาะตน b Design ได้ถกู ต้องตาม ✓ ✓✓ ✓✓ ย Fluid Grid Layout ได้ ✓ ✓✓ cading Style Sheet ทใี่ ช้กับ ✓ ด้ ✓ ✓ ✓ (Behavioral Objectives) ✓ uid Grid Layout ไดถ้ ูกตอ้ ง Framework ตกแต่งหนา้ เวบ็ ✓ าน ✓ rk สร้างเวบ็ ไซต์ลักษณะ ด้ถูกต้องตามมาตรฐาน W3C

ตารางที่ 4. (ต่อ) วเิ คราะห์ จุดประสงคเ์ ชงิ พฤตกิ รหสั วิชา 30204-2103 ช่อื วิชา การพฒั นาเวบ็ ไซตท์ างธรุ กิจ ทฤษฎ หน่วยท่ี 8 การออกแบบและพัฒนาเวบ็ ไซตแ์ อพลิเคช่ัน ด้วย PHP รายการความรู้ (Knowledge) จุดประสงค์เชิงพฤติกรรม ( 1). รู้จักภาษา PHP 1). อธบิ ายภาษา PHP ได้ 2). รูปแบบคำสง่ั PHP 2). จำแนกรูปแบบคำส่ัง PHP ไ 3). การทำงานของ PHP กับการจดั การฐานข้อมลู 3). บอกการทำงานของ PHP ก รายการทักษะ (Skills) จดุ ประสงค์เชิงพฤติกรรม ( 1). การตดิ ตัง้ PHP และโปรแกรมทีจ่ ำเป็น 1). ติดตงั้ PHP และโปรแกรมท การใชง้ าน 2). การใช้โปรแกรมจดั การฐานขอ้ มูล 2). ใช้โปรแกรมจัดการฐานข้อม งาน 3). การใช้ PHP ตดอตอ่ กับฐานขอ้ มลู 3). สร้างไฟล์ PHP ตดิ ตอ่ กบั ฐา การใชง้ าน 4). การสรา้ งฟอร์มเพื่อส่งคา่ และรบั ค่าลงใน 4). สร้างฟอร์มเพ่อื ส่งค่า และร ฐานข้อมลู ตามคูม่ ือการใชง้ าน

P a g e | 21 กรรมกับหวั ข้อการเรียนรูแ้ ละระดบั พฤตกิ รรมท่ีต้องการ ฎี 2 ชว่ั โมง/สปั ดาห์ ปฏิบตั ิ 2 ชวั่ โมง/สัปดาห์ จำนวน 3 หนว่ ยกติ ดา้ นพทุ ธิพสิ ัย ด้านทักษะพสิ ยั ด้านจติ พิสัย (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ ิวเคราะห์ สังเคราะห์ ประเมินค่า การเลียนแบบ การทำตามแบบ การทำ ูถก ้ตองแม่นยำ การทำอ ่ยางผสมผสาน การทำอ ่ยางอัตโนมั ิต การรับรู้ การตอบสนอง การเห็นคุณค่า การจัดกระบวนการคิด การมีลักษณะเฉพาะตน ได้ ✓ ✓✓ กับการจดั การฐานข้อมูล ได้ ✓ ✓✓ ✓ ✓✓ (Behavioral Objectives) ✓ ✓ ทจี่ ำเป็น ได้ถูกต้องตามคมู่ ือ ✓ ✓ ✓ ✓ มูล ไดถ้ กู ต้องตามคู่มือการใช้ ✓ ✓ านขอ้ มูล ไดถ้ ูกต้องตามคมู่ อื รบั คา่ ลงในฐานข้อมูล ได้ถูกต้อง

ตารางที่ 4. (ต่อ) วิเคราะห์ จุดประสงคเ์ ชิงพฤติก รหสั วิชา 30204-2103 ชื่อวิชา การพฒั นาเวบ็ ไซต์ทางธุรกิจ ทฤษฎ หน่วยท่ี 9 กรณศี ึกษาเวบ็ ไซต์ขายสนิ ค้าออนไลน์ รายการความรู้ (Knowledge) จดุ ประสงคเ์ ชิงพฤติกรรม ( 1). ความรู้เก่ียวกบั การขายสินคา้ ออนไลน์ 1). อธบิ ายเกีย่ วกับการขายสนิ ค 2). การเตรยี มขอ้ มลู เพอ่ื สร้างเวบ็ ไซต์ขายสินคา้ 2). จำแนกขอ้ มูลเพอ่ื สรา้ งเวบ็ ไ ออนไลน์ 3).การออกแบบและพัฒนาเว็บไซตข์ ายสนิ ค้าออนไลน์ 3). อธบิ ายวธิ ีการการออกแบบ ออนไลน์ ได้ รายการทักษะ (Skills) 1). การสรา้ ง Sitemap จดุ ประสงค์เชิงพฤติกรรม ( 2). การออกแบบฐานขอ้ มูลขายสนิ คา้ ออนไลน์ 1). สรา้ ง Sitemap ไดถ้ ูกต้องต 2). ออกแบบฐานข้อมลู ขายสินค 3). การสร้างระบบนับจำนวนผเู้ ข้าชม การใช้งาน 4). การสร้างระบบสมาชกิ 3). สร้างระบบนบั จำนวนผู้เขา้ ช 5). การสรา้ งระบบคลังสินค้า 4). สร้างระบบสมาชกิ ได้ถกู ต้อ 6). การสรา้ งระบบบรหิ ารจดั การร้าน 5). พฒั นาระบบคลังสนิ คา้ ได้ถ 6). พัฒนาระบบบริหารจดั การร งาน

P a g e | 22 กรรมกับหัวข้อการเรียนรแู้ ละระดบั พฤติกรรมท่ตี อ้ งการ ฎี 2 ชวั่ โมง/สปั ดาห์ ปฏิบัติ 2 ชว่ั โมง/สัปดาห์ จำนวน 3 หนว่ ยกิต ด้านพทุ ธพิ ิสัย ดา้ นทกั ษะพสิ ยั ด้านจิตพสิ ัย (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ วิเคราะ ์ห สังเคราะ ์ห ประเ ิมนค่า การเลียนแบบ การทำตามแบบ การทำถูกต้องแม่นยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโน ัมติ การ ัรบ ูร้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การมี ัลกษณะเฉพาะตน ค้าออนไลน์ ได้ ✓ ✓✓ ไซตข์ ายสนิ ค้าออนไลน์ ได้ ✓ ✓✓ บและพฒั นาเวบ็ ไซตข์ ายสินคา้ ✓ ✓✓ (Behavioral Objectives) ✓ ✓ ตามคูม่ ือการใชง้ าน ✓ ค้าออนไลน์ ไดถ้ กู ต้องตามค่มู ือ ✓ ✓ ✓ ชม ได้ถูกตอ้ งตามคู่มือ ✓ ✓ องตามคู่มอื การใชง้ าน ✓ ✓ ถูกตอ้ งตามคู่มอื การใชง้ าน ✓ ร้าน ไดถ้ กู ตอ้ งตามคู่มอื การใช้ ✓

ตารางท่ี 4. (ต่อ) วเิ คราะห์ จุดประสงคเ์ ชงิ พฤติก รหัสวชิ า 30204-2103 ชื่อวิชา การพัฒนาเว็บไซตท์ างธรุ กิจ ทฤษฎ หนว่ ยที่ 10 การ Upload เผยแพรเ่ วบ็ ไซต์บนอนิ เทอรเ์ น็ต รายการความรู้ (Knowledge) จดุ ประสงค์เชิงพฤตกิ รรม ( 1). เวบ็ เซิร์ฟเวอร์ 1). อธิบายการทำงานเว็บเซิร์ฟ 2). เว็บโฮสติ้ง 2). จำแนกเวบ็ โฮสต้งิ ไดถ้ กู ต้อง 3). วิธีการอัพโหลดเวบ็ ไซต์ 3). บอกวิธีการอพั โหลดเวบ็ ไซต รายการทกั ษะ (Skills) จุดประสงคเ์ ชิงพฤติกรรม ( 1). การใชโ้ ปรแกรม FTP สำหรบั อัพโหลดเวบ็ ไซต์ 1). ใชโ้ ปรแกรม FTP สำหรบั อพั คู้มอื การใช้งาน 2). การตรวจสอบขนาดของไฟลเ์ ว็บเพจ 2). ตรวจสอบขนาดของไฟล์เว็บ 3). การอพั โหลดเว็บไซตไ์ ปยงั โฮสต้ิง 3). ใชโ้ ปรแกรมสำเรจ็ รูปอัพโหล ถูกตอ้ งตามค่มู อื การใช้งาน

ห น้ า | 23 กรรมกับหัวข้อการเรยี นรแู้ ละระดบั พฤตกิ รรมท่ตี อ้ งการ ฎี 2 ชัว่ โมง/สัปดาห์ ปฏิบัติ 2 ช่วั โมง/สปั ดาห์ จำนวน 3 หนว่ ยกิต ด้านพทุ ธิพสิ ัย ดา้ นทกั ษะพสิ ยั ด้านจติ พิสยั (Behavioral Objectives) ความรู้ ความจำ ความเ ้ขาใจ การนำไปใช้ วิเคราะ ์ห สังเคราะ ์ห ประเ ิมนค่า การเลียนแบบ การทำตามแบบ การทำถูกต้องแม่นยำ การทำอย่างผสมผสาน การทำอย่าง ัอตโน ัมติ การ ัรบ ูร้ การตอบสนอง การเ ็หนคุณค่า การ ัจดกระบวนการคิด การมี ัลกษณะเฉพาะตน ฟเวอร์ได้ ✓ ✓✓ งตามมาตรฐาน ✓ ✓✓ ต์ได้ ✓✓ ✓ (Behavioral Objectives) ✓ ✓ พโหลดเวบ็ ไซต์ ได้ถกู ต้องตาม ✓ บเพจ็ ได้ ✓ ✓ ลดเว็บไซต์ไปยังโฮสตงิ้ ได้ ✓

P a g e | 24 ค่มู อื ครู ชุดการสอนท่ี 1 เรื่อง พ้นื ฐานการพฒั นาเวบ็ ไซตท์ างธุรกิจ คำชี้แจง ชุดการสอนเรื่อง พื้นฐานการพัฒนาเว็บไซต์ทางธุรกิจต้องการให้ผู้เรียนศึกษาเกี่ยวกับ ความรู้เกี่ยวกับเว็บไซต์ ความรู้หลักการออกแบบเว็บไซต์ ส่วนประกอบของเว็บไซต์ การเลือกใช้สี รปู แบบไฟลท์ เ่ี หมาะสมสำหรับการพัฒนาเว็บไซต์ ภาษาท่ีเหมาะสมในการพัฒนาเว็บไซต์ รปู แบบของ เว็บไซต์ธุรกจิ 1. จุดประสงค์ท่วั ไป 1.1). ผเู้ รียนมคี วามรูแ้ ละความเข้าใจ เก่ยี วกับเวบ็ ไซต์ หลักการออกแบบเวบ็ ไซต์ สว่ นประกอบของเว็บไซต์.รปู แบบไฟลท์ ่ีเหมาะสมสำหรับการพฒั นาเวบ็ ไซต์ ภาษาทีเ่ หมาะสมในการ พฒั นาเว็บไซต์ รูปแบบของเวบ็ ไซตธ์ ุรกจิ 1.2). มีทกั ษะ เลือกใชไ้ ฟล์ สี สำหรบั เว็บไซตด์ ้วยโปรแกรมเลือกสีและจำลองเฉดสี ออกแบบ โครงสร้างเวบ็ ไซต์ได้อยา่ งถกู ต้องมาตรฐานเว็บไซต์ได้ 1.3). สนใจใฝร่ ู้ รบั ผิดชอบเข้าเรยี นตรงเวลา แตง่ กายเรียบร้อย มีน้ำใจชว่ ยเหลือช่วยเหลอื ผอู้ น่ื และการปฏบิ ัตงิ านรว่ มกับผู้อื่น 1.4). ยอมรบั รูปแบบภาษาในการพฒั นาเว็บไซต์ จดั ลำดบั แนวทางหลักการออกแบบเวบ็ ไซต์ 1.5). มีเจตคติและกิจนิสัยที่ดีในการทำงาน ด้วยความละเอียดรอบคอบ ปลอดภัย เป็น ระเบียบ สะอาด ตรงต่อเวลา มีความซื่อสัตย์ รับผิดชอบ รักษาสภาพแวดล้อม และมีคุณธรรม จรยิ ธรรมและคณุ ลักษณะอนั พึงประสงค์ท่ีต้องการ 2. จดุ ประสงคเ์ ชงิ พฤติกรรม เม่อื ผเู้ รยี นเรยี นเรือ่ ง พืน้ ฐานการพัฒนาเว็บไซต์ทางธุรกจิ แลว้ สามารถ 2.1). อธิบายความรู้เบ้อื งตน้ พื้นฐานการออกแบบและพฒั นาเว็บไซต์ตามมาตรฐาน W3C ได้ 2.2). บอกส่วนประกอบของเว็บไซตไ์ ดต้ ามมาตรฐานเวบ็ ไซตไ์ ด้ 2.3). อธิบายรูปแบบไฟลท์ เี่ หมาะสมสำหรับการพัฒนาเวบ็ ไซตต์ ามาตรฐานภาพได้ 2.4). บอกภาษาทเ่ี หมาะกบั การพัฒนาเวบ็ ไซตไ์ ด้ 2.5). อธิบายรูปแบบของเว็บไซต์เพอื่ ธรุ กิจตามมาตรฐานการออกแบบออกแบบเว็บไซตไ์ ด้ 2.6). ออกแบบโครงสรา้ งเว็บไซตไ์ ด้อย่างถกู ต้องมาตรฐานเว็บไซตไ์ ด้ 2.7). เลือกใชไ้ ฟล์ สี สำหรบั เวบ็ ไซต์ด้วยโปรแกรมเลือกสีและจำลองเฉดสีได้

ห น้ า | 25 2.8). มีกจิ นิสยั ในการปฏิบตั ิงานตามหลักของเศรษฐกิจพอเพียง 2.9) .มีกิจนสิ ยั คน้ ควา้ หาความรูด้ ว้ ยตัวนำสู่การลงมอื ปฏบิ ัติ โดยใช้ทักษะการเรยี นรู้แห่ง ศตวรรษท่ี 21 (Active Learning) 2.10). มกี ารพัฒนาคณุ ธรรม จรยิ ธรรม คา่ นยิ ม และคุณลักษณะอันพงึ ประสงคท์ ีผ่ สู้ อน สามารถสังเกตเห็นได้ ในดา้ นความมมี นษุ ยสมั พนั ธ์ ความมีวินัย ความรบั ผิดชอบ ความเชื่อมัน่ ในตนเอง ความสนใจใฝร่ ู้ ความรักสามคั คี ความกตญั ญกู ตเวที 3. ส่วนประกอบของชดุ การสอนที่ 1 เรื่อง พื้นฐานการพฒั นาเวบ็ ไซต์ทางธรุ กจิ มีดงั น้ี 3.1). คมู่ ือครูชุดการสอนที่ 1 เรอ่ื ง พน้ื ฐานการพัฒนาเวบ็ ไซตท์ างธุรกจิ 3.2). โครงการสอนที่ 1 เรือ่ ง พ้ืนฐานการพฒั นาเว็บไซต์ทางธุรกจิ 3.3). แผนการจดั การเรยี นรู้ เรื่อง พน้ื ฐานการพฒั นาเว็บไซต์ทางธรุ กจิ 3.4). เอกสารประกอบการเรยี น เรื่อง พ้นื ฐานการพัฒนาเวบ็ ไซตท์ างธุรกจิ 3.5). แบบฝึกหัดทา้ ยหน่วย เรอ่ื ง พืน้ ฐานการพัฒนาเว็บไซตท์ างธุรกิจ 3.6). ใบงานท่ี 1 พ้นื ฐานการพฒั นาเว็บไซต์ทางธุรกิจ 3.7). แบบประเมินผลการปฏบิ ัตงิ าน ใบงานท่ี 1 พ้ืนฐานการพฒั นาเว็บไซต์ทางธรุ กจิ 3.8). แบบทดสอบก่อนเรียนและหลังเรียนพร้อมเฉลย ชุดการสอนที่ 1 เรื่อง พื้นฐานการ พัฒนาเวบ็ ไซต์ทางธุรกจิ 3.9). แบบสังเกตพฤตกิ รรมระหวา่ งการเรียนและการปฏิบตั งิ าน 3.10). ส่อื ประกอบการสอนเรอื่ ง พน้ื ฐานการพัฒนาเวบ็ ไซตท์ างธุรกิจ 4. เวลาท่ีใช้ ใช้เวลาในการสอนจำนวน 4 ช่ัวโมง 5. การเตรยี มการลว่ งหน้า ส่งิ ทค่ี รูต้องเตรียมการลว่ งหนา้ มดี งั นี้ 5.1). ศึกษาคมู่ อื ครู โครงการสอน และแผนการจดั การเรยี นรู้ เรอ่ื ง พ้นื ฐานการพฒั นา เวบ็ ไซตท์ างธุรกิจ 5.2). ศึกษาและเตรยี มเอกสารและสอ่ื การสอน เรอื่ ง พ้นื ฐานการพฒั นาเว็บไซต์ทางธุรกิจ ประกอบไปดว้ ย - คู่มือครูชดุ การสอนท่ี 1 เรอื่ ง พนื้ ฐานการพัฒนาเว็บไซตท์ างธุรกจิ - ส่อื Google Slide เรื่อง พ้นื ฐานการพฒั นาเวบ็ ไซต์ทางธรุ กจิ - ส่อื Active Learning ด้วยโปรแกรม Kahoot เรอื่ ง พ้ืนฐานการพฒั นาเวบ็ ไซต์ทางธรุ กจิ

ห น้ า | 26 5.3). ผสู้ อนตอ้ งเตรียมเอกสารประกอบการเรยี นเรื่อง พ้นื ฐานการพฒั นาเวบ็ ไซต์ทางธุรกจิ กรณีท่ีให้ผู้เรียนจัดเตรียมเอง ต้องมีต้นฉบับแจ้งให้ผเู้ รียนจดั เตรียมเอกสารประกอบการเรียนล่วงหนา้ ใหพ้ ร้อมกอ่ นเรียน 5.4). แบบทดสอบกอ่ นเรยี น Pre-Test ดว้ ย Google Form เรือ่ ง พน้ื ฐานการพฒั นา เว็บไซตท์ างธรุ กิจ 5.4). แบบทดสอบหลังเรียน Post-Test ดว้ ย Google Form เรื่อง พน้ื ฐานการพัฒนา เวบ็ ไซต์ทางธรุ กิจ 5.5). จัดเตรยี มใบงานท่ี 1 จดั เตรียมเคร่ืองคอมพวิ เตอร์ และเคร่อื งมอื ทจี่ ำเป็น ที่ใช้ ปฏิบัติงานคือ Google chrome, โปรแกรมประมวลผลคำ 5.5). จัดเตรียมและตรวจสภาพความพรอ้ มเครอื่ งคอมพิวเตอร์ โปรแกรมท่ีจำเป็น ได้แก่ Google chrome, โปรแกรมประมวลผลคำ และตวั อย่างการการออกแบบโครงสรา้ งเวบ็ ไซต์ เลอื กใชไ้ ฟล์ สี ด้วยโปรแกรมเลือกสีและจำลองเฉดสี ให้ผ้เู รียนดูเป็นตัวอย่าง 6. สื่อการเรยี นการสอน 6.1). ชุดการสอนที่ 1 เรอื่ ง พนื้ ฐานการพฒั นาเวบ็ ไซตท์ างธุรกจิ 6.2). สือ่ Google Slide เร่ือง พน้ื ฐานการพัฒนาเว็บไซตท์ างธุรกิจ 6.3). ใบงานเรื่อง พนื้ ฐานการพัฒนาเวบ็ ไซตท์ างธรุ กจิ 6.4). สอ่ื Active Learning ด้วยโปรแกรม Kahoot เร่ือง พ้นื ฐานการพฒั นาเวบ็ ไซตท์ าง ธุรกิจ 6.5). ตวั อยา่ งการการออกแบบโครงสร้างเว็บไซต์ เลือกใชไ้ ฟล์ สี ดว้ ยโปรแกรมเลือกสแี ละ จำลองเฉดสีเสร็จแล้ว 7. การจดั ชนั้ เรียน การจัดชั้นเรียนตามปกติสำหรับการสอนทฤษฎี โดยจัดการเรียนการสอนแบบอภิปราย ถาม-ตอบ อธิบาย สาธิต สรุป การเรียนภาคปฏิบัติเน้นการค้นคว้าหาความรู้ด้วยตัวนำสู่การลงมือ ปฏิบัติ โดยใช้ทักษะการเรียนรู้แห่งศตวรรษที่ 21 (Active Learning) จัดกลุ่มการปฏิบัติงานโดยการ แบ่งกลุ่มๆ ละ 3-4 คน เพื่อให้ผู้เรียนได้ปฏิบัติงาน โดยครูเตรียมจัดเตรียมเครื่องคอมพิวเตอร์ และ เคร่อื งมอื ทีจ่ ำเป็น ท่ีใชป้ ฏบิ ัตงิ านคอื Google chrome, โปรแกรมประมวลผลคำ ครสู าธิตวิธีการการ ออกแบบโครงสร้างเว็บไซต์ เลือกใช้ไฟล์ สี ด้วยโปรแกรมเลือกสีและจำลองเฉดและควบคุมดูแล พฤติกรรมการปฏิบตั ิงานใหค้ ำช้แี นะหากพบปัญหา 8. วธิ ีใชช้ ดุ การสอน

ห น้ า | 27 8.1 ศกึ ษาคู่มือการใช้ โครงการสอน และแผนการจดั การเรยี นรู้ เน้ือหาท่สี อน 8.2 ศกึ ษาวธิ กี ารใช้สื่อการเรียนการสอน 8.2 ศึกษาวิธกี ารวดั ผลและประเมินผล 9. ขน้ั ดำเนนิ การจดั กิจกรรมการจดั การเรยี นรู้ 9.1 ผสู้ อนช้ีแจงให้ผูเ้ รยี นทราบเกยี่ วกบั บทบาทหนา้ ทีข่ องผเู้ รียน 9.2 ผ้สู อนชีแ้ จงเนือ้ หาที่จะเรยี นในชดุ การสอนน้ี 9.3 ผสู้ อนชีแ้ จงวธิ ีการวัดผลประเมนิ ผลพรอ้ มกำหนดเวลาสง่ ชิ้นงาน 9.4 การจดั กิจกรรมการเรยี นการสอนในส่วนภาคทฤษฎี แบง่ ออกเป็น 5 ขนั้ ตอน ดงั นี้ ขั้นที่ 1 ทดสอบก่อนเรียน ครูมอบหมายแบบทดสอบก่อนเรียน Pre-Test ด้วย Google Form เรื่อง พื้นฐานการพัฒนาเว็บไซต์ทางธุรกจิ เพื่อวัดพื้นฐานความรู้กอ่ นเรียน โดยใช้ ระบบหอ้ งเรียนออนไลน์ Google classroom ขนั้ ท่ี 2 ขน้ั นำเขา้ สูบ่ ทเรยี น 2.1). ครจู ดั เตรียมเอกสาร พรอ้ มกับแนะนำรายวชิ า วธิ ีการให้คะแนนและวิธกี ารเรียน เรื่อง พื้นฐานการออกแบบและพฒั นาเวบ็ ไซต์ 2.2). ครแู จง้ จดุ ประสงค์การเรียนรขู้ องหนว่ ยเรียนท่ี 1 และขอให้ผู้เรียนรว่ มกนั ทำ กจิ กรรมการเรียนการสอน 2.3). ครูให้ผูเ้ รียนค้นคว้าหาความร้ดู ้วยตวั นำสู่การลงมอื ปฏบิ ัติ โดยใช้ทกั ษะการ เรยี นร้แู หง่ ศตวรรษท่ี 21 (Active Learning) ยกตวั อย่างเวบ็ ไซตท์ ีผ่ ู้เรยี นรูจ้ กั และร่วมกนั อภปิ ราย ขั้นท่ี 3 ข้ันจดั กจิ กรรมการเรยี นรู้ 1). ผสู้ อนแจกใบความรู้ที่ 1 เรอื่ ง พ้นื ฐานการพฒั นาเว็บไซตท์ างธรุ กิจ และใหผ้ ้เู รยี น ศกึ ษาเอกสารประกอบการสอนพ้นื ฐานการพฒั นาเวบ็ ไซต์ทางธุรกจิ หนว่ ยท่ี 1 ในระบบหอ้ งเรียน ออนไลน์ Google classroom 2). ผ้สู อนอธิบาย เน้อื หา พ้นื ฐานการพัฒนาเว็บไซต์ทางธุรกจิ ดว้ ย Google Slide อธบิ ายกระบวนการทำงานเว็บไซต์ ความรู้หลักการออกแบบเว็บไซต์ ขนั้ ตอนการพฒั นาเว็บไซต์ ตาม เนอ้ื หาในเอกสารประกอบการเรยี นรายวิชา การออกแบบและพัฒนาเวบ็ ไซต์ ขั้นที่ 4 ขนั้ สรปุ ครูให้ผ้เู รยี นซักถามขอ้ สงสัยทบทวนเนื้อหา ขั้นท่ี 5 ทดสอบหลังเรียน ครูใหน้ กั เรยี นทำแบบทดสอบหลงั เรียน Post-Test ดว้ ย Google Form เรอ่ื ง พ้นื ฐานการพฒั นาเว็บไซตท์ างธรุ กจิ เพ่ือวดั ประเมนิ ผลการเรยี นรู้

ห น้ า | 28 - ในขณะสอนภาคทฤษฎี ให้ปฏบิ ตั ดิ ังน้ี • สังเกตพฤตกิ รรมผูเ้ รยี นระหว่างการเรยี น • ขั้นสรุปบทเรียนควรเป็นกิจกรรมร่วมของผู้เรียนทุกกลุ่มหรือตัวแทนกลุ่มร่วมกนั ด้วยวธิ กี ารสุ่มจากเลือกกลุ่มดว้ ยเครอื่ งมอื https://wheelofnames.com/ • ตรวจดูผลการทดสอบกอ่ นเรียน Pre-Test หลงั เรียนแลว้ แจ้งผลใหผ้ เู้ รยี นทราบ • สอนซอ่ มเสริมหรอื มอบหมายงานเพิม่ เตมิ ให้กับผู้เรยี นที่ไม่ผา่ นเกณฑ์ 9.5 การจดั กิจกรรมการเรียนการสอนในสว่ นภาคปฏบิ ัติ แบง่ ออกเปน็ 5 ข้ันตอนดงั นี้ ข้ันท่ี 1 ข้ันกำหนดจุดประสงค์ 1.1). ครูแจ้งจุดประสงคก์ ารเรยี นรู้ของหนว่ ยเรียนที่ 1 และขอให้ผู้เรยี นร่วมกนั ทำ กิจกรรมการเรยี นการสอน 1.2). ครแู จกใบงานที่ 1 เรือ่ ง พนื้ ฐานการออกแบบสร้างเว็บไซต์ ให้แก่ผู้เรียน ขนั้ ที่ 2 ขน้ั เตรียมการสาธิต ครูจัดเตรียมและตรวจสภาพความพรอ้ มเครอื่ งคอมพวิ เตอร์ โปรแกรมทจี่ ำเป็น ไดแ้ ก่ Google chrome, โปรแกรมประมวลผลคำ และตวั อยา่ งการการออกแบบโครงสร้างเวบ็ ไซต์ เลอื กใช้ไฟล์ สี ด้วยโปรแกรมเลือกสแี ละจำลองเฉดสี ใหผ้ เู้ รียนดเู ป็นตวั อยา่ ข้ันที่ 3 ขน้ั ทำการสาธิต 3.1). ครูสาธติ ปฏิบัตเิ กี่ยวกับการออกแบบโครงสร้างเว็บไซต์และการใชเ้ คร่ืองมอื เลอื กสดี ว้ ย https://coolors.co/ 3.2). ครูให้ผูเ้ รยี นซกั ถามข้อสงสัยทบทวนเนื้อหา ข้ันท่ี 4 ขั้นลงมอื ปฏิบตั ิ 4.1). ครสู าธิตและใหน้ ักเรยี นปฏิบัติตาม เกยี่ วกับการออกแบบโครงสร้างเว็บไซต์ และการใชเ้ คร่อื งมือเลือกสีดว้ ย https://coolors.co/ 4.2). นกั เรียนสง่ ช้ินงานผ่านแบบฟอร์มด้วยระบบออนไลนร์ ะบบ Google Classroom 4.3). นกั เรยี นตรวจดชู ิน้ งานตัวเองผา่ นทางเวบ็ ไซต์ https://sites.google.com/site/kruwerathamt ขัน้ ท่ี 5 ข้ันตรวจและประเมินผลชนิ้ งาน 5.1).ครใู ห้นกั เรียนทกุ คนตรวจดูผลงานตัวเองทาง เว็บไซต์https://sites.google.com/site/kruwerathamt 5.2). ครูใหข้ ้อแนะนำ และประเมินผลชิ้นงาน

ห น้ า | 29 - ในขณะสอนภาคปฏิบตั ิ ใหป้ ฏิบัติดงั นี้ • ขณะผ้เู รียนปฏิบัติงานตามใบงาน ผ้สู อนควรควบคุมดูแลการปฏิบตั ิงานของผู้เรียน อย่างใกล้ชิด เน้นเรื่องการใช้ทักษะการเรียนรู้แห่งศตวรรษที่ 21 หากผู้เรียนมีปัญหาขณะ ปฏิบัติงานจะได้ให้คำแนะนำช่วยเหลือ มีกิจนิสัยในการปฏิบัติงานตามหลักของเศรษฐกิจ พอเพียง ค้นคว้าหาความรู้ดว้ ยตวั นำส่กู ารลงมือปฏบิ ัติ • ผสู้ อนควบคุมและติดตามผลการปฏบิ ตั งิ านของผูเ้ รยี นใหเ้ ป็นไปตามขั้นตอน การปฏบิ ตั งิ าน • สังเกตพฤติกรรมผู้เรียนระหวา่ งการปฏบิ ัติงาน • ตรวจผลงานการปฏบิ ัตงิ านตามใบงาน แล้วแจ้งผลให้ผู้เรยี นทราบ • กรณผี ้เู รยี นท่มี ผี ลการประเมินไม่ผ่านเกณฑ์ตอ้ งเรียกผเู้ รียนมารับทราบและแจง้ ข้อผดิ พลาดให้ผเู้ รยี นทราบเพื่อปรับปรุงแกไ้ ข 10. วิธีการใช้ส่อื การเรยี นการสอน ชดุ การสอนที่ 1 เรอ่ื ง พืน้ ฐานการพัฒนาเว็บไซตท์ างธรุ กจิ ผู้สอนต้องศึกษาวิธีการเรียนรู้จากแผนการจัดการเรียนรู้ คู่มือการใช้สื่อ และศึกษาเนื้อหา เรื่อง พื้นฐานการพัฒนาเว็บไซต์ทางธุรกิจ จากเอกสารประกอบการเรียนและสื่อ Google Slide หน่วยที่ 1 เรื่อง พื้นฐานการพัฒนาเว็บไซต์ทางธุรกิจ ก่อนทำการสอนจรงิ ส่วนสื่อที่ผู้เรียนใช้ไดแ้ ก่ เอกสารประกอบการเรียนหนว่ ยท่ี 1 เรือ่ ง พน้ื ฐานการพฒั นาเว็บไซต์ทางธรุ กิจผู้สอนต้องแจง้ ลว่ งหน้า ใหผ้ เู้ รียนทราบ 11. บทบาทของผู้เรียน 11.1 ผู้เรียนต้องเตรียมเอกสารประกอบการเรียน เรื่อง พื้นฐานการพัฒนาเว็บไซต์ทาง ธุรกิจ ก่อนเรียนโดยผู้สอนจดั เตรียมต้นฉบับใหล้ ว่ งหนา้ ทนั วันใช้สอนจริง 11.2 ผูเ้ รยี นต้องปฏิบัตติ ามคำแนะนำของผสู้ อน 11.3 ผเู้ รียนตอ้ งทำกิจกรรมตามท่มี อบหมายและรว่ มกนั อภปิ ราย 11.4 ผ้เู รยี นต้องปฏิบัตงิ านตามใบงาน 11.5 ผ้เู รยี นต้องส่งชน้ิ งานให้ตรงตามเวลาท่ีกำหนด 12. การวดั และประเมนิ ผล 12.1 วธิ ีวัดผล 12.1.1 สังเกตพฤติกรรมระหวา่ งการเรยี นและการปฏิบัติงาน 12.1.2 ตรวจผลจากแบบฝกึ หดั /การอภิปราย

ห น้ า | 30 12.1.3 ตรวจแบบทดสอบกอ่ นเรียน แบบทดสอบหลงั เรียน 12.1.4 ตรวจผลการปฏิบตั งิ านตามใบงาน 12.3.5 ประเมินผลจากการวัดทั้งส่วนที่เป็นความรู้ ทักษะและคุณลักษณะอันพึง ประสงค์ 12.2 เครอื่ งมอื วดั 12.2.1 แบบสงั เกตพฤติกรรมระหว่างเรียนและการปฏบิ ัตงิ าน 12.2.2 แบบฝึกหัด/ใบประเมนิ ผลการอภปิ ราย 12.2.3 แบบทดสอบก่อนเรียน แบบทดสอบหลังเรียน 12.2.4 ใบประเมนิ ผลการปฏิบัติงานตามใบงาน 12.2.5 แบบประเมินคณุ ลกั ษณะอันพึงประสงค์ 12.3 เกณฑ์การประเมนิ ผล 12.3.1 ผูเ้ รียนได้คะแนนพฤตกิ รรมระหวา่ งการเรยี นการสอนและการปฏบิ ตั งิ าน ไม่ต่ำกวา่ ร้อยละ 60 12.3.2 คะแนนรวมตามแบบประเมินผลงานใบงาน ไมต่ ่ำกวา่ ร้อยละ 60 12.3.3 คะแนนแบบฝึกหดั และแบบทดสอบ ไมต่ ำ่ กว่าร้อยละ 60 12.3.4 คะแนนประเมนิ คุณลักษณะอันพึงประสงค์ ไมต่ ่ำกวา่ รอ้ ยละ 60

P a g e | 31 โครงการสอน ชุดการสอนที่ 1 รหสั วชิ า 30204-2103ชอื่ วิชา การพัฒนาเวบ็ ไซตท์ างธุรกิจ ช่ือหน่วย พืน้ ฐานการพัฒนาเว็บไซต์ทางธุรกจิ จำนวน 4 ช่วั โมง หัวขอ้ การเรยี นรู้ 1). ความรู้เกยี่ วกับเวบ็ ไซต์ 2). ความรหู้ ลกั การออกแบบเวบ็ ไซต์ 3). ส่วนประกอบของเว็บไซต์ 4). รูปแบบไฟลท์ ่ีเหมาะสมสำหรบั การพฒั นาเวบ็ ไซต์ 5). ภาษาท่ีเหมาะสมในการพัฒนาเว็บไซต์ 6). รปู แบบของเวบ็ ไซต์ธรุ กจิ 7). การเลือกใช้สี 8). การออกแบบโครงสรา้ งเวบ็ ไซต์ หวั ขอ้ การเรยี นรู้ จุดประสงคเ์ ชิงพฤตกิ รรม 1). ความรเู้ ก่ยี วกับเวบ็ ไซต์ 1). ผเู้ รียนมคี วามรแู้ ละความเขา้ ใจ เกี่ยวกบั เว็บไซต์ 2). ความรู้หลกั การออกแบบเวบ็ ไซต์ หลักการออกแบบเวบ็ ไซต์ ส่วนประกอบของเวบ็ ไซต์. 3). ส่วนประกอบของเวบ็ ไซต์ รูปแบบไฟลท์ เ่ี หมาะสมสำหรับการพฒั นาเวบ็ ไซต์ 4). รูปแบบไฟลท์ ่เี หมาะสมสำหรับการพฒั นา ภาษาท่เี หมาะสมในการพฒั นาเวบ็ ไซต์ รปู แบบของ เวบ็ ไซต์ เว็บไซต์ธุรกิจ 5). ภาษาที่เหมาะสมในการพัฒนาเวบ็ ไซต์ 2). มที ักษะ เลอื กใชไ้ ฟล์ สี สำหรับเวบ็ ไซต์ด้วย 6). รปู แบบของเว็บไซต์ธุรกจิ โปรแกรมเลอื กสีและจำลองเฉดสี ออกแบบโครงสร้าง 7). การเลอื กใชส้ ี เวบ็ ไซต์ไดอ้ ยา่ งถูกตอ้ งมาตรฐานเว็บไซตไ์ ด้ 8). การออกแบบโครงสร้างเว็บไซต์ 3). สนใจใฝ่รู้ รบั ผดิ ชอบเขา้ เรยี นตรงเวลา แต่งกาย เรียบรอ้ ย มีน้ำใจชว่ ยเหลอื ชว่ ยเหลอื ผอู้ ่นื และการ ปฏิบตั ิงานร่วมกบั ผู้อ่ืน 4). ยอมรับรูปแบบภาษาในการพฒั นาเวบ็ ไซต์ จัดลำดับแนวทางหลักการออกแบบเว็บไซต์ 5). มเี จตคติและกจิ นสิ ัยท่ีดีในการทำงาน ดว้ ยความ ละเอยี ดรอบคอบ ปลอดภัย เปน็ ระเบยี บ สะอาด ตรงตอ่ เวลา มีความซอ่ื สัตย์ รับผิดชอบ รกั ษาสภาพแวดล้อม และมคี ุณธรรม จรยิ ธรรมและคณุ ลกั ษณะอนั พงึ ประสงค์ ที่ตอ้ งการ

ห น้ า | 32 วธิ กี ารสอน : 1). บรรยาย/อธิบาย เรื่อง พนื้ ฐานการพัฒนาเวบ็ ไซต์ทางธรุ กิจ 2). สาธิตปฏิบัติเกีย่ วกับการออกแบบโครงสรา้ งเว็บไซตแ์ ละการใช้เครอ่ื งมือเลือกสี สอ่ื การสอน 1). ชุดการสอนที่ 1 เรือ่ ง พน้ื ฐานการพฒั นาเวบ็ ไซต์ทางธรุ กจิ 2). ส่ือ Google Slide เรอ่ื ง พ้นื ฐานการพัฒนาเวบ็ ไซต์ทางธุรกจิ 3). ใบงานเรือ่ ง พ้นื ฐานการพฒั นาเว็บไซต์ทางธุรกจิ 4). สื่อ Active Learning ด้วยโปรแกรม Kahoot เรือ่ ง พ้นื ฐานการพฒั นาเว็บไซตท์ างธรุ กิจ 5). ตัวอยา่ งการการออกแบบโครงสร้างเว็บไซต์ เลอื กใช้ไฟล์ สี ด้วยโปรแกรมเลอื กสีและจำลองเฉดสเี สร็จแลว้ การประเมิน : 1). สงั เกตพฤติกรรมระหวา่ งการเรียนและการปฏบิ ัตงิ าน 2). ตรวจผลจากแบบฝึกหัด/การอภปิ ราย 3). ตรวจแบบทดสอบก่อนเรียน แบบทดสอบหลังเรยี น 4). ตรวจผลการปฏิบัตงิ านตามใบงาน 5). ประเมินผลจากการวัดทงั้ ส่วนทเ่ี ป็นความรู้ ทักษะและคณุ ลกั ษณะอนั พึงประสงค์

ห น้ า | 33 แผนการจดั การเรยี นรู้ สอนครั้งท่ี 1 จำนวน 4 ชม. ชื่อวิชา การพัฒนาเว็บไซต์ทางธรุ กจิ รหัสวชิ า 30204-2103 หน่วยท่ี 1 ชื่อหนว่ ย พ้นื ฐานการพฒั นาเว็บไซตท์ างธุรกจิ 1. หัวข้อการเรียนรู้ 1). ความรู้เก่ยี วกับเวบ็ ไซต์ 2). ความรูห้ ลักการออกแบบเว็บไซต์ 3). สว่ นประกอบของเวบ็ ไซต์ 4). รปู แบบไฟลท์ ่ีเหมาะสมสำหรับการพัฒนาเว็บไซต์ 5). ภาษาที่เหมาะสมในการพฒั นาเว็บไซต์ 6). รูปแบบของเว็บไซต์ธุรกิจ 7). การเลอื กใช้สี 8). การออกแบบโครงสรา้ งเวบ็ ไซต์ 2. สาระสำคัญ การสรา้ งเวบ็ ไซตส์ งิ่ สำคญั อยู่ท่ีการ ออกแบบเวบ็ เพราะเวบ็ ไซต์ทม่ี รี ูปแบบสวยงาม จะสามารถดึงดูด ความสนใจจากผู้คนได้ดีกว่า ทำให้ผู้คนเกดิ ความรู้สกึ ประทับใจ ดงั น้นั เริม่ แรกกอ่ นทำเว็บไซต์ จงึ จำเปน็ ตอ้ ง ทำความเขา้ ใจ ความรู้เก่ียวกับเว็บไซต์ ความรู้หลักการออกแบบเวบ็ ไซต์ ส่วนประกอบของเว็บไซต์ การ เลอื กใช้สี รปู แบบไฟล์ท่เี หมาะสมสำหรับการพฒั นาเวบ็ ไซต์ ภาษาท่เี หมาะสมในการพฒั นาเวบ็ ไซต์ รปู แบบ ของเวบ็ ไซตธ์ ุรกจิ 3. สมรรถนะประจำหนว่ ย 1). แสดงความรูเ้ กยี่ วกบั พนื้ ฐานกระบวนการทำงาน ส่วนประกอบ และการออกแบบพัฒนาเว็บไซต์ ได้ถูกต้องตามมาตรฐาน 2). ออกแบบโครงสรา้ งเว็บไซตไ์ ด้ถูกต้องตามมาตรฐาน 4. จุดประสงค์การเรยี นรู้ 4.1 จดุ ประสงคท์ ่วั ไป 1). นกั เรยี นมีความรเู้ กีย่ วกบั เว็บไซต์ได้ 2). นักเรยี นเขา้ ใจความร้หู ลักการออกแบบเวบ็ ไซต์ได้ 3). นกั เรียนบอกรปู แบบไฟลท์ ่เี หมาะสมสำหรับการพฒั นาเวบ็ ไซต์ได้ 4). นกั เรยี นภาษาทเ่ี หมาะสมในการพัฒนาเว็บไซต์ได้ 5). นกั เรียนบอกรปู แบบของเว็บไซต์เพ่ือธรุ กจิ ได้ 6). นกั เรยี นออกแบบโครงสร้างเว็บไซต์ได้

ห น้ า | 34 7). นกั เรียนเลอื กใชส้ ีจากเคร่ืองมือสำเรจ็ รปู ได้ 4.2 จุดประสงคเ์ ชิงพฤตกิ รรม 1). อธบิ ายความรเู้ บอ้ื งตน้ พื้นฐานการออกแบบและพฒั นาเว็บไซต์ได้ตามมาตรฐาน W3C 2). บอกสว่ นประกอบของเวบ็ ไซต์ได้ตามมาตรฐานเว็บไซต์ 3). อธบิ ายรูปแบบไฟลท์ ่ีเหมาะสมสำหรับการพฒั นาเวบ็ ไซตต์ ามได้มาตรฐานภาพ 4). บอกภาษาที่เหมาะกบั การพัฒนาเว็บไซตไ์ ด้อยา่ งเหมาะสม 5). อธบิ ายรปู แบบของเว็บไซต์เพอื่ ธรุ กิจได้ตามมาตรฐานการออกแบบออกแบบเวบ็ ไซต์ 6). ออกแบบโครงสร้างเว็บไซตไ์ ด้อยา่ งได้ถกู ตอ้ งมาตรฐานเว็บไซต์ 7). เลอื กใช้ไฟล์ สี สำหรับเว็บไซต์ดว้ ยโปรแกรมเลือกสีและจำลองเฉดสไี ด้อยา่ งถกู ต้อง 5. กิจกรรมการจดั การเรยี นรู้ (รูปแบบ 5 ข้ันตอน ตามทฤษฏีหลกั การของ ศ.ดร. ชัยยงค์ พรหมวงศ์ ) ในการเรียนการสอนของหนว่ ยที่ 1 ครงั้ ท่ี 1 (จำนวน 1 ชว่ั โมง) 1). ผสู้ อนชแี้ จงให้ผู้เรยี นทราบเกย่ี วกบั บทบาทหนา้ ท่ขี องผ้เู รียน 2). ผสู้ อนชี้แจงเนื้อหาทจ่ี ะเรยี นในชดุ การสอนน้ี 3). ผู้สอนชแี้ จงวิธกี ารวัดผลประเมนิ ผลพรอ้ มกำหนดเวลาสง่ ชนิ้ งาน 4). การจัดกจิ กรรมการเรยี นการสอนในสว่ นภาคทฤษฎี แบง่ ออกเป็น 5 ข้นั ตอน ดงั น้ี ขั้นที่ 1 ทดสอบก่อนเรียน ครูมอบหมายแบบทดสอบก่อนเรียน Pre-Test ด้วย Google Form เรื่อง พื้นฐานการพัฒนาเว็บไซต์ทางธุรกิจ เพื่อวัดพื้นฐานความรู้ก่อนเรียน โดยใช้ระบบห้องเรียน ออนไลน์ Google classroom ขั้นท่ี 2 ขน้ั นำเข้าสูบ่ ทเรียน 2.1). ครจู ดั เตรียมเอกสาร พร้อมกบั แนะนำรายวิชา วธิ กี ารให้คะแนนและวิธกี ารเรยี นเร่ือง พ้นื ฐานการออกแบบและพฒั นาเว็บไซต์ 2.2). ครแู จง้ จุดประสงคก์ ารเรียนร้ขู องหนว่ ยเรียนท่ี 1 และขอให้ผู้เรยี นรว่ มกนั ทำกิจกรรม การเรยี นการสอน 2.3). ครูให้ผู้เรียนคน้ ควา้ หาความรดู้ ว้ ยตัวนำสู่การลงมือปฏบิ ัติ โดยใช้ทกั ษะการเรียนร้แู ห่ง ศตวรรษท่ี 21 (Active Learning) ยกตวั อยา่ งเว็บไซตท์ ผี่ ู้เรียนรู้จกั และร่วมกันอภิปราย ข้ันที่ 3 ขัน้ จัดกจิ กรรมการเรยี นรู้ 1). ผสู้ อนแจกใบความรู้ท่ี 1 เรอื่ ง พ้ืนฐานการพัฒนาเวบ็ ไซต์ทางธุรกิจ และให้ผู้เรียนศึกษา เอกสารประกอบการสอนพืน้ ฐานการพฒั นาเว็บไซตท์ างธรุ กิจ หนว่ ยท่ี 1 ในระบบหอ้ งเรียนออนไลน์ Google classroom 2). ผู้สอนอธิบาย เน้อื หา พื้นฐานการพัฒนาเว็บไซตท์ างธุรกจิ ดว้ ย Google Slide อธบิ าย กระบวนการทำงานเว็บไซต์ ความรู้หลกั การออกแบบเว็บไซต์ ขนั้ ตอนการพัฒนาเวบ็ ไซต์ ตามเนอ้ื หาใน เอกสารประกอบการเรยี นรายวิชา การออกแบบและพัฒนาเวบ็ ไซต์

ห น้ า | 35 ขั้นท่ี 4 ขนั้ สรุป ครใู หผ้ ้เู รียนซกั ถามขอ้ สงสัยทบทวนเนอ้ื หา ขน้ั ท่ี 5 ทดสอบหลังเรยี น ครูให้นกั เรียนทำแบบทดสอบหลังเรยี น Post-Test ดว้ ย Google Form เร่อื ง พ้นื ฐานการพฒั นาเว็บไซต์ทางธรุ กิจ เพื่อวดั ประเมินผลการเรยี นรู้ - ในขณะสอนภาคทฤษฎี ให้ปฏบิ ัติดังนี้ • สงั เกตพฤตกิ รรมผ้เู รยี นระหวา่ งการเรยี น • ขั้นสรุปบทเรียนควรเป็นกิจกรรมร่วมของผู้เรียนทุกกลุ่มหรือตัวแทนกลุ่มร่วมกัน ด้วย วธิ กี ารสุม่ จากเลือกกล่มุ ดว้ ยเครือ่ งมอื https://wheelofnames.com/ • ตรวจดูผลการทดสอบก่อนเรยี น Pre-Test หลงั เรียนแลว้ แจง้ ผลให้ผูเ้ รยี นทราบ • สอนซอ่ มเสรมิ หรอื มอบหมายงานเพิ่มเติมให้กับผเู้ รียนทไ่ี มผ่ ่านเกณฑ์ 5). การจดั กจิ กรรมการเรียนการสอนในสว่ นภาคปฏบิ ัติ แบ่งออกเปน็ 5 ข้ันตอนดงั น้ี ข้ันท่ี 1 ขั้นกำหนดจุดประสงค์ 1.1). ครูแจง้ จดุ ประสงค์การเรยี นรู้ของหนว่ ยเรยี นท่ี 1 และขอให้ผู้เรียนร่วมกนั ทำกจิ กรรม การเรยี นการสอน 1.2). ครูแจกใบงานท่ี 1 เร่ือง พ้นื ฐานการออกแบบสร้างเว็บไซต์ ให้แก่ผู้เรียน ขนั้ ที่ 2 ขนั้ เตรียมการสาธติ ครูจดั เตรียมและตรวจสภาพความพรอ้ มเครือ่ งคอมพิวเตอร์ โปรแกรมท่จี ำเป็น ไดแ้ ก่ Google chrome, โปรแกรมประมวลผลคำ และตวั อย่างการการออกแบบโครงสร้างเว็บไซต์ เลือกใชไ้ ฟล์ สี ดว้ ยโปรแกรมเลอื กสแี ละจำลองเฉดสี ให้ผเู้ รียนดเู ปน็ ตัวอย่า ขัน้ ท่ี 3 ข้นั ทำการสาธิต 3.1). ครสู าธติ ปฏิบัติเกย่ี วกบั การออกแบบโครงสรา้ งเวบ็ ไซต์และการใชเ้ ครื่องมือเลือกสีด้วย https://coolors.co/ 3.2). ครใู ห้ผู้เรียนซกั ถามข้อสงสัยทบทวนเนอ้ื หา ขน้ั ที่ 4 ขั้นลงมอื ปฏบิ ตั ิ 4.1). ครสู าธติ และให้นกั เรยี นปฏบิ ัติตาม เก่ยี วกบั การออกแบบโครงสร้างเวบ็ ไซต์และการใช้ เคร่ืองมอื เลอื กสดี ว้ ย https://coolors.co/ 4.2). นกั เรียนสง่ ช้นิ งานผา่ นแบบฟอรม์ ด้วยระบบออนไลนร์ ะบบ Google Classroom 4.3). นักเรยี นตรวจดูชิ้นงานตวั เองผ่านทางเว็บไซต์ https://sites.google.com/site/kruwerathamt

ห น้ า | 36 ขั้นท่ี 5 ขัน้ ตรวจและประเมินผลชิ้นงาน 5.1).ครูให้นกั เรียนทกุ คนตรวจดูผลงานตัวเองทาง เว็บไซต์https://sites.google.com/site/kruwerathamt 5.2). ครใู ห้ข้อแนะนำ และประเมินผลชน้ิ งาน - ในขณะสอนภาคปฏิบตั ิ ให้ปฏิบตั ิดงั น้ี • ขณะผู้เรียนปฏิบัติงานตามใบงาน ผู้สอนควรควบคุมดูแลการปฏิบัติงานของผู้เรียนอย่าง ใกลช้ ิด เนน้ เรือ่ งการใชท้ ักษะการเรียนรแู้ ห่งศตวรรษท่ี 21 หากผ้เู รียนมีปัญหาขณะปฏิบัติงานจะได้ ให้คำแนะนำช่วยเหลือ มีกิจนิสัยในการปฏิบัติงานตามหลักของเศรษฐกิจพอเพียง ค้นคว้าหาความรู้ ดว้ ยตวั นำสู่การลงมอื ปฏิบัติ • ผู้สอนควบคุมและตดิ ตามผลการปฏบิ ตั ิงานของผเู้ รียนใหเ้ ปน็ ไปตามขน้ั ตอน การปฏิบัติงาน • สงั เกตพฤตกิ รรมผูเ้ รยี นระหวา่ งการปฏิบตั ิงาน • ตรวจผลงานการปฏิบัติงานตามใบงาน แล้วแจ้งผลให้ผู้เรียนทราบ กรณีผู้เรยี นที่มผี ลการประเมินไม่ผา่ นเกณฑต์ อ้ งเรยี กผเู้ รียนมารบั ทราบและแจ้งข้อผดิ พลาดให้ผูเ้ รียน ทราบเพื่อปรับปรุงแก้ไข 6. ส่อื การจัดการเรียนรู้ 1). ชุดการสอนที่ 1 เรอื่ ง พ้ืนฐานการพัฒนาเวบ็ ไซตท์ างธรุ กิจ 2). สือ่ Google Slide เรื่อง พื้นฐานการพฒั นาเวบ็ ไซตท์ างธรุ กจิ 3). ใบงานเรอื่ ง พื้นฐานการพฒั นาเวบ็ ไซตท์ างธุรกิจ 4). สือ่ Active Learning ด้วยโปรแกรม Kahoot เร่อื ง พืน้ ฐานการพฒั นาเว็บไซตท์ างธรุ กจิ 5). ตวั อยา่ งการการออกแบบโครงสร้างเวบ็ ไซต์ เลือกใช้ไฟล์ สี ดว้ ยโปรแกรมเลอื กสแี ละจำลองเฉดสี เสรจ็ แลว้ 7. การวัดผลและประเมินผล กอ่ นเรยี น วธิ กี ารวัดผล ให้นกั เรยี นทำแบบทดสอบก่อนเรียนจำนวน 10 ขอ้ เครื่องมอื วัด 1) แบบทดสอบกอ่ นเรยี น หนว่ ยที่ 1 เรอื่ ง พ้นื ฐานการพัฒนาเวบ็ ไซต์ทางธรุ กิจ ขณะเรยี น วิธีการวัดผล ถาม – ตอบ และใหน้ กั เรียนปฏิบตั ิตามใบงานที่ 1 ออกแบบหนา้ เวบ็ ไซต์ จำนวน 1 ชิ้นงาน เครอ่ื งมือวัด 1) ถามตอบจากบทเรยี น พืน้ ฐานการออกแบบและพฒั นาเว็บไซต์

ห น้ า | 37 2) ใบงานท่ี 1 เรื่อง พื้นฐานการออกแบบและพัฒนาเวบ็ ไซต์ หลงั เรียน วิธกี ารวดั ผล ให้นักเรียนทำแบบทดสอบหลังเรียนจำนวน 10 ขอ้ เครอื่ งมอื วัด 1)แบบทดสอบหลงั เรยี น หนว่ ยท่ี 1 เรื่อง พืน้ ฐานการพัฒนาเว็บไซต์ทางธุรกจิ 8. แหลง่ การเรยี นรู้เพมิ่ เตมิ 8.1 ภายในสถานศกึ ษา 1). หอ้ งสมุดวิทยาลยั เทคนคิ สกลนคร 2). ห้องอินเทอรเ์ น็ต 3). หอ้ งสมุดแผนกวชิ า 8.2 ภายนอกสถานศึกษา 1). ห้องสมุดประชาชน 2). ศูนย์การเรยี นรู้ชุมชน 3). ศูนยว์ ทิ ยบุ รกิ ารมหาวทิ ยาลยั ทีใ่ กล้กบั สถานศึกษา 9. กิจกรรมเสนอแนะ (ถา้ มี) 1). บรู ณาการกับวชิ าชีวติ และวฒั นธรรมไทย ดา้ นการพดู การอา่ น การเขียน และการฝึกปฏิบตั ิ ตนทางสงั คมดา้ นการเตรียมความพรอ้ ม ความรับผดิ ชอบ และความสนใจใฝ่รู้ 2). บรู ณาการกบั วิชาวทิ ยาศาสตร์ ดา้ นการมเี หตุผล และกระบวนการทำงานอย่างเป็นระบบ 3). บูรณาการกับวชิ าภาษาอังกฤษที่เกยี่ วกบั คำศัพทเ์ ฉพาะ

ห น้ า | 38 เอกสารประกอบการเรียน วชิ า การพฒั นาเวบ็ ไซต์ทางธรุ กิจ หลักสตู ร ประกาศนยี บัตรวชิ าชพี ชั้นสงู (ปวส.) พุทธศกั ราช 2563 หนว่ ยที่ 1 เรือ่ ง พน้ื ฐานการออกแบบและพฒั นาเว็บไซต์ โดย นายวธี รรม เทศประสทิ ธ์ิ ครู คศ.1 วทิ ยาลัยเทคนคิ สกลนคร สำนกั งานคณะกรรมการการอาชีวศกึ ษา กระทรวงศกึ ษาธิการ

ห น้ า | 39

ห น้ า | 40 คำแนะนำสำหรับผูเ้ รียน 1. ให้ผู้เรยี นฟงั คำแนะนำจำกผูส้ อน 2. ให้ผเู้ รยี นทำแบบทดสอบกอ่ นเรยี น จำนวน 20 ข้อ เวลำ 20 นำที 3. ให้ผู้เรียนทำกจิ กรรมกำรจัดกำรเรียนรู้ท่ีผู้สอนมอบหมำยตำมขน้ั ตอนทกุ ขั้นตอน 4. ใหผ้ ู้เรียนทำแบบทดสอบหลังเรียน จำนวน 20 ข้อ เวลำ 20 นำที 5. ให้ผ้เู รียนลงมือปฏบิ ตั งิ ำนตำมข้นั ตอนใบงำน ฟงั ขน้ั ตอนกำรลงมือปฏิบัตงิ ำน ตำมคำแนะนำผสู้ อน อยำ่ งเคร่งครดั เพ่ื อปฏิบัติงำนอย่ำงถกู วิธแี ละปลอดภัย