ขั้นตอนพัฒนาเว็บไซต์

ขั้นตอนกาพัฒนาและออกแบบเว็บไซต์ กระบวนการในการสร้างและออกแบบเว็บจะมีกระบวนการพื้นฐานอยู่ด้วยกัน 5 ขั้นตอนคือ       


1. การวางแผน (Planning)
เป็นขั้นตอนที่ผู้สร้างเว็บจะต้องรวบรวมข้อมูลที่ต้องการจะนำ มาสร้างเว็บ กำหนดวัตถุประสงค์และกลุ่มเป้าหมาย จากนั้นกำหนดขอบเขตและความต้องการของเว็บว่าจะต้องมีอะไรบ้าง เช่น ขนาดของหน้าจอภาพ บราวเซอร์ที่จะใช้ ฯลฯ องค์ประกอบและเครื่องมือที่จะต้องใช้ ต้องการมีกระดานข่าว ห้องสนทนา ฯลฯ รวมถึงขั้นตอนและกระบวนการในการบำรุงรักษาอย่างเป็นระบบ การวางแผนเบื้องต้นของการสร้างเว็บสำหรับ Dreamweaver คือ - กำหนดพื้นที่จัดเก็บเว็บในเครื่องคอมพิวเตอร์ - กำหนดพื้นที่ติดตั้งเว็บเมื่อสร้างเสร็จ

2. การออกแบบ (Design)
เป็นขั้นตอนที่นำข้อมูลและแผนที่วางไว้ไปปฏิบัติ โดยการลง มือปฏิบัติโดยจัดพิมพ์เนื้อหา กำหนดการเชื่อมโยง และคุณลักษณะอื่นที่ต้องใช้ในเว็บ การออกแบบก็จะเน้นที่การจัดหน้าจอของเว็บให้สอดคล้องกันและระมัดระวังปัญหาต่าง ๆ ในการออกแบบ

3. การพัฒนา (Development)
เป็นขั้นตอนที่ต่อเนื่องจากการออกแบบและการสร้าง โดย เน้นไปที่การตกแต่งและเสริมเครื่องมือต่าง ๆ สำหรับเว็บ เช่น การกำหนดสี ภาพ การใช้ Flash ช่วยให้เว็บเร้าความสนใจ และเพิ่มเติมเทคนิคต่าง ๆ ของโปรแกรมสนับสนุนการสร้างเว็บ

4. การติดตั้ง (Publishing)
เป็นขั้นตอนที่จะนำเอาเว็บที่ได้สร้างขึ้นเข้าไปติดตั้งในเว็บ เซอร์เวอร์เพื่อให้แสดงผลได้ในระบบอินเทอร์เน็ต หรือจะเรียกว่า การอับโหลด (Up load) ซึ่งเป็นขั้นตอนที่จะต้องดำเนินการอยู่เสมอเมื่อสร้างเว็บเสร็จ

5. การบำรุงรักษา (Maintenance) เป็นขั้นตอนประเมินผลและติดตามผลการติดตั้งเว็บไซต์ ว่ามีข้อขัดข้องหรือต้องปรับปรุงเปลี่ยนแปลงเว็บเพิ่มเติมให้ทันสมัยอยู่เสมอ อาจจะเรียกได้ว่าขั้นตอนการอับเดท (Up date) การกำหนดรูปแบบเว็บไซต์ (Web-site) เว็บไซต์ (Web-site) หมายถึง เว็บที่ประกอบด้วยเว็บเพจหลาย ๆ เว็บเพจมารวมกัน อยู่ภายในพื้นที่เดียวกันและเชื่อมโยงระหว่างกันภายใต้โดเมนเนมเดียวกัน โดยมีโฮมเพจเป็นหน้าแรกของเว็บไซต์ทำหน้าที่เชื่อมโยงไปยังเว็บเพจต่าง ๆ

โฮมเพจ (Homepage)
 หมายถึง เว็บเพจที่เป็นหน้าแรกของเว็บไซต์ ที่เข้าถึงได้ทันทีเมื่อเข้าสู่ระบบอินเทอร์เน็ตโดยการพิมพ์โดเมนเนมหรือยูอาร์แอลซึ่งเป็นที่ติดตั้งของเว็บไซต์

เว็บเพจ (Web page)
 หมายถึง เอกสารที่สร้างขึ้นโดยในรูปแบบของ HTML หรือโปรแกรมการสร้างเว็บโดยเฉพาะ จะแสดงผลได้เฉพาะโปรแกรมบราวเซอร์ และต้องติดตั้งในเว็บเซอร์เวอร์เพื่อเข้าไปอ่านข้อมูลได้โดยผ่านระบบอินเทอร์เน็ต เว็บเพจจะมี 2 ลักษณะใหญ่คือ - เว็บเพจแบบหน้าเดียว (Single page) หรือแบบสั้น (Short page) หมายถึง เว็บเพจที่แสดงผลข้อมูลหรือเนื้อหาเพียงหน้าเดียวมีขนาดเท่ากับหน้าจอคอมพิวเตอร์พอดี หรือมีแถบเลื่อนลงมาด้านล่างสั้น ๆ หรือมีรูปแบบเป็นกรอบพอดีหน้าจอภาพ - เว็บเพจแบบแถบเลื่อน (Scroll page) หรือแบบยาว (Long page) หมายถึง เว็บเพจที่แสดงผลข้อมูลหรือเนื้อหาเป็นแนวยาวจากด้านบนลงมายังด้านล่างของหน้าจอภาพ โดยมีแถบเลื่อนอยู่ด้านข้างสำหรับเลื่อนหน้าจอภาพ เพื่อดูข้อมูลที่แสดงผลหน้าจอภาพ
การออกแบบโครงสร้างเว็บ สิ่งที่ต้องพิจารณาในการสร้างเว็บเพื่อการศึกษาคือ โครงสร้างหลักของเว็บ เนื่องจากการจัดการข้อมูลเพื่อการเรียนการสอนมีความแตกต่างกัน กลุ่มผู้เรียนที่แตกต่างและเนื้อหาของเว็บแตกต่างกัน โครงสร้างของเว็บก็จะมีผลต่อการเรียนการสอนเช่นกัน (McCormack and Jones, 1998) โครงสร้างของเว็บโดยพื้นฐานจะมี 2 ลักษณะคือ       

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

เพิ่มเติ่ม : http://krumax.maesai.ac.th/unit2/u2.htm


องค์ประกอบที่ควรมีในเว็บเพจ

องค์ประกอบทั่วไป 
1. ชื่อของเว็บเพจ (Title) 
2. ประวัติและรูปภาพผู้จัดทำ (Profile/Picture) 
3. การเชื่อมโยงภายในและภายนอกเว็บ (Links) 
4. การแสดงที่อยู่ของเว็บ : URL 
5. วัน/เวลาที่สร้างเว็บ (Date/Time)
6. การปรับปรุงครั้งล่าสุด (Update) 
7. ผู้จัดทำเว็บ : (created by) 
8. การสงวนลิขสิทธิ์ (Copy right) 
9. การติดต่อผู้จัดทำเว็บ (contract /e-mail) 
10. สถานที่ติดต่อของเว็บ (Address) 
11. บราวเซอร์ที่เหมาะสมสำหรับการชม (Browser )
12. ขนาดหน้าจอที่เหมาะสมในการชม (Bested View) 
13. คำถามที่ถูกถามบ่อย FAQ (Frequency Asked Question) 
14. ความช่วยเหลือ (Help)

องค์ประกอบพิเศษ
1. สมุดเยี่ยม (Guest book) 
2. ฝากข้อความ (Web board) 
3. กระดานข่าว (Bulletin Board) 
4. กระทู้ ( Webboard ) 
5. แบบสำรวจ (Web poll) 
6. จำนวนผู้เข้าชม (Counter) 
7. ห้องสนทนา (Chat Room) 
8. สถิติทุกประเภท (Web state) 
9. เทคนิคพิเศษด้วยโปรแกรมสคริปต์ (Java script, VBscript , cgi,asp,php) 
10. โปรแกรมพิเศษสนับสนุน (Download) 
11. สไลด์สรุปบรรยาย (Presentation)


ขอบขอบคุณเนื้อหาและลิงค์เว็บมา ณ ที่นี่
ที่มา : http://www.gotoknow.org/