การเขียนเว็บ Web Editor รหัสวิชา ง20211 ครูผู้สอน นายกฤษฎา นุชมี

คำอธิบายรายวิชา กลุ่มวิชาเพิ่มเติม กลุ่มสาระการเรียนรู้การงานอาชีพและเทคโนโลยี วิชาการเขียน Web Editor 0รหัสวิชา ง20211 จำนวน 1.0 หน่วยกิต จำนวน 2 ชั่วโมง/สัปดาห์ จำนวน 40 ชั่วโมง/ภาคเรียน ศึกษา วิเคราะห์ความรู้พื้นฐานในการสร้างเว็บเพจด้วยภาษา HTML การจัดรูปแบบ เอกสารโครงสร้างภาษาHTML การจัดรูปแบบตัวอักษรและการใช้สีของตัวอักษร การ กำหนดเครื่องหมายหัวข้อและเลขลำดับ การจัดการกับตาราง การนำรูปภาพมาใช้กับเว็บเพจ และการเยื่อมโยงเว็บเพจ จากนั้นจึงศึกษาเทคนิคการสร้างและตกแต่งภาพด้วยโปรแกรม Adobe Photoshop การใช้เครื่องมือต่างๆในโปรแกรมการสร้างไฟลืใหม่ การบันทึกข้อมูลลง บนไฟล์ที่ถูกต้อง การใช้เครื่องมือตัดภาพ Lasso Toolและ Crop Tool การกำหนดการใช้ คำสั่งพื้นฐานในการสร้างภาพกราฟิก การใช้งานภาพพื้นหลัง Background Color การ ทำภาพพื้นหลังเบลอด้วยเครื่องมือ Filter การปรับภาพให้สว่างและคมชัด การปรับขนาด ชิ้นงานของภาพและการตัดกรอบของรูปภาพ จากนั้นศึกษาเทคนิคการสร้างและออกแบบ Websiteด้วยโปรแกรม Dreamweave โดยการใช้งานพื้นฐาน การเริ่มต้นใช้โปรแกรมและ ส่วนประกอบของโปรแกรม การกำหนดโครงร่างของเว็บ การตั้งค่าเพื่อให้อ่านภาษาไทยได้ การเพิ่มฟอนต์ภาษาเข้าไปในโปรแกรมและการเชื่อมโยงเว็บทั้งภายในและภายนอกเว็บไซต์

หน่วยการเรียนรู้ที่ 1 การสร้างเว็บเพจด้วยภาษา HTML 1.3 การจัดรูปแบบเอกสาร 1.4 การจัดรูปแบบตัวอักษร และการใช้สี 1.5 การกำหนดเครื่องหมายหัวข้อและลำดับเลข 1.6 การสร้างตาราง 1.6.1 คำสั่งในตาราง Table 1.6.2 การกำหนดสีของตารางและการจัดตำแหน่งข้อมูลใน ตาราง 1.7 การนำรูปภาพมาใช้กับเว็บเพจ 1.7.1 การใช้ภาพนิ่ง 1.7.2 การไช้ภาพเคลื่อนไหว 1.8 การเชื่อมโยงเว็บเพจ Link 1.8.1 การสร้างจุดเชื่อมโยงข้อความ 1.8.2 การเชื่อมโยงจุดเชื่อมโยงรูปภาพ

หน่วยการเรียนรู้ที่ 2 เทคนิคการสร้างและตกแต่งภาพด้วยโปรแกรมPhotoshop 2.1 เครื่องมือต่างๆใน (Toolbox) 2.1.1 การใช้เครื่องมือพื้นฐาน 2.1.2 การปรับเปลี่ยนตั้งค่าเครื่องมือ 2.2 การสร้างไฟล์ใหม่ (New) 2.3 การบันทึกข้อมูลลงบนไฟล์ 2.4 การใช้เครื่องมือตัดภาพ Lasso Tool 2.4.1 การสร้างภาพ Selection ได้อย่างอิสระ 2.4.2 การสร้างพื้นที่ Selection ในลักษณะของรูปหลาย เหลี่ยม 2.5 การตัดภาพด้วยเครื่องมือ Crop Tool 2.6 คำสั่งพื้นฐานของ Selection 2.7 การใช้งานภาพพื้นหลัง Background Color 2.8 การทําภาพในลักษณะเบลอโดยใช้Filter 2.8.1 ฟิลเตอร์ (Filter) คืออะไร

หน่วยการเรียนรู้ที่ 3 เทคนิคการสร้าวและออกแบบ Website ด้วย Adobe Dreamweave 3.3.2 เรียนรู้เมนูและแถบเครื่องมือ 3.4 การเริ่มกำหนดโครงร่างของเว็บ 3.5 เริ่มต้นสร้างเว็บไซต์ 3.5.1 การวางแผนงานก่อนการสร้างเว็บไซต์ 3.5.2 การกำหนดค่าต่างๆในหน้าเว็บเพจแต่ละหน้า 3.6 การตั้งค่าเพื่อให้โปรแกรมอ่านภาษาไทยได้ 3.7 การเพิ่ม Font เพื่อใช้งาน 3.8 การเชื่อมโยง(Link)

ผลการเรียนรู้

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

การสร้างเว็บเพจสามารถสร้างได้ 2 วิธี ดังนี้ ใช้โปรแกรมประเภทเท็กซ์เอดิเตอร์(Text Editor)ซึ่ง โปรแกรมที่นิยมใช้กันมาก คือ Notepad เพราะเป็น โปรแกรมที่ใช้ง่าย และมีอยู่ในระบบปฏิบัติการ Windows แต่ต้องเขียนคำสั่งด้วยตนเองทั้งหมด 2. ใช้โปรแกรมประเภทเว็บเอดิเตอร์ (Web Editor) เช่น Microsoft FrontPage , Macromedia Dreamweaver, Homesite เป็นต้น โดยส่วนใหญ่ แล้วโปรแกรมสำเร็จรูปเหล่านี้ ผู้ใช้สามารถสร้างได้ ด้วยตนเองคล้ายกับการใช้โปรแกรมสำนักงานทั่วไป โดยไม่จำเป็นต้องทำความเข้าใจในส่วนของ โครงสร้างของเว็บเพจ

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