โครงการจัดทำเว็บไซต์ Website Project

โครงการจดั ทาเวบ็ ไซต์(กรณศี ึกษา: โรงเรียนวดั ไผ่ล้อม ตาบลจนั ทนิมิต อาเภอเมือง จงั หวดั จนั ทบุรี) Website Project(WatPhaiLom School JanThaNiMid Meuang Provience Chanthaburi) นายปิ ตุภูมิ ศรีบุษรา นายพชั รพล เฉลมิ ศรีภญิ โญรัช นายสุริยา จนั ทะระ นายอสิ ระ ดาสุโพธ์ิ โครงการนีเ้ ป็ นส่วนหน่ึงของวชิ าโครงการ รหสั วชิ า 3204-6001 ตามหลกั สูตรประกาศนียบตั รวชิ าชีพช้ันสูง สาขาวชิ าคอมพวิ เตอร์ธุรกจิ สาขางานการพฒั นาเวบ็ เพจ วทิ ยาลยั เทคนิคจนั ทบุรี พ.ศ. 2557

หวั ขอ้ โครงการ โครงการจดั ทาเวบ็ ไซต์ (กรณีศึกษา: โรงเรียนวดั ไผล่ อ้ ม ตาบล จนั ทนิมิต อาเภอเมือง จงั หวดั จนั ทบุรี) Website Projectโดย (WatPhaiLom School JanThaNiMid Meuang Provience Chanthaburi)ครูท่ีปรึกษา นายปิ ตุภมู ิ ศรีบุษราสาขาวชิ า นายพชั รพล เฉลิมศรีภิญโญรัชสาขางาน นายสุริยา จนั ทะระปี การศึกษา นายอิสระ ดาสุโพธ์ิ นางจิรวรรณ มะลาไสย คอมพวิ เตอร์ธุรกิจ การพฒั นาเวบ็ เพจ 2557 บทคดั ย่อกกกกกกกกโครงการจดั ทาเวบ็ ไซต์ (กรณีศึกษา : โรงเรียนวดั ไผ่ลอ้ ม) มีวตั ถุประสงค์เพ่ือสร้างเวบ็ ไซต์โดยใช้โปรแกรม Joomla ตกแต่งให้มีความทนั สมยั และเหมาะสมกบั การเน้ือหาของเวบ็ ไซตแ์ ละเพ่ือนาความรู้จากวิชาเรียนไปสร้างเวบ็ ไซตโ์ รงเรียนวดั ไผล่ อ้ ม โครงการน้ีจะเป็ นวจิ ยัแบบเจาะจงกลุ่มตวั อยา่ ง เครื่องมือการทาวิจยั คร้ังน้ีจะเป็ นแบบสอบถามในเรื่องการจดั ทาเวบ็ ไซต์โรงเรียนวดั ไผล่ อ้ มและแบบสอบถามมีท้งั หมด 10 ขอ้ และแบบสอบถามในคร้ังน้ีทาการวิเคราะห์ขอ้ มลู โดยการหาค่าผลรวม และหาค่าเฉล่ีย ของผตู้ อบแบบสอบถาม 26 คนกกกกกกกกผลการศึกษาพบวา่ แบบสอบถามในเวบ็ ไซตโ์ รงเรียนวดั ไผล่ อ้ ม ในแต่ละดา้ นเป็ นเกณฑ์ในการหาผลการวเิ คราะห์ ระดบั เวบ็ ไซตโ์ รงเรียนวดั ไผล่ อ้ มโดยส่วนรวมเฉลี่ยอยใู่ นระดบั ดี โดยได้เรียงลาดบั จากเกณฑ์ที่มากสุดไปหาค่าเกณฑ์ท่ีนอ้ ยสุด ค่าที่มากท่ีสุดของเกณฑด์ ี คือขอ้ ท่ี 2 ความถูกตอ้ งของเน้ือหา มีค่าเฉล่ียเท่ากบั 4.46 และระดบั ที่นอ้ ยท่ีสุด ขอ้ ท่ี 1 เน้ือหาของเวบ็ ไซตม์ ีความเหมาะสม มีคา่ เฉล่ียเท่ากบั 4.08

Diploam thesis topic Website Project (WatPhaiLom School JanThaNiMid Meuang ProvienceBy Chanthaburi) Mr.Pitupum SribusaraConsultan Teacher Mr.Patcharapon ChalermsripinyolusMajor Mr.Suriya JantaraYear Mr.Aissara Dasupho Mrs. Jirawan Malasai Web Page Development 2014 Abstract The website project (WatPhaiLom School). The objective of the study was to buildwebsite by using Joomla the modern decor appropriate to the content of the website and to applythe knowledge from the course by created a WatPhaiLom School Website. This project made aresearch for a specific sample group. The tool of research will be a questionnaire of the aboutcreated a WatPhaiLom School Website by questionnaire with 10 questions. And questionnaire inthis research is performed analysis by using the sum. And average of the respondents 26 people The results indicate that questionnaire of the create a WatPhaiLom School Website.On each side were used for analysis. Level of the WatPhaiLom School Website all it was good.Sort by the maximum to the minimum. Maximum threshold it was good is the number 2 is correctcontent have average to 4.46 and minimum threshold is the number 1 is the site content isappropriate have average to 4.08

ใบรับรองโครงการ โครงการจดั ทาเวบ็ ไซต์ (กรณีศึกษา: โรงเรียนวดั ไผล่ อ้ ม ตาบลโดย จนั ทนิมิต อาเภอเมือง จงั หวดั จนั ทบุรี) Website Project (WatPhaiLom School JanThaNiMid Meuang Provienceครูท่ีปรึกษา Chanthaburi)สาขาวชิ า นายปิ ตุภูมิ ศรีบุษราสาขางาน นายพชั รพล เฉลิมศรีภิญโญรัชปี การศึกษา นายสุริยา จนั ทะระ นายอิสระ ดาสุโพธ์ิ นางจิรวรรณ มะลาไสย คอมพวิ เตอร์ธุรกิจ การพฒั นาเวบ็ เพจ 2557กกกกกกกกไดร้ ับอนุมตั ิให้นับโครงการน้ีเป็ นส่วนหน่ึงของวิชาโครงการ รหัสวิชา 3204-6001หลักสูตรประกาศนียบัตรวิชาช้ันสูง สาขาวิชาคอมพิวเตอร์ธุรกิจ สาขางานพฒั นาเว็บเพจวทิ ยาลยั เทคนิคจนั ทบุรี หวั หนา้ แผนกคอมพิวเตอร์ธุรกิจ (นางพีรญา ดุนขุนทด)คณะกรรมการสอบโครงการ ................................................. ประธานกรรมการ (นางจิรวรรณ มะลาไสย).................................................กรรมการ .................................................กรรมการ (นางสาวสุดาจิต มณีโชติ) (นายเสถียร ไตเ่ มฆ) (นายวเิ ชียร ประเสริฐสกลุ ) (นายสมประสงค์ สิงห์สุวรรณ) รองผอู้ านวยการฝ่ ายวชิ าการ ผอู้ านวยการวทิ ยาลยั เทคนิคจนั ทบุรีวนั ท่ี.........../............../............... วนั ท่ี.........../............../...............

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

เป้ าหมายกกกกกกกก1.กกนกั เรียน ผปู้ กครอง ครูและผบู้ ริหารโรงเรียน ร้อยละ 80 ใชเ้ วบ็ ไซตโ์ รงเรียนเป็ นกก แหล่งขอ้ มูลข่าวสาร ความรู้ และเผยแพร่ผลงานแก่นกั เรียนและคนทว่ั ไปกกกกกกกก2.กกมีผดู้ ูแลเวบ็ ไซตโ์ รงเรียนเกิดข้ึนอยา่ งนอ้ ยโรงเรียนละ 1 คนกกกกกกกก3.กกสามารถขอพ้นื ท่ีในการ Up ขอ้ มลู เวบ็ ไซตไ์ ด้กกกกกกกก4.กกมีความรู้พ้ืนฐานในการใชโ้ ปรแกรมตา่ ง ๆ สาหรับใชท้ าเวบ็ ไซต์เคร่ืองมอื และอุปกรณ์กกกกกHardwareกกกกกกกก1.กกเคร่ืองคอมพวิ เตอร์กกกกกกกก2.กกFlash Driveกกกกกกกก3.กกเครื่องพิมพ์กกกกกSoftwareกกกกกกกก1.กกโปรแกรม Joomla 2.5กกกกกกกก2.กกPhothoshopกกกกกกกก3.กกxamppวธิ ีการดาเนินการกกกกกกกก1.กกสารวจสภาพปัญหา ความตอ้ งการในการมีเวบ็ ไซตร์ ่วมกบั ชุมชนและโรงเรียนในกลุ่ม เครือข่ายพฒั นาการศึกษากกกกกกกก2.กกสอบถามและหาขอ้ มูล เพอ่ื จดั ทาเวบ็ ไซต์กกกกกกกก3.กกออกแบบเวบ็ ไซต์กกกกกกกก4.กกนาไปเสนอผทู้ ่ีเก่ียวขอ้ งเพ่ือตรวจสอบกกกกกกกก5.กกดาเนินการทาเวบ็ ไซต์ และสอบถามขอ้ มลู เพมิ่ เติมกกกกกกกก6.กกเสนอใหผ้ ทู้ ่ีเก่ียวขอ้ งตรวจสอบอีกคร้ังกกกกกกกก7.กกอพั โหลดเวบ็ ไซต์กกกกกกกก8.กกจดั ทารูปเล่มโครงการกกกกกกกก9.กกประชาสมั พนั ธ์เวบ็ ไซต์ และดาเนินการบริหารจดั การเวบ็ ไซตแ์ ละบุคลากรที่เกี่ยวขอ้ ง

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

ระยะเวลาในการดาเนินการกกกกกกกก19 พฤษภาคม – 19 กนั ยายน พ.ศ. 2557 กจิ กรรม ระยะเวลาดาเนินการ (สัปดาห์) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 181.กกสารวจสภาพปัญหา ความตอ้ งการในการมีเวบ็ ไซตร์ ่วมกบัชุมชนและโรงเรียนในกลุ่มเครือขา่ ยพฒั นาการศึกษา2.กกสอบถามและหาขอ้ มลู เพือ่จดั ทาเวบ็ ไซต์3.กกออกแบบเวบ็ ไซต์4.กกนาไปเสนอผทู้ ่ีเก่ียวขอ้ งเพ่อืตรวจสอบ5.กกดาเนินการทาเวบ็ ไซต์ และสอบถามขอ้ มลู เพมิ่ เติม6.กกเสนอใหผ้ ทู้ ี่เก่ียวขอ้ งตรวจสอบอีกคร้ัง7.กกอพั โหลดเวบ็ ไซต์8.กกจดั ทารูปเล่มโครงการ9.กกประชาสัมพนั ธ์เวบ็ ไซต์ และดาเนินการบริหารจดั การเวบ็ ไซต์และบุคลากรที่เก่ียวขอ้ ง10.กกสรุปผลการดาเนินงานและนาเสนอโครงการ

(นายสุริยา จนั ทะระ)นกั ศึกษาแผนกคอมพิวเตอร์ธุรกิจ หวั หนา้ โครงการ (นางจิรวรรณ มะลาไสย) ครูที่ปรึกษาโครงการ

ที่ ศธ.04030.017/ โรงเรียนวดั ไผล่ อ้ ม (อินทก์อุทยั ) หมทู่ ี่ 6 บา้ นไผล่ อ้ ม ต.จนั ทนิมิต อ.เมือง จ.จนั ทบุรี 22000 10 ตุลาคม 2557เร่ืองกกขอขอบคุณเรียนกกผอู้ านวยการวทิ ยาลยั เทคนิคจนั ทบุรี ตามท่ีแผนกคอมพิวเตอร์ธุรกิจ วิทยาลัยเทคนิคจนั ทบุรี ได้กาหนดให้นักศึกษาจดั ทาโครงการในรายวิชาโครงการ รหสั วชิ า 3204 – 6001 ซ่ึงนกั ศึกษาแผนกคอมพิวเตอร์ธุรกิจไดจ้ ดั ทาโครงการสร้างเวบ็ ไซตป์ ระชาสัมพนั ธ์แก่โรงเรียน ตามรายละเอียดแจง้ แลว้ น้นั ทางโรงเรียนวดั ไผล่ อ้ ม (อินทกอ์ ุทยั ) เห็นวา่ เป็ นโครงการที่ดี เหมาะสมท่ีจะเปิ ดโอกาสให้นกั เรียนไดน้ าความรู้ดา้ นคอมพิวเตอร์จากการเรียน สามารถนาไปใชใ้ นชีวิตประจาวนั ไดเ้ ป็ นอยา่ งดีทางโรงเรียนจึงขอขอบคุณมา ณ โอกาสน้ี จึงเรียนมาเพ่ือโปรดทราบ ขอแสดงความนบั ถือ วา่ ที่ร้อยตรี (สุรชยั ภทั ราภรณ์ไพบูลย)์ ผอู้ านวยการโรงเรียนวดั ไผล่ อ้ ม (อินทกอ์ ุทยั )โทร 039-321616

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

สารบญั หนา้บทคดั ยอ่ กกิตติกรรมประกาศ คสารบญั ตาราง ฉสารบญั ภาพ ชบทที่ 1 บทนา 1 1.1 ความเป็นมาและความสาคญั 2 1.2 วตั ถุประสงคข์ องโครงการ 2 1.3 ขอบเขตของโครงการ 2 1.4 ประโยชนค์ าดวา่ จะไดร้ ับ 3บทที่ 2 เอกสารและวจิ ยั ท่ีเกี่ยวขอ้ ง 3 2.1 การสร้างเวบ็ ไซต์ 15 2.2 โปรแกรมท่ีเกี่ยวขอ้ ง 17 2.3 การอพั โหลด 19 2.4 วจิ ยั ที่เก่ียวขอ้ ง 20บทที่ 3 วธิ ีดาเนินการ 21 3.1 การศึกษา และ รวบรวมขอ้ มูลต่างๆ 21 3.2 ออกแบบเวบ็ ไซต์ 38 3.3 จดั ทาเวบ็ ไซต์ 57 3.4 ตรวจสอบและแกไ้ ข 57 3.5 อพั โหลดเวบ็ ไซต์ 60บทที่ 4 ผลการดาเนินงาน 60 4.1 หนา้ เวบ็ ไซตโ์ รงเรียนวดั ไผล่ อ้ ม 7 4.2 สรุปผลการวเิ คราะห์แบบสอบถาม

สารบญั (ต่อ) หนา้บทท่ี 5 สรุปผลและขอ้ เสนอแนะ 80 5.1 สรุปผล 80 5.2 ปัญหาและอุปสรรค 80 5.3 ขอ้ เสนอแนะ 80บรรณานุกรม 81ภาคผนวก ก 82ภาคผนวก ข 108ประวตั ิผจู้ ดั ทาโครงการ 137

สารบัญตาราง หนา้ 79ตารางท่ี 79 4-1 แสดงร้อยละของผตู้ อบแบบสอบถาม จาแนกขอ้ มลู ตามเพศ 161 4-2 ตารางสรุปแบบสอบถามความคิดเห็นของครู-อาจารย์ และนกั เรียน-นกั ศึกษา 161 ข-1 แสดงร้อยละของผตู้ อบแบบสอบถาม จาแนกขอ้ มูลตามเพศ ข-2 ตารางสรุปแบบสอบถามความคิดเห็นของครู-อาจารย์ และนกั เรียน-นกั ศึกษา

สารบญั ภาพ หนา้ภาพที่ 6 6 2-1 เวบ็ ที่มีโครงสร้างแบบเรียงลาดบั 7 2-2 เวบ็ ที่มีโครงสร้างแบบลาดบั ข้นั 8 2-3 เวบ็ ท่ีมีโครงสร้างแบบตาราง 10 2-4 เวบ็ ที่มีโครงสร้างแบบใยแมงมมุ 11 2-5 การกาหนดโครงสร้างของเวบ็ ของโรงเรียนเสริมงามวิทยาคม 11 2-6 การกาหนดการเชื่อมโยงเวบ็ เพจ 12 2-7 การสร้างโฟลเดอร์และการตงั้ ชื่อและนามสกลุ ไฟล์ 12 2-8 การออกแบบเว็บเพจแตล่ ะหน้าในเว็บไซต์ 13 2-9 โครงสร้างเวบ็ ไซต์ 13 2-10 ตวั อยา่ งการแบง่ พืน้ ท่ีเว็บไซต์ 14 2-11 การสร้างเวบ็ ด้วยภาษา HTML 14 2-12 การใช้โปรแกรม Filezilla อพั โหลดไฟล์ 20 2-13 ตวั อยา่ งเว็บไซต์โรงเรียนเสริมงามวิทยาคม 21 3-1 ข้นั ตอนการดาเนินการจดั ทาโครงการ 22 3-2 ภาพโครงสร้างเวบ็ ไซต์ 23 3-3 การเชื่อมโยงระหวา่ งเพจ 24 3-4 หน้าแรก 25 3-5 ประวตั ิความเป็นมา 26 3-6 ฝ่ ายผบู้ ริหาร 27 3-7 ฝ่ ายวชิ าการ 28 3-8 ฝ่ ายงานบริหารทว่ั ไป 3-9 ฝ่ ายบริหารงบประมาณและงานบุคลากร

สารบญั ภาพ (ต่อ) หนา้ 29ภาพที่ 30 3-10 กิจกรรมผลงาน 31 3-11 ฝ่ ายบริหารงบประมาณและงานบุคลากร 32 3-12 ติดต่อเรา 33 3-13 ขา้ ราชการครู 34 3-14 คณะกรรมการสถานศึกษาข้ึนพ้นื ฐาน 35 3-15 คณะกรรมการนกั เรียน 36 3-16 จานวนนกั เรียน 37 3-17 ฝ่ ายบริหารงบประมาณและงานบุคลากร 38 3-18 ขอ้ มูลคอมพวิ เตอร์อินเทอร์เน็ต 38 3-19 ใส่ URL เพอ่ื เขา้ ไปแกไ้ ขขอ้ มลู 39 3-20 หนา้ การใส่รหสั 39 3-21 การใส่รหสั เพ่ือเขา้ ไปแกไ้ ขขอ้ มลู 41 3-22 หนา้ ฐานขอ้ มูลที่สามารถเขา้ ไปแกไ้ ขได้ 41 3-23 หนา้ ตาของ Joomla หนา้ แรก 42 3-24 การเขา้ หนา้ การสร้างเทมเพลต 42 3-25 หนา้ การอพั โหลดไฟลเ์ ทมเพลต 43 3-26 การเขา้ ไปท่ีหนา้ การจดั การเทมเพลต 43 3-27 การเขา้ ไปเลือกใชเ้ ทมเพลต 44 3-28 การเขา้ หนา้ การสร้างโมดูล 44 3-29 การอพั โหลดไฟลโ์ มดูล 3-30 การเขา้ ไปที่หนา้ การจดั การโมดูล

สารบัญภาพ (ต่อ) หนา้ภาพที่ 45 45 3-31 การเลือกใชง้ านโมดูล 46 3-32 การต้งั ค่าโมดูล 46 3-33 การเขา้ ไปที่หนา้ การจดั การเน้ือหา 47 3-34 การสร้างเน้ือหา 47 3-35 การเลือกรูปแบบการบนั ทึกขอ้ มลู 48 3-36 การแกไ้ ขเน้ือหา 48 3-37 การทาการแกไ้ ขเน้ือหา 49 3-38 การลบเน้ือหา 49 3-39 การเพ่มิ กลุ่มเมนูใหม่ 50 3-40 การเพมิ่ กลุ่มเมนูใหม่ 50 3-41 การเพิม่ โมดูล กลุ่มเมนู 51 3-42 การต้งั ค่าโมดูล เมนู 51 3-43 การเลือกตาแหน่งของโมดูลเมนู 52 3-44 การเลือกรูปแบบบนั ทึกขอ้ มลู 52 3-45 การสร้างเมนูหลกั 53 3-46 การเลือกชนิดของขอ้ มูล 53 3-47 การใส่รายละเอียดเมนู^ 54 3-48 การใส่เน้ือหา^ 54 3-49 การใส่รายละเอียดเมนู^ 55 3-50 การเลือกรูปแบบบนั ทึกขอ้ มูล 3-51 การสร้างลิงคภ์ ายนอก

สารบัญภาพ (ต่อ)ภาพที่ หนา้ 3-52 การใส่รายละเอียด 55 3-53 การเลือกชนิดของเมนู 56 3-54 การใส่ url ที่จะลิงคไ์ ป 56 3-55 การเลือกรูปแบบบนั ทึกขอ้ มูล 56 3-56 ลงทะเบียนพ้ืนที่เวบ็ ไซต์ 57 3-57 ภาพหนา้ โปรแกรม 58 3-58 รูปการกรอกขอ้ มูล 58 3-59 ภาพการอพั โหลดเวบ็ ไซต์ 59 3-60 ภาพหนา้ เวบ็ ไซตโ์ รงเรียนวดั ไผล่ อ้ ม 59 4-1 หนา้ หลกั ของเวบ็ ไซต์ 60 4-2 หนา้ ประวตั ิของโรงเรียนเล่าความเป็นมาของโรงเรียน 61 4-3 หนา้ แสดงรายช่ือผบู้ ริหารของโรงเรียนวดั ไผล่ อ้ ม 62 4-4 หนา้ แสดงรายชื่อฝ่ ายวิชาการของโรงเรียนวดั ไผล่ อ้ ม 63 4-5 หนา้ แสดงรายชื่อฝ่ ายบริหารทวั่ ไปของโรงเรียนวดั ไผล่ อ้ ม 64 4-6 หนา้ แสดงรายช่ือฝ่ ายบริหารงบประมาณและงานบุคลากรของโรงเรียนวดั ไผล่ อ้ ม 65 4-7 หนา้ แสดงหมวดหมกู่ ิจกรรมผลงานของโรงเรียนวดั ไผล่ อ้ ม 66 4-8 หนา้ แสดงภาพบรรยากาศกิจกรรมตลาดนดั เศรษฐกิจพอเพียง 67 4-9 หนา้ แสดงภาพกิจกรรมวนั ต่อตา้ นยาเสพติด 68 4-10 หนา้ แสดงภาพกิจกรรมวนั ปฐมนิเทศ 69 4-11 หนา้ แสดงภาพพนั ธกิจนโยบายของโรงเรียนวดั ไผล่ อ้ ม 70 4-12 หนา้ แสดงที่อยทู่ ่ีติดต่อไดข้ องทางโรงเรียนวดั ไผล่ อ้ ม 71

สารบัญภาพ (ต่อ) หนา้ 72ภาพท่ี 73 4-13 หนา้ แสดงรายชื่อขา้ ราชการครู^ 74 4-14 หนา้ แสดงรายชื่อคณะกรรมการศึกษาข้นั พ้ืนฐาน^ 75 4-15 หนา้ แสดงรายชื่อคณะกรรมการนกั เรียน^ 76 4-16 หนา้ แสดงรายช่ือจานวนนกั เรียน 77 4-17 หนา้ แสดงรายการส่ิงก่อสร้าง 4-18 หนา้ แสดงสถิติการเขา้ ใชง้ านคอมพวิ เตอร์ และอินเทอร์เน็ต

บทที่ 1 บทนากกกกกกกกปัจจุบนั เว็บไซต์มีบทบาทอย่างมากในชีวิต ช่วยให้เราสะดวกสบายในการทางานคน้ ควา้ หาขอ้ มูลเห็นไดว้ า่ เวบ็ ไซตม์ ีความสาคญั กบั ทุกสาขาอาชีพรวมท้งั การศึกษาท่ีมีการเรียนการสอนการสร้างเวบ็ ไซต์เพ่ิมมากข้ึนโรงเรียนต่าง ๆ ก็บรรจุหลกั สูตรการสร้างเวบ็ ไซต์เป็ นหลกั สูตรพ้ืนฐาน ในการเรียนการสอนทุกระดบั ช้ันซ่ึงการเรียนสมยั น้ีตอ้ งให้ทนั กบั ยุคไอทีในปัจจุบนั มีความจาเป็ นอยา่ งมากยกตวั อยา่ งเช่นจะหางานแบบวิธีท่ีสบายท่ีสุดก็คือเปิ ดเวบ็ ไซตห์ างานเพื่อที่จะไดไ้ ม่ตอ้ งหมดค่าใชจ้ า่ ยไปในการเดินทางหรือคา่ อะไรอีกหลาย ๆ อยา่ ง1.1กกความเป็ นมาและความสาคญักกกกกกกกในปัจจุบนั เว็บไซต์ได้เจริญก้าวหน้าอย่างรวดเร็ว ในการดาเนินชีวิตประจาวนั ของมนุษยเ์ วบ็ ไซต์และคอมพิวเตอร์ไดเ้ ขา้ มามีบทบาทสาคญั ต่อการดาเนินกิจกรรมต่าง ๆ โดยเฉพาะอย่างย่ิงการศึกษาคน้ ควา้ เพราะในแต่ละอาชีพหลกั ๆ ตอ้ งมีการใช้เวบ็ ไซต์ในการสื่อสารในการช่วยคน้ หา เช่น คน้ หาสถานท่ีรับสมคั รงาน รวมถึงคน้ หาความรู้ต่าง ๆ ในการทางาน ในรายวิชาเรียน ดว้ ยความกา้ วหนา้ ของเวบ็ ไซตแ์ ละอุปกรณ์ IT ทาใหอ้ งค์กรต่าง ๆ นาเทคโนโลยเี หล่าน้ีเขา้ มาช่วยในการดาเนินงานขององคก์ รใหม้ ีประสิทธิภาพมากยงิ่ ข้ึน ไมว่ า่ จะเป็ นการรับ-ส่งขอ้ มูลข่าวสารอิเล็กทรอนิกส์ การนาเว็บไซต์เขา้ มาใช้งานในการทาธุรกิจเช่นเว็บไซต์ olx.com\"Joomla\" เป็ นระบบบริหารจดั การเวบ็ ไซต์ (content management system: cms) ท่ีช่วยใหก้ ารพฒั นาเวบ็ ไซตเ์ ป็ นเร่ืองง่ายและรวดเร็ว สามารถติดต้งั ใชง้ านและอพั เดทขอ้ มูลไดท้ ุกท่ีทุกเวลาตามตอ้ งการ โปรแกรมjoomla จะแบ่งเวบ็ ไซต์ออกเป็ นสองส่วนหลกั ๆ คือ frontend คือส่วนท่ีแสดงผลให้กบั ผเู้ ขา้ ชมเวบ็ ไซต์ หรืออีกนยั หน่ึงก็คือเน้ือหาของเวบ็ ไซตน์ นั่ เอง backend คือส่วนการจดั การเน้ือหารวมถึงโครงสร้างของเวบ็ ไซต์ หรือเรียกอีกช่ือหน่ึงว่าส่วน administrator ดงั น้ันจึงจดั ทาโครงการสร้างเวบ็ ไซตใ์ ห้โรงเรียน โครงการน้ีไดจ้ ดั ทาข้ึนเพ่ือโรงเรียนวดั ไผล่ อ้ มเพื่อไดม้ ีเวบ็ ไซตเ์ ป็ นของตวั เองจะได้เป็ นท่ีเก็บรวบรวมขอ้ มูลของโรงเรียนและกิจกรรมต่าง ๆ ของนักเรียนโดยใช้โปรแกรมjoomla2.5

1.2วตั ถุประสงค์1.2กก1.2.1กกเพ่ือสร้างเวบ็ ไซตโ์ ดยใชโ้ ปรแกรม Joomla ตกแต่งใหม้ ีความทนั สมยั และเหมาะสมกบั การเน้ือหาของเวบ็ ไซต์1.2กก1.2.2กกเพ่ือนาความรู้จากวิชาเรียน ไปสร้างเวบ็ ไซต์โรงเรียนวดั ไผ่ล้อม โดยใช้โปรแกรมjoomla1.3กกขอบเขตของโครงการกกกก1.3.1กกเวบ็ ไซตโ์ รงเรียนวดั ไผล่ อ้ ม 1 เวบ็ ไซต์กกกก1.3.2กกประชาสัมพนั ธ์เวบ็ ไซตโ์ รงเรียนวดั ไผล่ อ้ มกกกก1.3.3กกไดม้ ีกระบวนการนาความรู้จากวชิ าเรียนมาใชใ้ หเ้ กิดประโยชน์1.4กกประโยชน์คาดว่าจะได้รับ1.2กก1.4.1กกไดร้ ู้จกั การสร้างเวบ็ ไซต์ เรื่องการใชโ้ ปรแกรม Joomla ใหม้ ีทนั สมยั และเหมาะสมกบัการเรียนรู้1.2กก1.4.2กกได้นาความรู้จากวิชาเรียน ไปสร้างเว็บไซต์โรงเรียนวดั ไผ่ลอ้ ม โดยใช้โปรแกรมjoomla

บทท่ี 2 เอกสารและวจิ ยั ทเ่ี กย่ี วข้องกกกกกกกกการศึกษาเรื่อง “การสร้างเวบ็ ไซต์” กรณีศึกษา โรงเรียนวดั ไผล่ อ้ ม (อินทก์อุทยั ) เป็ นการศึกษาโดยการนาเอาความรู้ทางดา้ นการสร้างเว็บไซต์ มาเป็ นตวั ช่วยในการสร้างเวบ็ ไซตเ์ พื่อประชาสัมพนั ธ์โรงเรียนให้เป็ นท่ีรู้จกั อยา่ งแพร่หลาย ผูพ้ ฒั นาไดท้ าการศึกษาคน้ ควา้ จากตาราและเอกสารท่ีเกี่ยวขอ้ งเพือ่ ใชเ้ ป็นแนวทางในการศึกษาและพฒั นาระบบโดยมีประเด็นที่จะศึกษาดงั น้ีกกกกกกกก2.1กกการสร้างเวบ็ ไซต์กกกกกกกก2.2กกโปรแกรมที่เก่ียวขอ้ งกกกกกกกก2.3กกการอพั โหลดกกกกกกกก2.4กกวจิ ยั ที่เก่ียวขอ้ ง2.1กกการสร้างเวบ็ ไซต์2.1กก2.1.1กกหลกั การออกแบบเวบ็ ไซต์กกกกกกกกการกาหนดขนาดเวบ็ เพจ ขนาดของเวบ็ ไซตท์ ่ีนิยมในปัจจุบนั มี 2 ขนาด คือกกกกกกกก2.1.1.1กกขนาดเวบ็ ไซตแ์ บบ 800 X 600 pixels เป็นขนาดที่สามารถใชไ้ ดก้ บั หนา้ จอทุกขนาดในปัจจุบันเป็ นขนาดของการออกแบบเว็บไซต์ท่ีใช้ในอดีต เนื่องจากอดีตขนาดของจอคอมพิวเตอร์มีขนาดเลก็กกกกกกกก2.1.1.2กกขนาดเวบ็ ไซตแ์ บบ 1024 X 768 pixels เป็ นขนาดท่ีนิยมในปัจจุบนั เน่ืองจากผใู้ ชน้ ิยมใชจ้ อคอมพิวเตอร์ขนาดใหญข่ ้ึนเน่ืองมาจากราคาจอคอมพวิ เตอร์ท่ีถูกลง2.1กก2.1.2กกรูปแบบการออกแบบเวบ็ ไซต์กกกกกกกกเวบ็ ไซตใ์ นปัจจุบนั จะมีการออกแบบท่ีแตกต่างกนั ไม่มากนกั ซ่ึงการออกแบบหน้าตาเวบ็ ไซตส์ ่วนใหญ่จะมองดูองคป์ ระกอบขององคก์ ร หน่วยงาน หรือเน้ือหาเร่ืองที่นาเสนอเป็ นหลกัซ่ึงการออกแบบหนา้ ตาของเวบ็ ไซตม์ ีอยู่ 3 แบบ คือกกกกกกกก2.1.2.1กกการออกแบบเวบ็ ไซตท์ ี่เนน้ การนาเสนอเน้ือหากกกกกกกกเป็ นการออกแบบเว็บไซตท์ ี่เน้นการนาเสนอเน้ือหามากกวา่ รูปภาพ โดยโครงสร้างใช้รูปแบบตารางเป็นหลกั มีการออกแบบหนา้ ตารูปแบบง่าย เช่น มีเมนูสารบญั และเน้ือหากกกกกกกก2.1.2.2กกการออกแบบเวบ็ ไซตท์ ่ีเนน้ ภาพกราฟิ กกกกกกกกกเป็ นการออกแบบเว็บไซต์ที่เน้นภาพกราฟิ กท่ีสวยงาม ซ่ึงอาจจะใช้โปรแกรมPhotoshop สาหรับการตกแตง่ ภาพ ขอ้ ดี สวยงาม น่าสนใจ ขอ้ เสีย ใชเ้ วลาในการโหลดเวบ็ นาน

กกกกกกกก2.1.2.3กกการออกแบบเวบ็ ไซตท์ ี่มีท้งั ภาพและเน้ือหาเป็ นการออกแบบเวบ็ ที่นิยมในปัจจุบนั ซ่ึงประกอบดว้ ยขอ้ ความ รูปภาพ โดยมีการจดั องคป์ ระกอบตา่ ง ๆ เพ่อื ใหเ้ วบ็ น่าสนใจ2.1กก2.1.3กกการออกแบบโครงสร้างเวบ็ ไซต์กกกกกกกกการออกแบบโครงสร้างเวบ็ ไซต์ คือ การวางแผนการจดั ลาดบั เน้ือหาสาระของเวบ็ ไซต์ออกเป็ นหมวดหมู่ เพ่ือจดั ทาเป็ นโครงสร้างในการจดั วางหนา้ เวบ็ เพจท้งั หมด เปรียบเสมือนแผนที่ที่ทาให้เห็นโครงสร้างท้งั หมดของเวบ็ ไซต์ ช่วยในนักออกแบบเว็บไซต์ไม่ให้หลงทาง การจดัโครงสร้างของเวบ็ ไซต์ มีจุดมุ่งหมายสาคญั คือ การที่จะทาใหผ้ เู้ ขา้ เยี่ยมชม สามารถคน้ หาขอ้ มูลในเวบ็ เพจได้อย่างเป็ นระบบ ซ่ึงถือว่าเป็ นข้นั ตอนท่ีสาคญั ท่ีสามารถสร้างความสาเร็จให้กบั ผูท้ ี่ทาหน้าที่ในการออกแบบและพฒั นาเวบ็ ไซต์ (Webmaster) การออกแบบโครงสร้างหรือจดั ระเบียบของขอ้ มูลที่ชดั เจน แยกยอ่ ยเน้ือหาออกเป็นส่วนตา่ ง ๆ ท่ีสัมพนั ธ์กนั และใหอ้ ยใู่ นมาตรฐานเดียวกนัจะช่วยใหน้ ่าใชง้ านและง่าย ต่อการเขา้ อ่านเน้ือหาของผใู้ ชเ้ วบ็ ไซต์กกกกกกกกหลกั ในการออกแบบโครงสร้างเวบ็ ไซต์ ควรพิจารณาดงั น้ีกกกกกกกก2.1.3.1กกกาหนดวตั ถุประสงค์ โดยพิจารณาวา่ เป้ าหมายของการสร้างเวบ็ ไซตน์ ้ีทาเพ่ืออะไรกกกกกกกก2.1.3.2กกศึกษาคุณลกั ษณะของผทู้ ่ีเขา้ มาใชว้ า่ กลุ่มเป้ าหมายใดท่ีผสู้ ร้างตอ้ งการสื่อสารขอ้ มลู อะไรท่ีพวกเขาตอ้ งการโดยข้นั ตอนน้ีควรปฏิบตั ิควบคูไ่ ปกบั ข้นั ตอนท่ีหน่ึงกกกกกกกก2.1.3.3กกวางแผนเก่ียวกบั การจดั รูปแบบโครงสร้างเน้ือหาสาระ การออกแบบเวบ็ ไซต์ตอ้ งมีการจดั โครงสร้างหรือจดั ระเบียบขอ้ มูลที่ชดั เจน การที่เน้ือหามี ความต่อเนื่องไปไม่สิ้นสุดหรือกระจายมากเกินไป อาจทาใหเ้ กิดความสับสนต่อผใู้ ชไ้ ด้ ฉะน้นั จึงควรออกแบบให้มีลกั ษณะที่ชดั เจนแยกยอ่ ยออกเป็นส่วนต่าง ๆ จดั หมวดหม่ใู นเร่ืองที่สมั พนั ธ์กนั รวมท้งั อาจมีการแสดงใหผ้ ใู้ ช้เห็นแผนท่ีโครงสร้างเพอื่ ป้ องกนั ความสบั สนได้กกกกกกกก2.1.3.4กกกาหนดรายละเอียดใหก้ บั โครงสร้าง ซ่ึงพิจารณาจากวตั ถุประสงคท์ ี่ต้งั ไว้ โดยต้งั เกณฑ์ในการใช้ เช่น ผูใ้ ช้ควรทาอะไรบา้ ง จานวนหน้าควรมีเท่าใด มีการเชื่อมโยง มากน้อยเพียงใดกกกกกกกก2.1.3.5กกหลงั จากน้นั จึงทาการสร้างเวบ็ ไซตแ์ ลว้ นาไปทดลองเพ่ือหาขอ้ ผดิ พลาดและทาการแกไ้ ขปรับปรุง แลว้ จึงนาเขา้ สู่เครือขา่ ยอินเทอร์เน็ตเป็นข้นั สุดทา้ ย

2.1กก2.1.4กกองคป์ ระกอบที่ดีของการออกแบบเวบ็ ไซต์2.1กก2.1.4กก2.1.4.1กกโครงสร้างที่ชดั เจน ผอู้ อกแบบเวบ็ ไซตค์ วรจดั โครงสร้างหรือจดั ระเบียบของขอ้ มูลที่ชดั เจน แยกยอ่ ยเน้ือหาออกเป็นส่วนต่าง ๆ ท่ีสมั พนั ธ์กนั และให้อยใู่ นมาตรฐานเดียวกนัจะช่วยใหน้ ่าใชง้ านและง่าย ตอ่ การอา่ นเน้ือหาของผใู้ ช้2.1กก2.1.4กก2.1.4.2กกการใชง้ านท่ีง่าย ลกั ษณะของเวบ็ ที่มีการใชง้ านง่ายจะช่วยใหผ้ ใู้ ชร้ ู้สึกสบายใจต่อการอ่านและสามารถทาความเขา้ ใจกบั เน้ือหาไดอ้ ยา่ งเต็มที่ โดยไม่ตอ้ งมาเสียเวลาอยกู่ บั การทาความเข้าใจ การใช้งานที่สับสนด้วยเหตุน้ีผูอ้ อกแบบจึงควรกาหนดป่ ุมการใช้งานท่ีชัดเจนเหมาะสม โดยเฉพาะป่ ุมควบคุมเส้นทางการเขา้ สู่เน้ือหา (Navigation) ไม่วา่ จะเป็ นเดินหนา้ ถอยหลงั หากเป็นเวบ็ ไซตท์ ี่มีเวบ็ เพจจานวนมาก ควรจะจดั ทาแผนผงั ของเวบ็ ไซต์ (Site Map) ที่ช่วยให้ผใู้ ชท้ ราบวา่ ตอนน้ีอยู่ ณ จุดใด หรือเคร่ืองมือสืบคน้ (Search Engine) ท่ีช่วยในการคน้ หาหนา้ ที่ท่ีตอ้ งการ2.1กก2.1.4กก2.1.4.3กกการเชื่อมโยงท่ีดี ลกั ษณะไฮเปอร์เท็กซ์ท่ีใช้ในการเช่ือมโยง ควรอยู่ในรูปแบบท่ีเป็ นมาตรฐาน ทว่ั ไปและตอ้ งระวงั เรื่องของตาแหน่งในการเชื่อมโยง การท่ีจานวนการเช่ือมโยงมากและกระจดั กระจายอยู่ทว่ั ไปในหน้าอาจก่อให้เกิดความสับสน นอกจากน้ีคาที่ใช้สาหรับการเช่ือมโยงจะตอ้ งเขา้ ใจง่ายมีความชดั เจนและไมส่ ้ันจนเกินไป นอกจากน้ีในแต่ละเวบ็ เพจที่สร้างข้ึนมาควรมี จุดเช่ือมโยงกลบั มายงั หนา้ แรกของเวบ็ ไซตท์ ่ีกาลงั ใชง้ านอยดู่ ว้ ย ท้งั น้ีเผอ่ื วา่ ผใู้ ช้เกิดหลงทาง และไมท่ ราบวา่ จะทาอยา่ งต่อไปดีจะไดม้ ีหนทางกลบั มาสู่จุดเริ่มตน้ ใหม่ ระวงั อยา่ ใหม้ ีหนา้ ท่ีไม่มีการเช่ือมโยง (Orphan Page) เพราะจะทาใหผ้ ใู้ ชไ้ มร่ ู้จะทาอยา่ งไรต่อไป2.1กก2.1.4กก2.1.4.4กกความเหมาะสมในหนา้ จอ เน้ือหาที่นาเสนอในแต่ละหนา้ จอควรส้ัน กระชบัและทนั สมยั หลีกเลี่ยงการใชห้ น้าจอที่มีลกั ษณะการเลื่อนข้ึนลง (Scrolling) แต่ถา้ จาเป็ นตอ้ งมี ควรจะให้ขอ้ มูลที่มี ความสาคญั อยู่บริเวณดา้ นบนสุดของหน้าจอ หลีกเล่ียงการใชก้ ราฟิ กดา้ นบนของหนา้ จอ เพราะถึงแมจ้ ะดูสวยงาม แต่จะทาให้ผใู้ ชเ้ สียเวลาในการไดร้ ับขอ้ มูลที่ตอ้ งการ แต่หากตอ้ งมีการใชภ้ าพประกอบก็ควรใชเ้ ฉพาะที่มีความสัมพนั ธ์กบั เน้ือหาเท่าน้นั นอกจากน้ีการใชร้ ูปภาพเพื่อเป็ นพ้ืนหลงั (Background) ไม่ควรเนน้ สีสันท่ีฉูดฉาดมากนกั เพราะอาจจะไปลดความเด่นชดัของเน้ือหาลง ควรใช้ภาพท่ีมีสีอ่อน ๆ ไม่สว่างจนเกินไปรวมไปถึงการใช้เทคนิคต่าง ๆ เช่นภาพเคล่ือนไหว หรือตวั อกั ษรวิง่ (Marquees) ซ่ึงอาจจะเกิดการรบกวนการอ่านได้ ควรใช้เฉพาะที่จาเป็ นจริง ๆ เท่าน้ันตวั อกั ษรท่ีนามาแสดงบนจอภาพควรเลือกขนาดท่ีอ่านง่าย ไม่มีสีสันและลวดลายมากเกินไป2.1กก2.1.4กก2.1.4.5กกความรวดเร็ว ความรวดเร็วเป็ นสิ่งสาคญั ประการหน่ึงที่ส่งผลต่อการเรียนรู้ผใู้ ชจ้ ะเกิดอาการเบ่ือหน่ายและหมดความสนใจกบั เวบ็ ท่ีใชเ้ วลาในการแสดงผลนาน สาเหตุสาคญั ที่

จะทาให้การแสดงผลนานคือการใช้ภาพกราฟิ กหรือภาพเคลื่อนไหว ซ่ึงแมว้ ่าจะช่วยดึงดูดความสนใจไดด้ ี ฉะน้นั ในการออกแบบจึงควรหลีกเล่ียงการใชภ้ าพขนาดใหญ่ หรือภาพเคล่ือนไหวที่ไม่จาเป็ น และพยายามใชก้ ราฟิ กแทนตวั อกั ษรธรรมดาใหน้ อ้ ยที่สุด โดยไม่ควรใชม้ ากเกินกวา่ 2 – 3บรรทดั ในแตล่ ะหนา้ จอ2.1กก2.1.5กกโครงสร้างของเวบ็ ไซต์2.1กก2.1.4กก2.1.5.1กกเวบ็ ท่ีมีโครงสร้างแบบเรียงลาดบั (Sequential Structure) เป็ นโครงสร้างแบบธรรมดาท่ีใชก้ นั มากที่สุดเน่ืองจากง่ายต่อการจดั ระบบขอ้ มูล ขอ้ มูลท่ีนิยม จดั ดว้ ยโครงสร้างแบบน้ีมกั เป็ นขอ้ มูลที่มีลกั ษณะเป็ นเรื่องราวตามลาดบั ของเวลา เช่น การเรียงลาดบั ตามตวั อกั ษรดรรชนี สารานุกรม หรืออภิธานศพั ท์ โครงสร้างแบบน้ี เหมาะกบั เวบ็ ไซตท์ ่ีมีขนาดเล็ก เน้ือหาไม่ซบั ซอ้ นใชก้ ารลิงก์ (Link) ไปทีละหนา้ ทิศทางของการเขา้ สู่เน้ือหา (Navigation) ภายในเวบ็ จะเป็ นการดาเนินเรื่องในลกั ษณะเส้นตรง โดยมี ป่ ุมเดินหน้า-ถอยหลงั เป็ นเครื่องมือหลกั ในการกาหนดทิศทาง ขอ้ เสียของโครงสร้างระบบน้ีคือ ผใู้ ชไ้ ม่สามารถกาหนดทิศทางการเขา้ สู่เน้ือหาของตนเองได้ ทาใหเ้ สียเวลาเขา้ สู่เน้ือ ภาพที่ 2-1 เวบ็ ท่ีมีโครงสร้างแบบเรียงลาดบั2.1กก2.1.4กก2.1.5.2กกเวบ็ ท่ีมีโครงสร้างแบบลาดบั ข้นั (Hierarchical Structure) เป็ นวธิ ีท่ีดีท่ีสุดวธิ ีหน่ึงในการจดั ระบบโครงสร้างท่ีมีความซบั ซอ้ นของขอ้ มูล โดยแบง่ เน้ือหา ออกเป็ นส่วนต่างๆ และมีรายละเอียดยอ่ ยๆ ในแต่ละส่วนลดหลน่ั กนั มาในลกั ษณะแนวคิดเดียวกบั แผนภูมิองคก์ ร จึงเป็ นการง่ายต่อการทาความเขา้ ใจกบั โครงสร้างของเน้ือหาในเวบ็ ลกั ษณะน้ี ลกั ษณะเด่นเฉพาะของ เวบ็ประเภทน้ีคือการมีจุดเริ่มตน้ ท่ีจุดร่วมจุดเดียว นนั่ คือ โฮมเพจ (Homepage) และเช่ือมโยงไปสู่เน้ือหา ในลกั ษณะเป็นลาดบั จากบนลงล่าง ภาพที่ 2-2 เวบ็ ที่มีโครงสร้างแบบลาดบั ข้นั

2.1กก2.1.4กก2.1.5.3กกเวบ็ ที่มีโครงสร้างแบบตาราง (Grid Structure) โครงสร้างรูปแบบน้ีมีความซบั ซ้อนมากกว่ารูปแบบท่ีผ่านมา การออกแบบเพิ่มความยืดหยุน่ ให้แก่การเขา้ สู่เน้ือหาของผูใ้ ช้โดยเพิ่มการเช่ือมโยงซ่ึงกันและกันระหว่างเน้ือหาแต่ละส่วน เหมาะแก่ การแสดงให้เห็นความสัมพนั ธ์กนั ของเน้ือหา การเขา้ สู่เน้ือหาของผูใ้ ช้จะไม่เป็ นลกั ษณะเชิงเส้นตรง เน่ืองจากผใู้ ช้สามารถเปล่ียนทิศทางการเขา้ สู่เน้ือหาของตนเองได้ ภาพท่ี 2-3 เวบ็ ท่ีมีโครงสร้างแบบตารางกกกกกกกกในการจดั ระบบโครงสร้างแบบน้ี เน้ือหาที่นามาใชแ้ ตล่ ะส่วนควรมีลกั ษณะที่เหมือนกนัและสามารถใช้รูปแบบร่วมกนั หลกั การออกแบบคือนาหัวขอ้ ท้งั หมดมาบรรจุลงในท่ีเดียวกนั ซ่ึงโดยทวั่ ไป จะเป็นหนา้ แผนภาพ (Map Page) ที่แสดงในลกั ษณะเดียวกบั โครงสร้างของเวบ็ เม่ือผใู้ ช้คลิกเลือก หวั ขอ้ ใด ก็จะเขา้ ไปสู่หนา้ เน้ือหา (Topic Page) ที่แสดงรายละเอียดของหวั ขอ้ น้นั ๆ และภายในหน้าน้ัน ก็จะมีการเช่ือมโยงไปยงั หน้ารายละเอียดของหัวข้ออื่นท่ีเป็ นเร่ื องเดียวกันนอกจากน้ียงั สามารถนา โครงสร้างแบบเรียงลาดบั และแบบลาดบั ข้นั มาใชร้ ่วมกนั ไดอ้ ีกดว้ ย ถึงแม้โครงสร้างแบบน้ี อาจจะสร้างความยงุ่ ยากในการเขา้ ใจได้ และอาจเกิดปัญหาการคงคา้ ง ของหวั ขอ้(Cognitive Overhead) ได้ แต่จะเป็ นประโยชน์ท่ีสุดเมื่อผใู้ ช้ไดเ้ ขา้ ใจถึงความสัมพนั ธ์ ระหวา่ งเน้ือหา ในส่วนของการออกแบบจาเป็ นจะตอ้ งมีการวางแผนท่ีดี เน่ืองจากมีการเชื่อมโยงที่เกิดข้ึนไดห้ ลายทิศทาง นอกจากน้ีการปรับปรุงแกไ้ ขอาจเกิดความยงุ่ ยากเมื่อตอ้ งเพ่มิ เน้ือหาในภายหลงั2.1กก2.1.4กก2.1.5.4กกเวบ็ ที่มีโครงสร้างแบบใยแมงมุม (Web Structure) โครงสร้างประเภทน้ีจะมีความยืดหยุน่ มากท่ีสุด ทุกหน้าในเวบ็ สามารถจะเชื่อมโยงไปถึงกนั ไดห้ มด เป็ นการสร้างรูปแบบการเขา้ สู่เน้ือหาท่ีเป็ นอิสระ ผใู้ ช้สามารถกาหนดวิธีการเขา้ สู่เน้ือหาได้ดว้ ย ตนเอง การเชื่อมโยงเน้ือหาแต่ละหน้าอาศยั การโยงใยขอ้ ความท่ีมีมโนทศั น์ (Concept) เหมือนกนั ของแต่ละหน้าในลกั ษณะของไฮเปอร์เทก็ ซ์หรือไฮเปอร์มีเดีย โครงสร้างลกั ษณะน้ีจดั เป็ นรูปแบบท่ี ไม่มีโครงสร้างท่ีแน่นนอนตายตวั (Unstructured) นอกจากน้ีการเชื่อมโยงไม่ไดจ้ ากดั เฉพาะเน้ือหา ภายในเวบ็ น้นั ๆแตส่ ามารถเช่ือมโยงออกไปสู่เน้ือหาจากเวบ็ ภายนอกได้

ภาพท่ี 2-4 เวบ็ ท่ีมีโครงสร้างแบบใยแมงมุมกกกกกกกกลกั ษณะการเช่ือมโยงในเวบ็ น้นั นอกเหนือจากการใชไ้ ฮเปอร์เท็กซ์หรือไฮเปอร์มีเดียกบั ขอ้ ความที่มีมโนทศั น์ (Concept) เหมือนกนั ของแต่ละหน้าแล้ว ยงั สามารถใช้ลกั ษณะการเชื่อมโยง จากรายการที่รวบรวมชื่อหรือหัวขอ้ ของเน้ือหาแต่ละหน้าไว้ ซ่ึงรายการน้ีจะปรากฏอยู่บริเวณใด บริเวณหน่ึงในหนา้ จอ ผใู้ ชส้ ามารถคลิกท่ีหวั ขอ้ ใดหวั ขอ้ หน่ึงในรายการเพ่ือเลือกที่จะเขา้ไปสู่หนา้ ใดๆ ก็ไดต้ ามความตอ้ งการ ขอ้ ดีของรูปแบบน้ีคือง่ายต่อผใู้ ชใ้ นการท่องเที่ยวบนเวบ็ โดยผใู้ ชส้ ามารถกาหนดทิศทาง การเขา้ สู่เน้ือหาไดด้ ว้ ยตนเอง แตข่ อ้ เสียคือถา้ มีการเพิ่มเน้ือหาใหม่ๆ อยู่เสมอจะเป็ นการยากในการ ปรับปรุง นอกจากน้ีการเช่ือมโยงระหวา่ งขอ้ มูลที่มีมากมายน้นั อาจทาใหผ้ ใู้ ชเ้ กิดการสับสนและ เกิดปัญหาการคงคา้ งของหวั ขอ้ (Cognitive Overhead) ได้2.1กก2.1.6กกองคป์ ระกอบของการออกแบบเวบ็ ไซต์2.1กก2.1.4กก2.1.6.1กกความเรียบง่าย (Simplicity) หมายถึง การจากดั องคป์ ระกอบเสริมให้เหลือเฉพาะองค์ประกอบหลกั กล่าวคือในการสื่อสารเน้ือหากบั ผูใ้ ช้น้ัน เราต้องเลือกเสนอสิ่งท่ีเราตอ้ งการนาเสนอจริง ๆ ออกมาในส่วนของกราฟิ ก สีสัน ตวั อกั ษรและภาพเคล่ือนไหว ตอ้ งเลือกให้พอเหมาะ ถา้ หากมีมากเกินไปจะรบกวนสายตาและสร้างความคาราญต่อผูใ้ ช้ตวั อย่างเวบ็ ไซต์ท่ีไดร้ ับการออกแบบที่ดี ไดแ้ ก่ เวบ็ ไซตข์ องบริษทั ใหญ่ ๆ อย่างเช่น Apple Adobe Microsoft หรือKokia ท่ีมีการออกแบบเวบ็ ไซตใ์ นรูปแบบที่เรียบง่าย ไมซ่ บั ซอ้ น และใชง้ านอยา่ งสะดวก2.1กก2.1.4กก2.1.6.2กกความสม่าเสมอ ( Consistency) หมายถึง การสร้างความสม่าเสมอใหเ้ กิดข้ึนตลอดท้งั เวบ็ ไซต์ โดยอาจเลือกใชร้ ูปแบบเดียวกนั ตลอดท้งั เวบ็ ไซตก์ ็ได้ เพราะถา้ หากวา่ แต่ละหนา้ในเวบ็ ไซตน์ ้นั มีความแตกต่างกนั มากจนเกินไป อาจทาใหผ้ ใู้ ชเ้ กิดความสับสนและไม่แน่ใจวา่ กาลงัอยใู่ นเวบ็ ไซตเ์ ดิมหรือไม่ เพราะฉะน้นั การออกแบบเวบ็ ไซตใ์ นแต่ละหนา้ ควรท่ีจะมีรูปแบบ สไตล์ของกราฟิ ก ระบบเนวเิ กชนั่ (Navigation) และโทนสีที่มีความคลา้ ยคลึงกนั ตลอดท้งั เวบ็ ไซต์2.1กก2.1.4กก2.1.6.3กกความเป็ นเอกลักษณ์ (Identity) ในการออกแบบเว็บไซต์ต้องคานึงถึงลกั ษณะขององคก์ รเป็นหลกั เน่ืองจากเวบ็ ไซตจ์ ะสะทอ้ นถึงเอกลกั ษณ์และลกั ษณะขององคก์ ร การ

เลือกใชต้ วั อกั ษร ชุดสี รูปภาพหรือกราฟิ ก จะมีผลต่อรูปแบบของเวบ็ ไซตเ์ ป็นอยา่ งมาก ตวั อยา่ งเช่นถา้ เราตอ้ งออกแบบเวบ็ ไซตข์ องธนาคารแต่เรากลบั เลือกสีสันและกราฟิ กมากมาย อาจทาใหผ้ ใู้ ชค้ ิดวา่ เป็นเวบ็ ไซตข์ องสวนสนุกซ่ึงส่งผลต่อความเชื่อถือขององคก์ รได้2.1กก2.1.4กก2.1.6.4กกเน้ือหา (Useful Content) ถือเป็ นสิ่งสาคญั ที่สุดในเว็บไซต์ เน้ือหาในเวบ็ ไซต์ตอ้ งสมบูรณ์และไดร้ ับการปรับปรุงพฒั นาให้ทนั สมยั อยู่เสมอ ผพู้ ฒั นาตอ้ งเตรียมขอ้ มูลและเน้ือหาท่ีผูใ้ ช้ต้องการให้ถูกต้องและสมบูรณ์ เน้ือหาท่ีสาคญั ท่ีสุดคือเน้ือหาท่ีทีมผูพ้ ฒั นาสร้างสรรค์ข้ึนมาเอง และไม่ไปซ้ากบั เวบ็ อื่น เพราะจะถือเป็ นส่ิงท่ีดึงดูดผูใ้ ช้ให้เขา้ มาเวบ็ ไซตไ์ ด้เสมอ แต่ถา้ เป็ นเวบ็ ที่ลิงคข์ อ้ มูลจากเวบ็ อื่น ๆ มาเม่ือใดก็ตามที่ผใู้ ชท้ ราบวา่ ขอ้ มูลน้นั มาจากเวบ็ ใดผใู้ ชก้ ็ไมจ่ าเป็นตอ้ งกลบั มาใชง้ านลิงคเ์ หล่าน้นั อีก2.1กก2.1.4กก2.1.6.5กกระบบเนวิเกชั่น (User-Friendly Navigation) เป็ นส่วนประกอบท่ีมีความสาคญั ต่อเวบ็ ไซตม์ าก เพราะจะช่วยไม่ให้ผูใ้ ช้เกิดความสับสนระหวา่ งดูเวบ็ ไซต์ ระบบเนวิเกชน่ั จึงเปรียบเสมือนป้ ายบอกทาง ดงั น้นั การออกแบบเนวิเกชน่ั จึงควรให้เขา้ ใจง่าย ใช้งานได้สะดวก ถา้ มีการใชก้ ราฟิ กกค็ วรส่ือความหมาย ตาแหน่งของการวางเนวเิ กชน่ั ก็ควรวางให้สม่าเสมอเช่น อยู่ตาแหน่งบนสุดของทุกหน้าเป็ นตน้ ซ่ึงถา้ จะให้ดีเมื่อมีเนวิเกช่ันท่ีเป็ นกราฟิ กก็ควรเพิ่มระบบเนวิเกชน่ั ที่เป็ นตวั อกั ษรไวส้ ่วนล่างดว้ ย เพื่อช่วยอานวยความสะดวกให้กบั ผูใ้ ช้ที่ยกเลิกการแสดงผลภาพกราฟิ กบนเวบ็ เบราเซอร์2.1กก2.1.4กก2.1.6.6กกคุณภาพของสิ่งที่ปรากฏให้เห็นในเวบ็ ไซต์ (Visual Appeal) ลกั ษณะที่น่าสนใจของเวบ็ ไซต์น้นั ข้ึนอยูก่ บั ความชอบส่วนบุคคลเป็ นสาคญั แต่โดยรวมแลว้ ก็สามารถสรุปไดว้ า่ เวบ็ ไซต์ท่ีน่าสนใจน้นั ส่วนประกอบต่าง ๆ ควรมีคุณภาพ เช่น กราฟิ กควรสมบูรณ์ไม่มีรอยหรือขอบข้นั บนั ไดใ้ หเ้ ห็น ชนิดตวั อกั ษรอา่ นง่ายสบายตา มีการเลือกใชโ้ ทนสีที่เขา้ กนั อยา่ งสวยงามเป็ นตน้2.1กก2.1.4กก2.1.6.7กกความสะดวกของการใช้ในสภาพต่าง ๆ (Compatibility) การใช้งานของเวบ็ ไซตน์ ้นั ไม่ควรมีขอบจากดั กล่าวคือ ตอ้ งสามารถใชง้ านไดด้ ีในสภาพแวดลอ้ มที่หลากหลาย ไม่มีการบงั คบั ให้ผใู้ ช้ตอ้ งติดต้งั โปรแกรมอื่นใดเพิ่มเติม นอกเหนือจากเวบ็ บราวเซอร์ ควรเป็ นเวบ็ ที่แสดงผลไดด้ ีในทุกระบบปฏิบตั ิการ สามารถแสดงผลไดใ้ นทุกความละเอียดหนา้ จอ ซ่ึงหากเป็ นเวบ็ ไซตท์ ี่มีผใู้ ชบ้ ริการมากและกลุ่มเป้ าหมายหลากหลายควรใหค้ วามสาคญั กบั เรื่องน้ีใหม้ าก2.1กก2.1.4กก2.1.6.8กกความคงที่ในการออกแบบ (Design Stability) ถา้ ตอ้ งการให้ผใู้ ชง้ านรู้สึกวา่เวบ็ ไซตม์ ีคุณภาพ ถูกตอ้ ง และเชื่อถือได้ ควรให้ความสาคญั กบั การออกแบบเวบ็ ไซตเ์ ป็ นอยา่ งมากต้องออกแบบวางแผนและเรียบเรียงเน้ือหาอย่างรอบคอบ ถ้าเว็บที่จดั ทาข้ึนอย่างลวก ๆ ไม่มี

มาตรฐานการออกแบบและระบบการจดั การขอ้ มูล ถา้ มีปัญหามากข้ึนอาจส่งผลใหเ้ กิดปัญหาและทาใหผ้ ใู้ ชห้ มดความเช่ือถือ2.1กก2.1.4กก2.1.6.9กกความคงท่ีของการทางาน (Function Stability) ระบบการทางานต่าง ๆ ในเวบ็ ไซตค์ วรมีความถูกตอ้ งแน่นอน ซ่ึงตอ้ งไดร้ ับการออกแบบสร้างสรรค์และตรวจสอบอยเู่ สมอตวั อยา่ งเช่น ลิงคต์ ่าง ๆ ในเวบ็ ไซต์ ตอ้ งตรวจสอบวา่ ยงั สามารถลิงคข์ อ้ มูลไดถ้ ูกตอ้ งหรือไม่ เพราะเวบ็ ไซต์อื่นอาจมีการเปลี่ยนแปลงไดต้ ลอดเวลา ปัญหาที่เกิดจากลิงค์ ก็คือ ลิงค์ขาด ซ่ึงพบไดบ้ ่อยเป็นปัญหาที่สร้างความราคาญกบั ผใู้ ชเ้ ป็นอยา่ งมาก2.1กก2.1.7กกข้นั ตอนการสร้างเวบ็ ไซต์2.1กก2.1.4กก2.1.7.1กกการวางแผนการจดั ทาเว็บไซต์ เป็ นข้นั ตอนแรกของการออกแบบเว็บเนื่องจากเราตอ้ งกาหนดช่ือเร่ือง เน้ือหา และรายละเอียดของเวบ็ ที่เราจะจดั ทาเพื่อให้เห็นมุมมองคร่าว ๆ ก่อนจะลงมือสร้างเวบ็ ไซต์ นอกจากน้ีเรายงั ตอ้ งทาการแบ่งเน้ือหาเป็ นหมวดหมู่ต่าง ๆตามลาดบั ก่อน-หลงั เพือ่ ใหง้ ่ายตอ่ การจดั ทาโครงร่างของเวบ็2.1กก2.1.4กก2.1.7.2กกการกาหนดโครงสร้างของเว็บ เป็ นข้นั ตอนในการกาหนดผงั ของเว็บเพื่อใหท้ ราบองคป์ ระกอบท้งั หมดของเวบ็ ตวั อยา่ งดงั รูป ภาพที่ 2-5 การกาหนดโครงสร้างของเวบ็ ของโรงเรียนเสริมงามวทิ ยาคม2.1กก2.1.4กก2.1.7.3กกการกาหนดการเชื่อมโยงเว็บเพจ การกาหนดการเชื่อมเว็บเพจ เป็ นการกาหนดความสัมพนั ธ์ของการเช่ือมโยงในแต่ละหน้าเว็บเพื่อให้สามารถกลบั ไปกลบั มาระหว่างหนา้ ตา่ ง ๆ ได้ โดยแตล่ ะไฟลจ์ ะมีความสมั พนั ธ์กนั ตวั อยา่ งดงั รูป

ภาพท่ี 2-6 การกาหนดการเช่ือมโยงเวบ็ เพจ2.1กก2.1.4กก2.1.7.4กกการต้งั ช่ือไฟลแ์ ละโฟลเดอร์2.1กก2.1.4กก2.1.7.4กก1)กกการสร้างโฟลเดอร์ การสร้างโฟลเดอร์ให้สร้างเป็ นช่ือหน่วยงาน /เรื่องน้นั ๆ ควรใชต้ วั อกั ษร ภาษาองั กฤษตวั พิมพเ์ ล็ก หรือผสมกบั ตวั เลข 0-9 เช่น swt คือ โรงเรียนเสริมงามวทิ ยาคม จากน้นั ขา้ งในโฟลเดอร์ swt ใหเ้ ราสร้างโฟลเดอร์เก็บรูปภาพ พ้ืนหลงั ไฟล์เสียงไฟลว์ ดี ีโอ หรือโฟลเดอร์อื่นเป็นชื่อภาษาองั กฤษ เช่น pic คือโฟลเดอร์เก็บรูปภาพ, bg คือ โฟลเดอร์เก็บพ้ืนหลงั เป็นตน้2.1กก2.1.4กก2.1.7.4กก2)กกการต้ังช่ือไฟล์ การต้ังชื่อไฟล์ให้ต้ังชื่อและนามสกุลไฟล์เป็ นตวั อกั ษร ภาษาองั กฤษตวั พิมพเ์ ล็ก หรือผสมกบั ตวั เลข 0-9 หรือเครื่องมือขีดลบ/ขีดล่าง และต้งั ช่ือไฟล์ให้ตรงกบั เรื่องน้นั ๆ เช่น history.html คือ ประวตั ิของโรงเรียน,person.html คือ บุคลากรของโรงเรียน เป็นตน้ ภาพที่ 2-7 การสร้างโฟลเดอร์และการต้งั ชื่อและนามสกลุ ไฟล์

2.1กก2.1.4กก2.1.7.4กก3)กกการออกแบบเวบ็ เพจแตล่ ะหนา้ ในเวบ็ ไซต์ ภาพที่ 2-8 การออกแบบเวบ็ เพจแตล่ ะหนา้ ในเวบ็ ไซต์2.1กก2.1.4กก2.1.7.4กก4)กกส่วนประกอบของเวบ็ ไซตท์ ี่ดีกกกกกกกกโครงสร้างของเวบ็ ไซตโ์ ดยจะมีส่วนหลกั ๆอยดู่ ว้ ยกนั ท้งั หมด 3 ส่วนหลกั ๆ ดงั น้ีกกกกกกกกส่วนหวั ของหน้า (Page Header) เป็ นส่วนท่ีอยู่ตอนบนสุดของหนา้ และเป็ นส่วนท่ีสาคญั ท่ีสุดของหนา้ เพราะเป็ นส่วนท่ีดึงดูดผชู้ มใหต้ ิดตามเน้ือหาภายในเวบ็ ไซต์ มกั ใส่ภาพกราฟิ กเพอ่ื สร้างความประทบั ใจกกกกกกกกส่วนทา้ ยของหนา้ (Page Footer) เป็นส่วนที่อยดู่ า้ นล่างสุดของหนา้ มกั วางระบบนาทางที่เป็ นลิงคข์ อ้ ความง่าย ๆ และอาจแสดงขอ้ มูลเพ่ิมเติมเก่ียวกบั เน้ือหาภายในเวบ็ ไซต์ เช่น เจา้ ของเวบ็ ไซต,์ ขอ้ ความแสดงลิขสิทธ์ิ, วธิ ีการติดต่อกบั ผดู้ ูแลเวบ็ ไซต,์ คาแนะนาการใชเ้ วบ็ ไซต์ เป็ นตน้โดยปกติส่วนหวั และส่วนทา้ ยมกั แสดงเหมือนกนั ในทุกหนา้ ของเวบ็ เพจ ภาพที่ 2-9 โครงสร้างเวบ็ ไซต์

2.1กก2.1.4กก2.1.7.5กกตวั อยา่ งการแบง่ พ้นื ท่ีเวบ็ ไซต์ ภาพท่ี 2-10 ตวั อยา่ งการแบง่ พ้นื ท่ีเวบ็ ไซต์2.1กก2.1.4กก2.1.7.6กกการสร้างเวบ็ เพจกกกกกกกกเม่ือจดั วางองค์ประกอบของเวบ็ แต่ละหน้าแล้ว ต่อไปคือข้นั ตอนการเขียนเว็บด้วยโปรแกรมภาษา HTML เพื่อกาหนดใหแ้ ต่ละหนา้ เวบ็ เพจนาเสนอขอ้ ความ รูปภาพ วีดีโอ และเสียงใหอ้ ยใู่ นรูปแบบการที่ตอ้ งการ ภาพท่ี 2-11 การสร้างเวบ็ ดว้ ยภาษา HTML2.1กก2.1.4กก2.1.7.7กกการลงทะเบียนขอพ้นื ที่เวบ็ ไซต์กกกกกกกกเม่ือทาการออกแบบและสร้างเวบ็ ไซตเ์ สร็จแลว้ ข้นั ตอนต่อไป คือ การเผยแพร่เวบ็ ไซต์สู่โลกของอินเทอร์เน็ตให้คนอ่ืนเขา้ มาเยี่ยมชม วิธีการ คือ การนาเว็บไซต์ไปฝากกบั ผูใ้ ห้บริการพ้ืนท่ีเวบ็ ไซต์ท้งั แบบเสียค่าใชจ้ ่ายหรือบริการ และแบบพ้ืนท่ีเวบ็ ไซต์ฟรี ซ่ึงวนั น้ีเราจะขอแนะนาเวบ็ ไซตท์ ่ีใหบ้ ริการฟรีพ้นื ท่ีฝากเวบ็ คือ http://www.thcity.com

2.1กก2.1.4กก2.1.7.8กกการอพั โหลดเวบ็ ไซต์กกกกกกกกเมื่อเราทาการสมคั รบริการพ้ืนท่ีฝากเว็บแล้ว ข้นั ตอนต่อไป คือการอพั โหลดไฟล์เวบ็ ไซตข์ องเราไปยงั เวบ็ ไซตท์ ี่ใหบ้ ริการพ้ืนที่ฝากเวบ็ ซ่ึงอาจจะทาการอพั โหลดผา่ นเวบ็ บราวเซอร์เวบ็ ที่ใหบ้ ริการ หรือการอพั โหลดดว้ ยโปรแกรม เช่น CuteFTP, Filezilla, WS_FTP เป็ นตน้ เพ่ือให้ผคู้ นไดเ้ ขา้ เยย่ี มชมโดยสามารถดูในเวบ็ ไซตข์ องเราผา่ นเครือขา่ ยอินเทอร์เน็ต ภาพท่ี 2-12 การใชโ้ ปรแกรม Filezilla อพั โหลดไฟล์2.1กก2.1.4กก2.1.7.9กกการเรียกดูเวบ็ ไซต์กกกกกกกกเม่ือเราทาการอพั โหลดไฟลเ์ วบ็ ไซตข์ องเราข้ึนบนเวบ็ ไซตท์ ี่ใหบ้ ริการพ้ืนท่ีฝากเวบ็ แลว้เราสามารถเปิ ดดูเว็บไซตข์ องเราผ่านโปรแกรมเวบ็ บราวเซอร์ เช่น Internet Explorer, MozillaFirefox, Google Chrome เป็ นตน้ โดยการพิมพท์ ่ีอยเู่ วบ็ ไซตต์ รง Address Bar เช่น www/.swt.ac.thเป็ นตน้ ภาพท่ี 2-13 ตวั อยา่ งเวบ็ ไซตโ์ รงเรียนเสริมงามวทิ ยาคม

2.2กกโปรแกรมทเ่ี ก่ยี วข้อง 2.2.1กกโปรแกรม Joomlaกกกกกกกกjoomla คือ CMS ตวั หน่ึงจากหลาย ๆ ตวั ที่ไดร้ ับความนิยมในปัจจุบนั สาหรับคุณท่ียงัไม่รู้จักว่า CMS คืออะไร ขออธิบายส้ัน ๆ เพ่ิมเติมดังน้ีครับ CMSน้ันเป็ นอักษรย่อของ คาว่า\"Content Management System\" ซ่ึงเม่ือแปลเป็ นภาษาไทย หมายถึง ระบบบริหารจดั การเน้ือหาของเวบ็ ไซต์ นนั่ หมายความวา่ ส่ิงที่เราจะตอ้ งดูแลก็คือเน้ือหาของเวบ็ ไซต์ เช่น การเพ่ิมบทความ การเพิ่มรูปภาพ หรือการปรับแต่งโยกยา้ ยโมดูลต่าง ๆ ไม่จาเป็ นจะตอ้ งมาน่ังเขียน Code ด้วยภาษา HTML, PHP,SQL เพียงแต่เรียนรู้วธิ ีการติดต้งั การปรับแต่ง การใชง้ าน CMS เท่าน้นั สาหรับCode ตา่ ง ๆ ที่นามาสร้าง และ ออกแบบเวบ็ ไซต์ จะทาโดยทีมงานของผพู้ ฒั นา CMS ของแต่ละทีมซ่ึงทาใหป้ ระหยดั เวลาในการสร้าง และออกแบบเวบ็ ไซต์ ไดอ้ ยา่ งมากกกกกกกกกjoomla เป็น CMS ที่ไดร้ ับความนิยมเป็ นอนั ดบั ตน้ ๆ เพราะมีระบบการจดั การเน้ือหาที่มีรูปแบบสากล การปรับแต่งหน้าตาของเว็บไซต์ทาได้ง่าย เพราะถูกออกแบบมาให้รองรับกับเทคโนโลยีการ ออกแบบเวบ็ ไซต์ สมยั ใหม่ ไม่วา่ จะเป็ นการรองรับ Flash หรือ GIF Animationนอกจากน้ีคุณยงั สามารถ Download Template ไดอ้ ยา่ งมากมายมีท้งั แบบที่สามารถนามาใชง้ านได้ฟรี (โดยให้เครดิตผสู้ ร้างนิดหน่อย เช่น ไม่ลบช่ือทีมพฒั นา Template น้นั ออกจาก Template เป็ นตน้ ) หรือหากตอ้ งการ Template ท่ีมีประสิทธิภาพ และมีความสวยงาม ก็สามารถหาซ้ือมาใช้ได้เพราะมีเว็บไซต์ที่ให้บริการจดั ทา Template ของอยู่มากมาย จุดเด่นอีกจุดหน่ึงก็คือมี Extensionจานวนมากใหเ้ ราสามารถนามาประยกุ ตใ์ ชง้ าน เช่น Component, Module, Plugin มีท้งั แบบฟรี และแบบตอ้ งชาระเงิน สาหรับเว็บไซต์อย่างเป็ นทางการคือ http://www.joomla.org เป็ นศูนยร์ วมขา่ วสารการ Update joomlaและคุณสามารถ download extension ตา่ ง ๆ ไดจ้ ากท่ีน่ีกกกกกกกกjoomla มีการ Update อยา่ งสม่าเสมอ ทาใหเ้ รามน่ั ใจไดว้ า่ การ ออกแบบเวบ็ ไซต์ ดว้ ยCMS joomla จะมีความปลอดภยั ซ่ึงปัจจุบนั (ตุลาคม 2553) เป็ นรุ่น 1.5.21 และท่ีสาคญั ที่สุดคือรองรับภาษาไทย 100% เพราะมีทีมงานที่คอยดูแลเรื่องภาษา ทาให้เราไม่ตอ้ งมากงั วลกบั การใชง้ านภาษาไทยวา่ จะผิดเพ้ียนในส่วนใดหรือไม่ และในขณะน้ี Team ผพู้ ฒั นากาลงั ร่วมกนั พฒั นารุ่นใหม่คือ joomla1.6 ซ่ึงในขณะน้ีกใ็ กลจ้ ะไดใ้ ชง้ านกนั ในเวลาอนั ใกลน้ ้ีคือ Joomla 1.6.4 Released สาหรับในเวอร์ชน่ั 1.5 ก็ยงั คงพฒั นาเพ่ิมเติมมาจนถึง 1.5.23 หากท่านใดใชเ้ วอร์ชนั่ เก่าอยู่ก็แนะนาให้upgrade ใหท้ นั สมยั อยเู่ สมอนะครับ ท้งั น้ีเพือ่ ประสิทธิภาพ และความปลอดภยั ของเวบ็ ไซตข์ องท่านเอง

กกกกกกกกสิ่งท่ีควรพจิ ารณาเป็นอนั ดบั ตน้ ๆ สาหรับผเู้ ร่ิมตน้ ใชง้ าน joomla แลว้ เกิดปัญหาน้นั ส่วนใหญ่ ไมไ่ ดม้ าจากตวั ของ joomla แต่มกั จะมีปัญหากบั PHP, MySql, เวอร์ชนั่ เก่า ทาให้เกิดปัญหาได้สาหรับการตรวจเช็คน้ันไม่ยากเลย เพราะในตอนที่ดาเนินการติดต้ังน้ัน จะมีหน้าเว็บเพจที่ตรวจสอบวา่ สามารถติดต้งั หรือรองรับไดห้ รือไม่ หากไม่รองรับใหห้ าตวั ใหม่มาลง เพราะฉะน้นัตอนติดต้งั มกั ไม่ค่อยเกิดปัญหา แต่จะเกิดปัญหาตอนที่เราติดต้งั ตวั เสริมต่าง ๆ (Extension) ซ่ึงบางตวั ถึงข้นั ไม่สามารถใชง้ านไดเ้ ลย เพราะติดต้งั ไปก็จะ error หรือติดต้งั ผา่ น แต่พอใชง้ านจริงก็จะมีปัญหา สาหรับคุณท่ีตอ้ งการติดต้งั บนโฮสติ้ง ก่อนจะใชบ้ ริการก็ควรเช็ครายละเอียดของโฮสติ้งใหด้ ีวา่ PHP, MySql น้นั เวอร์ชน่ั ใหมห่ รือไม่ จะไดเ้ กิดปัญหานอ้ ยลง 2.2.1กก2.2.1.1ddคุณสมบตั ิที่สาคญั อื่น ๆ ใน Joomla 2.5 2.2.1กก2.2.1.1dd 1)กกการแจง้ เตือนอตั โนมตั ิเม่ือ Joomla หรือส่วนเสริมที่สามารถใชไ้ ดม้ ีการปรับปรุง เม่ือเขา้ สู่หนา้ แผงควบคุมดูแลเวบ็ ไซตไ์ ดท้ นั ที จะมีการแสดงป่ ุมแจง้ เตือนใหม่ที่ช่วยใหพ้ วกเจา้ ของเวบ็ ดูและทาการปรับปรุงใหเ้ ป็นรุ่นล่าสุด นอกเหนือจากการปรับปรุงสาหรับ JoomlaCMS, จะมีอีกป่ ุมท่ีแสดงถึงส่วนที่จะตอ้ งปรับปรุงส่วนเสริมอ่ืนๆ ดว้ ย 2.2.1กก2.2.1.1dd 2)กกพลงั ในการคน้ หาดว้ ยภาษาท่ีดีกวา่ เดิม ในการคน้ หาหลกั ของ Joomlaสมบูรณ์แบบดว้ ยระบบ auto-completion และแสดงผล (ตวั อยา่ ง เช่น ถา้ คุณพิมพ์ \"ทางาน\" ในช่องการคน้ หาขอ้ มูล คุณจะเห็นการทางานในขณะน้นั ) ได้เป็ นท่ีรวดเร็วข้ึนและหลากหลายกว่าการคน้ หาแบบมาตรฐาน 2.2.2กกXamppกกกกกกกกXampp เป็ นโปรแกรม Apache web server ไวจ้ าลอง web server เพ่ือไวท้ ดสอบ สคริปหรือเวบ็ ไซตใ์ นเครื่องของเรา โดยที่ไม่ตอ้ งเช่ือมต่ออินเตอร์เน็ตและไม่ตอ้ งมีค่าใชจ้ ่ายใดๆ ง่ายต่อการติดต้งั และใช้งานโปรแกรม Xampp จะมาพร้อมกบั PHP ภาษาสาหรับพฒั นาเวบ็ แอพลิเคชนั่ ที่เป็ นท่ีนิยม , MySQL ฐานขอ้ มูล, Apache จะทาหนา้ ที่เป็ นเวบ็ เซิร์ฟเวอร์, Perl อีกท้งั ยงั มาพร้อมกบั OpenSSL , phpMyadmin (ระบบบริหารฐานขอ้ มูลที่พฒั นาโดย PHP เพ่ือใช้เชื่อมต่อไปยงัฐานขอ้ มูล สนบั สนุนฐานขอ้ มลู MySQL และ SQLite โปรแกรม Xampp จะอยใู่ นรูปแบบของไฟล์Zip, tar, 7z หรือ exe โปรแกรม Xampp อยภู่ ายใตใ้ บอนุญาตของ GNUGeneral Public License แต่บางคร้ังอาจจะมีการเปล่ียนแปลงเรื่องของลิขสิทธ์ิในการใช้งาน จึงควรติดตามและตรวจสอบโปรแกรมดว้ ย 2.2.1กก2.2.2.1กกโปรแกรม XAMPP สามารถใชง้ านได้ 4 OS ไดแ้ ก่ 2.2.1กก2.2.1.1กก1)กกWindows สามารถใชง้ านไดก้ บั windows รุ่น 2000, 2003, xp, vista,windows 7

2.2.1กก2.2.1.1กก2)กกLinux สาหรับ SuSE, RedHat, Mandrake, Debian และ Ubuntu 2.2.1กก2.2.1.1กก3)กกMac OS X 2.2.1กก2.2.1.1กก4)กกSolaris สาหรับ Solaris 8 และ Solaris 9กกกกกกกกในการใชง้ านเบ้ืองตน้ ให้ดบั เบิ้ลคลิก Xampp Control Panel Application แลว้ ทาการคลิกป่ ุม start จากน้นั สามารถใชง้ านได้ โดยเปิ ด Browser ข้ึนมาพมิ พ์ localhost หรือ 127.0.0.1 2.2.1กก2.2.2.2กกขอ้ จากดั ดา้ นเทคนิค 2.2.1กก2.2.1.1กก1)กก เครื่องคอมพวิ เตอร์ควรมี RAM ไม่ต่ากวา่ 128 MB 2.2.1กก2.2.1.1กก2)กก Hard disk มีพ้ืนท่ีมากกวา่ 320 MB 2.2.1กก2.2.1.1กก3)กก CPU ไม่กาหนดข้นั ต่า 2.2.3กกโปรแกรม FileZillaกกกกกกกกFtp เป็ นคายอ่ มาจาก File Transfer Protocol ซ่ึงทางานบน port 21 ประโยชน์ของมนั คือช่วยทาใหเ้ ราสามารถอพั โหลดไฟลจ์ ากเครื่องของเรา ส่งไปยงั เคร่ืองเซิฟเวอร์ หรือ ดาวน์โหลดไฟล์จากเคร่ืองเซิฟเวอร์ ลงมาเครื่องเราก็ไดเ้ ช่นกนักกกกกกกกFilezilla เป็นโปรแกรม Ftp ที่เป็ น Freeware ท่ีสามารถดาวน์โหลดมาใชง้ านไดฟ้ รี ไม่มีค่าใชจ้ า่ ย เป็นท่ีนิยมมากในกลุ่ม webmaster ในประเทศไทย 2.2.1กก2.2.3.1กกFtp server – เป็ นโปรแกรมที่ถูกติดต้งั ไวท้ ่ีเคร่ืองเซิฟเวอร์ ทาหน้าท่ีใหบ้ ริการ ftp หากมีการเชื่อมตอ่ จากไคลแอนเขา้ ไป 2.2.1กก2.2.3.2กกFtp client – เป็ นโปรแกรม ftp ที่ถูกติดต้งั ในเคร่ืองคอมพิวเตอร์ของ userทว่ั ๆไป ทาหนา้ ที่เช่ือมต่อไปยงั Ftp server และทาการอพั โหลด ดาวน์โหลดไฟล์ หรือ จะส่ังแกไ้ ขช่ือไฟล์ ลบไฟล์ เคลื่อนยา้ ยไฟลก์ ไ็ ดเ้ ช่นกนั2.3กกการอพั โหลดกกกกกกกกหลงั จากท่ีเราไดส้ ร้างเว็บเพจจนเป็ นที่น่าพอใจแล้ว ข้นั ตอนต่อไปคือ การเผยแพร่ผลงานสู่สายตาชาวโลก โดยการนาไปใส่ในเวบ็ ไซต์ซ่ึงในบทน้ีเราจะกล่าวถึงแนวทางการจดDomain Name การเลือกใช้เว็บเซิร์ฟเวอร์ และการโอนยา้ ยเวบ็ เพจท่ีเราสร้างไปยงั เว็บไซต์กกกกกก ข้ันตอนแรกในการเผยแพร่ เว็บเพจท่ีเราสร้าง คือเราต้องมีพ้ืนที่ว่างในเครื่ องคอมพิวเตอร์ที่ทาหน้าที่เผยแพร่เวบ็ เพจ (เวบ็ เซิร์ฟเวอร์) ซ่ึงมี 3 วิธีในการติดต่อขอพ้ืนที่ ดงั น้ีกกกกกกกก2.3.1กกติดต้งั เวบ็ เซิร์ฟเวอร์ดว้ ยตวั เองกกกกกกกกวธิ ีน้ีเป็นวธิ ีท่ีมีราคาสูงท่ีสุดเพราะเราตอ้ งซ้ือเครื่องเซิร์ฟเวอร์เอง นอกจากน้นั เรายงั ตอ้ งเสียคา่ ใชจ้ า่ ยในการเชื่อมต่อเคร่ืองเซิร์ฟเวอร์กบั อินเทอร์เน็ตแบบ 24 ชวั่ โมงดว้ ย ซ่ึงจะตอ้ งเชื่อมต่อ

ดว้ ยความเร็วสูงจึงจะรองรับการรับส่งขอ้ มลู ที่เกิดข้ึนไดร้ วดเร็วซ่ึงมี 2 วธิ ีในการเช่ือมตอ่ เซิร์ฟเวอร์ของเรากบั อินเทอร์เน็ตกกกกกกกก2.4.1กก2.3.1.1กก เชื่อมต่อโดยใช้ Leased lineกกกกกกก เป็ นการเช่ือมต่อเครื่องเซิร์ฟเวอร์ของเรากับผูใ้ ห้บริการอินเทอร์เน็ตโดยใช้สายLeased (ผา่ นอุปกรณ์เราทเ์ ตอร์ (Router)) Line ซ่ึงเป็ นสายส่งขอ้ มูลเช่ารายเดือน (วงจรเช่า) โดยอตั ราค่าบริการจะข้ึนอยกู่ บั ความเร็วในการส่งขอ้ มูลท่ีใช้ นอกจากน้นั ยงั ตอ้ งเสียค่าเช่าสาย LeasedLine รายเดือนใหก้ บั องคก์ ารส่ือสารแห่งประเทศไทยดว้ ยกกกกกกกกขอ้ ดีของวิธีน้ีคือเราจะมีเครื่องเซิร์ฟเวอร์อยใู่ นสถานที่เดียวกบั เรา ทาใหจ้ ดั การไดง้ ่ายและเรายงั สามารถใชป้ ระโยชน์จากสาย Leased Line เพื่อเชื่อมต่อคอมพิวเตอร์เคร่ืองอ่ืนในองคก์ รของเรากบั อินเทอร์เน็ตตลอด 24 ชว่ั โมงกกกกกกกกขอ้ เสียคือตอ้ งแบกรับภาระดา้ นเทคนิคในการจดั การดูแลอุปกรณ์ต่างๆ ซ่ึงจาเป็นตอ้ งใช้บุคลากรท่ีเช่ียวชาญกกกกกกกก2.4.1กก2.3.1.2กก ใชบ้ ริการ Co-locationกกกกกกกกเป็นการนาเคร่ืองเซิร์ฟเวอร์ของเราไปฝากไวท้ ่ีผใู้ หบ้ ริการอินเทอร์เน็ต โดยการเชื่อมต่อเขา้ กบั วงจรสื่อสารของผใู้ ห้บริการรายน้นั โดยตรง วิธีน้ีค่าใชจ้ ่ายน้อยกวา่ วิธีแรกแต่มีขอ้ เสียคือเราจะติดต่อเครื่องเซิร์ฟเวอร์ของเราผา่ นโมเด็ม ซ่ึงมีความเร็วท่ีค่อนขา้ งจากดั สาหรับขอ้ ดีของวิธีน้ีคือเคร่ืองเซิร์ฟเวอร์ของเราไดเ้ ชื่อมต่อโดยตรงกบั วงจรสื่อสารของผใู้ ห้บริการอินเทอร์เน็ตทาให้รับส่งขอ้ มูลดว้ ยความเร็วสูงกกกกกกกก2.3.2กกขอเช่าพ้ืนท่ีในเวบ็ เซิร์ฟเวอร์ของผอู้ ่ืนกกกกกกกกเป็นวธิ ีที่มีคา่ ใชจ้ ่ายนอ้ ย เพราะเป็ นการขอเช่าพ้ืนท่ีในเวบ็ เซิร์ฟเวอร์ของผอู้ ื่นซ่ึงปัจจุบนัมีบริษทั ท้งั ในและตา่ งประเทศที่เปิ ดใหบ้ ริการ สาหรับระดบั ราคาจะแตกตา่ งกนั ไปตามรายละเอียดของบริการท่ีให้กกกกกกกก2.3.3กกการขอพ้ืนที่ฟรีเพ่ือจดั ต้งั เวบ็ ไซตท์ ่ี Tripodกกกกกกกกในกรณีน้ีมีให้เลือกหลายรูปแบบท้งั ฟรีและเสียค่าใช้จ่าย แต่การให้บริการและการอานวยความสะดวกก็แตกตา่ งกนั ไปดว้ ย บางแห่งจะตอ้ งติดป้ ายโฆษณา หรืออาจจะมีเวบ็ บอร์ดและสมุดเยยี่ ม ตวั นบั ใหท้ นั ทีเมื่อลงทะเบียนขอพ้ืนที่ แต่สาหรับผเู้ ริ่มตน้ ควรจะเลือกในส่วนที่สามารถใชป้ ระโยชน์ไดม้ ากท่ีสุด และท่ีสาคญั ควรเลือกเวบ็ ท่ีสนบั สนุน CGI คือตอ้ งเป็ นเวบ็ ไซตท์ ี่รองรับภาษาสคริปตท์ ี่ใชเ้ ขียนโปรแกรมตา่ งๆ เช่น ASP, PHP, Perl เป็นตน้

2.4กกวจิ ัยทเี่ กย่ี วข้องกกกกกกกกนางสาวมานีสงค์ ปฐมวิริยะวงศ์ (2550) ทาการศึกษาวิจยั เร่ือง การใชป้ ระโยชน์และความพึงพอใจต่อเวบ็ ไซต์สถาบนั ของนกั ศึกษาสถาบนั เทคโนโลยีพระจอมเกลา้ พระนครเหนือ มีวตั ถุประสงค์เพ่ือศึกษาพฤติกรรมการใช้ เหตุผลท่ีใช้เวบ็ ไซต์ ลกั ษณะของการใช้ประโยชน์ และระดบั ความพึงพอใจต่อเวบ็ ไซตส์ ถาบนั ของนกั ศึกษา ใชว้ ิธีการสารวม สุ่มตวั อยา่ งนกั ศึกษาจานวน400 คน พบวา่ พฤติกรรมการใชเ้ วบ็ ไซตส์ ถาบนั มีความถ่ี 1–3 คร้ังต่อเดือน แต่ละคร้ังใชเ้ วลา 15–29นาที ส่วนใหญ่เขา้ เวบ็ ไซตเ์ พ่ือรับทราบขอ้ มูลข่าวสาร และเพ่ือติดต่อส่ือสารกบั สถาบนั ในระบบของการลงทะเบียน การตรวจสอบผลการศึกษา และการสืบคน้ ขอ้ มูลประกอบการศึกษา วิจยั และรายงาน ผลเปรียบเทียบด้านเพศ ระดบั การศึกษา และรายได้ พบว่าไม่มีผลต่อพฤติกรรมการใช้เวบ็ ไซต์สถาบนั แต่นกั ศึกษาที่มีเคร่ืองคอมพิวเตอร์ และโมเด็มของตนเองจะมีพฤติกรรมการใช้เวบ็ ไซตแ์ ตกตา่ งกบั นกั ศึกษาท่ีไม่มีอยา่ งมีนยั สาคญั ทางสถิติที่ระดบั 0.05 ประเด็นความตอ้ งการของนกั ศึกษา มากที่สุด คือ ตอ้ งการใหเ้ วบ็ ไซตข์ องสถาบนั ปรับปรุงขอ้ มูลใหท้ นั สมยั อยเู่ สมอ รองลงมาคือควรปรับปรุงการออกแบบตกแต่งเวบ็ ไซต์ และจดั หมวดหมู่ใหเ้ ป็ นระเบียบเพื่อสืบคน้ ไดง้ ่าย มีขอ้ เสนอแนะให้เพ่ิมความสามารถของเคร่ืองบริการ เพื่อการเช่ือมโยงกบั เวบ็ ไซตท์ ่ีน่าสนใจ เพ่ิมช่องทางการติดตอ่ สื่อสารกบั ผบู้ ริหาร อาจารยท์ ่ีปรึกษา และผเู้ ชี่ยวชาญกกกกกกกกนายศุภชยั ธรรมวงศ์ (2551) ทาการศึกษาวิจยั เร่ือง การพฒั นาระบบบริหารจดั การขอ้ มูลบนเวบ็ ไซตส์ านกั งานสาธารณสุขจงั หวดั แม่ฮ่องสอน มีวตั ถุประสงคเ์ พ่ือปรับปรุงเวบ็ ไซต์สานกั งานฯ ให้เป็ นแหล่งเผยแพร่ขอ้ มูล ประชาสัมพนั ธ์ขอ้ มูลข่าวสาร กิจกรรม และเป็ นเคร่ืองมือในการทางาน โดยใชภ้ าษาพีเอชพี และโปรแกรมจดั การฐานขอ้ มลู มายเอสคิวแอล เวบ็ ไซตแ์ บ่งได้ 2ส่วนท่ีสาคญั คือ ส่วนของเจา้ หน้าที่และบุคคลทวั่ ไป และส่วนระบบบริหารจดั การขอ้ มูล เป็ นส่วนของผดู้ ูแลระบบและผรู้ ับผิดชอบจากแต่ละหน่วยงาน ให้บริการขอ้ มูลไดแ้ ก่ ขอ้ มูลวิสัยทศั น์และยทุ ธศาสตร์ การจองการใชง้ านหอ้ งประชุม รถยนต์ เคร่ืองโปรเจคเตอร์ การจดั การขอ้ มูลประชากรสถานการณ์โรคเอดส์ การจัดอนั ดบั สถานการณ์โรคติดต่อต่าง ๆ การจดั การขอ้ มูลบุคลากร การจดั การไฟล์ดาวน์โหลด การจดั การอลั บ้มั ภาพ การจดั การข่าวกิจกรรม ข่าวประกวดราคา ข่าวประชาสัมพนั ธ์ บทความ ซ่ึงผลการประเมินความพึงพอใจดว้ ยแบบสอบถามพบวา่ 1) กลุ่มผูด้ ูแลระบบ มีความพึงพอในระดบั ดี (ค่าเฉล่ีย 4.35) 2) กลุ่มเจา้ หนา้ ที่ท่ีรับผิดชอบขอ้ มูล มีความพึงพอใจในระดบั ดี (ค่าเฉลี่ย 4.25) และ 3) กลุ่มเจา้ หน้าที่ และบุคคลทวั่ ไป มีความพึงพอใจระดบั ดีมาก(ค่าเฉลี่ย 4.75) สรุปไดว้ า่ เวบ็ ไซตท์ ่ีพฒั นาข้ึนสามารถนาไปใชป้ ระโยชน์ไดจ้ ริง

บทท่ี 3 วธิ ีดาเนินการกกกกกกกกการโครงการจดั ทาเวบ็ ไซต์ (กรณีศึกษา : โรงเรียนวดั ไผล่ อ้ ม ตาบลจนั ทนิมิต อาเภอเมือง จงั หวดั จนั ทบุรี) คณะผจู้ ดั ทามีข้นั ตอนและวธิ ีการดาเนินงานดงั น้ีกกกกกกกก3.1กกการศึกษา และ รวบรวมขอ้ มูลต่างๆกกกกกกกก3.2กกออกแบบเวบ็ ไซต์กกกกกกกก3.3กกจดั ทาเวบ็ ไซต์กกกกกกกก3.4กกตรวจสอบและแกไ้ ขกกกกกกกก3.5กกอพั โหลดเวบ็ ไซต์กกกกกกกกในการดาเนินการทาเวบ็ ไซต์ (กรณีศึกษา : โรงเรียนวดั ไผล่ อ้ ม) ไดม้ ีข้นั ตอนการทาเวบ็ ไซตด์ งั ภาพท่ี 3-1 ดงั น้ี เร่ิมตน้ การศึกษา และ รวบรวมขอ้ มูลต่างๆ ออกแบบเวบ็ ไซต์ จดั ทาเวบ็ ไซต์ ตรวจสอบและแกไ้ ข อพั โหลดเวบ็ ไซต์ จบการทางาน ภาพที่ 3-1 ข้นั ตอนการดาเนินการจดั ทาโครงการ

3.1**การศึกษา และ รวบรวมข้อมูลต่างๆกกกกกกกกโครงการจดั ทาเวบ็ ไซต์ (กรณีศึกษา : โรงเรียนวดั ไผล่ อ้ ม) เริ่มจากการรวบรวมขอ้ มูลโรงเรียน, ประวตั ิโรงเรียน, ขอ้ มูลฝ่ ายบริหาร, ขอ้ มูลบุคลากร, กิจกรรมผลงาน, ขอ้ มูลพ้ืนฐาน เพ่ือใชใ้ นการดาเนินการจดั ทาเวบ็ ไซต์3.2**ออกแบบเวบ็ ไซต์กกกกกกกกเมื่อศึกษาและรวบรวมขอ้ มูลต่างๆของโรงเรียนบางกะจะแลว้ ทางคณะผจู้ ดั ทาก็ไดท้ าการออกแบบเวบ็ ไซต์ โดยมีข้นั ตอนดงั ตอ่ ไปน้ีกกกกกกกก3.2.1กกกาหนดโครงสร้างเวบ็ ไซต์ เวบ็ ไซด์ รูปภาพ หนา้ แรก แรก ประวรตั ูปิคภวาพาม เป็ นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อเรา ภาพที่ 3-2 ภาพโครงสร้างเวบ็ ไซต์

3.2.2กกกาหนดการเชื่อมโยงระหวา่ งเวบ็ เพจ E โรงเรียนวดั ไผล่ อ้ ม (อินทกอ์ ุทยั ) E E E E E Eหนา้ แรก ประวตั ิ ฯ ฝ่ าย กิจกรรม นโยบาย ติดตอ่ เรา หนา้ หนา้ บรหิหนาาร้ หนา้ หนา้ หนา้ แรกแรก แรก แรก แรก แรก ประวตั ิ ประวตั ิ แรก ประวตั ิ ประวตั ิ ประวตั ิ ฯ ฯ ประวตั ิ ฯ ฯ ฯ ฝ่ าย ฝ่ าย ฯ ฝ่ าย ฝ่ าย ฝ่ าย บริหาร บริหาร ฝ่ าย บริหาร บริหาร บริหาร กิจกรรม กิจกรรม บริหาร กิจกรร กิจกรรม กิจกรรม กิจกรรม ม นโยบาย นโยบาย นโยบาย นโยบาย นโยบาย นโยบายติดตอ่ ติดตอ่ ติดต่อ ติดต่อ ติดตอ่ ติดต่อเรา เรา ภาพท่ี 3-3เกราารเช่ือมโยงระหวเา่รงาเพจ เรา เรากกกกกกกกลกั ษณะการเช่ือมโยงของเวบ็ ไซต์ จะเร่ิมจากการเขา้ หนา้ แรกของเวบ็ เพจ และจะเร่ีมเขา้สู่หนา้ แรก จะมีหวั ขอ้ ซ่ึงทุกหนา้ ท้งั หมด จะมีลิงค์ ที่สามารถกลบั ไปสู่ หนา้ แรกได้

3.2.3กกกาหนดการเชื่อมโยงระหวา่ งเวบ็ เพจ3.2.2กก3.2.3.1กกหนา้ แรก Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มูลพ้นื ฐานLink ภายนอก เน้ือหา นาฬิกา/วนั ที่สถิติผเู้ ขา้ เยย่ี มชม ภาพท่ี 3-4 หนา้ แรก

3.2.2กก3.2.3.2กกประวตั ิความเป็นมา Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มลู พ้ืนฐานLink ภายนอก เน้ือหา นาฬิกา/วนั ท่ีสถิติผเู้ ขา้ เยยี่ มชม ภาพท่ี 3-5 ประวตั ิความเป็นมา

3.2.2กก3.2.3.3กกฝ่ ายผบู้ ริหาร Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มลู พ้นื ฐานLink ภายนอก เน้ือหานาฬิกา/วนั ท่ีสถิติผเู้ ขา้ เยยี่ มชม ภาพที่ 3-6 ฝ่ ายผบู้ ริหาร

3.2.2กก3.2.3.4กกฝ่ ายวชิ าการ Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มูลพ้ืนฐานLink ภายนอก เน้ือหานาฬิกา/วนั ท่ีสถิติผเู้ ขา้ เยยี่ มชม ภาพท่ี 3-7 ฝ่ ายวชิ าการ

3.2.2กก3.2.3.5กกฝ่ ายบริหารงานทว่ั ไป Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มลู พ้ืนฐานLink ภายนอก เน้ือหานาฬิกา/วนั ที่สถิติผเู้ ขา้ เยย่ี มชม ภาพที่ 3-8 ฝ่ ายงานบริหารทว่ั ไป

3.2.2กก3.2.3.6กกฝ่ ายบริหารงบประมาณและงานบุคลากร Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มูลพ้ืนฐานLink ภายนอก เน้ือหานาฬิกา/วนั ท่ีสถิติผเู้ ขา้ เยย่ี มชม ภาพท่ี 3-9 ฝ่ ายบริหารงบประมาณและงานบุคลากร

3.2.2กก3.2.3.7กกกิจกรรมผลงาน Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มลู พ้ืนฐานLink ภายนอก เน้ือหา นาฬิกา/วนั ที่สถิติผเู้ ขา้ เยยี่ มชม ภาพท่ี 3-10 กิจกรรมผลงาน

3.2.2กก3.2.3.8กกนโยบาย Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มลู พ้นื ฐานLink ภายนอก เน้ือหานาฬิกา/วนั ที่สถิติผเู้ ขา้ เยยี่ มชม ภาพที่ 3-11 ฝ่ ายบริหารงบประมาณและงานบุคลากร

3.2.2กก3.2.3.9กกติดต่อเรา Headerหนา้ แรก ประวตั ิความเป็นมา ฝ่ ายบริหาร กิจกรรมผลงาน นโยบาย ติดต่อบุคลากร เราขอ้ มูลพ้นื ฐานLink ภายนอก เน้ือหา นาฬิกา/วนั ที่สถิติผเู้ ขา้ เยยี่ มชม ภาพที่ 3-12 ติดตอ่ เรา