หลักการออกแบบเว็บไซต์
- 3. การวางแผน 1) กำหนดเนื้อหำ ก่อนทำเว็บเรำจะต้องรู้ว่ำเรำจะทำเว็บเกี่ยวกับ อะไร เนื้อหำเป็นอย่ำงไร กลุ่มเป้ำหมำยเป็นกลุ่มใด ทั้งนี้เพื่อที่จะได้ นำเนื้อหำ เหล่ำนั้นมำใส่ในเว็บเพื่อแสดงให้รู้ว่ำ เนื้อหำโดยรวม เกี่ยวกับอะไรบ้ำง 2) ออกแบบมุมมองหน้ำเว็บ (Layout) เป็นกำรจัดวำง องค์ประกอบในเว็บเพจว่ำส่วนใดควรจะมีอะไร โดยกำรร่ำงใส่ กระดำษเปล่ำ ๆ ไว้ก่อนหรือใช้โปรแกรมคอมพิวเตอร์ช่วยในกำร ออกแบบก็ได้ สำมำรถใช้ตำรำงช่วยในกำรจัดองค์ประกอบในหน้ำ เว็บนั้น ซึ่งจะทำให้เว็บเพจมีควำมเป็นระเบียบยิ่งขึ้น และสะดวก ต่อกำรแก้ไข ปรับปรุงต่อไป
- 4. การเตรียมการ • 1) กำรเตรียมกำรด้ำนข้อมูล เช่นเนื้อหำ ภำพ เสียง หรือสิ่งจำเป็นต่ำงๆ ที่คิด ว่ำต้องกำรจะนำเสนอในกำรทำเว็บเพจนั้น เมื่อเรำรู้แล้วว่ำเรำจะทำเว็บ เกี่ยวกับอะไร • 2) กำรรวบรวมข้อมูล เช่น ถ้ำจะทำเว็บ เกี่ยวกับโรงเรียน ก็ต้องไปหำคติพจน์ ประจำโรงเรียน สีประจำโรงเรียน บุคลำกรในโรงเรียน ประวัติโรงเรียน ฯลฯ มำ รวบรวมไว้เพื่อจัดรูปแบบต่อไป • 3) กำรหำเครื่องมือในกำรจัดทำ หมำยถึงโปรแกรมกำรทำงำนต่ำง ๆ เช่น โปรแกรมจัดกำรรูปภำพ เสียง ภำพเคลื่อนไหวต่ำงๆ โปรแกรมในกำรจัดทำเว็บ เพจเป็นต้น
- 5. การสร้างและออกแบบเว็บเพจ • เมื่อวางแผนและเตรียมการเรียบร้อยแล้ว ก็ถึงเวลา จัดสร้างเว็บเพจ ซึ่งอาจจะทาคนเดียวหรือทาเป็นกลุ่มก็ ได้ โดยใช้เครื่องมือที่เตรียมไว้ ซึ่งมีขั้นตอน ดังนี้
- 6. • 1) กาหนดโครงสร้างของเว็บไซต์ การสร้างเว็บไซต์นั้น ควรเริ่มจากการสร้างแผนผังของเว็บไซต์ก่อน หรือที่ เรียกว่า Site Map ซึ่งสามารถเขียนแผนผังออกมาเพื่อกาหนดจานวนหน้าเว็บ เพจที่ต้องการ หน้าเว็บเพจ-1 (โฮมเพจ) index.html หน้าเว็บเพจ-2 ลงทะเบียน reg.html หน้าเว็บเพจ-3 รายชื่อชุมนุม list.html หน้าเว็บเพจ-4 เช็ครายชื่อ ck.html
- 7. กาหนดการเชื่อมโยงระหว่างเว็บเพจ • เป็นการกาหนดการเชื่อมโยงให้เว็บเพจแต่ละหน้าให้เชื่อมโยงถึงกันระหว่าง หน้าต่าง ๆ ได้โดยแสดงชื่อไฟล์ HTML แต่ละไฟล์ที่มีการเชื่อมโยงสัมพันธ์แต่ละ ไฟล์อย่างชัดเจน index.html history.html list.html about.html vision.html ck.html ckhis.html food.html room.html phu.html
- 8. การออกแบบเว็บเพจแต่ละหน้า เป็นการออกแบบหน้าเว็บเพจแต่ละหน้า หรือเลย์เอาท์ (Lay Out) ให้สวยงาม โดยเฉพาะในเว็บเพจหน้าแรก ซึ่งเรียกว่า “โฮมเพจ” นั้น สามารถออกแบบให้สวยงาม เพื่อดึงดูดความสนใจของผู้เข้าชม โดยการเขียนลงในกระดาษ หรือใช้โปรแกรม คอมพิวเตอร์ช่วยในการออกแบบก็ได้
- 9. หน้าหลัก ประวัติ แหล่งท่องเที่ยว ร้านอาหาร ที่พัก ข่าวท่องเที่ยว ติดต่อเรา ชื่อเว็บไซต์ Logo เมนู Link ที่อยู่ ที่ติดต่อ อีเมล์ รูป และข้อความ กำรออกแบบเว็บเพจแต่ละหน้ำ
- 10. การสร้างเว็บเพจแต่ละหน้า • เป็นการนาเว็บเพจที่ออกแบบไว้มาสร้างโดยใช้ภาษา html หรืออาจใช้โปรแกรม สาเร็จรูป เช่น FrontPage, Macromedia Dreamweaver หรือโปรแกรมสาเร็จรูปอื่น ๆ ตามความถนัด
- 11. ทดสอบและการแก้ไขข้อบกพร่อง • กำรสร้ำงเว็บควรจะมีกำรทดสอบก่อนเผยแพร่ทุกครั้ง เพื่อตรวจสอบ ควำมถูกต้องของกำรแสดงผล โดยทดสอบที่เครื่องของตัวเอง ด้วย โปรแกรมเว็บบรำวเซอร์ที่ใช้อ่ำนข้อมูลภำษ html เช่น Internet Explorer, Firefox, Google Chrome เป็นต้น พร้อมทั้งสำมำรถอัพ โหลดขึ้นไปยังที่จัดเก็บเว็บเพจเพื่อหำข้อบกพร่องและนำมำแก้ไข ต่อไป
- 12. การนาเว็บเพจต่าง ๆ มารวบรวมเป็นเว็บไซต์ • เมื่อสร้างเว็บเพจเสร็จ จัดรวบรวม และเรียบเรียงหน้าเว็บเพจแต่ละหน้า ทาการทดสอบ แก้ไขปรับปรุงเสร็จแล้ว ก็สามารถเผยแพร่เว็บเพจทั้งหมดสู่ สาธารณชนในรูปแบบของเว็บไซต์ได้
- 13. ลงทะเบียนขอพื้นที่เว็บไซต์ • เป็นกำรเผยแพร่เว็บไซต์ที่สร้ำงเสร็จแล้วสู่ระบบเครือข่ำย อินเทอร์เน็ต เพื่อให้บุคคลอื่น ๆ สำมำรถเข้ำชมเว็บไซต์ของเรำ ได้ วิธีกำรก็คือ นำเว็บไซต์ที่เรำสร้ำงขึ้นไปไว้บนพื้นที่ที่ให้บริกำร (Web Hosting) ซึ่งมีพื้นที่ ที่ให้บริกำรฟรีและแบบที่ต้องเสีย ค่ำบริกำร ตัวอย่ำงเว็บ host ที่ให้พื้นที่ฟรี เช่น google site เป็นต้น