โครงงานครูโจ้-recent44

เร่ือง FROM จัดทำโดย นำงสำวทพิ ำนัน ชำครยี รัตน์ เลขที่ 12 นำงสำวศตนันท์ ขันธมำลยั เลขท่ี 13 นำงสำวสวุ พชิ ชำ ปัญจรักษว์ รกุล เลขท่ี 16 ชน้ั มธั ยมศกึ ษำปีท่ี 4/4 เสนอ คณุ ครูภัทรดนยั พลสูงเนนิ โรงเรียนนำรนี ุกลู จงั หวดั อุบลรำชธำนี สำนักงำนเขตพืน้ ทก่ี ำรศึกษำมธั ยมศกึ ษำ เขต 29

เร่ือง FROM จัดทำโดย นำงสำวทพิ ำนัน ชำครยี รัตน์ เลขที่ 12 นำงสำวศตนันท์ ขันธมำลยั เลขท่ี 13 นำงสำวสวุ พชิ ชำ ปัญจรักษว์ รกุล เลขท่ี 16 ชน้ั มธั ยมศกึ ษำปีท่ี 4/4 เสนอ คณุ ครูภัทรดนยั พลสูงเนนิ โรงเรียนนำรนี ุกลู จงั หวดั อุบลรำชธำนี สำนักงำนเขตพืน้ ทก่ี ำรศึกษำมธั ยมศกึ ษำ เขต 29

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

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

สำรบญั (ต่อ) ค บทท่ี 5 สรปุ อภปิ รายและข้อเสนอแนะ หน้า การดาเนนิ งานจัดทาโครงงาน 22 สรปุ ผลการดาเนินงานโครงงาน 22 ข้อเสนอแนะ 22 ปญั หา อุปสรรค และแนวทางในการพัฒนา 23 23 บรรณานุกรม 24

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

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

3 บทท่ี2 เอกสำรและโครงงำนทเี่ กยี่ วขอ้ ง การจดั ทาโครงงานFROM เวบ็ ไซตก์ ารศึกษา ผู้จดั ทาได้ศกึ ษาเอกสาร ดังต่อไปน้ี 1. ความหมายของเวบ็ ไซต์ 2. ประโยชน์ของเว็บไซต์ 3. องค์ประกอบของเว็บไซต์ 4. ประเภทของเว็บไซต์ 5. การสร้างเวบ็ ไซต์ 6. ขั้นตอนการพฒั นาเวบ็ ไซต์ 7. ศัพท์เบ้ืองต้นเก่ียวกับเว็บไซต์ 8. เว็บไซตท์ เี่ ปน็ ที่รูจ้ ัก 1.ควำมหมำยของเวบ็ ไซต์ เวบ็ ไซต์ (Website) คือ แหลง่ ท่ีเก็บรวบรวมข้อมลู เอกสารและสอื่ ประสมต่างๆ เชน่ ภาพ เสยี ง ข้อความ คาทีใ่ ช้เรยี กกลุ่มของเวบ็ เพจ ดงั นัน้ ภายในเวบ็ ไซตจ์ ะประกอบไปด้วยโฮมเพจและเวบ็ เพจ โดยเว็บไซต์ ตอ้ งมีการจดทะเบยี นชอ่ื เวบ็ ไซตน์ ัน้ ๆ ไวแ้ ล้ว เช่น http://www.google.com, http://www.mkp.ac.th เป็นต้น โดยเว็บไซต์แบ่งตามลกั ษณะการใช้งานและการโตต้ อบกับผ้ใู ช้ไดเ้ ป็น 2 ชนดิ คือ 1. Static Website หมายถึง เวบ็ ไซต์ทส่ี ร้างด้วยภาษา HTML ธรรมดา และบนั ทึกเปน็ ไฟล์นามสกุล .html เนอื้ หาข้อความ รปู ภาพในหนา้ เวบ็ เพจน้ันจะเปน็ ไปตามท่ีเราเขยี นกาหนดไวเ้ มอ่ื มผี ู้เรยี กดหู น้าเวบ็ เพจน้ัน Web Server ก็จะสง่ ไฟล์น้ันไปให้ยงั เครื่องท่ีร้องขอ และแสดงผลออกทางโปรแกรมเวบ็ เบราเซอรบ์ นเครื่องของผชู้ มนัน้ เว็บไซต์ท่ี ตอบสนองทางเดยี ว ไม่มกี ารติดตอ่ กับฐานขอ้ มูล และไม่สามารถเกบ็ ข้อมูลได้ เปน็ การนาเสนอขอ้ มลู แบบทางเดียว เหมอื นกับการอา่ นหนงั สอื และเนอ่ื งจาก Static Website มกี ารนาเสนอขอ้ มูลแบบตายตวั น้เี อง จงึ ไม่เปน็ ท่ีสนใจ ของผู้พบเห็น ปจั จบุ ันไม่คอ่ ยเห็นเว็บไซตป์ ระเภทน้ีมากนัก เน่อื งจากไมส่ ามารถบรหิ ารข้อมลู ไดส้ ะดวก จึงทาให้ เวบ็ ไซตท์ ี่พฒั นาดว้ ยวิธนี ้ี ไมค่ ่อยประสบความสาเรจ็ และปิดตัวเองไป หรือพัฒนาใหม่ในรูปแบบ Static Website เหมาะกบั เว็บไซตท์ ่ีมีขนาดไมใ่ หญ่ จานวนหน้าเว็บเพจไม่มาก ไมม่ ีการเปลย่ี นแปลงข้อมูลบ่อยๆ และไม่ มกี ารตดิ ต่อฐานข้อมลู ถา้ เราจะสรา้ งเวบ็ รูปแบบนี้ สามารถทาไดไ้ ม่ยาก โดยต้องศึกษาเร่ืองการเขียนเวบ็ เพจ ดว้ ย HTML กอ่ น ข้อดีของเว็บรปู แบบนี้ คือ เราสามารถกาหนดรปู แบบการตกแต่ง และเน้อื หา ของแต่ละหน้าได้

4 ตามต้องการ แต่กค็ วรควบคุมสไตล์ของแตล่ ะหนา้ ให้เหมือนกนั ด้วย อย่าให้หนา้ ใดโดดจนคดิ ว่าเปน็ คนละเว็บไซต์ กัน สว่ นข้อเสยี ก็คือ การแก้ไขเปล่ียนแปลงยุ่งยาก จะต้องแก้ไขกบั ไฟลห์ น้า เว็บเพจนัน้ ๆ เม่ือแกไ้ ขแลว้ ก็ ตอ้ ง Upload ไฟลน์ น้ั ขึ้นไป Web Server ใหม่ทุกครง้ั และเวบ็ รปู แบบน้ีจะไม่สามารถใช้งานฐานข้อมูลได้ 2. Dynamic Website หมายถึง เวบ็ ไซตท์ หี่ น้าเวบ็ เพจสามารถเปล่ยี นแปลงข้อมูลเองได้ โดยไม่ต้องเขียนแต่ละหน้าเว็บเพจ เอง เชน่ กระดานข่าว (Webboard), ระบบสบื คน้ ข้อมลู สงั เกตได้วา่ เม่ือมผี ู้มาตั้งกระทู้ และตอบกระทู้ ก็จะเกดิ หนา้ เว็บเพจนนั้ ๆ ขึ้นไดเ้ อง โดยท่เี ราไม่ได้เป็นคนสร้างหนา้ เวบ็ เพจเหล่านน้ั เอง เว็บไซต์รูปแบบน้ีจะถูกสร้างด้วย ภาษา Script แบบ Server Side Script เชน่ PHP, ASP, ASP.Net, JSP และอืน่ ๆ ไฟลเ์ อกสารที่ีได้จะมีนามสกลุ .php, .asp เป็นตน้ และมักจะมีการติดตอ่ กับฐานข้อมูลเพ่ือบนั ทึกขอ้ มลู ลงในฐานข้อมลู หรอื นาข้อมลู จาก ฐานข้อมลู ข้ึนมาแสดงผลเปน็ หน้าเวบ็ เพจ สว่ นการทางานของเว็บไซต์รูปแบบน้ี จะต่างจาก แบบ Static Website โดยเม่ือมผี ้ชู มเรยี กดหู นา้ เวบ็ เพจ ไฟลห์ น้าเว็บเพจนน้ั จะถูกแปลและ execute คาส่ัง โดยตวั Interpreter ทฝ่ี ่งั Serverีให้อย่ใู นรูปแบบเอกสาร HTML กอ่ น จึงส่งกลับให้ Web Server เพอ่ื ส่งต่อไป ใหโ้ ปรแกรมเวบ็ เบราเซอร์ของผใู้ ช้งานต่อไป การสรา้ งเว็บไซตร์ ูปแบบนี้ ตอ้ งอาศยั ความรใู้ นการเขียนโปรแกรม มากกว่าแบบแรกมาก นอกจากจะต้องมีความรู้พ้ืนฐาน HTML แลว้ ยงั ต้องเขียนภาษา Server Side Script เป็น อย่างน้อย 1 ภาษา ต้องรูเ้ รอ่ื งการจัดการฐานข้อมลู ต้องเขยี น SQLีเพือ่ จดั การกบั ข้อมูลในฐานขอ้ มลู ได้ และถ้า อยากใหร้ ะบบงานทางานได้อยา่ งรวดเรว็ ไม่ต้อง Refresh หน้าจอบ่อยๆ ยังต้องรเู้ รื่อง AJAX อกี ดว้ ย ในการจดั ทาเวบ็ ไซต์ใหม่ขนึ้ มาหน่งึ เวบ็ ไซต์น้ัน สงิ่ ท่ีจาเป็นอยา่ งย่ิงคือการกาหนดวัตถุประสงค์ของการจดั ทา ให้ชดั เจน เพ่อื เปน็ แนวทางในการออกแบบและพฒั นาเวบ็ ไซตต์ ่อไป

5 2.ประโยชน์ของเวบ็ ไซต์ ประโยชนของเวบ็ ไซต์ สาหรับบุคคลธรรมดา  ทาเปน็ ไฟลป์ ระวตั สิ ว่ นตัว หรือ Resume Online  สาหรบั บนั ทึกความทรงจาส่วนตัว คลา้ ยสมุด Daily  สามารถหารายไดจ้ ากเว็บไซต์ จากโฆษณาจาก Google  สามารถขายพื้นท่บี นเวบ็ ไซตใ์ ห้ผสู้ นใจ  ทาเว็บขายสนิ คา้ แบบส่วนตวั รองรบั การชาระเงนิ ออนไลน์ได้ ประโยชนของเว็บไซต์ สาหรบั นิติบคุ คลหรอื บริษัท  ขอ้ มลู ดจิ ิตอลของบริษัท บนเครอื ขา่ ยอนิ เตอรเ์ นต็ (หนา้ รา้ นในโลกดิจิตอล)  ใช้สาหรับการนาแนะสินคา้ หรือบริการ  เป็นร้านค้าออนไลน์ทท่ี างาน 24 ช่วั โมง 7 วนั ตอ่ สัปดาห์ ไมม่ วี นั หยุด  ใชส้ าหรบั สรา้ งความน่าเชอ่ื ถือ สรา้ งภาพลักษณท์ ี่ดี หรือ Image ให้กบั บรษิ ัท  แสดงถึงความเปน็ คนมีวสิ ยั ทัศน์ มีความรู้ ความเข้าใจในการประยกุ ต์การใชเ้ ทคโนโลยใี หก้ ับบริษทั ให้กับ เจา้ ของบริษัท  สามารถแนะนาในรูปแบบของ รูปภาพ ภาพเคล่ือนไหว เสียง และวีดีโอ  เปน็ ชอ่ งทางในการตดิ ต่อสื่อสารหรือการทาการตลาดกับลกู คา้ ทวั่ โลกได้ (เพม่ิ ช่องทางการตลาด)  รองรับข้อมลู ทุกภาษาท่วั โลก  ลกู ค้าสามารถตดิ ต่อถงึ เราไดโ้ ดยตรง ผ่านการกรอกแบบฟอร์ม  ค่าใช้จา่ ยในการพฒั นาค่อนข้างตา่ เม่อื เปรียบเทียบกบั การทาการตลาดอนื่ ๆ  สามารถเปล่ยี นแปลงข้อมลู ได้ตลอดเวลา ไม่เหมือนกับการพมิ พ์เอกสาร โบรช์ วั ร์  รองรับการชาระเงนิ ออนไลนผ์ ่านทว่ั โลก  และอื่นๆ อกี มากมาย

6 มีเว็บไซต์ ได้อเี มลฟรี นอกจากน้ี ประโยชน์ของการมีเวบ็ ไซต์เป็นของตัวเอง นน่ั ก็คือ การมีอีเมล ภายใตช้ อื่ ของเว็บไซต์ตัวเอง เชน่ เวบ็ ไซตข์ องเรา TechnoIntrend.com เราสามารถสร้างอีเมลได้ดังตวั อย่าง [email protected] แทนที่เราจะใช้อเี มลฟรขี องบริษัทอน่ื ๆ เช่น Yahoo Mail, Gmail ของ Google หรือ Outlook ของ Microsoft เป็นตน้ 3.องค์ประกอบของเวบ็ ไซต์ การออกแบบเว็บไซต์ทมี่ ปี ระสทิ ธิภาพนั้นตอ้ งคานึงถึง องค์ประกอบสาคญั ดังต่อไปน้ี 1. ความเรียบงา่ ย (Simplicity) หมายถึง การจากดั องคป์ ระกอบเสริมใหเ้ หลอื เฉพาะองค์ประกอบหลัก กลา่ วคือในการส่ือสารเนื้อหากับผู้ใช้ นั้น เราต้องเลือกเสนอส่งิ ทีเ่ ราต้องการนาเสนอจริง ๆ ออกมาในสว่ นของกราฟิก สีสัน ตัวอกั ษรและ ภาพเคลอ่ื นไหว ตอ้ งเลือกให้พอเหมาะ ถ้าหากมีมากเกินไปจะรบกวนสายตาและสร้างความคาราญต่อผ้ใู ช้ตัวอย่าง เว็บไซตท์ ี่ได้รบั การออกแบบท่ีดี ไดแ้ ก่ เว็บไซตข์ องบรษิ ัทใหญ่ ๆ อย่างเช่น Apple Adobe Microsoft หรอื Kokia ท่ีมกี ารออกแบบเว็บไซตใ์ นรูปแบบทเ่ี รยี บงา่ ย ไมซ่ ับซอ้ น และใช้งานอย่างสะดวก 2. ความสมา่ เสมอ ( Consistency) หมายถึง การสร้างความสมา่ เสมอให้เกิดข้นึ ตลอดท้ังเว็บไซต์ โดยอาจเลอื กใช้รูปแบบเดียวกนั ตลอดทั้ง เว็บไซตก์ ็ได้ เพราะถ้าหากว่าแตล่ ะหนา้ ในเว็บไซตน์ ้นั มีความแตกต่างกันมากจนเกนิ ไป อาจทาใหผ้ ูใ้ ชเ้ กดิ ความ สับสนและไม่แนใ่ จวา่ กาลังอยู่ในเว็บไซตเ์ ดมิ หรือไม่ เพราะฉะน้ันการออกแบบเวบ็ ไซตใ์ นแต่ละหน้าควรทจ่ี ะมี รปู แบบ สไตล์ของกราฟิก ระบบเนวิเกช่ัน (Navigation) และโทนสที ม่ี ีความคล้ายคลึงกันตลอดท้ังเวบ็ ไซต์ 3. ความเปน็ เอกลักษณ์ (Identity) ในการออกแบบเว็บไซตต์ อ้ งคานงึ ถงึ ลักษณะขององคก์ รเปน็ หลัก เน่ืองจากเวบ็ ไซตจ์ ะสะท้อนถึงเอกลกั ษณ์ และลักษณะขององคก์ ร การเลอื กใช้ตวั อักษร ชดุ สี รปู ภาพหรือกราฟกิ จะมผี ลตอ่ รปู แบบของเว็บไซตเ์ ปน็ อยา่ ง มาก ตวั อย่างเช่น ถ้าเราตอ้ งออกแบบเว็บไซต์ของธนาคารแตเ่ รากลบั เลอื กสีสันและกราฟิกมากมาย อาจทาใหผ้ ้ใู ช้ คดิ ว่าเป็นเว็บไซต์ของสวนสนุกซง่ึ สง่ ผลต่อความเชื่อถอื ขององค์กรได้

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

8 9. ความคงที่ของการทางาน (Function Stability) ระบบการทางานตา่ ง ๆ ในเว็บไซตค์ วรมีความถูกต้องแน่นอน ซึ่งต้องได้รับการออกแบบสร้างสรรคแ์ ละตรวจสอบ อย่เู สมอ ตวั อย่างเชน่ ลงิ ค์ต่าง ๆ ในเว็บไซต์ ต้องตรวจสอบวา่ ยังสามารถลิงค์ขอ้ มูลได้ถูกตอ้ งหรอื ไม่ เพราะ เว็บไซต์อ่นื อาจมีการเปล่ียนแปลงไดต้ ลอดเวลา ปญั หาทเ่ี กิดจากลิงค์ ก็คอื ลิงคข์ าด ซ่งึ พบได้บ่อยเปน็ ปญั หาท่ี สรา้ งความราคาญกบั ผใู้ ชเ้ ป็นอยา่ งมาก 4.ประเภทของเว็บไซต์ ในการจัดทาเวบ็ ไซต์ใหม่ข้นึ มาหนง่ึ เวบ็ ไซตน์ ้นั สง่ิ ท่ีจาเป็นอย่างยง่ิ คอื การกาหนดวัตถปุ ระสงคข์ องการจัดทา ให้ชัดเจน เพ่ือเปน็ แนวทางในการออกแบบและพฒั นาเว็บไซต์ ซ่ึงสามารถแบ่งประเภทของเว็บไซต์ออกเป็น 9 ประเภท ดงั น้ี 1. เว็บไซตส์ ว่ นตัว (Personal website) เปน็ เว็บที่สร้างขึ้นเพื่อเผยแพรข่ ้อมลู ส่วนตวั เช่น ขอ้ มูลเกีย่ วกบั ส่วนตัว การศกึ ษา การงาน ความสนใจ เป็นต้น 2. เว็บไซตเ์ พ่ือธุรกจิ การค้า (Business/Marketing website) เว็บไซตน์ ้มี จี ุดประสงค์ เพอ่ื การค้าขายสินค้า การโฆษณาสินคา้ การส่งเสริมการขาย ในเวบ็ ไซตจ์ ะมขี ้อมูลของสนิ ค้า ราคาและการบริการตา่ ง ๆ ซงึ่ ในปัจจบุ นั ตลาดประเภทนีก้ าลงั ใชก้ นั มากข้นึ 3. เว็บไซต์ทีเ่ สนอข่าวประจาวนั (Current website) เปน็ เวบ็ ท่เี สนอข้อมลู ประเภทข่าว ซึ่งจะเปลีย่ นไปเป็น ประจาวนั เชน่ เว็บไซต์ของหนงั สอื พิมพ์ไทยรัฐ เดลนิ ิวส์ เปน็ ต้น 4. เว็บไซต์ส่งเสริมการบริการเป็นสือ่ กลางของข้อมูล (Share Information website) เปน็ เว็บทีม่ ี จดุ ประสงค์ทจ่ี ะใช้เปน็ การแลกเปลยี่ นข้อมูล เปน็ ต้น 5. เวบ็ การศกึ ษา (Education website) เปน็ เว็บทส่ี ร้างขนึ้ เพื่อการศึกษา ทีม่ นี โยบายในการเผยแพร่ ความรู้ และใหโ้ อกาสในการค้นควา้ หาขอ้ มลู เพื่อการศึกษา บุคคลท่ีสนใจโดยท่วั ไป รวมถึงนกั เรยี น นสิ ิต นกั ศึกษา ด้วย นาเสนอข้อมลู เกย่ี วกบั การเรยี นรู้ทั้งแบบทีเ่ ป็นทางการและไม่เป็นทางการ 6. เวบ็ บันเทงิ (Entertainment website) เป็นเว็บที่นาเสนอเสนอเนือ้ หาด้านบันเทิง และใหบ้ ริการต่าง ๆ เพือ่ เสริมสร้างความบันเทิง เช่น ดนตรี ภาพยนตร์ ดารา กีฬา ความรัก บทกลอน การต์ ูน เรื่องขาขนั รวมถงึ การ ให้บรกิ ารดาวน์โหลดสอื่ ชนิดต่าง ๆ เป็นต้น 7. เว็บองค์กรท่ีไมแ่ สวงหาผลกาไร (None-profit organization website) เป็นเว็บทีส่ รา้ งข้ึนโดยกลุม่ บุคคลหรอื องค์กรตา่ ง ๆ ที่มีนโยบายในการสรา้ งสรรคท์ ี่ชว่ ยเหลือสังคม โดยท่ีไม่หวงั ผลกาไรหรือค่าตอบแทน ซง่ึ กลุ่มบคุ คลหรือองค์กรเหล่าน้ีได้แก่ สมาคม ชมรม มูลนธิ ิ และโครงการตา่ ง ๆ โดยอาจมีจุดประสงค์เฉพาะท่ี

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

10 1.กาหนดโครงสรา้ งของเวบ็ ไซต์ 2. กาหนดการเชอื่ มโยงระหว่างเว็บเพจ  การกาหนดการเชอ่ื มโยงใหเ้ ว็บเพจแตล่ ะหน้าเช่ือมโยงถึงกันเพ่ือให้กลับไปกลับมาระหวา่ ง หนา้ ตา่ งๆ ได้  แต่ละไฟลท์ ่ีมีการเชอื่ มโยงสัมพนั ธ์กัน 3. การออกแบบเวบ็ เพจแตล่ ะหน้า  ในขั้นตอนการออกแบบน้ีอาจเรยี กว่าการออกแบบเลย์เอาท์ (Lay Out)

11  สามารถทาไดโ้ ดยการเขยี นลงในกระดาษ หรอื ใช้โปรแกรมคอมพวิ เตอร์ชว่ ยในการออกแบบก็ได้ ดงั ภาพ 4.การสร้างเวบ็ เพจแต่ละหนา้  สรา้ งโดยใช้ภาษา html หรอื อาจใช้โปรแกรมสาเรจ็ รปู เช่น Macromedia Dreamweaver หรือโปรแกรมสาเร็จรปู อ่ื 5.การลงทะเบยี นขอพน้ื ที่เวบ็ ไซต์  เป็นการเผยแพร่เวบ็ ไซต์ทสี่ ร้างเสรจ็ แลว้ เข้าสู่ระบบเครือขา่ ยอินเทอรเ์ น็ต เพื่อให้บุคคลอ่ืนๆ สามารถเขา้ ชมเวบ็ ไซตข์ องเราได้  วิธีการก็คือนาเว็บไซต์ท่เี ราสรา้ งขนึ้ ไปไว้บนพ้ืนท่ีท่ใี หบ้ ริการ (Web Hosting) ซ่งึ มีพน้ื ที่ที่ ใหบ้ ริการฟรีและแบบทต่ี ้องเสียค่าบรกิ าร 6.การอัพโหลดเวบ็ ไซต์ การคัดลอกข้อมูลจากเครื่องเราไปเก็บไวใ้ นเคร่ือง Server เรยี กวา่ Upload หลงั จากสรา้ งเวบ็ ไซตแ์ ละ ลงทะเบียนขอพื้นท่ีสาหรับฝากเวบ็ ไซต์แลว้ ใหใ้ ช้โปรแกรมสาหรับอัปโหลด (Upload) เชน่ โปรแกรม CuteFTP, WinSCP, WS_FTP เพ่อื ให้คนท่ัวโลกสามารถเข้าชมเวบ็ ไซตข์ องเราผ่านทาง ระบบเครือข่ายอนิ เทอรเ์ น็ตได้

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

13 4.การสรา้ งเวบ็ ไซตต์ ้องอาศัยทกั ษะหลายๆดา้ น เชน่ ในการเตรียมเน้อื หา ออกแบบกราฟกิ เขียน โปรแกรม และการดูแลเว็บเพจเซริฟเวอร์ เป็นต้น ซึง่ ถา้ เปน็ เป็นเวบ็ ไซตข์ นาดใหญ่อาจจะต้องใชบ้ คุ ลากรเป็น จานวนมาก 5.เตรียมทรัพยากรตา่ งๆทจ่ี าเป็นเช่น โปรแกรมสาสาหรับสรา้ งเว็บไซต์ โปรแกรมสาหรบั สรา้ งกราฟิก ภาพเคล่อื นไหว และมัลตมิ ิเดีย และโปรแกรมอื่นๆท่ีตอ้ งใช้ วิเคราะหแ์ ละจัดโครงสรา้ งข้อมลู ขั้นตอนน้เี ปน็ การนาข้อมลู ตา่ งๆรวบรวมไดจ้ ากขัน้ แรก ไม่ว่าจะเป็นวัตถุประสงค์เว็บไซต์ คุณลกั ษณะ ข้อจากัดของกลุ่มผชู้ มเป้าหมาย รวมเนอ้ื หาหลักของเว็บไซต์ นามาประเมิน วิเคราะห์ และ จัดระบบ เพื่อให้ได้โครงสร้างข้อมลู และข้อกาหนด ซึง่ จะใชเ้ ปน็ กรอบสาหรบั การออกแบบและดาเนินนการใน ข้ันตอ่ ๆไป ผลทไี่ ด้รบั จากขั้นนี้ควรประกอบไปดว้ ย -แผนผังสร้างของเวบ็ ไซต(์ site structure) สารบญั (table of content) ลาดับการนาเสนอ (storyboard)หรือผงั งาน(flowchart) -ระบบนาทางหรอื เนวิเกชน่ั ซ่ึงผู้ชมจะใช้สาหรบั เปิดเข้าไปยังส่วนตา่ งๆของเวบ็ ไซต์ ตวั อย่างเช่น โครงสรา้ งและรูปแบบของเมนู -องคป์ ระกอบต่างๆท่ีจะนามาใชใ้ นเวบ็ เพจมอี ะไรบา้ งเชน่ รูปภาพกราฟิก เสยี ง วิดโ๊ อ มลั ตมิ ิ เดยี แบบฟอร์ม อไรบ้างที่เป็นบราวเซอนข์ องผูส้ นบั สนนุ อะไรบา้ งที่ต้องอาศัยโปรแกรมเสรมิ -ขอ้ กาหนดเกีย่ วกับลักษณะหน้าตาและรปู แบบของเพจ -ขอ้ กาหนดของโปรแกรมภาษาสคริปต์หรอื เวบ็ แอพพลเิ คชนั่ และฐานขอ้ มูลที่ใชใ้ นเว็บไซต์ -คณุ สมบัติของเว็บเซรริ ฟ์ เวอร์ รวมถึงขอ้ จากัด และบรกิ ารเสริมตา่ งๆทมี่ ีให้ ออกแบบเวบ็ เพจและเตรียมข้อมลู เป็นข้นั ออกแบบแบบเค้าโครวหนา้ ตา และลักษณะด้านกราฟิกของหนา้ เว็บเพจ เพอ่ื ใหผ้ ชู้ มเกดิ อารมณ์ ความรับร้ตู อ่ เว็บเพจตามท่เี ราตอ้ งการ ดงั นั้นผู้ท่ีทาหนา้ ที่นี้จึงควรมคี วามสามารถทางดา้ นศลิ ปะ พอสมควร โปรแกรมท่จี ะใชใ้ นการออกแบบ คอื adobe photoshop ซึ่งผลท่ไี ดจ้ ะประกอบไปด้วยกราฟิก ตา่ งๆท่ีใชบ้ นเวบ็ เพจ เช่น โลโก้ ภาพพื้นหลัง ปุ่มเมนู การออกแบบเวบ็ เพจยังรวมไปถึงการกาหนดสสี นั และ รูปแบบของส่วนประกอบตา่ งๆท่ีไม่ใชภ่ าพกราฟกิ เชน่ ฟอนต์ ขนาด และสขี อ้ ความ ลงมอื สร้างและทดสอบ

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

15 1. Domain Name คอื ชื่อเวบ็ ไซต์ (ท่ีไมม่ ีการซา้ กนั กับเวบ็ ไซตอ์ น่ื ๆ) เช่น google.com, enjoyday.net 2. Hosting คือ พ้ืนท่เี ก็บข้อมูลเว็บไซต์ทง้ั หมด โดยเชา่ ใช้รายปี ขนาดของพื้นที่เก็บข้อมูล ข้ึนอยู่กบั ปรมิ าณข้อมลู ของเว็บไซต์ นั้นๆ 3. Website คอื แหลง่ รวบรวมข้อมูลทั้งหมดของสถานประกอบการ หรือองค์กรนนั้ ๆ 4. Home Page คือหนา้ แรกของเวบ็ ไซต์ 5. Web Page เป็นหนา้ รายละเอียดย่อยๆของเว็บไซต์ 6. Web browser คือ โปรแกรมสาหรับเรียกดูเว็บเพจ ใหแ้ สดงตามข้อมลู ท่ีผู้จัดทาเว็บไซตต์ ้องการสอื่ สาร ซ่ึงผ้ใู ช้งานเว็บไซต์ สามารถเรียกผา่ น browser หลากหลายช่องทาง อาทิเชน่ Internet Explorer (IE), Mozilla Firefox, Safari และ Opera เปน็ ตน้ 7. Header คือ สว่ นหวั ของเวบ็ ไซต์ ซึ่งอยู่บนสุดของเวบ็ ไซต์ แสดงชอ่ื เว็บไซต์ Logo และรายการเมนูหลกั ของเว็บ เพือ่ เป็น ชอ่ งทางในการเข้าถงึ คงรายละเอียดอ่ืนๆ เพิม่ เติมของ องค์กร 8. Footer คือ สว่ นทา้ ยของเวบ็ ไซต์ เนน้ เปน็ ส่วนช่องทางลดั ในการสอื่ สารกบั องค์กร และเข้าถงึ ข้อมลู ทีส่ าคัญของสินค้าและ บริการ รวมทั้งข้อมลู การตดิ ต่อองค์กร เป็นต้น 9. Menu Bar คือ ส่วนแถบเมนูของเว็บไซต์ 10. Upload คือ การส่งข้อมูลจากเครอื่ งของเราไปยงั Web Server เมอื่ เราสร้าง Web page แต่ละหน้าแลว้ ต้องส่งข้อมลู ไป เกบ็ ไวท้ ี่ Web Server ที่เป็นเคร่อื งคอมพิวเตอรท์ ีใ่ ห้บริการขอ้ มลู www โดยอาศยั โปรแกรม FTP

16 11. Search engine เปน็ เครื่องมือหรือโปรแกรมในการค้นหาเว็บตา่ งๆ และข้อมลู ตา่ งๆ อาทิ เช่น yahoo.com,Google.com, bing.com เปน็ ต้น 12. Banner คือ ปา้ ยโฆษณา หรอื รปู ภาพที่ต้องการสื่อถึงสนิ ค้า และบริการในข้อความสนั้ ๆ และใช้รูปภาพเป็นตวั กลางหลกั ใน การสร้างความจดจา และดึงดูดใจลกู คา้ 13. SEO (Search Engine optimization) คือ บริการจัดการให้เวบ็ ไซตต์ ิดอนั ดบั ในการค้นหาของระบบ Search engine เปน็ อันดบั ต้นๆ เพือ่ ใหผ้ ใู้ ช้งาน เวบ็ ไซต์เขา้ ถงึ รายละเอียด เน้ือหาของตัวเว็บไซต์งา่ ยขน้ึ 14. Add Product คอื การเพิม่ สินคา้ (ข้อมลู สินคา้ รปู ภาพ) เข้าสูเ่ วบ็ ไซต์ 15. Add Content คือ การเพม่ิ บทความ รายละเอยี ดข้อมูลของเวบ็ ไซต์ หรือข้อมูลทเ่ี ก่ียวขอ้ งเขา้ สเู่ ว็บไซต์ 16. Template คอื โครงร่างของหน้าเวบ็ ไซต์ทถ่ี กู ออกแบบมาเพื่อใหล้ ูกคา้ ไดเ้ ลือกใชง้ านตามความพึงพอใจ 17. Theme คือ รปู แบบของเว็บไซต์ท่ลี ูกค้าตอ้ งการ อาทิเช่น ลวดลาย โทนสี เป็นต้น 18. Lay Out คือ การจัดวางรูปแบบของเว็บไซต์ เปน็ การวางสัดสว่ นข้อมลู ของเว็บไซต์ให้ใชง้ านงา่ ย 19. Category คือ หมวดหมู่หลักของสนิ คา้ หรือบรกิ าร 20. Webmaster คือ ผู้ดแู ล ปรบั ปรงุ เว็บไซต์ 21. E-newsletter คอื จดหมายข่าวอเิ ลค็ ทรอนิคส์ ท่ีทางเว็บไซต์จัดส่งให้สมาชิกผ่านระบบอินเทอร์เนต็ 22. Keyword คือคาคน้ ท่รี ะบุบนเวบ็ ไซต์ เพ่ือให้ผู้ใช้งานเว็บไซต์สามารถค้นหาเวบ็ ไดง้ ่ายๆ จากคาคาน้ัน

17 23. Spam คอื Email ท่เี ป็นขยะที่เราไม่ตอ้ งการ โดยส่งมาจาก Email ทเ่ี ราไมร่ ู้จักซ่งึ จะทาให้เราเสียพ้ืนท่เี ก็บข้อมลู ของเรา ไปโดยเปลา่ ประโยชน์ จุดประสงค์ของ Email Spam นั้นผู้สง่ สว่ นใหญ่ตอ้ งการโฆษณาบรกิ ารต่างๆที่ตวั เองมี 24. FAQ (Frequently Asked Questions) คือ คาถามท่พี บบ่อย จากลูกคา้ หรอื ผ้ใู ชง้ านเว็บไซต์ ดงั นัน้ ทางผดู้ แู ลเวบ็ ไซต์จึงนาคาถาม และคาตอบเหล่านน้ั ข้ึน บนเวบ็ ไซตเ์ พ่ือนาเสนอให้กับผู้ใช้งานทา่ นอน่ื ๆ สามารถรับทราบถึงปัญหา และวธิ ีการแก้ไขปัญหาได้อย่างงา่ ยข้นึ 8.เว็บไซต์ที่เปน็ ทีร่ จู้ กั 1. Google.com เปน็ เว็บไซต์ท่ใี ห้สิทธ์ิผูใ้ ช้สามารถคน้ หาข้อมลู ได้ท่ัวโลก ทัง้ ข้อความ ภาพ และวิดโี อด้วยคณุ ลกั ษณะเฉพาะและเทคโนโลยีทชี่ ว่ ยให้การคน้ หาข้อมลู บนโลกออนไลนไ์ ด้งา่ ยยิ่งขน้ึ 2. Youtube.com สาหรับทุกคนท่ีใช้อินเทอร์เนต็ จะตอ้ งรจู้ กั YouTube ได้อย่างแนน่ อน โดยเราก็สามารถมีชอ่ งเพอื่ อัปโหลดวดิ โี อของเราได้เหมอื นกัน ซึง่ ในปจั จบุ ันมีการแขง่ กันทา Content ในรูปแบบวดิ โี อบน YouTube กนั เยอะมากขึน้ เพราะถ้าหากมียอดผ้เู ข้าชมวดิ ีโอถึง 1 ล้านผทู้ ่เี ป็นเจ้าของวิดโี อจะไดเ้ งนิ 30,000 บาท 3. Facebook.com ส่อื สงั คมออนไลน์ท่ีมปี ระโยชนท์ ่ีจะเช่ือมโยงผู้คนจากทุกมุมโลกเข้าไว้ท่ีเดียว เพื่อตดิ ตามเพอื่ น อปั โหลด รปู แชร์ลิงก์และวิดีโอ 4. Baidu.com เปน็ เว็บไซต์ชอื่ ดังของคนจีน สว่ นใหญแ่ ลว้ ผทู้ ่ใี ชง้ านเวบ็ ไซตน์ ี้ก็จะเป็นชาวจีน คือเคร่ืองมือคน้ หา ภาษาจนี ช้ันนาที่จะมอบประสบการณใ์ นการคน้ หาที่งา่ ยและเช่ือถือได้ และเน้ือหามัลติมีเดยี ทีห่ ลากหลายรวมถึง เพลง MP3 และภาพยนตร์ ซึ่งเปน็ รายแรกท่ีนาเสนอเทคโนโลยีโทรศัพทม์ ือถือ WAP และ PDA ในประเทศจีน 5. Wikipedia.org วกิ พิ ีเดียหรือสารานุกรมเสรีออนไลนท์ ่ีมหี ลากหลายภาษา แตบ่ ทความถูกเขียนขึ้นโดยผเู้ ชย่ี วชาญของวิกิ พเี ดยี และไดร้ ับการตรวจสอบภายใต้กระบวนการท่ีเปน็ มาตรฐาน สรา้ งขนึ้ โดยใช้ซอฟต์แวร์ของวกิ ิพเี ดีย 6. Reddit.com

18 เว็บไซตข์ า่ วสงั คม โดยใชผ้ ้ใู ช้นาลิงกข์ ่าวท่นี า่ สนใจมาโพสตห์ รือประชาสัมพนั ธ์ ซง่ึ ผใู้ ชท้ กุ คนสามารถ แสดงความคิดเหน็ และให้คะแนนเรอื่ งราวเหล่านน้ั ได้ ซึง่ กาลังเป็นทีน่ ยิ มอย่างมากในต่างประเทศ 7. Yahoo.com เป็นผู้ให้บรกิ าร Internet Portal รายใหญท่ ี่แสดงผลการคน้ หา, ปรับแตง่ เน้ือหาได้, หอ้ งสนทนา, อีเมล ฟรี และคลบั เป็นต้น 8. Google.co.in เป็นเว็บไซต์ Google ของประเทศอินเดีย เหมือน ๆ กับ Google.co.th ซง่ึ Google ของอนิ เดียกาลงั เป็นเครือ่ งมอื คน้ หายอดนยิ มนี้ โดยสามารถคน้ หาได้ทง้ั เว็บ หรือเฉพาะหนา้ เวบ็ จากอินเดีย อีกทง้ั ยังสามารถค้นหา โดยใชภ้ าษาอังกฤษ ฮินดู ภาษาเบงกาลี ภาษาเตลกู ู ภาษามราฐี และภาษาทมฬิ 9. Qq.com เว็บไซตข์ องผู้ใหบ้ ริการอนิ เทอร์เนต็ ท่ีใหญท่ ่ีสดุ และใชง้ านมากท่ีสุดของจนี อย่าง Tencent กอ่ ตัง้ ขึน้ ใน เดือนพฤศจิกายนปี พ.ศ. 2541 ปัจจุบนั Tencent มงุ่ มน่ั ที่จะใหบ้ ริการทางอินเทอร์เน็ตแบบครบวงจรแก่ผใู้ ช้งาน ในประเทศจีน มที ัง้ QQ Instant Messenger, QQ Mail เปน็ ต้น โดยเป็นแหล่งรวบรวมชมุ ชนท่ีใหญ่ทีส่ ดุ บน อนิ เทอร์เนต็ ของประเทศจนี 10. Amazon.com เว็บไซตท์ เี่ น้นลกู ค้าเปน็ ศูนยก์ ลาง ซ่งึ ลูกคา้ สามารถคน้ พบและค้นหาสิ่งท่ีพวกเขาต้องการซื้อทาง ออนไลนแ์ ละพยายามที่จะเสนอราคาให้ลูกคา้ ไดใ้ นราคาต่าที่สดุ เว็บไซต์มีคุณลกั ษณะและบรกิ ารแบบสว่ นบุคคล มากมาย รวมถงึ การสั่งซอื้ เพยี งคลกิ เดยี ว นอกจากนี้ยังรวบรวมบทวิจารณ์ ผลิตภณั ฑ์ บตั รของขวญั รายชื่อ รา้ นอาหาร ภาพยนตร์ การเดินทาง และการประมวลผลภาพด้วย

19 บทที่ 3 อุปกรณแ์ ละวธิ ดี ำเนนิ งำน การจดั ทาโครงงานเวบ็ ไซตเ์ พ่ือการศึกษา มวี ธิ ีการดาเนินงานโครงงานตามข้นั ตอนตอ่ ไปน้ี 1. วสั ดุอปุ กรณ์ เคร่ืองมือหรือโปรแกรมหรอื ใช้ในการพฒั นา 1.1 เครอื่ งคอมพวิ เตอร์ พร้อมเชอ่ื มต่อระบบเครือข่ายอินเตอรเ์ น็ต 1.2 โปรแกรม Microsoft Word 2013 1.3 เวบ็ ไซตท์ ี่ให้บริการคือ wix.com 1.4 เว็บไซต์ท่ีใชใ้ นการติดตอ่ สื่อสารคอื www.facebook.com , www.gmail.com , www.google.com 2. ขั้นตอนการดาเนินงาน 2.1 คดิ หวั ขอ้ โครงงานเพ่อื นาเสนอครูประจาวิชา 2.2 ศึกษาและค้นคว้าข้อมลู ท่เี กย่ี วข้องกบั เรื่องทนี่ า่ สนใจ คือเรื่องเวบ็ ไซต์และศกึ ษาค้นควา้ เพ่ิมเตมิ เพียงใด จากเว็บไซดต์ า่ งๆ และจัดเกบ็ ขอ้ มลู เพอ่ื จัดทาเนื้อหาต่อไป 2.3 นาเสนอรายงานความกา้ วหน้าให้ครูประจาวิชาได้ตรวจสอบ ซ่ึงครูทปี่ รึกษาจะให้ข้อเสนอต่างๆ เพอ่ื ให้ จัดทาเนื้อหาและการนาเสนอทีน่ า่ สนใจ ทั้งนเ้ี ม่ือได้รบั คาแนะนาก็จะนามาปรบั ปรุงแก้ไขให้เป็นท่นี า่ สนใจเป็น อย่างยิ่ง 2.4 จัดทาโครงงานเพื่อเสนอครูประจาวิชา 2.5 นาเสนอครุประจาวิชา หากเม่ือไดร้ บั คาแนะนาก็จะนามาปรับปรุงแก้ไขให้ดยี ่ิงข้นึ

20 สรำ้ งเว็บไซต์ เข้าไปท่ี wix.com จากน้ันเลือกรปู แบบเวบ็ ไซต์ทีต่ อ้ งการ แนบเวบ็ ไซตข์ องขอ้ สอบต่างๆ เผยแพรเ่ วบ็ ไซต์

21 บทท่ี4 ผลกำรดำเนนิ งำน ผลกำรดำเนนิ งำน การจัดทาโครงงานน้ี มีวัตถปุ ระสงคเ์ พ่ือพัฒนาเวบ็ ไซต์ และคน้ ควา้ เรอ่ื งทส่ี นใจเก่ียวกับการสร้างเว็บไซต์ เพ่ือใหผ้ จู้ ัดทาโครงงานสามารถนามาประยกุ ต์ใชใ้ ห้เขา้ กับการเรียนรขู้ องตนเองมากยง่ิ ข้ึน ตลอดจนสามารถ ติดตอ่ สือ่ สารกันได้ระหว่างครู เพอื่ นและผ้สู นใจทัว่ ไป ซ่ึงมีผลการดาเนนิ งานโครงงาน ดังน้ี 4.1 ผลกำรพัฒนำเวบ็ ไซต์ การพัฒนาเวบ็ ไซต์ (Website) ผจู้ ดั ทาไดเ้ ร่ิมดาเนนิ งานตามข้นั ตอนการดาเนินงานทเี่ สนอในบทท่ี 3 แลว้ จากนัน้ ได้นาเสนอเผยแพรผ่ ลงานผ่านเครือข่ายอนิ เทอร์เน็ต ทสี่ ามารถเขา้ ถึงได้ทกุ ท่ที ุกเวลาซึง่ สามารถ เช่อื มตอ่ กบั ส่ือสงั คมในรปู แบบของ Social Media ท่เี ว็บไซตw์ ix.comทั้งนี้เว็บบล็อกดังกล่าว สามารถจดั การและ เช่อื มตอ่ กบั เวบ็ ไซต์อ่นื ๆ ไดเ้ ป็นอยา่ งดี โดยทั้งครทู ีป่ รกึ ษา เพ่อื นๆในหอ้ งเรยี นไดเ้ ข้าไปมีส่วนร่วมในการจดั การ เรียนรู้ โดยแสดงความเห็นในเนอ้ื หาและรปู แบบของการนาเสนออยา่ งหลากหลาย ซึ่งทาใหเ้ กดิ การเรยี นรู้และเป็น แหลง่ เรยี นรู้ในโลกออนไลน์อย่างหลากหลายและรวดเรว็

22 บทท่ี5 สรปุ อภิปรำยและข้อเสนอแนะ 5.1 กำรดำเนินงำนจดั ทำโครงงำน 5.1.1 วตั ถปุ ระสงคข์ องโครงงาน -เพอ่ื เพ่ิมความสะดวกสบายใหแ้ ก่ครแู ละนักเรยี นทเ่ี ข้าใชง้ าน -เพอ่ื ความสะดวกในการคน้ หาขอ้ สอบในแต่ละปีการศึกษา -ใช้ประโยชน์ในการเรยี นการศึกษา -เพอ่ื เปน็ ประโยชน์กับบคุ คลท่สี นใจท่ัวไป -เพอ่ื เป็นสอื่ ทางการศกึ ษาผ่านเครือข่ายอนิ เทอรเ์ น็ต 5.1.2 วัสดุ อปุ กรณ์ เครื่องมอื หรอื โปรแกรมหรือท่ใี ช้ในการพัฒนา - โปรแกรม Microsoft Word 2013 - เวบ็ ไซต์ท่ีให้บรกิ ารคอื wix.com - เว็บไซตท์ ใี่ ช้ในการตดิ ต่อสื่อสารคือ www.facebook.com , www.gmail.com , www.google.com 5.2 สรปุ ผลกำรดำเนนิ งำนโครงงำน การพัฒนาเวบ็ ไซต์ (Website) ผจู้ ัดทาได้เร่มิ ดาเนนิ งานตามข้นั ตอนการดาเนนิ งานทีเ่ สนอในบทท่ี 3 แล้ว จากนัน้ ไดน้ าเสนอเผยแพร่ผลงานผ่านเครือขา่ ยอนิ เทอรเ์ น็ต ที่สามารถเขา้ ถงึ ไดท้ ุกที่ทกุ เวลาซง่ึ สามารถ เชือ่ มตอ่ กบั ส่ือสงั คมในรปู แบบของ Social Media ท่เี ว็บไซตw์ ix.comทง้ั น้เี วบ็ บล็อกดงั กลา่ ว สามารถจดั การและ เชื่อมต่อกบั เว็บไซต์อน่ื ๆ ไดเ้ ป็นอย่างดี โดยทง้ั ครทู ี่ปรึกษา เพอื่ นๆในห้องเรยี นได้เขา้ ไปมีสว่ นรว่ มในการจดั การ เรยี นรู้ โดยแสดงความเหน็ ในเน้ือหาและรปู แบบของการนาเสนออยา่ งหลากหลาย ซ่ึงทาให้เกดิ การเรียนรู้และเป็น แหล่งเรยี นร้ใู นโลกออนไลนอ์ ย่างหลากหลายและรวดเร็ว

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

24 บรรณานกุ รม บทบาท หน้าท่ี และประโยชน์ของเวบ็ ไซต์ .(ออนไลน์) แหลง่ ท่ีมา: https://www.uds.co.th/article/2019/03/20/web-site/ ความหมายของเว็บไซต์.(ออนไลน์) แหลง่ ทม่ี า: https://sites.google.com/site/supachaichotikitphiwat/khwam-hmay-websit คาศัพท์ของเว็บไซต.์ (ออนไลน์) แหล่งทีม่ า: https://tannyonline.wordpress.com/ 10 อนั ดับเวบ็ ไซต์ที่คนท่วั โลกนิยมเข้าชมในปจั จุบนั ”(ออนไลน์) แหลง่ ที่มา: https://www.ar.co.th/kp/th/368