2.1.2 แผนการจัดการเรียนรู้_Web Design

Page 1

แผนการจัดการเรียนรู การออกแบบและพัฒนาเว็บไซต์ (รหัสวิชา 3901-2006) หลักสูตรประกาศนียบัตรวิชาชีพชั้นสูง พุทธศักราช 2557

นายกิตติ์กาญจน์ ปฏิพันธ์ วิทยฐานะ ครูชานาญการพิเศษ

สาขาวิชาเทคโนโลยีสารสนเทศ วิทยาลัยอาชีวศึกษาขอนแก่น สานักงานคณะกรรมการการอาชีวศึกษา กระทรวงศึกษาธิการ


คำนำ แผนการจั ด การเรี ย นรู้ ใ นรายวิ ช า กำรออกแบบและพั ฒ นำเว็ บ ไซต์ ตามหลั ก สู ต ร ประกาศนียบัตรวิชาชีพชั้นสู ง พุ ทธศักราช 2557 คณะวิชาเทคโนโลยีสารสนเทศและการสื่อสาร สาขาวิชาเทคโนโลยีสารสนเทศ สานักงานคณะกรรมการการอาชีวศึกษา เป็นแผนการจัดการเรียนรู้ ที่ยึดหลักที่สาคัญคือ หลักการอาชีวศึกษา หลักสูตร และหลักการจัดการเรียนรู้ เพื่อเป็นแนวทางให้ อาจารย์ผู้สอน จัดกระบวนการเรียนรู้ การประเมินผลตามสภาพจริง (Authentic Assessment) การ เรียบเรียงเนื้อหา ตรงตามจุดประสงค์รายวิชา มาตรฐานรายวิชา และคาอธิบายรายวิชา มุ่งให้ผู้เรียน แสวงหาความรู้จากแหล่งความรู้ที่หลากหลาย สร้างองค์ความรู้ใหม่ ๆ มีความคิดเชิงสร้างสรรค์ เป็น คนดีทั้งกาย วาจา ใจ มีคุณธรรม จริยธรรม และจรรยาบรรณวิชาชีพ เพื่อให้เป็นกาลังคนด้านดิจิทัลที่ มีคุณภาพของประเทศไทย ขอขอบคุณ..... คณะผู้บริหาร และบุคลากรในวิทยาอาชีวศึกษาขอนแก่น ที่มองเห็นคุณค่าและความสาคัญ ของแผนการจัดการเรียนรู้ในรายวิชาการออกแบบและพัฒนาเว็บไซต์ ผู้ เ รี ย นและ ผู้ ส นใจทุ ก ท่ า น ที่ เป็ น ผู้ เ ก็ บ เกี่ ย วและเรี ย นรู้ ห ลั ก การจาก แผนฯเล่ ม นี้ คณาจารย์ ทุ ก ท่ า น ที่ เป็ น ต้ น แบบทางความคิ ด ดี ๆ และประพฤติ ต นเป็ น แบบอย่ างที่ ดี พี่ ๆ เพื่อน ๆ น้อง ๆ รวมทั้ง ภรรยา ลูก ๆ และทุกคนที่มีส่วนร่วมให้แผนการจัดการเรียนรู้ เล่มนี้สาเร็จลงได้ด้วยดี ที่สาคัญที่สุดในชีวิตคือ คุณพ่อเหรียญ-คุณแม่แดง ปฏิพันธ์ ที่เป็นต้นแบบ แห่งพลังความคิดดี ๆ เป็นแบบอย่างที่ดี รวมทั้งคาสอนดี ๆ หล่อหลอมให้ผมมีคุณภาพชีวิตที่ดี ทาให้ ได้มีโอกาสเรียนรู้และสร้างสรรค์สิ่งดี ๆ ให้กับเยาวชน สังคม และประเทศชาติ ผู้เขียนหวังเป็นอย่างยิ่งว่าแผนการจัดการเรียนรู้รายวิชาการออกแบบและพัฒนาเว็บ ไซต์ เล่มนี้จะเป็นประโยชน์ต่อผู้เรียนและผู้สนใจศึกษาค้นคว้าด้วยตนเองเป็นอย่างยิ่ง

กิตติ์กาญจน์ ปฏิพันธ์ วิทยฐานะ ครูชานาญการพิเศษ


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

ก ข ค ฆ ง จ 1 6 11 16 21 26 31 36 41 45


หลักสูตรประกำศนียบัตรวิชำชีพชั้นสูง พุทธศักรำช 2557 ประเภทวิชำเทคโนโลยีสำรสนเทศและกำรสื่อสำร สำขำวิชำเทคโนโลยีสำรสนเทศ วิชำกำรออกแบบและพัฒนำเว็บไซต์ (Web Design and Development) รหัสวิชำ 3901-2006 ทฤษฏี 1 ปฏิบัติ 4 หน่วยกิต 3 จุดประสงค์รำยวิชำ 1. มีความเข้าใจหลักการออกแบบและพัฒนาเว็บ 2. สามารถออกแบบและพัฒนาเว็บ 3. มีกิจนิสัยในการทางานด้วยความประณีต รอบคอบและปลอดภัย ตระหนักถึงคุณภาพ ของงานและมีจริยธรรมในงานอาชีพ สมรรถนะรำยวิชำ 1. ออกแบบและพัฒนาเว็บด้วยโปรแกรมสาเร็จรูปเบื้องต้น 2. สร้างเว็บเพจ 3. ทดสอบการใช้และการทางานของเว็บเพจ คำอธิบำยรำยวิชำ ศึกษาและปฏิบัติ หลักการออกแบบและพัฒนาเว็บไซต์ แนวคิดและรูปแบบของเว็บไซต์ แบบต่าง ๆ การวิเคราะห์และการออกแบบเว็บไซต์ การกาหนดความต้องการ การรวบรวมข้อมูล ที่เกี่ยวข้อง การเลือกใช้สื่อในรูปแบบต่าง ๆ ที่เหมาะสม การกาหนดการเชื่อมโยง ขั้นตอนการ สร้างเว็บไซต์ การเลือกและติดตั้งโปรแกรมที่เกี่ยวข้อง การสร้าง Table , Form และ Frame, การกาหนด Link , การใช้งานภาพกราฟิก การจัดการ Layers และ Table , การใช้งานสื่อ รูปแบบต่าง ๆ การสร้าง Dynamic web page


ตำรำงวิเครำะห์หลักสูตร หลักสูตรประกำศนียบัตรวิชำชีพชั้นสูง พุทธศักรำช 2557 ประเภทวิชำเทคโนโลยีสำรสนเทศและกำรสื่อสำร สำขำวิชำเทคโนโลยีสำรสนเทศ วิชำกำรออกแบบและพัฒนำเว็บไซต์ รหัส 3901-2006

รวม (100 %)

ลำดับควำมสำคัญ

จานวนชั่วโมง

หน่วยที่ 1 ความรู้พื้นฐานเกี่ยวกับเว็บไซต์และ อินเทอร์เน็ต หน่วยที่ 2 หลักการออกแบบและพัฒนาเว็บไซต์ หน่วยที่ 3 การออกแบบและสร้างเว็บไซต์ หน่วยที่ 4 การออกแบบกราฟิกเพื่องานเว็บไซต์ หน่วยที่ 5 การติดตั้งและการใช้งาน Dreamweaver หน่วยที่ 6 การสร้างตาราง ฟอร์ม เฟรม และการ กาหนดลิงค์ หน่วยที่ 7 การจัดการเลเยอร์และตารางใช้งาน หน่วยที่ 8 สื่อมัลติมีเดีย และเว็บไดนามิค หน่วยที่ 9 การอับ โหลด และโปรโมทเว็บไซต์ สอบปลายภาค รวม ลำดับควำมสำคัญ

จิตพิสัย (20%)

ชื่อหน่วยการเรียนรู้

1 0 0 0 0 0

3

1

5

7

4

1 1 1 1

1 1 0 0

6 6 3 8

3 2 1 3

14 14 5 13

3 3 7 4

12 4 10 10

1 1 1 0 0 2

8

3

16

1

16

1 1 1 0 0 1 1 0 1 1 0 1 0 1 0 0 0 1

8 5 3

3 3 1

15 12 6

2 5 6

12 12 5 5 90

ความรู้ (5%) ความเข้าใจ (5%) การนาไปใช้ (5%) การวิเคราะห์ (5%) การสังเคราะห์ (5%) การประเมินค่า (5%)

เกณฑ์การวัดด้านพฤติกรรม

ทักษะพิสัย (50%)

พุทธพิสัย (30%)

1 1 0 1

1 1 0 0

1 2 0 0

0 0 0 0

8 6 5 4 0 7 50 20 100 3 5 6 7 8 4 1 2

อ้างอิง : ทฤษฎีการเรียนรู้ เบนจามิน บลูมและคณะ ได้กาหนดการวัดการจัดการเรียนรู้ออกเป็น 3 ด้าน คือ 1. ด้านพุทธิพิสัย (Cognitive Domain) 2. ด้านทักษะพิสัย (Psychomotor Domain) 3. ด้านเจตพิสัย (Affective Domain)

หน่วยกำรเรียนรู้


จ วิชำกำรออกแบบและพัฒนำเว็บไซต์ (Web Design and Development) รหัสวิชา 3901-2006 ทฤษฏี 1 ปฏิบัติ 4 หน่วยกิต 3 หน่วยกิต หน่วยที่ 1 2 3 4 5 6 7 8 9

จำนวน ชั่วโมง 4 12 4 10 10 16 12 12 5 5

ชื่อหน่วยกำรเรียนรู้ ความรู้พื้นฐานเกี่ยวกับเว็บไซต์และอินเทอร์เน็ต หลักการออกแบบและพัฒนาเว็บไซต์ การออกแบบและสร้างเว็บไซต์ การออกแบบกราฟิกในงานเว็บไซต์ การติดตั้งและการไช้งาน Dreamweaver การสร้างตาราง ฟอร์ม เฟรม และการกาหนดลิงค์ การจัดการเลเยอร์และตารางใช้งาน สื่อมัลติมีเดีย และเว็บไดนามิค การอับ โหลด และโปรโมทเว็บไซต์ สอบปลายภาค (ประมวล/บูรณาการความรู้)

รวมทั้งสิ้น

90

สัปดำห์ที่ 1 2-3 4 5-6 7-8 9-11 12-14 15-16 17 18


โครงกำรสอน หลักสูตรประกำศนียบัตรวิชำชีพชั้นสูง พุทธศักรำช 2557 ประเภทวิชำเทคโนโลยีสำรสนเทศและกำรสื่อสำร สำขำวิชำเทคโนโลยีสำรสนเทศ วิชำกำรออกแบบและพัฒนำเว็บไซต์ รหัส 3901-2006

จานวนหน่วยการจัดการเรียนรู้ 9 หน่วย หน่วยที่ สัปดาห์ 1

1

2

2-3

3

3-4

เนื้อหา สาระการเรียนรู้ ควำมรู้พื้นฐำนเกี่ยวกับเว็บไซต์และอินเทอร์เน็ต - ประวัติ ความเป็นมา และข้อดีของอินเทอร์เน็ต - คาศัพท์ใช้ในระบบอินเทอร์เน็ต - การเลือกใช้บราวเซอร์เพื่อใช้งานอินเทอร์เน็ต - ผู้ให้บริการอีเมล์ฟรี และ โดเมนเนม - ทักษะในศตวรรษที่ 21 ที่ควรรู้ - คุณธรรม จริยธรรม ในการใช้คอมพิวเตอร์ หลักกำรออกแบบและพัฒนำเว็บ ไซต์ - ความหมาย ประเภท องค์ประกอบของเว็บไซต์ - การแบ่งพื้นที่ให้กับเว็บเพจ - หลักการออกแบบและพัฒนาเว็บไซต์ - มาตรฐานในการออกแบบเว็บไซต์ - รูปแบบของเว็บไซต์ - การวิเคราะห์และการออกแบบเว็บไซต์ - แนวคิดการออกแบบเว็บไซต์เชิงสร้างสรรค์ กำรออกแบบและกำรสร้ำงเว็บไซต์ - การกาหนดความต้องการ - การรวบรวมข้อมูล - การเลือกใช้สื่อในรูปแบบต่าง ๆ ที่เหมาะสม - การกาหนดการเชื่อมโยงภายในและภายนอก - ขั้นตอนการออกแบบและสร้างเว็บไซต์

จานวน 90 ชั่วโมง จานวน ชั่วโมง 4

ชั่วโมงที่ 1-4

12

5-16

4

17-20


หน่วยที่ สัปดาห์ 4

5-6

5

9-10

6

11-13

เนื้อหา สาระการเรียนรู้ กำรออกแบบกรำฟิกในงำนเว็บไซต์ - ทฤษฏีสีและความหมายของวรรณะสี - อารมณ์และความหมายของสี - การออกแบบฟอนต์เพื่องานเว็บ - การจัดองค์ประกอบภาพสาหรับงานออกแบบเว็บ - การติดตั้งและการใช้งาน Photoshop - การบูรณาการใช้ Photoshop สาหรับงาน ออกแบบเว็บไซต์ - การออกแบบส่วนหัวของเว็บ - การสร้างตัวอักษรและภาพเคลื่อนไหวภาพ - แนวคิดในการออกแบบกราฟิกเพื่องานพัฒนา เว็บไซต์เชิงสร้างสรรค์ กำรติดตั้งและใช้งำน Dreamweaver - ความสามารถของโปรแกรม Dreamweaver - การติดตั้ง เข้าสู่โปรแกรม Dreamweaver - พื้นที่ใช้งาน Work Area - การจัดการโฟลเดอร์สาหรับเว็บ (Site map) - การสร้างหน้าเว็บและโฟลเดอร์อย่างง่าย - การกาหนดรายละเอียดหน้าเว็บเพื่อใช้งาน - การใส่ภาพและข้อความให้กับเว็บเพ็จ - การออกแบบเลย์เอาท์ กำรสร้ำงตำรำง ฟอร์ม เฟรม และกำรกำหนดลิงค์ - การสร้างตารางลงบนเว็บเพจ - การแก้ไขและปรับคุณสมบัติของตาราง - การสร้างฟอร์ม - การแก้ไขและปรับคุณสมบัติของฟอร์ม - การสร้าง การแก้ไข และปรับคุณสมบัติของเฟรม - การกาหนดลิงค์ให้กับเว็บเพจ

จานวน ชั่วโมง 10

ชั่วโมงที่ 21-30

10

31-40

16

41-56


หน่วยที่ สัปดาห์ 7

14

8

15-16

9

17-18

18

เนื้อหา สาระการเรียนรู้ กำรจัดกำรเลเยอร์และตำรำงกำรใช้งำน - การสร้างเลเยอร์ - การวางองค์ประกอบให้กับเลเยอร์ - การเลือกและเปลี่ยนคุณสมบัติของเลเยอร์ - การจัดการตารางการใช้งาน สื่อมัลติมีเดียและกำรสร้ำงไดนำมิคเว็บเพจ - ความหมายและการเลือกใช้งานสื่อมัลติมีเดีย - องค์ประกอบมัลติมีเดีย - การแทรกไฟล์วิดีโอ (MP4) - การแทรกไฟล์เพลง (MP3) - ความหมายและประเภทเว็บไดนามิค - ความรู้เกี่ยวกับโปรแกรมพีเอชพี(PHP) - การบูรณาการพัฒนางานด้วยโปรแกรม PH กำรอับ โหลด และโปรโมทเว็บ - พื้นที่ Server ให้บริการฟรี - การขอพื้นที่ Server ให้บริการฟรี - การอับโหลด ข้อมูล - การโปรโมทเว็บไซต์ - เว็บไซต์ที่ผู้แต่งเป็น Web Master - เว็บไซต์ที่ประสบความสาเร็จและสร้างสรรค์ สอบประมวลควำมรู้ (ปลำยภำค) รวมจานวนชั่วโมง

จานวน ชั่วโมง 12

ชั่วโมงที่ 57-68

12

69-80

5

81-85

5 90

86-90


เกณฑ์กำรวัดและประเมินผลกำรจัดกำรเรียนรู้ หลักสูตรประกำศนียบัตรวิชำชีพชั้นสูง พุทธศักรำช 2557 ประเภทวิชำเทคโนโลยีสำรสนเทศและกำรสื่อสำร สำขำวิชำเทคโนโลยีสำรสนเทศ วิชำกำรออกแบบและพัฒนำเว็บไซต์ รหัส 3901-2006 คะแนน 100 คะแนน จำแนกได้ดังนี้ - คะแนนคุณธรรม จริยธรรม 20 (ความตรงต่อเวลาเข้าเรียน,ส่งแบบฝึกหัด,การแต่งกาย (ความมุ่งมั่น ตั้งใจเรียน, การช่วยเหลือเพื่อน - คะแนนใบงานประจาหน่วยการเรียนรู้ (จานวน 9 หน่วย ๆ ละ 10 คะแนน เป็น 90 แล้วหาร 2) - คะแนนสอบประมวลความรอบรู้ 35 (สอบปลายภาค) กำรตัดสินผลกำรเรียน คะแนน คะแนน คะแนน คะแนน คะแนน คะแนน คะแนน คะแนน

80-100 75-79 70-74 65-69 60-64 55-59 50-54 0-49

เกรด 4 เกรด 3.5 เกรด 3 เกรด 2.5 เกรด 2 เกรด 1.5 เกรด 1 เกรด 0

คะแนน 10 คะแนน) 10 คะแนน) 45 คะแนน คะแนน


1

แผนการจัดการเรียนรู้ ชื่อวิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ตและเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

1. สาระสาคัญ ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ต เป็นสิ่งที่สาคัญในการเรียนรู้รวมทั้งศึกษาประวัติและความ เป็นมาของอินเทอร์เน็ต ข้อดีของอินเทอร์เน็ต คาศัพท์ใช้ในระบบอินเทอร์เน็ต ผู้ให้บริการอีเมล์ฟรี โดเมนเนม การเลือกใช้งานโปรแกรมบราวเซอร์ ทักษะในศตวรรษที่ 21 คุณธรรม และจริยธรรมใน การใช้คอมพิวเตอร์ 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาประวัติและความเป็นมาและข้อดีของระบบอินเทอร์เน็ต 2. เพื่อศึกษาความหมายของคาศัพท์ที่ใช้ในระบบอินเทอร์เน็ต 3. เพื่อศึกษาและเลือกใช้งานโปรแกรมบราวเซอร์ 4. เพื่อศึกษาทักษะในศตวรรษที่ 21 และคุณธรรม จริยธรรมในการใช้คอมพิวเตอร์ จุดประสงค์เชิงพฤติกรรม 1. อธิบายประวัติ ความเป็นมาและข้อดีของระบบอินเทอร์เน็ตได้ 2. อธิบายความหมายของคาศัพท์ที่ใช้ในระบบอินเทอร์เน็ตได้ 3. สามารถเลือกใช้งานโปรแกรมบราวเซอร์ ได้ 4. อธิบายทักษะในศตวรรษที่ 21 และคุณธรรม จริยธรรมในการใช้คอมพิวเตอร์ได้ 3. สาระการเรียนรู้ 1. ประวัติ ความเป็นมา และข้อดีของอินเทอร์เน็ต 2. คาศัพท์ใช้ในระบบอินเทอร์เน็ต 3. การเลือกใช้บราวเซอร์เพื่อใช้งานอินเทอร์เน็ต 4. ผู้ให้บริการอีเมล์ฟรี และ โดเมนเนม 5. ทักษะในศตวรรษที่ 21 ที่ควรรู้ 6. คุณธรรม จริยธรรม ในการใช้คอมพิวเตอร์ * เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์

นายกิตติ์กาญจน์ ปฏิพันธ์ :

วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


2

แผนการจัดการเรียนรู้ ชื่อวิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ตและเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความมีวินัย ตรงต่อเวลา และการแต่งกาย 3. ผู้สอนแนะนาตัวเองให้ผู้เรียนรู้จัก 4. ผู้สอนชี้แจงจุดประสงค์รายวิชา สมรรถนะรายวิชา และคาอธิบายรายวิชา เกณฑ์การวัดผล และประเมินผลตลอดทั้งภาคเรียน 5. ผู้สอนสอดแทรกทักษะศตวรรษที่ 21 เกี่ยวกับความคิดสร้างสรรค์/การมองโลกในแง่ดี ขณะกาลังเรียน 1. ผู้สอนอธิบายความรู้เกี่ยวกับอินเทอร์เน็ตเบื้องต้น ประวัติและความเป็นมาของอินเทอร์เน็ต ข้อดีของอินเทอร์เน็ต คาศัพท์ใช้ในระบบอินเทอร์เน็ต พร้อมให้ผู้เรียนดูเนื้อหาประกอบจากสื่อ 2. ผู้สอนอธิบายการเลือกใช้งานโปรแกรมบราวเซอร์ และโดเมนเนม ทักษะในศตวรรษที่ 21 และสอดแทรก คุณธรรม จริยธรรมในการใช้คอมพิวเตอร์ หลังเรียน 1. ให้ผู้เรียนทากิจกรรมจากใบงาน โดยการตอบคาถามจากผู้สอน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความสนใจใฝ่รู้ ความรับผิดชอบ ความมีระเบียบ ละเอียด รอบคอบ ซื่อสัตย์ ความขยัน อดทน และความคิดสร้างสรรค์ 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : เว็บไซต์และอินเทอร์เน็ต จาก www.issuu/konsangsan/internet วิดีโอ (Youtube) : ความหมายอินเทอร์เน็ต จาก https://www.youtube.com/watch?v=Sx6hT9Ek7zI พาวเวอร์พอยท์ (PPT): ความหมายอินเทอร์เน็ต จาก www.konsangsan.com/webdesign/internet 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ

นายกิตติ์กาญจน์ ปฏิพันธ์ :

วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


3

แผนการจัดการเรียนรู้ ชื่อวิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ตและเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

ใบงาน หน่วยการเรียนรู้ท่ี 1 เรื่อง ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ตและเว็บไซต์ 1.ให้จับคู่ด้านซ้ายและขวาที่มีความสัมพันธ์กันโดยนาพยัญชนะที่อยู่ด้านหน้า (ด้านขวามือ) มาไว้ด้านหน้าของตัวเลขแต่ละหัวข้อ (ด้านซ้ายมือ) ….… 1.Webpage …… 2. Mozila Firefox …… 3. Home page …… 4. Internet …… 5. Chrome …… 6. Internet Thailand ........ 7. 800 * 600 pixels ……. 8. Content …… 9. View ---> Encoding …… 10. Asia

ก. ทวีปที่ใช้อินเทอร์เน็ตมากที่สุด ข. ปรับแต่งภาษาไทยใน Explorer ค. แต่ละหน้าของเว็บไซต์ ง. ผู้ให้บริการอินเทอร์เน็ตรายแรกของไทย จ. ความละเอียดของการแสดงผล ฉ. ปรับแต่งภาษาไทยใน Fire fox ช. ใช้ติดต่อสื่อสาร ค้นหาข้อมูล ซ. โปรแกรมใช้เปิดอินเทอร์เน็ต (Browser) ฌ. โปรแกรมประเภท Open Source ญ. หน้าแรกของเว็บไซต์

2. ให้สืบค้นคานิยามของคาว่า เว็บ และ เว็บเซอร์วิส จากแหล่งความรู้บนอินเทอร์เน็ตมา อย่างน้อย 3 แหล่ง (พร้อมอ้างอิง) จากนั้นให้สรุปเป็นความคิดของนักศึกษา 3. ให้สืบค้นหาคุณธรรมจริยธรรมในการใช้คอมพิวเตอร์จากแหล่งความรู้บนอินเทอร์เน็ตมา อย่างน้อย 5 ข้อ (พร้อมอ้างอิงแหล่งความรู้)

นายกิตติ์กาญจน์ ปฏิพันธ์ :

วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


4

แผนการจัดการเรียนรู้ ชื่อวิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ตและเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ :

วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


5

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย หลักการออกแบบและพัฒนาเว็บไซต์

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

1. สาระสาคัญ ศึกษาความหมาย ประเภท และองค์ประกอบของเว็บไซต์เพื่อเป็นองค์ความรู้พื้นฐาน การแบ่ง พื้นที่ในการออกแบบให้กับเว็บเพจ หลักการออกแบบและพัฒนาเว็บไซต์ มาตรฐานในการออกแบบ เว็บไซต์ในแต่ละประเท แนวคิด และรูปแบบของเว็บ ไซต์ การวิเคราะห์และการออกแบบเว็บ ไซต์ แนวคิดการออกแบบเว็บไซต์เชิงสร้างสรรค์ 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาความหมาย ประเภทและองค์ประกอบทั่วไปของเว็บไซต์ 2. เพื่อศึกษาหลักการออกแบบเว็บไซต์ 3. เพื่อศึกษามาตรฐานในการออกแบบเว็บไซต์ 4. เพื่อศึกษารูปแบบ การวิเคราะห์และออกแบบเว็บไซต์ 5. เพื่อศึกษาแนวคิดการออกแบบเว็บไซต์เชิงสร้างสรรค์ จุดประสงค์เชิงพฤติกรรม 1. อธิบายความหมาย ประเภทและองค์ประกอบทั่วไปของเว็บได้ 2. อธิบายหลักการออกแบบเว็บไซต์ได้ 3. อธิบายมาตรฐานในการออกแบบเว็บไซต์ได้ 4. อธิบายรูปแบบ การวิเคราะห์และออกแบบเว็บไซต์ได้ 5. อธิบายแนวคิดการออกแบบเว็บไซต์เชิงสร้างสรรค์ 3. สาระการเรียนรู้ 1. ความหมาย ประเภท องค์ประกอบของเว็บไซต์ 2. การแบ่งพื้นที่ให้กับเว็บเพจ 3. หลักการออกแบบและพัฒนาเว็บไซต์ 4. มาตรฐานในการออกแบบเว็บไซต์ 5. รูปแบบของเว็บไซต์ 6. การวิเคราะห์และการออกแบบเว็บไซต์ 7. แนวคิดการออกแบบเว็บไซต์เชิงสร้างสรรค์ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


6

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย หลักการออกแบบและพัฒนาเว็บไซต์

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

* เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความรับผิดชอบ และบุคลิกภาพที่ดี 3. ผู้สอนสอดแทรกทักษะชีวิต เกี่ยวกับการมองโลกในแง่ดี การคิดดี คิดบวก ขณะกาลังเรียน 1. ผู้สอนอธิบายความหมาย ประเภท องค์ประกอบของเว็บไซต์ การแบ่งพื้นที่เว็บเพจ หลักการออกแบบและพัฒนาเว็บไซต์ มาตรฐานในการออกแบบเว็บไซต์ พร้อมให้ผู้เรียนดู ภาพประกอบจากสื่อการสอน 2. ผู้สอนอธิบายรูปแบบของเว็บไซต์ การวิเคราะห์และการออกแบบเว็บไซต์ แนวคิด การออกแบบเว็บไซต์เชิงสร้างสรรค์ พร้อมให้ผู้เรียนดูภาพประกอบจากสื่อการสอน หลังเรียน 1. ให้ผู้เรียนทากิจกรรม โดยการตอบคาถามจากผู้สอน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความสนใจใฝ่รู้ ความรับผิดชอบ ความมีระเบียบ ละเอียด รอบคอบ ซื่อสัตย์ ความขยัน อดทน และการมองโลกในแง่ดี 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : หลักการออกแบบเว็บไซต์ จาก www.issuu/konsangsan/webdesign วิดีโอ (Youtube) : ออกแบบเว็บไซต์มืออาชีพ https://www.youtube.com/watch?v=V338XopJtjQ วิดีโอ (Youtube) : หลักออกแบบเว็บไซต์ที่ดี https://www.youtube.com/watch?v=wl7vvn5y6OQ วิดีโอ (Youtube) : หลักออกแบบเว็บเบือ้ งต้น https://www.youtube.com/watch?v=D2Dlesv2K7M พาวเวอร์พอยท์ (PPT) : หลักการออกแบบเว็บไซต์ : www.konsangsan.com/webdesign/webdesign 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


7

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย หลักการออกแบบและพัฒนาเว็บไซต์

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

ใบงานที่ 2 คาชี้แจง ให้นักศึกษาตอบคาถามให้สมบูรณ์ที่สุด 1. ให้นักศึกษาบอกชื่อและประเภทของเว็บไซต์มา 5 เว็บไซต์ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................... 2. ให้นักศึกษาบอกหลักการออกแบบเว็บไซต์พร้อมอธิบาย .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ................................................... 3. ให้นักศึกษาบอกแนวคิดในการออกแบบเว็บไซต์เชิงสร้างสรรค์ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


8

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย หลักการออกแบบและพัฒนาเว็บไซต์

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


9

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบและสร้างเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

1. สาระสาคัญ การออกแบบและพั ฒ นาเว็บไซต์ที่ตอบโจทย์ ตรงกลุ่มเป้าหมายสาคั ญ ที่สุดคือการมีขั้นตอนที่ ชัดเจน เริ่มต้นจากการเก็บความต้องการ การรวบรวมข้อมูล การออกแบบเว็บไซต์โดยเลือกใช้สื่อที่ เหมาะสม เป็ นสัดส่วน และการเชื่อมโยงข้อมูลทั้งภายในและภายนอกอย่างสมบู รณ์ ถูกต้อง นาไปสู่ การเป็นเว็บไซต์ที่ดี มีคุณภาพได้ 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาการกาหนดความต้องการ การรวบรวมข้อมูล 2. เพื่อศึกษาการเลือกใช้สื่อในรูปแบบต่าง ๆ ที่เหมาะสม 3. เพื่อศึกษาการกาหนดการเชื่อมโยงภายในและภายนอก 4. เพื่อศึกษาขั้นตอนการออกแบบและสร้างเว็บไซต์ จุดประสงค์เชิงพฤติกรรม 1. อธิบายวิธีการกาหนดความต้องการ การรวบรวมข้อมูล 2. อธิบายวิธีการเลือกใช้ สื่อในรูปแบบต่าง ๆ ที่เหมาะสมได้ 3. อธิบายวิธีการกาหนดการเชื่อมโยงภายในและภายนอก 4. อธิบายขั้นตอนการออกแบบและสร้างเว็บไซต์ ได้ 3. สาระการเรียนรู้ 1. การกาหนดความต้องการ การรวบรวมข้อมูล 2. การเลือกใช้สื่อในรูปแบบต่าง ๆ ที่เหมาะสม 3. การกาหนดการเชื่อมโยงภายในและภายนอก 4. ขั้นตอนการออกแบบและสร้างเว็บไซต์

* เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


10

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบและสร้างเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความรับผิดชอบ และบุคลิกภาพ 3. ผู้สอนสอดแทรกทักษะชีวิต เกี่ยวกับการคิดไตร่ตรอง การคิดอย่างเป็นระบบ ขณะกาลังเรียน 1. ผู้สอนอธิบายการกาหนดความต้องการ การรวบรวมข้อมูล การเลือกใช้สื่อใน รูปแบบต่าง ๆ ที่เหมาะสม 2. ผู้สอนอธิบายการกาหนดการเชื่อมโยงข้อมูลทั้งภายในและภายนอก ขั้นตอนการ ออกแบบและสร้างเว็บไซต์ พร้อมให้ผู้เรียนศึกษาจากสื่อประกอบการเรียนรู้ทั้งสื่อสิ่งพิมพ์ และสื่อ ดิจิทัล หลังเรียน 1. ให้ผู้เรียนทากิจกรรมใบงาน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความสนใจใฝ่รู้ ความรับผิดชอบ ความมีระเบียบ ละเอียด รอบคอบ การคิดไตร่ตรองและคิดอย่างเป็นระบบ 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : หลักการออกแบบเว็บไซต์ www.issuu/konsangsan/stepwebdesign วิดีโอ (Youtube) : ขั้นตอนการสร้างเว็บไซต์ https://www.youtube.com/watch?v=qtx6BhVNPho วิดีโอ (Youtube) : เริ่มต้นสร้างเว็บไซต์ https://www.youtube.com/watch?v=E9ql87GVpRA พาวเวอร์พอยท์ (PPT) : การออกแบบเว็บไซต์ : www.konsangsan.com/webdesign/stepwebdesign 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


11

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบและสร้างเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

ใบงานที่ 2 คาชี้แจง ให้นักศึกษาตอบคาถามให้สมบูรณ์ที่สุด 1. ให้นักศึกษาบอกขั้นตอนการเชื่อมโยงเว็บข้อมูลภายในและภายนอก พร้อมอธิบาย .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................... 2. ให้นักศึกษาบอกขั้นตอนการออกแบบเว็บไซต์พร้อมอธิบาย .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ................................................... 3. ให้นักศึกษาบอกหลักในการคิดไตร่ตรองและคิดอย่างเป็นระบบ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


12

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบและสร้างเว็บไซต์

ท-ป-น (1:4:3) จานวน 4 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


13

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบกราฟิกในงานเว็บไซต์

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

1. สาระสาคัญ การออกแบบงานกราฟิ กเพื่อน ามาใช้ในการพั ฒนาเว็บไซต์นั้น นั บว่าเป็ น สิ่ง ที่สาคัญ อย่างยิ่ง เพราะจะส่งเสริมให้เว็บไซต์ดูสวยงามและน่าสนใจ อีกทั้งยังดึงดูดความสนใจของผู้ชมเว็บไซต์ทมี่ ีความ โดดเด่น มี สไตล์ มี ดี ไซน์ เนื้อ หาในหน่ วยการเรียนรู้นี้ เป็ น หลั กการด้ านคอมพิ วเตอร์ก ราฟิก การ ออกแบบฟอนต์เพื่องานเว็บไซต์ การจัดองค์ประกอบภาพสาหรับเว็บไซต์ การออกแบบส่วนหัวเว็บ เพจ การสร้างตัวอักษร และแนวคิดในการออกแบบกราฟิกเพื่องานพัฒนาเว็บไซต์เชิงสร้างสรรค์ 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาทฤษฏีสีและวรรณะสี 2. เพื่อศึกษาอารมณ์และความหมายของสี 3. เพื่อศึกษาการออกแบบฟอนต์เพื่องานเว็บ 4. เพื่อศึกษาการจัดองค์ประกอบของภาพสาหรับงานออกแบบเว็บไซต์ 5. เพื่อศึกษาการติดตั้งและการใช้งาน Photoshop 6. เพื่อศึกษาการบูรณาการใช้ Photoshop สาหรับงานออกแบบเว็บไซต์ จุดประสงค์เชิงพฤติกรรม 1. อธิบายทฤษฏีสี อารมณ์และความหมายของวรรณะสี 2. อธิบายการออกแบบฟอนต์เพื่องานเว็บ 3. อธิบายการจัดองค์ประกอบของภาพสาหรับงานออกแบบเว็บได้ 4. สามารถติดตั้งและใช้งาน Photoshop เพื่อการออกแบบเว็บไซต์ได้ 5. สามารถบูรณาการใช้ Photoshop สาหรับงานออกแบบเว็บไซต์ได้ 3. สาระการเรียนรู้ 1. ทฤษฏีสีและความหมายของวรรณะสี 2. อารมณ์และความหมายของสี 3. การออกแบบฟอนต์เพื่องานเว็บ 4. การจัดองค์ประกอบของภาพสาหรับงานออกแบบเว็บ 5. การติดตั้งและการใช้งาน Photoshop 6. การบูรณาการใช้ Photoshop สาหรับงานออกแบบเว็บไซต์ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


14

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบกราฟิกในงานเว็บไซต์

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

7. การออกแบบส่วนหัวของเว็บ 8. การสร้างตัวอักษรและภาพเคลื่อนไหวภาพ 9. แนวคิดในการออกแบบกราฟิกเพื่องานพัฒนาเว็บไซต์เชิงสร้างสรรค์ * เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความรับผิดชอบ และบุคลิกภาพ 3. ผู้สอนสอดแทรกทักษะชีวิต เกี่ยวกับการมองโลกในแง่ดี การคิดดี คิดบวก 4. ผู้สอนสอดแทรกทักษะในศตวรรษที่ 21 ด้านความคิดสร้างสรรค์ และ เสริมเนื้อหา ด้านการคิดนอกกรอบ การคิดแตกต่าง ขณะกาลังเรียน 1. ผู้สอนอธิบายคาศัพท์ที่เกี่ยวข้องกับหลักการด้านงานกราฟิก หลักการออกแบบ กราฟิก หลักการด้านความคิดสร้างสรรค์ และการนาความคิดสร้างสรรค์มาใช้ในการออกแบบเว็บไซน์ พร้อมให้ผู้เรียนดูภาพ วิดีโอ จากสื่อการสอน 2. ผู้สอนอธิบายการบูรณาการด้านความคิดสร้างสรรค์ การคิดนอกกรอบ การคิด แตกต่างมาบูรณาการเพื่อออกแบบเว็บไซต์ พร้อมให้ผู้เรียนดูภาพประกอบจากสื่อการสอน หลังเรียน 1. ให้ผู้เรียนทากิจกรรม โดยการตอบคาถามจากผู้สอน และให้ทาใบงาน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความสนใจใฝ่รู้ การแบ่งปัน การกล้าคิดนอกกรอบ 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : หลักการออกแบบเว็บไซต์ จาก www.issuu/konsangsan/webdesign วิดีโอ (Youtube) : ออกแบบเว็บไซต์มืออาชีพ https://www.youtube.com/watch?v=V338XopJtjQ 6. การวัดและประเมินผล 1. ใบงาน และ กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


15

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบกราฟิกในงานเว็บไซต์

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

ใบงานที่ 4 คาชี้แจง ให้นักศึกษาตอบคาถามให้สมบูรณ์ที่สุด 1. ให้นักศึกษาบอกชื่อและประเภทของเว็บไซต์ที่ออกแบบสร้างสรรค์มา 5 เว็บไซต์ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................... 2. ให้นักศึกษาบอกหลักการออกแบบเว็บไซต์เชิงสร้างสรรค์ พร้อมอธิบาย .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ................................................... 3. ให้นักศึกษาออกแบบหน้าเว็บไซต์เชิงสร้างสรรค์มา 1 หน้าเว็บเพจ (โดยเขียนเหตุผลในการ ออกแบบแต่ละจุดด้วย)............. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ...............................................................................................

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


16

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบกราฟิกในงานเว็บไซต์

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

ตัวอย่างผลงานผู้เรียน …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. เหตุผลในการออกแบบ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (…………………………………….) นักศึกษา

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


17

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบกราฟิกในงานเว็บไซต์

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

ตัวอย่างผลงานผู้เรียน …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. เหตุผลในการออกแบบ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (…………………………………….) นักศึกษา

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


18

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การออกแบบกราฟิกในงานเว็บไซต์

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


19

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การติดตั้ง และการใช้งาน Dreamweaver

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

1. สาระสาคัญ ความรู้เกี่ ย วกั บ ศั ก ยภาพและสามารถของโปรแกรม Dreamweaver รวมทั้ ง การติ ด ตั้ ง การเข้าสู่โปรแกรม Dreamweaver อย่างง่าย รู้จักพื้นที่ และการแบ่งพื้นที่การใช้งาน(Work Area) การจัดการโฟลเดอร์สาหรับเว็บ (Site map) การสร้างหน้าเว็บและโฟลเดอร์อย่างง่าย การกาหนด รายละเอียดหน้าเว็บ เพื่อใช้งาน การแทรกรูภาพและข้อความให้ กับเว็บเพ็ จ รวมทั้ งการออกแบบ เลย์เอาท์อย่างยืดหยุ่นและสะดวกในการใช้งาน 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาความสามารถของโปรแกรม Dreamweaver 2. เพื่อศึกษาการติดตั้ง การเข้าสู่โปรแกรม Dreamweaver 3. เพื่อศึกษาพื้นที่ใช้งาน Work Area และการจัดการโฟลเดอร์สาหรับเว็บ (Site map) 4. เพื่อศึกษาการสร้างหน้าเว็บและโฟลเดอร์อย่างง่าย 5. เพื่อศึกษาการกาหนดรายละเอียดหน้าเว็บเพื่อใช้งาน การใส่ภาพ ข้อความ และเลย์เอาท์ จุดประสงค์เชิงพฤติกรรม 1. อธิบายความสามารถของโปรแกรม Dreamweaver 2. สามารถติดตั้ง และเข้าสูโ่ ปรแกรม Dreamweaver 3. สามารถจัดการพื้นที่ใช้งาน Work Area และจัดการโฟลเดอร์สาหรับเว็บ (Site map) 4. สามารถสร้างหน้าเว็บและโฟลเดอร์อย่างง่าย 5. สามารถกาหนดรายละเอียดหน้าเว็บเพื่อใช้งาน การใส่ภาพ ข้อความ และเลย์เอาท์ได้ 3. สาระการเรียนรู้ 1. ความสามารถของโปรแกรม Dreamweaver 2. การติดตั้ง การเข้าสู่โปรแกรม Dreamweaver พื้นที่ใช้งาน Work Area 3. การจัดการโฟลเดอร์สาหรับเว็บ (Site map) 4. การสร้างหน้าเว็บและโฟลเดอร์และการกาหนดรายละเอียดหน้าเว็บเพื่อใช้งาน 5. การใส่ภาพและข้อความให้กับเว็บเพ็จ 6. การออกแบบเลย์เอาท์ * เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


20

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การติดตั้ง และการใช้งาน Dreamweaver

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความตั้งใจและมุ่งมั่นในการทางาน 3. ผู้สอนสอดแทรกทักษะชีวิต เกี่ยวกับความอดทนและการคิดเป็นระบบ ขณะกาลังเรียน 1. ผู้สอนอธิบายความสามารถของโปรแกรม Dreamweaver การติดตั้ง เข้าสู่โปรแกรม Dreamweaver และพาผู้เรียนปฏิบัติการแบ่งพื้นที่ใช้งาน Work Area การจัดการโฟลเดอร์สาหรับ เว็บ (Site map) การสร้างหน้าเว็บและโฟลเดอร์อย่างง่าย 2. ผู้สอนอธิบายการกาหนดรายละเอียดหน้าเว็บเพื่อใช้งาน และพาผู้เรียนปฏิบัติการใส่ ภาพและข้อความให้กับเว็บเพ็จ การออกแบบเลย์เอาท์พร้อมให้ผู้เรียนดูภาพประกอบจากสื่อการสอน หลังเรียน 1. ให้ผู้เรียนทากิจกรรม โดยการตอบคาถามจากผู้สอน และให้ทาใบงาน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความสนใจใฝ่รู้ ความอดทนและการคิดอย่างเป็นระบบ 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : หลักการออกแบบเว็บไซต์ จาก www.issuu/konsangsan/setupweb วิดีโอ (Youtube) : การติดตั้ง Dreamweaver: https://www.youtube.com/watch?v=3w6RAyCQiFo วิดีโอ (Youtube) : การใช้งาน Dreamweaver : https://www.youtube.com/watch?v=dyxrQehQm7k วิดีโอ (Youtube) : การใช้งาน Dreamweaver : https://www.youtube.com/watch?v=XTIYBiwx5zQ พาว์เวอร์พอยท์ (Powerpoint) www.konsangsan.com/webdesign/UseDreamweaver.ppt 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ และดูทักษะในการออกแบบเว็บไซต์

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


21

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การติดตั้ง และการใช้งาน Dreamweaver

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

ใบงานที่ 5 คาชี้แจง ให้นักศึกษาตอบคาถามให้สมบูรณ์ที่สุดและส่งงานตามกาหนด 1. ให้นักศึกษาบอกความสามารถของโปรแกรม Dreamweaver .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ................................................................................................................................... 2. ให้นักศึกษาอธิบายขั้นตอนการติดตั้งโปรแกรม Dreamweaver มาโดยสังเขป .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ 3. ให้นักศึกษาอธิบายวิธีการจัดการโฟลเดอร์ใน Dreamweaver มาโดยสังเขป .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ 4. ให้นักศึกษาสร้างเว็บเพจเกี่ยวกับข้อมูลนักศึกษา โดยมีภาพ ข้อความ โดยออกแบบหน้า เว็บเพจได้อย่างครบถ้วนสมบูรณ์ และเก็บบันทึกข้อมูลในโฟลเดอร์ web5 .................................................................................................................................................. ............................................................................................................................ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


22

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การติดตั้ง และการใช้งาน Dreamweaver

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

ตัวอย่างผลงานผู้เรียน …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. เหตุผลในการออกแบบ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (…………………………………….) นักศึกษา

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


23

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การติดตั้ง และการใช้งาน Dreamweaver

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

ตัวอย่างผลงานผู้เรียน …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. เหตุผลในการออกแบบ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (…………………………………….) นักศึกษา

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


24

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การติดตั้ง และการใช้งาน Dreamweaver

ท-ป-น (1:4:3) จานวน 10 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


25

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การสร้างตาราง ฟอร์ม เฟรม และการกาหนดลิงค์

ท-ป-น (1:4:3) จานวน 16 ชั่วโมง

1. สาระสาคัญ การมีความรู้ เทคนิค วิธีการในการสร้าง แทรกตารางลงบนเว็บเพจ รวมทั้งสามารถแก้ไขและ กาหนดคุณสมบัติของตารางได้ จะทาให้การออกแบบเว็บไซต์มีสีสัน การมีเทคนิคและวิธีการในการ สร้างฟอร์ม สร้างเฟรม รวมทั้งการกาหนดคุณสมบัติ แก้ไข และ ลบฟอร์มและเฟรมได้ตามที่ต้องการ สามารถกาหนดลิงค์ทั้งภายในและภายนอกได้เป็นอย่างดี 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาการสร้างตารางลงบนเว็บเพจ 2. เพื่อศึกษาการแก้ไขและปรับคุณสมบัติของตาราง 3. เพื่อศึกษาการสร้างฟอร์มแก้ไขและปรับคุณสมบัติของฟอร์ม 4. เพื่อศึกษาการสร้าง การแก้ไข และปรับคุณสมบัติของเฟรม 5. เพื่อศึกษาการกาหนดลิงค์ให้กับเว็บเพจ จุดประสงค์เชิงพฤติกรรม 1. สามารถสร้างตารางลงบนเว็บเพจ 2. สามารถแก้ไขและปรับคุณสมบัติของตาราง 3. สามารถสร้างฟอร์มแก้ไขและปรับเปลี่ยนคุณสมบัติของฟอร์มได้ 4. สามารถสร้าง การแก้ไข และปรับเปลี่ยนคุณสมบัติของเฟรม 5. สามารถการกาหนดลิงค์ให้กับเว็บเพจได้ 3. สาระการเรียนรู้ 1. การสร้างตารางลงบนเว็บเพจ 2. การแก้ไขและปรับคุณสมบัติของตาราง 3. การสร้างฟอร์ม 4. การแก้ไขและปรับเปลี่ยนคุณสมบัติของฟอร์ม 5. การสร้าง การแก้ไข และปรับเปลี่ยนคุณสมบัติของเฟรม 6. การกาหนดลิงค์ให้กับเว็บเพจ * เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


26

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การสร้างตาราง ฟอร์ม เฟรม และการกาหนดลิงค์

ท-ป-น (1:4:3) จานวน 16 ชั่วโมง

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความตั้งใจและมุ่งมั่นในการทางาน 3. ผู้สอนสอดแทรกทักษะชีวิต เกี่ยวกับภาวะผู้นาและมีเป้าหมายชัดเจน ขณะกาลังเรียน 1. ผู้สอนอธิบาย และพาผู้เรียนฝึกปฏิบัติเกี่ยวกับ วิธีการในการสร้าง แทรกตารางลงบน เว็บเพจ รวมทั้งสามารถปฏิบัติการแก้ไขและกาหนดคุณสมบัติของตารางได้ 2. ผู้สอนอธิบาย และพาผู้เรียนฝึกปฏิบัติเกี่ยวกับวิธีการในการสร้างฟอร์ม สร้างเฟรม รวมทั้งการกาหนดคุณสมบัติ แก้ไข และ ลบฟอร์มและเฟรมได้ตามที่ต้องการ สามารถกาหนดลิงค์ทั้ง ภายในและภายนอกได้เป็นอย่างดี หลังเรียน 1. ให้ผู้เรียนทากิจกรรม โดยการตอบคาถามจากผู้สอน และให้ทาใบงาน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความสนใจใฝ่รู้ ภาวะผู้นาและมีเป้าหมายชัดเจน 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : หลักการออกแบบเว็บไซต์ จาก www.issuu/konsangsan/formframe วิดีโอ (Youtube) : การสร้างตาราง https://www.youtube.com/watch?v=9dO3jq3TigI วิดีโอ (Youtube) : การสร้างฟอร์ม https://www.youtube.com/watch?v=GCgFPnRWxYc วิดีโอ (Youtube) : การปรับแต่งเฟรม https://www.youtube.com/watch?v=t_HXOilGi58 พาว์เวอร์พอยท์ (Powerpoint) www.konsangsan.com/webdesign/FormAndFrame.ppt 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ การสร้างตาราง การสร้างฟอร์ม การสร้างเฟรม

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


27

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การสร้างตาราง ฟอร์ม เฟรม และการกาหนดลิงค์

ท-ป-น (1:4:3) จานวน 16 ชั่วโมง

ใบงานที่ 6 คาชี้แจง ให้นักศึกษาตอบคาถามให้สมบูรณ์ที่สุดและส่งงานตามกาหนด 1. ให้นักศึกษาออกแบบและพัฒนาเว็บไซต์ เกี่ยวกับจังหวัดขอนแก่น โดยมีเมนูสามารถลิงค์ได้ อย่างสมบูรณ์ ประกอบไปด้วย ตาราง ฟอร์ม เฟรม และเก็บบันทึกข้อมูลในโฟลเดอร์ web6 .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ หลักการในการออกแบบเว็บเพจ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


28

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การสร้างตาราง ฟอร์ม เฟรม และการกาหนดลิงค์

ท-ป-น (1:4:3) จานวน 16 ชั่วโมง

ตัวอย่างผลงานผู้เรียน …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. เหตุผลในการออกแบบ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. …………………………. (…………………………………….) นักศึกษา นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


29

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การสร้างตาราง ฟอร์ม เฟรม และการกาหนดลิงค์

ท-ป-น (1:4:3) จานวน 16 ชั่วโมง

ตัวอย่างผลงานผู้เรียน …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. เหตุผลในการออกแบบ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. …………………………. (…………………………………….) นักศึกษา นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


30

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การสร้างตาราง ฟอร์ม เฟรม และการกาหนดลิงค์

ท-ป-น (1:4:3) จานวน 16 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


31

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การจัดการเลเยอร์ และตารางการใช้งาน

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

1. สาระสาคัญ การออกแบบเว็บไซต์ที่ดี จะมีความยืดหยุ่น จาเป็นต้องมีความรู้เทคนิค วิธีการในการสร้าง เลเยอร์ รวมทั้งสามารถวางองค์ประกอบให้กับเลเยอร์ เลือกและปรับเปลี่ยนคุณสมบัติของเลเยอร์ได้ มีเทคนิคและวิธีการในการจัดการ แก้ไข ลบ กาหนดคุณสมบัติตารางการใช้งานได้เป็นอย่างดี 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาการสร้างเลเยอร์ 2. เพื่อศึกษาการวางองค์ประกอบให้กับเลเยอร์ 3. เพื่อศึกษาการเลือกและเปลี่ยนคุณสมบัติของเลเยอร์ 4. เพื่อศึกษาการจัดการตารางการใช้งาน จุดประสงค์เชิงพฤติกรรม 1. สามารถสร้างเลเยอร์ 2. สามารถวางองค์ประกอบให้กับเลเยอร์ให้กับเว็บเพจได้สวยงาม 3. สามารถเลือกและปรับเปลี่ยนคุณสมบัติของเลเยอร์ได้ตามความเหมาะสม 4. สามารถจัดการตารางการใช้งานได้เป็นอย่างดี 3. สาระการเรียนรู้ 1. การสร้างเลเยอร์ 2. การวางองค์ประกอบให้กับเลเยอร์ 3. การเลือกประเภทของเลเยอร์ 4. การปรับเปลี่ยนคุณสมบัติของเลเยอร์ 5. การจัดการตารางการใช้งาน * เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


32

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การจัดการเลเยอร์ และตารางการใช้งาน

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความตั้งใจและการทางานเป็นทีม 3. ผู้สอนสอดแทรกทักษะศตวรรษที่ 21 เกี่ยวกับทักษะด้านความยืดหยุ่น การปรับตัว ขณะกาลังเรียน 1. ผู้สอนอธิบาย และพาผู้เรียนฝึกปฏิบัติเกี่ยวกับ การสร้างเลเยอร์ การวาง องค์ประกอบให้กับเลเยอร์ การเลือกและเปลี่ยนคุณสมบัติของเลเยอร์ 2. ผู้สอนอธิบาย และพาผู้เรียนฝึกปฏิบัติเกี่ยวกับวิธีการในการจัดการตารางการใช้งาน รวมทั้งการกาหนดคุณสมบัติ แก้ไข และ ลบตารางได้ตามที่ต้องการ หลังเรียน 1. ให้ผู้เรียนทากิจกรรม โดยการตอบคาถามจากผู้สอน และให้ทาใบงาน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความยืดหยุ่น และการทางานเป็นทีม 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : หลักการออกแบบเว็บไซต์ จาก www.issuu/konsangsan/layertable วิดีโอ (Youtube) : การสร้างเลเยอร์ https://www.youtube.com/watch?v=HSWEUn_gc8M วิดีโอ (Youtube) : การแทรกเลเยอร์ https://www.youtube.com/watch?v=pQjto1WLsDU วิดีโอ (Youtube) : การจัดการตาราง https://www.youtube.com/watch?v=gUg84sU6xm4 พาว์เวอร์พอยท์ (Powerpoint) www.konsangsan.com/webdesign/layertable.ppt 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ และดูทักษะการจัดการเลเยอร์

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


33

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การจัดการเลเยอร์ และตารางการใช้งาน

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

ใบงานที่ 7 คาชี้แจง ให้นักศึกษาพัฒนางานให้สมบูรณ์ที่สุดและส่งงานตามกาหนด 1. ให้นักศึกษาออกแบบและพัฒนาเว็บไซต์ เกี่ยวกับสาขาเทคโนโลยีสารสนเทศ (IT) วิทยาลัย อาชีวศึกษาขอนแก่น โดยประกอบไปด้วย ตาราง และเลเยอร์ เก็บบันทึกข้อมูลในโฟลเดอร์ web7 .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ หลักการในการออกแบบเว็บเพจ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


34

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การจัดการเลเยอร์ และตารางการใช้งาน

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

ตัวอย่างผลงานผู้เรียน …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. เหตุผลในการออกแบบ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. …………………………. (…………………………………….) นักศึกษา นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


35

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การจัดการเลเยอร์ และตารางการใช้งาน

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


36

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย สื่อมัลติมีเดีย และการสร้างเว็บไดนามิค

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

1. สาระสาคัญ ศึ ก ษาความหมายและการเลื อ กใช้ ง านสื่ อ มั ล ติ มี เดี ย ได้ อ ย่ า งเหมาะสม องค์ ป ระกอบสื่ อ มัลติมีเดีย ประเภทต่าง ๆการแทรกไฟล์วิดีโอ (MP4) การแทรกไฟล์เพลง (MP3) และการกาหนด คุ ณ สมบั ติ ให้ สื่ อ มั ล ติ มี เดี ย ศึ ก ษาความหมายและประเภทเว็บ ไดนามิ ค ความรู้เกี่ ย วกั บ โปรแกรมพีเอชพี(PHP) และการบูรณาการพัฒนางานด้วยโปรแกรม PHP 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาความหมายและการเลือกใช้งานสื่อมัลติมีเดีย 2. เพื่อศึกษาองค์ประกอบมัลติมีเดีย 3. เพื่อศึกษาการแทรกไฟล์วิดีโอ (MP4) และการแทรกไฟล์เพลง (MP3) 4. เพื่อศึกษาความหมายและประเภทเว็บไดนามิค 5. เพื่อศึกษาความรู้และการบูรณาการพัฒนางานด้วยโปรแกรมพีเอชพี(PHP) จุดประสงค์เชิงพฤติกรรม 1. อธิบายความหมายและการเลือกใช้งานสื่อมัลติมีเดีย 2. อธิบายองค์ประกอบมัลติมีเดีย 3. สามารถแทรกไฟล์วิดีโอ (MP4) และ แทรกไฟล์เพลง (MP3) 4. อธิบายความหมายและประเภทเว็บไดนามิค 5. สามารถบูรณาการพัฒนางานด้วยโปรแกรมพีเอชพี(PHP) 3. สาระการเรียนรู้ 1. ความหมายและการเลือกใช้งานสื่อมัลติมีเดีย 2. องค์ประกอบมัลติมีเดีย 3. การแทรกไฟล์วิดีโอ (MP4) 4. การแทรกไฟล์เพลง (MP3) 5. ความหมายและประเภทเว็บไดนามิค 6. ความรู้เกี่ยวกับโปรแกรมพีเอชพี(PHP) 7. การบูรณาการพัฒนางานด้วยโปรแกรม PHP * เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์ นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


37

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย สื่อมัลติมีเดีย และการสร้างเว็บไดนามิค

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความเป็นผู้นาและการทางานเป็นทีม 3. ผู้สอนสอดแทรกทักษะศตวรรษที่ 21 เกี่ยวกับทักษะด้านภาวะผู้นา ขณะกาลังเรียน 1. ผู้ ส อนอธิ บ าย ความหมายและการเลื อ กใช้ ง านสื่ อ มั ล ติ มี เดี ย องค์ ป ระกอบสื่ อ มัลติมีเดียการแทรกไฟล์วิดีโอ (MP4) การแทรกไฟล์เพลง (MP3) และการกาหนดคุณ สมบัติให้สื่อ ประเภทต่าง ๆและพาผู้เรียนฝึกปฏิบัติเกี่ยวกับการแทรกไฟล์วิดีโอ (MP4) การแทรกไฟล์เพลง (MP3) และการกาหนดคุณสมบัติให้สื่อประเภทต่าง ๆ 2. ผู้สอนอธิบาย ความหมายและประเภทเว็บไดนามิค ความรู้เกี่ยวกับโปรแกรมพีเอชพี (PHP) และพาผู้เรียนฝึกปฏิบัติเกี่ยวกับวิธีการบูรณาการพัฒนางานด้วยโปรแกรม PHP หลังเรียน 1. ให้ผู้เรียนทากิจกรรม โดยการตอบคาถามจากผู้สอน และให้ทาใบงาน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านความเป็นผู้นา และการทางานเป็นทีม 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : หลักการออกแบบเว็บไซต์ จาก www.issuu/konsangsan/webdynamic วิดีโอ (Youtube) : webDynamic : https://www.youtube.com/watch?v=PGaFqFTEhvE วิดีโอ (Youtube) : PHP Dynamic web : https://www.youtube.com/watch?v=7i8izYE5tr4 วิดีโอ (Youtube) : การสร้าง webdynamic https://www.youtube.com/watch?v=0bDYK058XY8 พาว์เวอร์พอยท์ (Powerpoint) www.konsangsan.com/webdesign/webdynamic.ppt 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ เกี่ยวกับเว็บไดนามิค

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


38

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย สื่อมัลติมีเดีย และการสร้างเว็บไดนามิค

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

ใบงานที่ 8 คาชี้แจง ให้นักศึกษาพัฒนางานให้สมบูรณ์ที่สุดและส่งงานตามกาหนด 1. ให้นักศึกษาบอกความหมายและการเลือกใช้งานสื่อมัลติมีเดียประเภทต่าง ๆ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ 2. ให้นักศึกษาบอกความหมายและความแตกต่างของเว็บสเตติกและเว็บไดนามิค .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ 3. ให้นักศึกษาบอกศักยภาพและความสามารถของโปรแกรม PHP .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


39

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย สื่อมัลติมีเดีย และการสร้างเว็บไดนามิค

ท-ป-น (1:4:3) จานวน 12 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


40

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การอับ โหลด และโปรโมทเว็บไซต์

ท-ป-น (1:4:3) จานวน 5 ชั่วโมง

1. สาระสาคัญ การออกแบบและพั ฒ นาเว็ บ ไซต์ ให้ ป ระสบความส าเร็ จ สู ง ควรลองศึ ก ษาพื้ น ที่ Server ที่ ใ ห้ บ ริ ก ารฟรี การขอพื้ น ที่ Server ที่ ให้ บ ริ ก ารฟรี และการอั บ -โหลด ข้ อ มู ล ขึ้ น บนโฮสติ้ ง ฟรี นอกจากการออกแบบและพัฒนาเว็บแล้ว สิ่งที่จะส่งเสริมและสนับสนุนให้ประสบความสาเร็จสูงคือ การโปรโมทเว็บไซต์เว็บไซต์ด้วยเทคนิคและวิธีการต่าง ๆ รวมทั้งยกตัวอย่างเว็บไซต์ที่ผู้แต่งเป็น Web Master และเว็บไซต์ที่ประสบความสาเร็จและสร้างสรรค์ 2. จุดประสงค์การเรียนรู้ จุดประสงค์ทั่วไป 1. เพื่อศึกษาความรู้เกี่ยวกับพื้นที่ Server ให้บริการฟรี 2. เพื่อศึกษาการขอพื้นที่ Server ให้บริการฟรี 3. เพื่อศึกษาการอับ-โหลด ข้อมูล ขึ้นบนโฮสติง้ ได้ 4. เพื่อศึกษาวิธีการโปรโมทเว็บไซต์ 5. เพื่อศึกษาเว็บไซต์ที่ประสบความสาเร็จและสร้างสรรค์ จุดประสงค์เชิงพฤติกรรม 1. อธิบายความรู้เกี่ยวกับพื้นที่ Server ให้บริการฟรี 2. อธิบายการขอพื้นที่ Server ให้บริการฟรี 3. สามารถอับ-โหลด ข้อมูล ขึ้นบนโฮสติง้ ได้ 4. อธิบายวิธีการโปรโมทเว็บไซต์ 5. อธิบายเว็บไซต์ที่ประสบความสาเร็จและสร้างสรรค์ 3. สาระการเรียนรู้ 1. พื้นที่ Server ให้บริการฟรี 2. การขอพื้นที่ Server ให้บริการฟรี 3. การอับ-โหลด ข้อมูล 4. การโปรโมทเว็บไซต์ 5. เว็บไซต์ที่ผู้แต่งเป็น Web Master และ เว็บไซต์ที่ประสบความสาเร็จและสร้างสรรค์ * เนื้อหาสาระทั้งหมดในเอกสารประกอบการจัดการเรียนรู้ วิชาการออกแบบและพัฒนาเว็บไซต์

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


41

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การอับ โหลด และโปรโมทเว็บไซต์

ท-ป-น (1:4:3) จานวน 5 ชั่วโมง

4. กระบวนการจัดการเรียนรู้ นาเข้าสู่บทเรียน 1. ผู้สอนจัดเตรียมเอกสาร สื่อการเรียนการสอน 2. ผู้สอนเช็คชื่อผู้เรียน สังเกตพฤติกรรมความคิดสร้างสรรค์ 3. ผู้สอนสอดแทรกทักษะศตวรรษที่ 21 เกี่ยวกับทักษะด้านนวัตกรรมและความคิด สร้างสรรค์ ขณะกาลังเรียน 1. ผู้ ส อนอธิ บ าย ความหมายพื้ น ที่ Server ที่ ใ ห้ บ ริ ก ารฟรี การขอพื้ น ที่ Server ให้บริการฟรี และพาผู้เรียนฝึกปฏิบัติเกี่ยวกับ การขอพื้นที่ Server ให้บริการฟรี และการอับ -โหลด ข้อมูลขึ้นบนโฮสต์ 2. ผู้ สอนอธิบ าย การโปรโมทเว็ บไซต์เว็ บไซต์ด้ วยเทคนิ คและวิธีก ารต่าง ๆ รวมทั้ ง ยกตัวอย่างเว็บไซต์ที่ผู้แต่งเป็น Web Master และเว็บไซต์ที่ประสบความสาเร็จและสร้างสรรค์ หลังเรียน 1. ให้ผู้เรียนทากิจกรรม โดยการตอบคาถามจากผู้สอน และให้ทาใบงาน 2. ผู้สอนสังเกตพฤติกรรมผู้เรียนด้านนวัตกรรมและความคิดสร้างสรรค์ 5. สื่อและแหล่งการเรียนรู้ สื่อสิ่งพิมพ์ : พรพรรณ โสภาพล. (2558). การออกแบบและพัฒนาเว็บไซต์. หนังสือเมืองไทย จากัด. หนังสืออิเล็กทรอนิกส์ (E-Book) : การอับโหลดและโปรโมท จาก www.issuu/konsangsan/uploadweb วิดีโอ (Youtube) : UpLoadtoServer : https://www.youtube.com/watch?v=QpQDpCqPvo8 วิดีโอ (Youtube) : อับโหลดขึ้นเซริฟเวอร์ : https://www.youtube.com/watch?v=QpQDpCqPvo8 วิดีโอ (Youtube) : การอับโหลดข้อมูล : https://www.youtube.com/watch?v=SH9SWo7Dkuk พาว์เวอร์พอยท์ (Powerpoint) www.konsangsan.com/webdesign/uploadweb.ppt 6. การวัดและประเมินผล 1. ใบงาน 2. กิจกรรมถาม-ตอบ เพื่อตรวจสอบความรู้ ความเข้าใจ เกี่ยวกับการอับโหลดและโปรโมทเว็บ

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


42

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การอับ โหลด และโปรโมทเว็บไซต์

ท-ป-น (1:4:3) จานวน 5 ชั่วโมง

ใบงานที่ 9 คาชี้แจง ให้นักศึกษาพัฒนางานให้สมบูรณ์ที่สุดและส่งงานตามกาหนด 1. ให้นักศึกษาบอกขั้นตอน/วิธีการขอพื้นที่ Server ให้บริการฟรี มาอย่างน้อย 1 โฮสติ้ง .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ 2. ให้นักศึกษาบอกขั้นตอน/วิธีการอับ-โหลดข้อมูลขึ้นบนโฮสติ้ง .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................ 3. ให้นักศึกษาบอกแนวคิด วิธีการโปรโมทเว็บให้ประสบความสาเร็จ .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. .................................................................................................................................................. ............................................................................................................................

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


43

แผนการจัดการเรียนรู้ ชือ่ วิชา การออกแบบและพัฒนาเว็บ รหัส 3901-2005 ชื่อหน่วย การอับ โหลด และโปรโมทเว็บไซต์

ท-ป-น (1:4:3) จานวน 5 ชั่วโมง

7. บันทึกผลการใช้แผนการจัดการเรียนรู้ ผลการจัดการเรียนรู้ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. ปัญหาและอุปสรรค …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ………………………………………………………………………………………………………….. แนวทางแก้ปัญหาและข้อเสนอแนะ …………………………………………………………………………………………………………………… ……………………………………………………………………………………………………………………………………………. ……………………………………………………………………………………………………………………………………………. …………………………………………………………………………………………………………..

…………………………. (นายกิตติ์กาญจน์ ปฏิพันธ์)

นายกิตติ์กาญจน์ ปฏิพันธ์ : วิทยาลัยอาชีวศึกษาขอนแก่น

สานักงานคณะกรรมการการอาชีวศึกษา


ภาคผนวก - บันทึกข้อความการพัฒนาหลักสูตรร่วมกับสถานประกอบการ - ผลการระดมความคิดพัฒนาหลักสูตรร่วมกับสถานประกอบการ - บันทึกข้อความรายงานผลการพัฒนาหลักสูตรร่วมกับสถานประกอบการ - หนังสือแต่งตั้งผู้เชี่ยวชาญพิจาณาความสอดคล้อง และความถูกต้องของเนื้อหา - บันทึกข้อความขออนุญาตใช้แผนการจัดการเรียนรู้ - บันทึกข้อความรายงานผลการใช้แผนการจัดการเรียนรู้ - ผลการประเมินแผนการจัดการเรียนรู้


บันทึกข้อความ ส่วนราชการ วิทยาลัยอาชีวศึกษาขอนแก่น ที่ /๒๕๕๙ วันที่ เมษายน พ.ศ. ๒๕๕๙ เรื่อง ขออนุมัตดิ าเนินโครงการพัฒนาหลักสูตรรายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) เรียน ผู้อานวยการวิทยาลัยอาชีวศึกษาขอนแก่น สิ่งที่ส่งมาด้วย ๑. หนังสือเชิญผู้เชี่ยวชาญ

จานวน ๑ ฉบับ

ตามที่สานักงานคณะกรรมการการอาชีวศึกษามี นโยบายในการพัฒนาหลักสูตรให้มีความทันสมัย ทัน ต่อเหตุการณ์โลกยุคไร้พรมแดน โดยคานึงถึงคุณภาพและความเป็นเลิศทางวิชาชีพ และหนึ่งในภารกิจที่สาคัญ ที่ต้องพัฒนาอย่างเป็นระบบและเร่งด่วนคือการพัฒนาหลักสูตร หลักการสอน และหลักการจัดการเรียนรู้ สาขาวิชาเทคโนโลยีสารสนเทศ วิทยาลัยอาชีวศึกษาขอนแก่น ได้ตระหนักและให้ความสาคัญในการ พัฒนาหลักสูตร ซึ่งจะเป็นกรอบในการจัดการเรียนรู้ได้อย่างมีคุณภาพ จึงขออนุญ าตดาเนินโครงการนาร่อง พัฒนาหลักสูตรรายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) ในวันที่ ๔ พฤษภาคม ๒๕๕๙ ณ ห้องประกันคุณภาพ วิทยาลัยอาชีวศึกษาขอนแก่น จึงเรียนมาเพื่อโปรดพิจารณาอนุมัติ ………………. (นายอานาจ สุขแสงรัตน์) หัวหน้างานพัฒนาหลักสูตรและการสอน

................................ (นายกิตติ์กาญจน์ ปฏิพันธ์) อาจารย์ผู้รับผิดชอบรายวิชาฯ …………

(นางสาวนัยนา เจริญพล) รองผู้อานวยการฝ่ายวิชาการ


บันทึกข้อความ ส่วนราชการ วิทยาลัยอาชีวศึกษาขอนแก่น ที่ /๒๕๕๙ วันที่ พฤษภาคม พ.ศ. ๒๕๕๙ เรื่อง รายงานผลการพัฒนาหลักสูตรรายวิชา การออกแบบและพัฒนาเว็บไซต์ ร่วมกับสถานประกอบการ เรียน ผู้อานวยการวิทยาลัยอาชีวศึกษาขอนแก่น สิ่งที่แนบมาด้วย ผลการร่วมพัฒนาหลักสูตรรายวิชา การออกแบบและพัฒนาเว็บไซต์ จานวน ๑ แผ่น ตามบันทึกข้อความที่ ๐๔๑๐ ลว. ๒๗ เมษายน ๒๕๕๙ อนุมัติให้ ดาเนินโครงการพัฒ นาหลักสูตร รายวิชาการออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) ร่วมกับสถานประกอบการในวันที่ ๔ พฤษภาคม ๒๕๕๙ ณ ห้องประกันคุณภาพ วิทยาลัยอาชีวศึกษาขอนแก่น นั้น ผลการด าเนิ น โครงการพั ฒ นาหลัก สู ต รรายวิ ช า การออกแบบและพั ฒ นาเว็ บ ไซต์ ร่ว มกั บ สถาน ประกอบการเป็นไปด้วยความเรียบร้อย เป็นไปตามวัตถุประสงค์และเกิดผลดีต่อผู้เรียนสูงสุด ดังสิ่งที่แนบมา จึงเรียนมาเพื่อโปรดทราบ ................................ (นายกิตติ์กาญจน์ ปฏิพันธ์) อาจารย์ผู้รับผิดชอบรายวิชาฯ

………………. (นายอานาจ สุขแสงรัตน์) หัวหน้างานพัฒนาหลักสูตรและการสอน ………………………………………………………… ………………………………………………………… ………………………………………………………… (นางสาวนัยนา เจริญพล) รองผู้อานวยการฝ่ายวิชาการ


โครงการพัฒนาหลักสูตรร่วมกับสถานประกอบการ รายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) ในวันที่ ๔ พฤษภาคม ๒๕๕๙ ณ ห้องประกันคุณภาพ วิทยาลัยอาชีวศึกษาขอนแก่น คาอธิบายรายวิชา (เดิม) ศึกษาและปฏิบัติหลักการออกแบบและพัฒนาเว็บไซต์ แนวคิดและรูปแบบของเว็บไซต์แบบต่าง ๆ การ วิเคราะห์และการออกแบบเว็บไซต์ การกาหนดความต้องการ การรวบรวมข้อมูลที่เกี่ยวข้อง การเลือกใช้สื่อใน รูปแบบต่าง ๆ ที่เหมาะสม การกาหนดการเชื่อมโยง ขั้น ตอนการสร้างเว็บไซต์ การเลือกและติดตั้งโปรแกรมที่ เกี่ยวข้อง การสร้าง Table , Form และ Frame, การกาหนด Link , การใช้งานภาพกราฟิก การจัดการ Layers และ Table , การใช้งานสื่อรูปแบบต่าง ๆ การสร้าง Dynamic web page

คาอธิบายรายวิชา (เพิ่มเติมใหม่) ความรู้เกี่ยวกับอินเทอร์เน็ตเบื้องต้นและคาศั พท์ที่ควรรู้ ศึกษาและปฏิบัติหลักการออกแบบและพัฒนา เว็บไซต์ แนวคิดและรูปแบบของเว็บไซต์แ บบต่าง ๆ การวิเคราะห์และการออกแบบเว็บไซต์ การกาหนดความ ต้องการ การรวบรวมข้อมูลที่เกี่ยวข้อง การออกแบบกราฟิกเพื่อพัฒนาเว็บไซต์ การเลือกใช้สื่อในรูปแบบต่าง ๆ ที่เหมาะสม การกาหนดการเชื่อมโยง ขั้นตอนการสร้างเว็บไซต์ การเลือกและติดตั้งโปรแกรมที่เกี่ยวข้อง การ สร้าง Table , Form และ Frame, การกาหนด Link , การจัดการ Layers และ Table , การใช้งานสื่อรูปแบบ ต่าง ๆ การสร้าง Dynamic web page การอับโหลดและโปรโมทเว็บไซต์

ข้อสรุปสภาพปัญหาทีเ่ กิดจากการระดมความคิดพัฒนาหลักสูตร 1. ผู้เรียนที่จบการศึกษามาจาก ม.6 หรือ ไม่ตรงกับสาขา(ไอที) ยังไม่มีพื้นฐาน หรือมีก็ไม่เท่ากัน ควรมีการให้ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ต หรือคาศัพท์ต่าง ๆ ก่อน เพื่อจะได้มีฐานความรู้ที่ ใกล้เคียงกัน การเพิ่มและเติมความรู้ต่อยอด จะทาให้ผู้เรียนไม่กลัวหรือเบื่อหน่าย 2. ส่วนมากผู้ที่เรียนด้านเทคโนโลยีสารสนเทศ(ไอที) จะมีทักษะด้านการเขียนโปรแกรม ทักษะด้าน การแก้ปัญหาเฉพาะหน้า และด้านความอดทน แต่โปรแกรมหรืองานที่พัฒนาขึ้นจาเป็นจะต้องมี ดีไซน์ มีสไตล์ ที่โดดเด่น สวยงามด้วย จึงจะสามารถนาไปจาหน่ายหรือขายได้ ฉะนั้นทักษะที่ควร เสริมอย่างยิ่งคือ ทักษะด้านการออกแบบกราฟิกเพื่องานเว็บไซต์ ให้สวยงาม มีสไตล์เฉพาะ 3. ในการพัฒนาโปรแกรม หรือ การออกแบบและพัฒนาเว็บไซต์ให้ประสบความสาเร็จสูง สิ่งสาคัญ ที่ขาดไม่ได้ต้องจากเว็บไซต์ที่ดีและสวยงามแล้ว ต้องมีการประชาสัมพันธ์ หรือ โปรโมทเว็บไซต์ให้ เป็นที่รู้จักและทาอย่างต่อเนื่องด้วย 4. การออกแบบเว็บไซต์ ไม่ควรเรียนรู้และออกแบบเฉพาะในพีซีส่วนตัวเท่านั้น ควรฝึกการเรียนรู้ ผ่านโฮสติ้งจริง ๆ หรือ โฮสติ้งฟรี ซึ่งขั้นตอนนี้เรียนกว่า การอับ-โหลด ข้อมูล ซึ่งผู้เรียนควรมีเป็น อย่างยิ่ง และควรส่งเสริมทักษะด้านความคิดสร้างสรรค์ และด้านการคิดนอกกรอบด้วย ………………….

………………..

……………………

………………………..

(นายอานาจ สุขแสงรัตน์)

(นายศาสตรา ผลากอง)

(นายกิตติ์กาญจน์ ปฏิพันธ์)

(นางสาววิจิตรา วงค์คาคูณ)

หน.งานพัฒนาหลักสูตรฯ

ผจก.บริษัทซีสโก้ ซิสเต็มฯ

หน.สาขาเทคโนโลยีสารสนเทศ

ครูสาขาเทคโนโลยีสารสนเทศ


บันทึกข้อความ ส่วนราชการ วิทยาลัยอาชีวศึกษาขอนแก่น ที่ /๒๕๕๙ วันที่ พฤษภาคม พ.ศ. ๒๕๕๙ เรื่อง ขออนุญาตใช้แผนการจัดการเรียนรู้รายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) เรียน ผู้อานวยการวิทยาลัยอาชีวศึกษาขอนแก่น สิ่งที่แนบมาด้วย แผนการจัดการเรียนรู้รายวิชา การออกแบบและพัฒนาเว็บไซต์

จานวน ๑ เล่ม

ตามที่วิทยาลัยอาชีวศึกษาขอนแก่น มีนโยบายในการจัดการเรียนการสอนโดยเน้นคุณภาพผู้เรียนเป็น สาคัญ ให้ผู้สอนตระหนักในการพัฒนาโครงการสอน และแผนการจัดการเรียนรู้ โดยคานึงถึงคุณภาพผู้เรียน พัฒนาหลักสูตร หลักการสอนและหลักการจัดการเรียนรู้ให้เป็นปัจจุบัน ข้าพเจ้านายกิตติ์กาญจน์ ปฏิพันธ์ ทาหน้าที่หัวหน้าสาขาวิชาเทคโนโลยีสารสนเทศ ได้ตระหนักและให้ ความสาคัญในการพัฒนาหลักสูตร หลักการสอน และหลักการอาชีวศึกษา ซึ่งจะเป็นกรอบในการจัดการเรียน การสอนได้อย่างมีคุณภาพ จึงขออนุญาตใช้แผนการจัดการเรียนรู้ในรายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) ประจาปีการศึกษา ๑/๒๕๕๙ จึงเรียนมาเพื่อโปรดพิจารณาอนุญาต ................................ (นายกิตติ์กาญจน์ ปฏิพันธ์) อาจารย์ผู้รับผิดชอบรายวิชาฯ

………………. (นายอานาจ สุขแสงรัตน์) หัวหน้างานพัฒนาหลักสูตรและการสอน …………………………………………………………………… …………………………………………………………………… …………………………………………………………………… (นางสาวนัยนา เจริญพล) รองผู้อานวยการฝ่ายวิชาการ


บันทึกข้อความ ส่วนราชการ วิทยาลัยอาชีวศึกษาขอนแก่น ที่ /๒๕๕๙ วันที่ ตุลาคม พ.ศ. ๒๕๕๙ เรื่อง รายงานผลการใช้แผนการจัดการเรียนรู้รายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) เรียน ผู้อานวยการวิทยาลัยอาชีวศึกษาขอนแก่น สิ่งที่แนบมาด้วย ผลการประเมินการใช้แผนการจัดการเรียนรู้รายวิชา การออกแบบและพัฒนาเว็บไซต์ ตามที่วิทยาลัยอาชีวศึกษาขอนแก่น มีนโยบายในการจัดการเรียนการสอนโดยเน้นคุณภาพผู้เรียนเป็น สาคัญ ให้ผู้สอนตระหนักในการพัฒนาโครงการสอน และแผนการจัดการเรียนรู้ฯ อย่างเป็นระบบ และข้าพเจ้า นายกิตติ์กาญจน์ ปฏิพันธ์ ได้ใช้แผนการจัดการเรียนรู้ในรายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑๒๐๐๖) ประจาปีการศึกษา ๑/๒๕๕๙ กับนักศึกษาสาขาวิชาเทคโนโลยีสารสนเทศ สสท.๑/๒๕๕๙ ผลการใช้แผนการจัดการเรียนรู้ในรายวิชา การออกแบบและพัฒนาเว็บไซต์ (๓๙๐๑-๒๐๐๖) ปรากฏ ว่าผู้เรียนมีผลสัมฤทธิ์ทางการเรียนรู้ที่ดีขึ้น มีความกระตือรือร้นในการจัดกิจกรรมการเรียนรู้ มีความรับผิดชอบ มีความสุขและกล้าคิดสร้างสรรค์ จึงเรียนมาเพื่อโปรดพิจารณาอนุญาต ................................ (นายกิตติ์กาญจน์ ปฏิพันธ์) อาจารย์ผู้รับผิดชอบรายวิชาฯ

………………. (นายอานาจ สุขแสงรัตน์) หัวหน้างานพัฒนาหลักสูตรและการสอน ………………………………………………………… ………………………………………………………… ………………………………………………………… (นางสาวนัยนา เจริญพล) รองผู้อานวยการฝ่ายวิชาการ



Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.