Download to read offline
Dreamweaver
- 1. รายงานโครงงานคอมพิวเตอร์ การสร้างDreamweaver เรื่อง สานวน สุภาษิตคาพังเพย จัดทาโดย 1.นาย ธนิต ทองเหมือน เลขที่ 4 ม. 3/1 2.นางสาว จินตนา หวังบริสุทธิ์ เลขที่ 7 ม. 3/1 3. นางสาว บุษญา ชัยเพชร์ เลขที่ 15 ม. 3/1 4. นางสาว สุดารัตน์ จันทร์ทอง เลขที่25 ม. 3/1 เสนอ คุณครู จุรีรัตน์ สงด้วง โรงเรียนหาดสาราญวิทยาคม สานักงานเขตพื้นที่การศึกษามัธยมศึกษา เขต13
- 2. กิตติกรรมประกาศ รายงานโครงงานคอมพิวเตอร์ฉบับนี้ สาเร็จลุล่วงไปได้ด้วยความเมตตา ช่วยเหลืออย่างดียิ่งจาก คุณบรรยงค์ ศรีปรางค์ ที่เห็นชอบในการจัดทาโครงงานและให้ความรู้เกี่ยวกับการ สร้าง Dreamweaver อีกทั้งเป็นที่ปรึกษาในด้านวิชาการและการจัดทาโครงงานคอมพิวเตอร์ ขอขอบพระคุณคณะครูโรงเรียนหาดสาราญวิทยาคม จังหวัดตรัง ทุกท่านที่มี ส่วนช่วยสนับสนุนให้การเรียนรู้ประสบผลสาเร็จ ขอบคุณเพื่อนๆ ทุกคนที่มีส่วนช่วยแนะนาการทาโครงงาน คอมพิวเตอร์ การใช้อินเทอร์เน็ต การสร้าง Dreamweaver และการช่วยเข้ามาคลิก “LIKE” ในกล่องแสดงความ คิดเห็น ขอบคุณกาลังใจดีๆ จากคุณพ่อคุณแม่ที่คอยให้คาปรึกษา ความดีอันเกิดจากการศึกษาค้นคว้าในครั้งนี้ ผู้จัดทาโครงงานขอมอบแด่บิดา มารดา ครูอาจารย์และผู้มีพระคุณทุกท่าน ที่มีส่วนช่วยผลักดันและเป็น กาลังใจ ซึ่งผู้จัดทาซาบซึ้งในความกรุณาอันยิ่งใหญ่จากท่าน และขอขอบพระคุณมา ณ โอกาสนี้ ผู้จัดทา 1.นาย ธนิต ทองเหมือน เลขที่ 4 ม. 3/1 2.นางสาว จินตนา หวังบริสุทธิ์ เลขที่ 7 ม. 3/1 3. นางสาว บุษญา ชัยเพชร์ เลขที่ 15 ม. 3/1 4. นางสาว สุดารัตน์ จันทร์ทอง เลขที่25 ม. 3/1
- 3. บทคัดย่อ โครงงานการสร้าง Dreamweaverเรื่องสานวน สุภาษิตคาพังเพย นี้ จัดทา ขึ้นโดยมีวัตถุประสงค์ เพื่อที่จะเผยแพร่สุภาษิตคาพังเพยและแสดงคานิยมของมนุษย์มาตั้งแต่โบราณกาล ซึ่งเป็นสื่อที่ ได้รับความ สนใจและเป็นที่นิยมในปัจจุบัน มาประยุกต์เข้ากับการเรียนรู้ โดยได้ศึกษารูปแบบและ พัฒนาการเรียนรู้ใน การจัดสร้าง Dreamweaver ทั้งนี้ได้ทาการศึกษาค้นคว้า เนื้อหาความรู้ที่สนใจเกี่ยวกับเรื่องสานวน สุภาษิต คา พังเพย ซึ่งมีเนื้อหาเกี่ยวกับสานวน สุภาษิต คาพังเพย โดยผู้จัดทาโครงงานสามารถพัฒนารูปแบบของการ สร้าง Dreamweaver ได้ด้วยตนเองและนามาประยุกต์ใช้ให้เข้ากับการเรียนรู้ของตนเองมากยิ่งขึ้น และได้ นาเสนอบทเรียนผ่าน นี้ทาให้สามารถติดต่อสื่อสารกันได้ระหว่างครูเพื่อนและผู้สนใจ ทั่วไปได้เป็นอย่างดี
- 4. บทที่ 1 บทนา 1.1 แนวคิดที่มา และความสาคัญ เนื่องจากทางคณะผู้จัดทาได้แลเห็นว่าปัจจุบันนี้คนเรามักมอง ข้ามสุภาษิตคาพังเพยทั้งนี้ทางคณะ ผู้จัดทาจึงจัดทาสื่อเพื่อที่จะเผยแพร่สุภาษิตคาพังเพยและแสดงคานิยมของมนุษย์มาตั้งแต่โบราณกาล มนุษย์ ได้นาสานวนสุภาษิตคาพังเพยนามาใช้ในการให้ข้อคิดและแนวปฏิบัติรวมทั้งคติเตือนประจาใจในด้านการ อบรมสั่งสอนพร้อมทั้งเป็นการพูดให้เกิดความคิดสานึกที่ดี 1.2 วัตถุประสงค์ 1.เพื่ออนุรักษ์สานวนสุภาษิต คาพังเพย ที่เป็นไทยไว้ 2.เพื่อเผยแพร่สานวนสุภาษิต คาพังเพย แก่ผู้ที่สนใจ 3.เพื่อให้เกิดความรู้ ความเข้าใจเกี่ยวกับสานวนสุภาษิต คาพังเพย 1.3 ขอบเขตของโครงงาน 1. จัดทาโครงงานคอมพิวเตอร์ด้วย Dreamweaverเรื่อง สานวน สุภาษิต คาพังเพย 2. วัสดุ อุปกรณ์ เครื่องมือหรือโปรแกรมหรือที่ใช้ในการพัฒนา ได้แก่ เครื่องคอมพิวเตอร์ พร้อม
- 5. บทที่ 2 หลักการและทฤษฎี ในการจัดทาโครงงานคอมพิวเตอร์ การสร้างDreamweaver เรื่อง สานวน สุภาษิต คาพังเพยนี้ ผู้จัดทา โครงงานได้ศึกษาเอกสารและจากเว็บไซต์ต่างๆ ที่เกี่ยวข้องดังต่อไปนี้ 2.1 ข้อมูลเกี่ยวกับสานวน สุภาษิต คาพังเพย 2.2 Dreamweaver 2.1 ข้อมูลเกี่ยวกับสานวน สุภาษิต คาพังเพย สุภาษิต หมายถึง ถ้อยคาที่สั่งสอนหรือห้ามโดยตรง มีคาเปรียบเทียบบ้างไม่มีบ้าง เช่น คบคนให้ดูหน้า ซื้อผ้า ให้ดูเนื้อ, อย่าถือคนบ้า อย่าว่าคนเมา, น้าเชี่ยว อย่าขวางเรือ คาพังเพย หมายถึง ถ้อยคาที่แสดงความจริง ไม่ได้สอนโดยตรง อาจจะเป็นคาพังเพยแท้ก็ได้ เป็นสานวนก็ได้ เป็นคาขวัญก็ได้ คาพังเพยแท้เช่น มีเงินเขานับว่าน้อง มีทองเขานับว่าพี่, ยากเงิน จนทอง พี่น้องไม่มี, มีเงิน ทอง พูดจาได้ มีไม้ไร่ ปลูกเรือนงาม, รู้แล้วพูดไปสองไพเบี้ย รู้แล้วนิ่งเสียตาลึงทอง สานวน มักเป็นคาเปรียบเทียบ คือให้นาความเป็นไปของสิ่งนั้นๆ มาเปรียบเทียบกับความประพฤติของคน เช่นคาว่า ขิงก็รา ข่าก็แรง, ปลาร้าเค็ม มะเขือขื่น, ตัวเท่าเสา เงาท่ากระท่อม, น้าร้อนปลาเป็น น้าเย็นปลาตาย คาขวัญ มักเป็นคาปลอบขวัญหรือปลุกใจให้มุ่งมั่น เช่นคาว่า กรุงศรีอยุธยายังไม่สิ้นคนดี (หมายถึงเมืองไทยยัง ไม่สิ้นคนดี) ชาติเสือต้องไว้ลาย ชาติชายต้องไว้ชื่อ, ช้าๆ ได้พร้าเล่มงาม
- 6. 1.เกลือเป็นหนอน ญาติมิตร สามีภรรยา บุตรธิดาเพื่อนร่วมงาน หรือคนในบ้านที่คิดทรยศ,หนอนบ่อนไส้ 2.ขนทรายเข้าวัด หาประโยชน์ให้ส่วนรวม 3.ไข่ในหิน ของที่ต้องระมัดระวังทะนุถนอมอย่างยิ่ง 4.นกสองหัว คนที่ทาตัวฝักใฝ่เข้าด้วยทั้ง 2 ฝ่ายที่ไม่เป็นมิตรกับโดยหวังประโยชน์เพื่อตน 5.เกลือจิ้มเกลือ เกลือจิ้มเกลือ หมายถึง ไม่ยอมเสียเปรียบกัน แก้เผ็ดให้สาสมกัน 6.กบในกะลา ผู้ที่คิดว่าตนมีความรู้มาก แต่ที่จริงแล้วมีความรู้และประสบการณ์น้อยมาก จากัดอยู่ในกรอบแคบๆเท่านั้น 7.กระต่ายตื่นตูม อาการตื่นตกใจในเหตุการณ์ที่สรุปขึ้นเองอย่างไม่มีเหตุผล ตื่นตกใจโดยไม่คิดถึงเหตุผลว่าเกิดอะไรขึ้นกัน 8.กันไว้ดีกว่าแก้ รู้จักหาวิธีป้องกันเหตุไม่ให้เกิดขึ้นดีกว่าปล่อยให้เหตุร้ายเกิดแล้วไม่สามารถแก้ไขอะไรได้ 9.กินน้าเห็นปลิง กระทาการสิ่งใดสิ่งหนึ่งอยู่ แต่เจออะไรบางอย่างที่ไม่น่าไว้วางใจ จึงไม่ทาสิ่งนั้นๆ ต่อให้จบ 10.กินอยู่กับปากอยากอยู่กับท้อง รู้อยู่แก่ใจว่าทาอะไรลงไป แต่ตีหน้าซื่อแสร้งทาเป็นไม่รู้สานวนสุภาษิตที่คล้ายคลึงกัน
- 7. บทที่ 3 วิธีดาเนินงานโครงงาน สร้างเว็บไซต์ด้วยDreamweaver วิธีใช้ Dreamweaver CS6 เกี่ยวกับ Dreamweaver ทาความรู้จักโปรแกรม Dreamweaver Macromedia Dreamweaver เป็นโปรแกรมสาหรับออกแบบและพัฒนาเว็บไซต์ ที่ได้รับความนิยม อย่างมากในปัจจุบัน เนื่องด้วยสามารถใช้งานได้ง่าย มีเครื่องมือให้ใช้งานมากมาย ซึ่งสามารถพัฒนา เว็บได้อย่างรวดเร็ว และง่ายดาย นอกจากโปรแกรม Macromedia Dreamweaver จะออกแบบมาให้ใช้สร้างเว็บ อย่างง่ายดายแล้ว ยังเพิ่ม คุณสมบัติต่าง ๆ ที่มีประสิทธิภาพ และเอื้อประโยชน์สาหรับผู้ทาเว็บอย่างเต็มที่ ไม่ว่าจะเป็นระบบการ จัดการเกี่ยวกับ Site และการจัดเก็บไฟล์ นอกจากนี้ยังมีระบบช่วยจัดการเกี่ยวกับการ Upload ไฟล์ไปยัง เซิร์ฟเวอร์อีกด้วย นอกจากนี้แล้วปัจจุบัน Macromedia Dreamweaver รุ่นใหม่ ๆ ยังสนับสนุนการใช้งานเว็บแบบไดนามิค เพิ่มมากขึ้น มีการรองรับสคริปภาษาต่าง ๆ เช่น CSS , Java Script , ภาษา XML และรองรับลูกเล่น เกี่ยวกับการทาภาพเคลื่อนไหว Gif Animation และสนับสนุนการใช้งาน Flash เพิ่มขึ้นอีกด้วย ที่กล่าวมาข้างต้น เป็นคุณสมบัติและความสามารถของโปรแกรมตัว
- 8. เก่งตัวนี้ ซึ่งสามารถครองใจผู้ทาเว็บมาอย่างยาวนาน ตั้งแต่เริ่มต้น ก่อตั้งซึ่งจากอดีตจนถึงปัจจุบัน Macromedia Dreamweaver มี ออกมาแล้วหลายเวอร์ชั่น ซึ่งมีทั้งหมดดังนี้ Dreamweaver 1.0 (ธันวาคม ค.ศ. 1997) Dreamweaver 1.2 (มีนาคม ค.ศ. 1998) Dreamweaver 2.0 (ธันวาคม ค.ศ. 1998) Dreamweaver 3.0 (ธันวาคม ค.ศ. 1999) Dreamweaver UltraDev 1.0 (มิถุนายน ค.ศ. 2000) Dreamweaver 4.0 (ธันวาคม ค.ศ. 2000) Dreamweaver UltraDev 4.0 (ธันวาคม ค.ศ. 2000) Dreamweaver MX (พฤษภาคม ค.ศ. 2002) Dreamweaver MX 2004 (10 พฤศจิกายน ค.ศ. 2003) Dreamweaver 8 (13 พฤศจิกายน ค.ศ. 2005) Dreamweaver CS3 (9.0) รุ่นทดลอง ล่าสุด (27 มีนาคม พ.ศ. 2550) ในอดีตโปรแกรม Macromedia Dreamweaver ถูกสร้างขึ้นโดยบริษัท แมโครมีเดีย แต่ปัจจุบันนี้ควบ กิจการรวมกับบริษัท อะโดบีซิสเต็มส์ ดังนั้นเวอร์ชั่นที่ถูกพัฒนาขึ้นในภายหลัง จึงมีการใช้ชื่อใหม่ จากชื่อเดิม แมโครมีเดีย ดรีมวีฟเวอร์ (Macromedia Dreamweaver) เปลี่ยนเป็น อะโดบี ดรีมวีฟเวอร์ (Adobe Dreamweaver) การสร้าง Site เพื่อจัดเก็บไฟล์และโฟลเดอร์ ในการสร้างเว็บไซต์นั้น จะประกอบไปด้วยไฟล์ต่าง ๆ มากมาย ไม่ว่าจะเป็นไฟล์ HTML รูปภาพ และโฟลเดอร์ ซึ่งเราจะต้องมีการเตรียมการจัดเก็บส่วนประกอบเหล่านี้ เพื่อไม่ให้เกิดความสับสนใน ภายหลัง ซึ่งการสร้าง Site สามารถช่วยจัดการได้ ผู้ที่เริ่มต้นสร้างเว็บไซต์ใหม่ ๆ อาจจะคิดว่าการสร้างเว็บไซต์ไม่น่าจะยุ่งยากมากนัก รวมทั้งส่วนประกอบก็ ไม่ได้สร้างความสับสน แต่จะเกิดปัญหาขึ้นได้ในภายหลังเมื่อคุณมีเว็บไซต์ที่ประกอบไปด้วยไฟล์จานวน มากเพิ่มขั้น ซึ่งหากคุณไม่จัดเก็บให้ดี คุณจะได้เจอกับปัญหานี้แน่ ๆ ค่ะ เช่น เมื่อต้องการจะแก้ไขไฟล์ภาพ
- 9. สักภาพ คุณก็ต้องมาเสียเวลาคิดว่าไฟล์ที่ใช้งานในหน้านี้ ถูกจัดเก็บไว้ที่ไหนชื่อไฟล์อะไร เป็นต้น บางครั้ง แก้ไขเสร็จเซฟไว้คนล่ะที่ ทาให้เกิดปัญหาลิงค์ผิดพลาด หรือ บางทีลบไฟล์ หรือเซฟไฟล์ทับผิดที่ เป็นต้น เพราะฉนั้น เพื่อป้องกันปัญหายุ่งยากเหล่านี้ เราจึงต้องมีการวางแผนในการจัดเก็บไฟล์ต่าง ๆ ให้เป็น ระเบียบ มีแบบแผน เช่น จากรูปข้างต้น จะเป็นตัวอย่างลักษณะการจัดเก็บไฟล์ที่ Webmaster กาหนดขึ้น ซึ่งข้อมูลของเว็บไซต์จะถูกเก็บอยู่ในโฟลเดอร์ชื่อ nextstepdev โดยภายในโฟลเดอร์นี้จะเป็นข้อมูลของ เว็บ nextstepdev เท่านั้น ซึ่งจะประกอบไปด้วย ไฟล์ HTP และรูปภาพต่าง ๆ โดย Webmaster วางแผนให้ไฟล์ต่าง ๆ ที่เป็นไฟล์เกี่ยวกับเว็บถูกจัดเก็บอยู่ด้านนอกสุด และได้สร้าง โฟลเดอร์เพื่อจัดเก็บรูปภาพโดยเฉพาะ คือ โฟลเดอร์ images สาหรับเก็บรูปภาพที่เป็นภาพที่เป็นโครงร่าง ของเพจ ส่วนโฟลเดอร์ imgs ถูกสร้างขึ้นมาเพื่อเก็บภาพที่เป็นภาพ ประกอบเนื้อหา เป็นต้น ซึ่งเมื่อเราวางแผนไว้แล้วแบบนี้ เมื่อมีการจัดเก็บไฟล์เพิ่มขึ้น หรือเรียกใช้งานไฟล์ เราก็จะสามารถใช้งานได้ สะดวก เพราะจะทราบโดยอัตโนมัติ ว่าจะเซฟไฟล์ไว้ที่ไหน จะเรียกไฟล์จากที่ไหน เป็นต้น ซึ่งในโปรแกรม Macromedia Dreamweaver ก็มีส่วนที่สนับสนุนการจัดการเกี่ยวกับการจัดเก็บไฟล์และ โฟลเดอร์อยู่ ซึ่งเราเรียกว่าการสร้าง Site เพื่ออานวยความสะดวกในการสร้างเว็บไซต์ เวลาเรียกใช้งาน ก็ จะสามารถเรียกใช้งานได้อย่างรวดเร็ว ซึ่งทุก ๆ ครั้งที่เรามีการสร้างเว็บไซต์ใหม่ เราควรจัดการสร้าง Sit ในโปรแกรม Macromedia Dreamweaver เป็นลาดับแรกก่อนค่ะ โดยมีขึ้นตอนในการสร้างดังนี้ค่ะ ขั้นตอนที่ 1 คลิกเลือกคาสั่ง Site --> Manage Sites... จาก Menu Bar ขั้นตอนที่ 2 จะปรากฏไดอะล็อกบ็อกซ์ Manage Site ให้ทาการคลิกที่ปุ่ม New... จากนั้นเลือก Site
- 10. ขั้นตอนที่ 3 รอสักครู่จะปรากฏไดอะล็อกบ็อกซ์Site Definition ให้ทาการตั้งชื่อไซต์ ในช่อง Site name ขั้นตอนที่ 4 ระบุโฟลเดอร์ที่จะใช้ใน การจัดเก็บเว็บไซต์ โดยการคลิกที่รูปโฟลเดอร์ ที่บริเวณ Local root folder ซึ่งจะมีไดอะล็อกบ็อกซ์ใหม่เพิ่มมา ให้เลือกไปยังโฟลเดอร์ที่เราจะจัดเก็บข้อมูล จากนั้น คลิกปุ่ม Select (เลือกไปยังโฟลเดอร์ที่จะจัดเก็บเว็บไซต์ โดยต้องสร้างโฟลเดอร์นี้ไว้ก่อน จากตัวอย่าง Webmaster สร้างโฟลเดอร์ชื่อ nextstepdev ไว้ที่ C: AppServwww ดังนั้น Webmaster จึงเลือกเข้า ไปในโฟลเดอร์ชื่อ nextstepdev แล้วจึงกดปุ่ม Select ) ขั้นตอนที่ 5 เมื่อระบุโฟลเดอร์สาหรับเก็บข้อมูลเรียบร้อยแล้ว คลิกปุ่ม OK ขั้นตอนที่ 6 จะปรากฏชื่อ Site name ที่เราสร้างขึ้นในหน้าต่าง Manage Site ดังภาพ จากนั้นให้เราคลิก ปุ่ม Done
- 11. แค่นี้ก็เรียบร้อยแล้วค่ะ Site ที่เราสร้างขึ้นจะปรากฏขึ้นที่บริเวณ File Panel ทางด้านขวามือ ดังภาพ การกาหนดคุณสมบัติพื้นฐานของเว็บเพจ ก่อน ที่เราจะเริ่มต้นสร้างเว็บเพจ หลังจากเราได้สร้างไฟล์ใหม่แล้ว เราควรกาหนดคุณสมบัติ พื้นฐานให้กับหน้าเว็บเพจของเราก่อน เพื่อใช้เป็นค่าเริ่มต้นในการทาเว็บเพจของเพจนั้น คุณสมบัติพื้นฐานหรือค่าเริ่มต้นของเว็บเพจ ซึ่งเราจะต้องเริ่มกาหนดก่อนทาเว็บ ได้แก่ การ กาหนดค่าของฟอนต์ ขนาดของฟอนต์ สีของข้อความ สีของพื้นหลัง เป็นต้น ซึ่งมีวิธีกาหนดค่าคุณสมบัติพื้นฐานของเว็บเพจ ดังนี้ ขั้นตอนแรก คลิกที่เมนู Modify --> Page Properties จะมีไดอะล็อกบ็อกซ์ ปรากฏขึ้น ขั้นตอนที่ 2 กาหนดค่าในส่วนของ Appearance ซึ่งจะประกอบไปด้วย รายละเอียดที่ต้อง กาหนดดังนี้
- 12. 1. ข้อมูลเกียวกับลักษณะของข้อความ ที่จะปรากฏทางหน้าเว็บเพจเช่น จะเป็นฟอนต์อะไร ขนาดเท่าไหร่ สีอะไรเป็นต้น 2. ข้อมูลเกี่ยวกับพื้นหลังของเว็บเพจ ซึ่งสามารถกาหนดได้ ว่าต้องการให้พื้นหลังของเว็บเพจ เป็นสีอะไร หรือหากไม่กาหนดเป็นสีก็สามารถกาหนด เป็นพื้นหลังแบบรูปภาพก็ได้ 3. ส่วนของระยะขอบของเว็บเพจ ซึ่งหากคุณไม่ได้กาหนดไว้ ค่าเริ่มต้นของเว็บเพจของคุณจะมี ลักษณะเว้นว่างบริเวณขอบทั้งสี่ด้าน หากไม่ต้องการให้มีขอบให้กาหนดค่า margin ทั้งสี่ด้านให้ เท่ากับ 0 ขั้นตอนที่ 3เมื่อกาหนดเรียบร้อยแล้ว ให้ทาการคลิกปุ่ม OK เพจของคุณก็จะมีคุณสมบัติตามค่าเริ่มต้น ที่คุณได้กาหนดค่าไว้ คุณสมบัติส่วนนี้ หากคุณไม่ได้กาหนดไว้ ชนิดของฟอนต์และขนาด ที่แสดงผลใน Dreamweaver จะถูกแสดงผลตามค่าดีฟอลต์ที่คุณได้กาหนดที่ในส่วน Preferences ของโปรแกรม (ติดตามอ่าน ได้ในบทความต่อไปค่ะ) ส่วนการแสดงผลทางบราวเซอร์ หากคุณไม่ได้กาหนดชนิดของฟอนต์ ขนาด สีของฟอนต์ และสี พื้นหลัง การแสดงผลจะขึ้นอยู่กับค่าดีฟอลต์ที่กาหนดไว้ที่เว็บบราวเซอร์ของผู้เยี่ยม ชมแต่ละคน การใช้งาน CSS Style กาหนดรูปแบบตัวอักษร การทา เว็บเพจนั้นบางครั้ง เราจะต้องมีการทางานหลาย ๆ อย่าง และบางครั้งก็ต้อง ทาซ้า ๆ หลาย ๆ ครั้ง ซึ่งจะทาให้เกิดความไม่สะดวก และทาให้เสียเวลาได้ ซึ่งโปรแกรม Macromedia Dreamweaver ก็เตรียมเครื่องมือที่เรียกว่า CSS Style มาช่วยแก้ปัญหา
- 13. นี้ จะมีวิธีแก้ปัญหาอย่างไร ดูได้ที่บทความนี้ค่ะ จากปัญหาข้างต้นที่ได้กล่าวไปเพื่อน ๆ บางคนอาจจะยังไม่เห็นภาพชัดเจน ว่าอะไรบ้างที่เรา ต้องทาหลาย ๆ อย่าง และต้องทาซ้า ๆ หนึ่งในนั้นที่ Webmaster จะขอยกตัวอย่างให้เห็นกัน ชัด ๆ ก็คือ เกี่ยวกับการพิมพ์ข้อความ การพิมพ์ข้อความนั้นเราต้องปรับแต่งคุณสมบัติ ของข้อความอยู่หลาย ๆ อย่างด้วยกัน ไม่ว่าจะ เป็นการปรับเลือกฟ้อนต์ เลือกขนาดของข้อความ เลือกสีของข้อความ เห็นไหมละค่ะ เราต้อง ปรับค่าตั้ง 3 ครั้ง ถึงจะได้ลักษณะรูปแบบข้อความที่เราต้องการ แล้วเมื่อเราต้องพิมพ์ข้อความ หลาย ๆ ข้อความ หลาย ๆ ตาแหน่ง เราก็ต้องมาทาขั้นตอนที่กล่าวมาซ้า ๆ อีก เพื่อแก้ไขปัญหานี้ Macromedia Dreamweaver ก็เตรียมเครื่องมือที่เรียกว่า CSS Style มา ช่วยลดขั้นตอนการทางานซ้า ๆ แบบที่กล่าวมา โดยแค่กาหนดค่าไว้ที่ CSS Style แล้วเรียกใช้ CSS Style แค่เพียงครั้งเดียวก็เป็นอันเสร็จเรียบร้อยค่ะ ก่อนจะไปพบวิธีการสร้าง CSS Style เรามารู้จัก CSS Style กันสักหน่อย CSS Style ย่อมา จาก Cascading Style Sheets เป็นเครื่องมือที่ช่วยกาหนดคุณสมบัติของสิ่งต่าง ๆ ในหน้าเว็บ เพจ ไม่ว่าจะเป็นการกาหนดคุณสมบัติของฟอนต์ เช่น ลักษณะของฟอนต์ ขนาด กาหนด คุณสมบัติของสี เกี่ยวกับพื้นหลัง เกี่ยวกับตาราง และอื่น ๆ อีกมากมาย รูปร่างหน้าตา CSS Style ใน Macromedia Dreamweaver Mx 2004 ก็มีลักษณะดังภาพด้านบนค่ะ ซึ่งก็ ประกอบไปด้วยส่วนต่าง ๆ ตามที่เห็นในภาพค่ะ เอาละครับ เรามาเริ่มสร้าง CSS Style เพื่อกาหนดรูปแบบตัวอักษรและข้อความกันเลยค่ะ
- 14. ขั้นตอนแรก ให้คุณคลิกที่ปุ่ม สร้างสไตล์ใหม่ซึ่งอยู่บริเวณด้านล่าง (ตาแหน่ง สร้างสไตล์ใหม่ ตามรูปที่ 1 ค่ะ) ขั้นตอนที่ 2 ถ้าทาขั้นตอนแรกถูกต้อง คุณก็จะเจอไดอะล็อกบ็อกซ์ New CSS Style ตามภาพ ที่ 2 ค่ะ ให้คุณทาการตั้งชื่อของ Style ที่ช่อง Name ต้องตั้งชื่อให้สื่อความหมายนะค่ะ เพราะ ชื่อนี้จะปรากฏให้เราเลือกเมื่อต้องการใช้งาน ตั้งให้สื่อความหมายจะได้จาได้ (บางครั้งเราก็สร้าง Style หลาย ๆ ตัวค่ะ สร้างเยอะถ้าชื่อไม่สื่อความหมายเดียวจะลืมเอาได้) Webmaster ตั้งชื่อ Style ว่า "tahoma_12" เพราะจะสร้างรูปแบบฟอนต์ที่ใช้ฟอนต์แบบ tahoma และจะกาหนดขนาดฟอนต์เท่ากับ 12 pixels เมื่อตั้งชื่อและกาหนดรายละเอียดตามภาพแล้ว กด OK ขั้นตอนที่ 3 จะปรากฏไดอะล็อกบ็อกซ์ เพื่อให้ทาการเซฟ Style Sheets ให้ทาการตั้งชื่อ Style Sheets จากนั้นเซฟไว้ในโฟลเดอร์ Site งานที่กาหนดไว้สาหรับเก็บข้อมูลเว็บไซต์ที่เรา จะสร้างขึ้น
- 15. ขั้นตอนที่ 4 เมื่อเราได้เซฟStyle Sheets เรียบร้อยแล้วจะมีไดอะล็อกบ็อกซ์ปรากฏขึ้น เพื่อให้ เรากาหนดลักษณะของ Style Sheets ในที่นี้เราจะกาหนดลักษณะของตัวอักษรและข้อความ ดังนั้นให้เลือก Type สังเกตบริเวณทางขวามือ จะมีลักษณะของ Type ให้เรากาหนด ซึ่ง Webmaster ก็ได้กาหนด ฟอนต์แบบ tahoma และกาหนดขนาดฟอนต์เท่ากับ 12 pixels และกาหนดสีของฟอนต์ เป็น รหัสสี #333333 และเลือกเป็นแบบตัวอักษรแบบธรรมดา เมื่อกาหนดค่าต่าง ๆ เรียบร้อยแล้ว ก็กดปุ่ม OK เพียงแค่นี้เราก็สร้าง Style Sheets ได้แล้วค่ะ สังเกตที่บริเวณ CSS Style จะปรากฏชื่อ Style Sheets ที่เราสร้างขึ้น พร้อมทั้งรายละเอียดลักษณะของสไตล์ และที่บริเวณ File Panel ก็จะ
- 16. ปรากฏไฟล์ CSS Styleที่เราได้สร้างขึ้นปรากฏให้เห็นค่ะ ขั้นตอนการสร้าง CSS Style ก็เสร็จเรียบร้อยแล้วค่ะ เดียวบทความหน้าเราจะมาเรียนรู้ วิธีการใช้งาน CSS Style ที่เราได้สร้างไว้กันค่ะ ติดตามอ่านในบทความถัดไปค่ะ การเรียกใช้งาน CSS Style ที่ได้กาหนดไว้ บทความนี้เราจะมาเริ่มต้น ลองเรียกใช้งาน CSS Style ที่เราได้สร้างไว้ในบทความที่ แล้ว มาดูกันค่ะว่าจะเรียกใช้งานกันอย่างไร แต่รับรองได้ค่ะว่าทได้ง่าย ๆ และรวดเร็ว ด้วยค่ะ จากบทที่แล้วเราได้สร้าง CSS Style ไว้แล้ว ซึ่งเป็น Style เกี่ยวกับตัวอักษรและข้อความ ทีนี้ เราก็มาเริ่มต้นกันเลยค่ะ ขั้นตอนที่ 1 ให้เราสร้างข้อความขึ้นมาก่อนค่ะ โดยไม่ต้องกาหนดคุณสมบัติใด ๆ ของข้อความ ค่ะ แค่พิมพ์ข้อความธรรมดา ๆ
- 17. ขั้นตอนที่ 2 หลังจากนั้นให้ใช้เมาท์ลากเพื่อเลือกข้อความตามภาพที่ 2 ค่ะ ขั้นตอนที่ 3 เลื่อนเมาส์มาที่บริเวณ ด้านล่าง ตรงส่วนของ Properties จากนั้นคลิกเลือกที่ชื่อ Style ตามภาพที่ 3 ค่ะ จากนั้นเลือก Style ตามชื่อที่เราได้สร้างไว้ ในบทความที่แล้วครับ เสร็จเรียบร้อยแล้วค่ะ เพียงแค่นี้ข้อความที่เราใช้ Style นี้ ก็จะเปลี่ยนคุณสมบัติตามค่าของ Style ที่เราได้กาหนดไว้ คือฟอนต์แบบ tahoma ขนาด 12 pixels และมีสีเทาดา #333333
- 18. จากภาพผลลัพธ์ Webmaster สร้างสไตล์อีกชื่อคือ tahoma_B12red คือสร้างสไตล์ ฟอนต์ แบบ tahoma ขนาด 12 pixels และมีสีแดง #FF0000 และเป็นตัวหนา ซึ่งเมื่อเลือกใช้ Style ตัวนี้ก็จะได้ผลลัพธ์อย่างที่เห็นค่ะ การใส่สี Background ให้กับเว็บเพจ บทความนี้เป็นบทความ Basic ของการใช้โปรแกรม Dreamweaver เกี่ยวกับการใส่ สีสันให้กับหน้าเว็บเพจ โดยการกาหนดสีพื้นหลัง (Background) ให้กับเว็บเพจ ซึ่ง สามารถใส่สีให้กับพื้นหลังของเว็บเพจได้ง่าย ๆ ดังนี้ ขั้นตอนที่ 1 ให้เราเปิดโปรแกรม Dreamweaver ขึ้น มาก่อนค่ะ จากนั้นเราจะมาเริ่มต้นการ ใส่สีของหน้าเอกสาร Web Page โดยคลิกที่ Menu Bar ที่เมนู Modify --> Properties ตามภาพที่ 1 ค่ะ ขั้นตอนที่ 2 จากนั้นเมื่อปรากฏไดอะ ล็อกบ็อกซ์ Page Properties ขึ้น ให้ทาการเลือกสีที่ ต้องการในตาแหน่ง Background ตามภาพที่ 2 จากนั้นคลิกปุ่ม OK
- 19. เพียงแค่นี้ พื้นสีเว็บเพจของเพื่อน ๆก็จะเปลี่ยนเป็นสีตามที่ได้กาหนดไว้ในขึ้นตอนที่ 2 แล้ว ค่ะ การใส่ลิงค์ให้ข้อความและรูปภาพ บทความนี้จะเป็นการใส่ลิงค์ให้กับข้อความและรูปภาพ โดยใช้โปรแกรม Dreamweaver ซึ่งสามารถทาได้ง่าย ๆ ดัง ขั้นตอนที่ 1 ให้ทาการสร้างไฟล์ใหม่ใน Dreamweaver ก่อนค่ะจากนั้นดึงภาพเข้ามาใน โปรแกรม Dreamweaverสาหรับทาลิงค์แบบลิงค์รูปภาพ ตามตาแหน่งที่ 1 และการ สร้างข้อความสาหรับเตรียมทาลิงค์แบบลิงค์ข้อความ ตามตาแหน่งที่ 2
- 20. ขั้นตอนที่ 2 เราจะมาเริ่มใส่ลิงค์ให้กับข้อความและรูปภาพกันค่ะ ก่อนอื่น้เรามาทาลิงค์ แบบรูปภาพกันก่อนค่ะ เริ่มต้นก็คลิกที่ภาพที่เราจะทาลิงค์ตามตาแหน่งที่ 1 ของรูปที่ 1 จากนั้นลองสังเกตบริเวณด้านล่างของโปรแกรม Dreamweaver ในส่วนของ Properties สังเกตบริเวณช่องที่มีชื่อว่า Link ตามภาพที่ 2 ในตาแหน่ง 1.1 หากต้องการลิงค์ไฟล์ เอกสารเราสามารถลิงค์ได้โดยคลิกที่รูปแฟ้ม (ภายในวงกลม) เพื่อ Select File ที่ต้องการ ลิงค์ไปหา หรือหากเราจะลิงค์แบบลิงค์เว็บไซต์ เราก็สามารถพิมพ์ URL ของเว็บไซต์นั้น ๆ ลงในช่อง Link นี้ได้เลย ดังที่เห็นในภาพที่ 2 ซึ่งเป็นการลิงค์แบบลิงค์ไปเว็บไซต์ โดยตาม ตัวอย่างจะลิงค์ไปที่ http://www.thainextstep.com แบบที่ 2 การลิงค์แบบลิงค์ข้อความ หลังจากที่เราพิมพ์ข้อความแล้ว ให้เราทาการแด็ก เมาส์ที่บริเวณข้อความที่เราต้องการทาลิงค์ ตามภาพที่ 1 ตาแหน่งที่ 2 เมื่อแด็กเมาส์ที่ข้อความแล้ว สังเกตบริเวณด้านล่างของโปรแกรม Dreamweaver ใน ส่วนของ Properties ตามภาพที่ 2.1 ซึ่งจะมีช่องที่ชื่อว่า Link อยู่เหมือนกัน วิธีการทา ลิงค์ก็เหมือนกันกับแบบลิงค์ภาพค่ะ ซึ่งก็จะมีช่องให้ใส่ลิงค์ และปุ่มให้ Select File
- 21. เพียงแค่นี้ ก็เสร็จแล้วค่ะ ลองเซฟไฟล์แล้วลองtest กันดูค่ะ ... เวลาเราเอาเมาส์ Over บน รูปและลิงค์ เมาส์พอยเตอร์ก็จะเปลี่ยนไป จากเป็นลูกศรก็จะกลายเป็นรูปมือแทน ถ้าได้ ตามนี้ก็ลิงค์สาเร็จแล้วค่ะ การสร้างตารางใน Dreamweaver บท ความนี้เราจะมาเริ่มต้นสร้างตารางให้กับเว็บเพจกันค่ะ ซึ่งเป็นบทความ Basic อีกบทความหนึ่ง ใครที่เริ่มต้นใช้งานโปรแกรม Deamweaver ก็เข้ามาดูกันได้ค่ะ ขั้นตอนที่ 1 ให้เราเปิดโปรแกรม Dreamweaver ขึ้นมาก่อนค่ะ จากนั้นเรามาเริ่มสร้าง ตารางให้เว็บเพจของเรากันเลยค่ะ โดยคลิกที่รูปตาราง ตามภาพที่ 1 ค่ะ ขั้นตอนที่ 2 จะปรากฏไดอะล็อกบีอก Insert Table ขึ้นมา ซึ่งในส่วนนี้จะเป็นส่วน กาหนดรายละเอียดของตารางที่เราต้องการจะสร้าง อันดับแรกก็คือกาหนดขนาดของ ตาราง โดยตามตัวอย่างจะขอสร้างตารางขนาด 3 แถว 3 คอลัมน์ โดยให้มาขนาดความ กว้างของตารางเท่ากับ 300 pixels และกาหนดขอบของตารางให้เป็นแบบไม่มีขอบ เมื่อกาหนดได้ตามต้องการแล้วคลิกที่ปุ่ม OK และแล้วเราก็จะได้ตารางขนาด 3 แถว 3 คอลัมน์ และกว้าง 300 pixels หากเรา Save ไฟล์แล้วดูผลลัพธ์ ก็จะไม่เห็นอะไรใด ๆ ทั้งสิ้น เพราะเรากาหนดให้เป็นแบบไม่มีขอบ
- 22. โดยส่วนใหญ่แล้วเราจะกาหนดให้เป็นแบบไม่มี ขอบ ในกรณีที่ใช้สาหรับจัดตาแหน่งของ ข้อความเนื้อหาซะเป็นส่วนใหญ่และหากเราต้องการแบบให้แสดงผลด้วย เราก็จะต้อง ปรับแต่งรายละเอียดให้กับตารางด้วย ไม่ว่าจะเป็นการใส่เส้นขอบ การใส่สีขอบตาราง การ ใส่สีให้พื้นของตาราง และรวมไปถึงการใส่ภาพให้กับพื้นของตาราง การปรับแต่งตาราง ด้วยการใส่สีพื้นและเส้นขอบ บท ความนี้เป็นบทความต่อจากบทความสอน Dreamweaver ในบทความที่แล้ว ค่ะ หลังจากที่บทความที่แล้วเราทา Workshop Photoshop สร้างตารางได้แล้ว ในบทความนี้เราจะมาปรับแต่งตารางของเราโดยการเพิ่มสีสันให้พื้นตารางและเส้น ขอบ ขั้นตอนแรก ก่อนอื่นเราต้องสร้างตารางขึ้นมาก่อนนะค่ะ จะกี่แถวกี่คอลัมน์ก็ได้ Webmaster ขอใช้ Table จากบทความ การสร้างตารางใน Dreamweaver ที่ได้สร้าง ไว้ในบทความที่แล้วนะค่ะ เมื่อสร้างตารางแล้ว หากเราไม่ได้กาหนดเส้นขอบตาราง (เหมือนบทความที่ผ่านมาตอน สร้าง Table กาหนด Border=0) ตั้งแต่เริ่มต้นสร้าง เมื่อเราจะใส่สีของเส้นขอบ ถ้าเราใส่ สีไปจะทาให้ไม่เห็นสีของเส้นขอบตาราง ดังนั้นเราจึงต้องไปกาหนดเส้นขอบของตารางกัน ก่อน โดยการใช้เมาส์จับที่ตาราง จากนั้นกาหนดค่า Border ที่ส่วน Properties ให้มีค่า เท่ากับ 1 ดังที่ปรากฏตามภาพที่ 1
- 23. เมื่อเรากาหนด Border=1 แล้วเส้นขอบของตารางจะเปลี่ยนไปดังภาพที่ 2 และ เมื่อ ทดสอบดูผ่าน Browser ก็ทาให้เราสามารถเห็นขอบของตารางได้ ขั้นตอนที่ 2 เมื่อเราได้เส้นขอบของ ตารางแล้ว ให้เราใช้เมาส์จับที่ที่ตาราง จากนั้น สังเกตที่ส่วนของ Properties แล้วคลิกเลือก Brdr Color เพื่อใส่สีให้กับเส้นของตาราง และเมื่อใส่สีแล้วก็จะได้เส้นขอบตารางเหมือนภาพที่ 3 ค่ะ ขั้นตอนที่ 3 ขั้นตอนนี้เราจะมาใส่สี ให้กับพื้นหลังของตารางกันค่ะ เริ่มต้นโดยให้เราใช้ เมาส์จับที่ที่ตาราง จากนั้นใส่สีให้ Background ของตารางโดยคลิกเลือกสีที่ Bg Color ของ Properties จากนั้นคลิกเลือกสีที่ต้องการค่ะ
- 24. และแล้วก็เสร็จเรียบร้อย ได้ผลลัพธ์ของการปรับแต่งตาราง ตามภาพที่4 ค่ะ การใส่คาอธิบายให้รูปภาพ โดยใช้โปรแกรม Dreamweaver การใส่คาอธิบายให้รูปภาพ ก็คือการใส่คาสั่ง ALT Tag ในภาษา HTLM นั่นเอง และเราสามารถใช้โปรแกรม Dreamweaver ในการใส่คาอธิบายให้รูปภาพได้ ซึ่ง สามารถทาได้อย่างง่ายดายและรวดเร็ว ติดตามดูได้ในบทความนี้ค่ะ
- 25. ขั้นตอนการใส่คาอธิบายให้รูปภาพ โดยใช้โปรแกรม Dreamweaver อย่างแรกเราก็ต้องนาภาพเข้ามาใน โปรแกรมโดยคลิกที่ปุ่มที่ 1 เมื่อเราได้รูปภาพมาแล้วให้เรา คลิกที่รูปภาพตามรูปภาพ ที่ 2 จากนั้นสังเกตในส่วนบริเวณ Properties เราจะเห็นใน ส่วนของช่อง Alt ตามภาพที่ 3 ให้เราใส่คาอธิบายรูปภาพ ลงในช่อง Alt นี้ค่ะ แค่ นี้ก็เสร็จเรียบร้อยแล้วค่ะ ลองเซฟไฟล์เป็น HTML ไฟล์ แล้วลองเปิดไฟล์ดู หรือจะกด F12 ดูเลยก็ได้ค่ะ เมื่อเรา เลื่อนเม้าส์ไปบนรูปภาพ เราก็จะเห็นคาอธิบายของรูปภาพ ตามที่เรากาหนดไว้ค่ะ เพิ่มอักขระพิเศษใน Dreamweaver
- 26. ในการทาเว็บเพจ บางครั้งเราอาจจะต้องใส่อักขระพิเศษต่าง ๆซึ่งทาง Dreamweaver เค้าก็เตรียมเครื่องมือในส่วนนี้ไว้ให้เราใช้อยู่แล้วค่ะ ทาได้ อย่างไรเข้ามาดูได้ที่บทความนี้ค่ะ สาหรับตัวอย่างอักขระที่เราจะมาลองใส่กันวันนี้ ก็คือ Copyright ที่มีลักษณะตามภาพฝั่งซ้ายมือ วิธีทาก็ไม่ อยากค่ะ โดยทาได้ดังนี้ ก่อนอื่นก็ให้พิมพ์ข้อความขั้นมาก่อนนะค่ะ จากนั้นให้ วางเคอเซอร์ตรงตาแหน่ง X จากนั้นไปที่บริเวณเมนูบาร์ เลือกใช้คาสั่ง Insert --> Special Charecters --> Copyright ก็จะได้ผลลัพธ์ตามภาพด้านล่างค่ะ
- 27. เทคนิคการทาภาพ Swap Image สาหรับบทความนี้เราจะมาทาเทคนิคการ Swap Image เพื่อเพิ่มความน่าสนใจ ให้กับการลิงค์รูปภาพบนเว็บ นอกจากนี้สามารถนาไปประยุกต์ ทาให้เว็บไซต์ดูดี แต่จะประยุกต์แบบไหน ดูไอเดียการทาได้ที่นี่ค่ะ เทคนิคนี้ทได้ไม่อยากค่ะ เพราะเป็นการใช้เทคนิคลูกเล่นที่มีอยู่ในโปรแกรม Dreamweaver ... เราจะทาเทคนิคนี้ได้นั้น ก่อนอื่นต้องเตรียมไฟล์รูปภาพไว้ก่อน 2 ภาพค่ะ ในบทความนี้ Webmaster เตรียมภาพไว้ 2 ภาพตามรูปด้านบนค่ะ จากนั้นเมื่อเราได้รูปภาพมา 2 รูปแล้ว เราก็จะมาเริ่มทากันเลยค่ะ ขั้นตอนที่ 1 ก็ให้ทาการสร้างไฟล์ใหม่ใน Dreamweaver เลยค่ะ ขั้นตอนที่ 2 ให้ทาการดึงรูปเข้ามาใน โปรแกรม โดยการที่ตาแหน่ง A ตามภาพค่ะ จากนั้นจะมีไดอะล็อกบ็อก Select Image Source ตามรูปด้านล่าง ให้ทาการเลือก ไฟล์ภาพแรกที่เตรียมไว้ จากนั้นกดปุ่ม OK ตามตาแหน่ง C ขั้นตอนที่ 3 เมื่อได้รูปมาแล้ว ให้ทาการคลิกที่รูป จากนั้นสังเกตที่ Panel Group ทางด้านขวามือของโปรแกรม เลือกแท็บ Behaviors (หากไม่มี Panel Group Behaviors ให้ทาการเรียกใช้งาน โดยการเลือกคาสั่ง Window จากเมนูบาร์ด้านบน แล้วเลือก Behaviors) จากนั้นคลิกที่รูปเครื่องหมายบวก ตามตาแหน่ง A แล้วเลือก Swap Image ขั้นตอนที่ 4 จะปรากฏไดอะล็อกบ็อก Swap Image ให้ทาการคลิก Browse... ตาม ตาแหน่งที่ 1 จากนั้นจะปรากฏไดอะล็อกบ็อก Select Image Source ตามรูปด้านล่าง ให้ทาการเลือกไฟล์ภาพอีกภาพที่เตรียมไว้ จากนั้นกดปุ่ม OK ตามตาแหน่ง 2 จะ กลับมาที่ ไดอะล็อกบ็อก Swap Image จากนั้นกด OK ที่ตาแหน่งที่ 3
- 28. ขั้นตอนที่ 5 ทาการบัญทึกหน้าเว็บเพจเป็นเอกสาร .html หรือ .htm แค่นี้ก็เสร็จ เรียบร้อยแล้วค่ะ ลองเรียกไฟล์ที่บันทึกไว้ มาดูสิค่ะ ว่าได้ผลลัพธ์อย่างไร...? สาหรับคนที่ทาตามขึ้นตอนต่าง ๆ ข้างต้นมาหมดแล้วก็คงจะได้ทราบแล้วนะค่ะ ว่าได้ ผลลัพธ์อย่างไร สาหรับคนที่ยังไม่ได้ลงมือทาก็ลองทาตามดูค่ะ แล้วจะได้เทคนิคไปทา เว็บของคุณให้สวยขึ้นอีกแบบ
- 29. บทที่ 4 ผลการดาเนินงานโครงงาน การจัดทาโครงงานคอมพิวเตอร์การสร้าง Dreamweaverเรื่อง สานวน สุภาษิต คาพังเพยนี้ มี วัตถุประสงค์ และค้นคว้าเรื่องที่สนใจเกี่ยวกับสานวน สุภาษิต คาพังเพย เพื่อให้ผู้จัดทาโครงงานสามารถนามา ประยุกต์ใช้ให้เข้ากับการเรียนรู้ของตนเองมากยิ่งขึ้น ตลอดจนสามารถติดต่อสื่อสารกันได้ระหว่างครูเพื่อนและ ผู้สนใจทั่วไป ซึ่งมีผลการดาเนินงานโครงงาน ดังนี้ ผลการพัฒนา รูปภาพนับว่าเป็นสิ่งสาคัญอย่างมากในการสร้างเว็บเพจ ทาให้ผู้อ่านเข้าใจเรื่องราวที่นาเสนอมากยิ่งขึ้น และ ช่วยให้เว็บเพจมีสีสันสวยงาม สิ่งที่จะต้องคานึงถึง คือ ภาพควรจะต้องมีขนาดเล็ก เพื่อนาไปเรียกใช้บนเว็บเพจ ได้อย่างรวดเร็ว
- 30. บทที่ 5 สรุปผลการดาเนินงาน และข้อเสนอแนะ การจัดทาโครงงานคอมพิวเตอร์การสร้างDreamweaver เรื่อง สานวน สุภาษิตนี้ สามารถสรุปผลการ ดาเนินโครงงาน และข้อเสนอแนะ ดังนี้ 5.1 การดาเนินงานจัดทาโครงงาน 5.1.1 วัตถุประสงค์ของโครงงาน 5.1.1.1 เพื่อศึกษาและสร้าง Dreamweaver เรื่อง สานวน สุภาษิต คาพังเพย 5.1.1.2 เพื่อศึกษาค้นคว้าเรื่องที่สนใจเกี่ยวกับสานวน สุภาษิต คาพังเพย 5.1.1.3 เพื่อให้ผู้เรียนสามารถพัฒนารูปแบบของสร้าง Dreamweaver ได้ด้วยตนเองและนามาประยุกต์ใช้ให้ เข้ากับการเรียนรู้ของตนเองมากยิ่งขึ้น 5.2 สรุปผลการดาเนินงานโครงงาน การสร้าง Dreamweaver เรื่อง สานวน สุภาษิต คาพังเพยนี้ ผู้จัดทาได้เริ่มดาเนินงานตามขั้นตอนการ ดาเนินงานที่เสนอในบทที่ 3 แล้ว จากนั้นได้นาเสนอเผยแพร่ผลงานผ่านเครือข่ายอินเทอร์เน็ต ทั้งนี้สร้าง Dreamweaverดังกล่าว สามารถจัดอื่นๆ ได้เป็นอย่างดีโดยทั้งครูที่ปรึกษา เพื่อนๆในห้องเรียนได้เข้าไปมีส่วน ร่วมในการจัดการเรียนรู้ โดยแสดงความเห็นในเนื้อหาและรูปแบบของการนาเสนออย่างหลากหลาย ซึ่ง ทาให้เกิดการเรียนรู้และเป็นแหล่งเรียนรู้ในโลกออนไลน์อย่างหลากหลายและรวดเร็ว
- 31. 5.3 ข้อเสนอแนะ 5.3.1 ข้อเสนอแนะทั่วไป 5.3.1.1เว็บไซต์ที่สร้าง Dreamweaver สาเร็จรูปที่ใช้ทาเว็บไซต์ได้ง่ายและรวดเร็ว แต่ถ้าเราใช้ประโยชน์ในทางที่ไม่ถูกต้องและ ไม่เหมาะสม ก็จะส่งผลต่อการละเมิดลิขสิทธิ์และได้รับความรู้ที่ไม่ถูกต้อง เพราะฉะนั้นผู้จัดทาควรเผยแพร่สิ่งที่ดี ๆ ให้บุคคลที่ เข้ามาเยี่ยมหรือศึกษาได้ความรู้และสิ่งดี ๆ นาไปเผยแพร่ต่อให้ผู้อื่นมาศึกษาความรู้ ที่เป็นประโยชน์ต่อไป 5.3.1.2 ควรมีการจัดทาเนื้อหาของโครงงานให้หลากหลายให้ครบทุกกลุ่มสาระ การเรียนรู้ 5.3.1.3 ควรมีการจัดทาแบบทดสอบก่อนเรียนและหลังเรียนเพิ่มเติม 5.3.2 ปัญหา อุปสรรค และแนวทางในการพัฒนา 5.3.2.1 เครื่องคอมพิวเตอร์ไม่เพียงพอกับการทาโครงงาน และบางครั้งอินเทอร์เน็ตมีปัญหา เข้าพร้อมกันก็จะ ทาให้ช้า จึงทาให้การพัฒนาเว็บบล็อกเกิดความล่าช้าตามไปด้วย 5.3.2.2 เพื่อนนักเรียนบางคนเรียนรู้การพัฒนาเว็บบล็อกค่อนข้างช้า ทาให้ต้องเสียเวลาในการเรียนรู้ เพราะ ครูผู้สอนไม่สามารถสอนเนื้อหาเพิ่มเติมได้
- 32. บรรณานุกรม “คาพังเพย” ทองสืบ ศุภะมาร์ค ***สานวนไทย,กาญจนาคพันธุ์, พระนคร : ห้างหุ้นส่วนจากัดรวมสาส์น, พ.ศ.2514 เว็บไซต์ http://papillon-dreamweaver.blogspot.com/2014/02/dreamweaver-cs6.html http://krupichai4259.blogspot.com/p/5.html