หลักการออกแบบเว็บไซต์

สรุปหลักการออกแบบเว็บไซต์

การกำหนดขนาดเว็บเพจ

ขนาดของเว็บไซต์ที่นิยมในปัจจุบันมี 2 ขนาด คือ

1.      ขนาดเว็บไซต์แบบ 800 X 600 pixels เป็นขนาดที่สามารถใช้ได้กับหน้าจอทุกขนาดในปัจจุบันเป็นขนาดของการออกแบบเว็บไซต์ที่ใช้ในอดีต เนื่องจากอดีตขนาดของจอคอมพิวเตอร์มีขนาดเล็ก

2.       ขนาดเว็บไซต์แบบ 1024 X 768 pixels เป็นขนาดที่นิยมในปัจจุบัน เนื่องจากผู้ใช้นิยมใช้จอคอมพิวเตอร์ขนาดใหญ่ขึ้นเนื่องมาจากราคาจอคอมพิวเตอร์ที่ถูกลง

รูปแบบการออกแบบเว็บไซต์

          เว็บไซต์ในปัจจุบันจะมีการออกแบบที่แตกต่างกันไม่มากนัก ซึ่งการออกแบบหน้าตาเว็บไซต์ส่วนใหญ่จะมองดูองค์ประกอบขององค์กร หน่วยงาน หรือเนื้อหาเรื่องที่นำเสนอเป็นหลัก ซึ่งการออกแบบหน้าตของเว็บไซต์มีอยู่ 3 แบบ คือ

1.     การออกแบบเว็บไซต์ที่เน้นการนำเสนอเนื้อหา

เป็นการออกแบบเว็บไซต์ที่เน้นการนำเสนอเนื้อหามากกว่ารูปภาพ โดยโครงสร้างใช้รูปแบบตารางเป็นหลัก มีการออกแบบหน้าตารูปแบบง่าย

2.     การออกแบบเว็บไซต์ที่เน้นภาพกราฟิก

เป็นการออกแบบเว็บไซต์ที่เน้นภาพกราฟิกที่สวยงาม ซึ่งอาจจะใช้โปรแกรม Photoshop สำหรับการตกแต่งภาพ ข้อดี สวยงาม น่าสนใจ ข้อเสีย อาจจะใช้เวลาในการโหลดเว็บนาน

3.     การออกแบบเว็บไซต์ที่มีทั้งภาพและเนื้อหา

เป็นการออกแบบเว็บที่นิยมในปัจจุบันซึ่งประกอบด้วยข้อความ รูปภาพ โดยมีการจัดองค์ประกอบต่าง ๆ เพื่อให้เว็บน่าสนใจ

การออกแบบโครงสร้างเว็บไซต์

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

หลักในการออกแบบโครงสร้างเว็บไซต์ ควรพิจารณาดังนี้

1.      กำหนดวัตถุประสงค์ โดยพิจารณาว่าเป้าหมายของการสร้างเว็บไซต์นี้ทำเพื่ออะไร

2.      ศึกษาคุณลักษณะของผู้ที่เข้ามาใช้ว่ากลุ่มเป้าหมายใดที่ผู้สร้างต้องการสื่อสาร ข้อมูลอะไรที่พวก เขาต้องการโดยขั้นตอนนี้ควรปฏิบัติควบคู่ไปกับขั้นตอนที่หนึ่ง

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

4.      กำหนดรายละเอียดให้กับโครงสร้าง ซึ่งพิจารณาจากวัตถุประสงค์ที่ตั้งไว้ โดยตั้งเกณฑ์ในการใช้  เช่น ผู้ใช้ควรทำอะไรบ้าง จำนวนหน้าควรมีเท่าใด มีการเชื่อมโยง มากน้อยเพียงใด

5.      หลังจากนั้น จึงทำการสร้างเว็บไซต์แล้วนำไปทดลองเพื่อหาข้อผิดพลาดและทำการแก้ไขปรับปรุง แล้วจึงนำเข้าสู่เครือข่ายอินเทอร์เน็ตเป็นขั้นสุดท้าย

องค์ประกอบที่ดีของการออกแบบเว็บไซต์

1.      โครงสร้างที่ชัดเจน ผู้ออกแบบเว็บไซต์ควรจัดโครงสร้างหรือจัดระเบียบของข้อมูลที่ชัดเจน แยกย่อยเนื้อหาออกเป็นส่วนต่าง ๆ

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

3.      การเชื่อมโยงที่ดี ลักษณะไฮเปอร์เท็กซ์ที่ใช้ในการเชื่อมโยง ควรอยู่ในรูปแบบที่เป็นมาตรฐาน ทั่วไปและต้องระวังเรื่องของตำแหน่งในการเชื่อมโยง การที่จำนวนการเชื่อมโยงมากและกระจัดกระจายอยู่ทั่วไปในหน้าอาจก่อให้เกิดความสับสน นอกจากนี้คำที่ใช้สำหรับการเชื่อมโยงจะต้องเข้าใจง่ายมีความชัดเจนและไม่สั้นจนเกินไป

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

5.      ความรวดเร็ว ความรวดเร็วเป็นสิ่งสำคัญประการหนึ่งที่ส่งผลต่อการเรียนรู้ ผู้ใช้จะเกิดอาการเบื่อหน่ายและหมดความสนใจกับเว็บที่ใช้เวลาในการแสดงผลนาน

โครงสร้างของเว็บไซต์

1.      เว็บที่มีโครงสร้างแบบเรียงลำดับ (Sequential Structure)

เป็นโครงสร้างแบบธรรมดาที่ใช้กันมากที่สุดเนื่องจากง่ายต่อการจัดระบบข้อมูล ข้อมูลที่นิยม จัดด้วยโครงสร้างแบบนี้มักเป็นข้อมูลที่มีลักษณะเป็นเรื่องราวตามลำดับของเวลา

2.     เว็บที่มีโครงสร้างแบบลำดับขั้น (Hierarchical Structure)

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

3.     เว็บที่มีโครงสร้างแบบตาราง (Grid Structure)

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

ในการจัดระบบโครงสร้างแบบนี้ เนื้อหาที่นำมาใช้แต่ละส่วนควรมีลักษณะที่เหมือนกัน และ สามารถใช้รูปแบบร่วมกัน หลักการออกแบบคือนำหัวข้อทั้งหมดมาบรรจุลงในที่เดียวกันซึ่งโดยทั่วไป จะเป็นหน้าแผนภาพ (Map Page) ที่แสดงในลักษณะเดียวกับโครงสร้างของเว็บ เมื่อผู้ใช้คลิกเลือก หัวข้อใด ก็จะเข้าไปสู่หน้าเนื้อหา (Topic Page) ที่แสดงรายละเอียดของหัวข้อนั้นๆ และภายในหน้านั้น ก็จะมีการเชื่อมโยงไปยังหน้ารายละเอียดของหัวข้ออื่นที่เป็นเรื่องเดียวกัน

4.     เว็บที่มีโครงสร้างแบบใยแมงมุม (Web Structure)

โครงสร้างประเภทนี้จะมีความยืดหยุ่นมากที่สุด ทุกหน้าในเว็บสามารถจะเชื่อมโยงไปถึงกัน ได้หมด เป็นการสร้างรูปแบบการเข้าสู่เนื้อหาที่เป็นอิสระ ผู้ใช้สามารถกำหนดวิธีการเข้าสู่เนื้อหาได้ด้วย ตนเอง การเชื่อมโยงเนื้อหาแต่ละหน้าอาศัยการโยงใยข้อความที่มีมโนทัศน์ (Concept) เหมือนกัน ของแต่ละหน้าในลักษณะของไฮเปอร์เท็กซ์หรือไฮเปอร์มีเดีย โครงสร้างลักษณะนี้จัดเป็นรูปแบบที่ ไม่มีโครงสร้างที่แน่นนอนตายตัว (Unstructured)

ลักษณะการเชื่อมโยงในเว็บนั้น นอกเหนือจากการใช้ไฮเปอร์เท็กซ์หรือไฮเปอร์มีเดีย กับข้อความที่มีมโนทัศน์ (Concept) เหมือนกันของแต่ละหน้าแล้ว ยังสามารถใช้ลักษณะการเชื่อมโยง จากรายการที่รวบรวมชื่อหรือหัวข้อของเนื้อหาแต่ละหน้าไว้ ซึ่งรายการนี้จะปรากฏอยู่บริเวณใด บริเวณหนึ่งในหน้าจอ ผู้ใช้สามารถคลิกที่หัวข้อใดหัวข้อหนึ่งในรายการเพื่อเลือกที่จะเข้าไปสู่หน้าใดๆ ก็ได้ตามความต้องการ ข้อดีของรูปแบบนี้คือง่ายต่อผู้ใช้ในการท่องเที่ยวบนเว็บ

องค์ประกอบของการออกแบบเว็บไซต์

1.     ความเรียบง่าย (Simplicity)

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

2.     ความสม่ำเสมอ ( Consistency)

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

3.     ความเป็นเอกลักษณ์ (Identity)

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

4.     เนื้อหา (Useful Content)

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

5.     ระบบเนวิเกชั่น (User-Friendly Navigation)

เป็นส่วนประกอบที่มีความสำคัญต่อเว็บไซต์มาก เพราะจะช่วยไม่ให้ผู้ใช้เกิดความสับสนระหว่างดูเว็บไซต์ ระบบเนวิเกชั่นจึงเปรียบเสมือนป้ายบอกทาง

6.     คุณภาพของสิ่งที่ปรากฏให้เห็นในเว็บไซต์ (Visual Appeal)

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

7.     ความสะดวกของการใช้ในสภาพต่าง ๆ (Compatibility)

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

8.     ความคงที่ในการออกแบบ (Design Stability)

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

9.     ความคงที่ของการทำงาน (Function Stability)

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

ขั้นตอนการสร้างเว็บไซต์

          ขั้นตอนที่ 1 การวางแผนการจัดทำเว็บไซต์

เป็นขั้นตอนแรกของการออกแบบเว็บ เนื่องจากเราต้องกำหนดชื่อเรื่อง เนื้อหา และรายละเอียดของเว็บที่เราจะจัดทำเพื่อให้เห็นมุมมองคร่าว ๆ ก่อนจะลงมือสร้างเว็บไซต์ นอกจากนี้เรายังต้องทำการแบ่งเนื้อหาเป็นหมวดหมู่ต่าง ๆ ตามลำดับก่อน-หลัง เพื่อให้ง่ายต่อการจัดทำโครงร่างของเว็บ

ขั้นตอนที่ 2 การกำหนดโครงสร้างของเว็บ

 เป็นขั้นตอนในการกำหนดผังของเว็บ เพื่อให้ทราบองค์ประกอบทั้งหมดของเว็บ ตัวอย่างดังรูป

ข้อสังเกต

1.      หน้าแรกของเว็บ หรือโฮมเพจ จะต้องชื่อ index ส่วนนามสกุลให้ใส่ตามลักษณะของภาษาที่ใช้ในการสร้างเว็บ

2.      การตั้งชื่อเว็บเพจแต่ละหน้าเวลาให้กำหนดชื่อเป็นภาษาอังกฤษตามด้วยนามสกุลของภาษาที่เราสร้างเว็บ เช่น index.html, home.html, history.html เป็นต้น

ขั้นตอนที่ 3 การกำหนดการเชื่อมโยงเว็บเพจ

การกำหนดการเชื่อมเว็บเพจ เป็นการกำหนดความสัมพันธ์ของการเชื่อมโยงในแต่ละหน้าเว็บเพื่อให้สามารถกลับไปกลับมาระหว่างหน้าต่าง ๆ ได้ โดยแต่ละไฟล์จะมีความสัมพันธ์กัน ตัวอย่างดังรูป

ขั้นตอนที่ 4 การตั้งชื่อไฟล์และโฟลเดอร์

1. การสร้างโฟลเดอร์

การสร้างโฟลเดอร์ให้สร้างเป็นชื่อหน่วยงาน / เรื่องนั้น ๆ ควรใช้ตัวอักษร ภาษาอังกฤษตัวพิมพ์เล็ก หรือผสมกับตัวเลข 0-9 เช่น swt คือ โรงเรียนเสริมงามวิทยาคม จากนั้นข้างในโฟลเดอร์ swt ให้เราสร้างโฟลเดอร์เก็บรูปภาพ พื้นหลัง ไฟล์เสียง ไฟล์วีดีโอ หรือโฟลเดอร์อื่นเป็นชื่อภาษาอังกฤษ เช่น pic คือโฟลเดอร์เก็บรูปภาพ, bg คือ โฟลเดอร์เก็บพื้นหลัง เป็นต้น

2. การตั้งชื่อไฟล์

การตั้งชื่อไฟล์ให้ตั้งชื่อและนามสกุลไฟล์เป็นตัวอักษร ภาษาอังกฤษตัวพิมพ์เล็ก หรือผสมกับตัวเลข 0-9 หรือเครื่องมือขีดลบ/ขีดล่าง  และตั้งชื่อไฟล์ให้ตรงกับเรื่องนั้น ๆ เช่น history.html คือ ประวัติของโรงเรียน, person.html คือ บุคลากรของโรงเรียน เป็นต้น

ขั้นตอนที่ 5 การออกแบบเว็บเพจแต่ละหน้าในเว็บไซต์

ส่วนประกอบของเว็บไซต์ที่ดี

โครงสร้างของเว็บไซต์โดยจะมีส่วนหลักๆอยู่ด้วยกันทั้งหมด 3 ส่วนหลัก ๆ ดังนี้

1. ส่วนหัวของหน้า (Page Header)

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

- โลโก้ (Logo) เป็นสิ่งที่เว็บไซต์ควรมี เป็นตัวแทนของเว็บไซต์ได้เป็นอย่างดี และยังทำให้เว็บน่าเชื่อถือ

- ชื่อเว็บไซต์

- เมนูหลักหรือลิงค์ (Navigation Bar) เป็นจุดเชื่อมโยงไปสู่เนื้อหาของเว็บไซต์

2. ส่วนของเนื้อหา (Page Body)

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

สำหรับส่วนเนื้อหาควรแสดงใจความสำคัญที่เป็นหัวเรื่องไว้บนสุด ข้อมูลมีความกระชับ ใช้รูปแบบตัวอักษรที่อ่านง่าย และจัด Layout ให้เหมาะสมและเป็นระเบียบ

3. ส่วนท้ายของหน้า (Page Footer)

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

ขั้นตอนที่ 6 การสร้างเว็บเพจ

เมื่อจัดวางองค์ประกอบของเว็บแต่ละหน้าแล้ว ต่อไปคือขั้นตอนการเขียนเว็บด้วยโปรแกรมภาษา HTML เพื่อกำหนดให้แต่ละหน้าเว็บเพจนำเสนอข้อความ รูปภาพ วีดีโอ และเสียง ให้อยู่ในรูปแบบการที่ต้องการ

ขั้นตอนที่ 7 การลงทะเบียนขอพื้นที่เว็บไซต์

เมื่อทำการออกแบบและสร้างเว็บไซต์เสร็จแล้ว ขั้นตอนต่อไป คือ การเผยแพร่เว็บไซต์สู่โลกของอินเทอร์เน็ตให้คนอื่นเข้ามาเยี่ยมชม วิธีการ คือ การนำเว็บไซต์ไปฝากกับผู้ให้บริการพื้นที่เว็บไซต์ทั้งแบบเสียค่าใช้จ่ายหรือบริการ และแบบพื้นที่เว็บไซต์ฟรี ซึ่งวันนี้เราจะขอแนะนำเว็บไซต์ที่ให้บริการฟรีพื้นที่ฝากเว็บ คือ http://www.thcity.com

ขั้นตอนที่ 8 การอัพโหลดเว็บไซต์

เมื่อเราทำการสมัครบริการพื้นที่ฝากเว็บแล้ว ขั้นตอนต่อไป คือการอัพโหลดไฟล์เว็บไซต์ของเราไปยังเว็บไซต์ที่ให้บริการพื้นที่ฝากเว็บซึ่งอาจจะทำการอัพโหลดผ่านเว็บบราวเซอร์เว็บที่ให้บริการ หรือการอัพโหลดด้วยโปรแกรม เช่น CuteFTP, Filezilla, WS_FTP เป็นต้น เพื่อให้ผู้คนได้เข้าเยี่ยมชมโดยสามารถดูในเว็บไซต์ของเราผ่านเครือข่ายอินเทอร์เน็ต

ขั้นตอนที่ 9 การเรียกดูเว็บไซต์

เมื่อเราทำการอัพโหลดไฟล์เว็บไซต์ของเราขึ้นบนเว็บไซต์ที่ให้บริการพื้นที่ฝากเว็บแล้ว เราสามารถเปิดดูเว็บไซต์ของเราผ่านโปรแกรมเว็บบราวเซอร์ เช่น Internet Explorer, Mozilla Firefox, Google Chrome เป็นต้น โดยการพิมพ์ที่อยู่เว็บไซต์ตรง Address Bar เช่น http://www/.swt.ac.th เป็นต้น

สรุปและทำแบบฝึกหัดท้ายบท

สรุปการออกแบบระบบเนวิเกชั่นสำหรับเว็บ

Designing Web Navigation

ความสำคัญของระบบเนวิเกชั่น

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

          ระบบเนวิเกชั่นนั้นอาจประกอบด้วยองค์ประกอบหลายๆ อย่าง เช่นเนวิเกชันบาร์ หรือ pop-up menu ซึ่งมักจะมีอยู่ในทุกๆ หน้าของเว็บเพจ และอาจอยู่ในหน้าเฉพาะที่มีรูปแบบป็นระบบสารบัญ ระบบดัชนี หรือ site map ที่สามารถให้ผู้ใช้คลิกผ่านโครงสร้างข้อมูลไปยังส่วนอื่นๆได้ การเข้าใจถึงรูปแบบและองค์ประกอบของระบบเนวิเกชั่นเหล่านี้ จะทำให้คุณออกแบบระบบเนวิเกชันด้วยองค์ประกอบที่เหมาะสมได้อย่างมีประสิทธิภาพ

รูปแบบของระบบเนวิเกชั่น      

          แบ่งเป็น 4 รูปแบบ

                    ระบบเนวิเกชั่นแบบลำดับชั้น (Hierarchical)

                    ระบบเนวิเกชั่นแบบโกลบอล (Global)

ระบบเนวิเกชั่นแบบโลคอล (Local)

                    ระบบเนวิเกชั่นเฉพาะที่ (Ad Hoc)

ระบบเนวิเกชั่นแบบลำดับชั้น (Hierarchical)

เป็นระบบเนวิเกชั้นพื้นฐาน

     มีการเชื่อมโยงตามลำดับชั้นของข้อมูล

               หัวข้อหลัก à หัวข้อย่อย à รายละเอียด

     มีข้อจำกัดในการเคลื่อนที่เฉเพาะแนวตั้ง

ระบบเนวิเกชั่นแบบโกลบอล (Global)

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

Global Navigation

                                       

ระบบเนวิเกชั่นแบบโกลบอล (Global)

จากผลการศึกษาพบว่าตำแหน่งที่ดีที่สุดสำหรับเนวิเกชั่นบาร์คือด้านบนสุดหรือล่างสุดของหน้าเว็บ

ระบบเนวิเกชั่นแบบโลคอล (Local)

เป็นระบบเนวิเกชั้นที่ใช้ลิงค์ไปยังรายละเอียดย่อยๆ ภายในหัวข้อหลักนั้นๆ  โดยจะเหมาะสำหรับเว็บไซท์ที่มีรายละเอียดและมีรายการหัวข้อที่ซับซ้อน

ระบบเนวิเกชั่นแบบโลคอล (Local)

 ตอบคำถามต่อไปนี้

ความสำคัญของระบบเนวิเกชั่น?

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

          ระบบเนวิเกชั่นนั้นอาจประกอบด้วยองค์ประกอบหลายๆ อย่าง เช่นเนวิเกชันบาร์ หรือ pop-up menu ซึ่งมักจะมีอยู่ในทุก ๆ หน้าของเว็บเพจ และอาจอยู่ในหน้าเฉพาะที่มีรูปแบบป็นระบบสารบัญ ระบบดัชนี หรือ site map ที่สามารถให้ผู้ใช้คลิกผ่านโครงสร้างข้อมูลไปยังส่วนอื่น ๆได้ การเข้าใจถึงรูปแบบและองค์ประกอบของระบบเนวิเกชั่นเหล่านี้ จะทำให้คุณออกแบบระบบเนวิเกชันด้วยองค์ประกอบที่เหมาะสมได้อย่างมีประสิทธิภาพ

ระบบเนวิเกชั่นแบบลำดับชั่น?

เป็นระบบเนวิเกชั้นพื้นฐาน

 มีการเชื่อมโยงตามลำดับชั้นของข้อมูล

 หัวข้อหลัก à หัวข้อย่อย à รายละเอียด

 มีข้อจำกัดในการเคลื่อนที่เฉเพาะแนวตั้ง

ระบบเนวิเกชั่นแบบโกลบอล?

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

ระบบเนวิเกชั่นแบบโลบอล?

เป็นระบบเนวิเกชั้นที่ใช้ลิงค์ไปยังรายละเอียดย่อยๆ ภายในหัวข้อหลักนั้น ๆ  โดยจะเหมาะสำหรับเว็บไซท์ที่มีรายละเอียดและมีรายการหัวข้อที่ซับซ้อน

ระบบเนวิเกชั่นเฉพาะที่?

      เป็นระบบเนวิเกชั่นเฉพาะที่ตามความจำเป็นของเนื้อหา ซึ่งก็คือลิงค์ของคำหรือข้อความที่น่าสนใจซึ่งประกอบอยู่ในประโยค

Navigation Bar?

       เป็นระบบเนวิเกชั่นพื้นฐานที่ใช้ได้หลายรูปแบบ ทั้งแบบลำดับชั้น, แบบโกลบอล และแบบโลคอล
โดย Navigation Bar จะประกอบด้วยกลุ่มของลิงค์ต่างๆ ที่อยู่รวมกันในบริเวณหนึ่งของหน้าเว็บไซท์

Frame Based?

         เป็นระบบเนวิเกชั่นที่อาศัยระบบเฟรมมาช่วยแบ่งพื้นที่ในหารแสดงข้อมูล และข้อมูลในแต่ละเฟรมเป็นอิสระจากกัน  โดยจะมีเฟรมที่มีระบบ Navigation ที่สามารถควบคุมการแสดงผลข้อมูลในอีกเฟรมหนึ่งได้

Pull-Down Menu?

คือ การแสดงผลในรูปแบบของการนำเมาส์ชี้ที่เมนูหลัก จะปรากฏเมนูย่อยให้เลือกคลิก คล้ายกับเมนูคำสั่งในระบบ Windows

มีจุดเด่นคือ

- มีรายการให้เลือกมากแต่ใช้พื้นที่น้อย

- ช่วยให้ผู้ใช้เลือกรายการย่อยเข่าสู่เป้าหมายได้สะดวก

- เหมาะสำหรับข้อมูลประเภทเดียวกันที่มีจำนวนมากๆ

Pop-Up Menu?

    คือ หน้าต่าง window เล็ก ๆ ที่โดดขึ้นมา หรือผลุบโผล่ขึ้นมา เวลาเปิดหน้าเว็ปขึ้นมา อาจจะเป็นการโฆษณาขายสินค้า หรือข่าวสารต่างๆ

มีจุดเด่นคือ

 -หน้าเว็บเพจไม่รกจนเกินไปด้วยลิงค์จำนวนมาก

- ประหยัดพื้นที่ในการแสดงรายการย่อยของเมนู

Image Map?

-ใช้ภาพกราฟิกในการลิงค์ โดยกำหนดขอบเขตของพื้นที่ต่างๆ ที่สามารถลิงค์ได้บนภาพกราฟิกนั้น

-ควรมีคำอธิบายในส่วนของ ALT (Alternate Text)

-ไม่ควรใช้ระบบเนวิเกชั่นแบบ Image Map ทั้งเว็บไซท์

Search Box?

        มีประโยน์สำหรับเว็บไซท์ที่มีข้อมูลปริมาณมาก ซึ่งผู้ใช้สามารถเข้าถึงข้อมูลได้โดยการระบุคีย์เวิร์ดที่ต้องการค้นหา ผ่านระบบ Search Engine ของเว็บไซท์ เพื่อให้แสดงรายการต่างๆ ที่ค้นพบ

ระบบผู้เชี่ยวชาญ

ระบบผู้เชี่ยวชาญ (Expert Systems : ES)

            ในปัจจุบันมีผู้กล่าวขานถึงระบบผู้เชี่ยวชาญ (EXPERT SYSTEM:ES) และปัญญาประดิษฐ์ (ARTIFICIAL INTELIGENCE : AL) กันมากขึ้นทุกขณะ จนบางครั้งเรายากที่หาความแตกต่างเนื่องจากระบบคอมพิวเตอร์ซึ่งในที่นี้ได้ หมายถึงฮาร์ดแวร์ซอฟด์แวร์ได้ถูกพัฒนาให้มีประสิทธิภาพขึ้นมาอย่างมากและความสามารถของมันก็ไม่ได้หยุดนิ่งเลย ทำให้มนุษย์เกิดความคิดที่จะทำให้มนุษย์เป็นผู้เขียนโปรแกรมคำสั่งให้กับมันโดยตรง ดังนั้น คำว่า จึงได้กำเนิดขึ้นและ AL ได้ถูกแยกออกเป็น 2 แนวทางด้วยกัน โดยแนวทางแรกเป็นแนวทางที่จะให้คอมพิวเตอร์รับรู้ถึงภาษามนุษย์ เช่น ผู้ใช้จะพูดผ่านไมโครโฟนที่ติดต่อกับคอมพิวเตอร์ว่า "ให้แสดงยอดรายงานการขายวันนี้" คอมพิวเตอร์ก็จะทำการดึงข้อมูลการขายมาประมวลผลการวิจัยทางด้านนี้ได้พัฒนาไปมาก และมีแนวโน้มที่จะเป็นจริงได้ในอนาคต ระบบผู้เชี่ยวชาญเป็นระบบที่ได้นำเอาความรู้ความเชี่ยวชาญและประสบการณ์จากผู้เชี่ยวชาญในเรื่องใดเรื่องหนึ่งมาเก็บไว้กล่าวคือ ระบบจะเก็บเอาปัจจัยทุกประการที่ผู้เชี่ยวชาญต้องคำนึงถึงตามปัจจัยต่างๆ และหาคำตอบให้กับผู้ใช้ ระบบช่วยการตัดสินใจหรือ DSS ต่างกับระบบผู้เชี่ยวชาญตรงที่ว่า ระบบช่วยการตัดสินใจเพียงแต่เสนอทางเลือกที่ดีที่สุดให้กับผู้ใช้หรือนักบริหารเท่านั้น ดังนั้นผู้ตัดสินใจสุดท้ายคือ ผู้ใช้อีก ตัวอย่างของระบบผู้เชี่ยวชาญจะให้คำตอบซึ่งเป็นการตัดสินใจของระบบเองเลย โดยไม่ต้องมาผ่านผู้ใช้ซึ่งเป็นคนอีก ตัวอย่างของระบบผู้เชี่ยวชาญที่มีใช้ปัจจุบันและประสบความสำเร็จเป็นอย่างดีคือ ระบบผู้เชี่ยวชาญของ AMEX ที่ใช้สำหรับตรวจสอบเครดิตของผู้ใช้บัตร เป็นต้น
              ระบบผู้เชี่ยวชาญ คือระบบคอมพิวเตอร์ ที่จำลองการตัดสินใจของมนุษย์ ผู้เป็นผู้เชี่ยวชาญในด้านใดด้านหนึ่ง โดยใช้ความรู้และการสรุปเหตุผลเชิงอนุมาน (inference) ในการแก้ปัญหายากๆ ที่ต้องอาศัยผู้เชี่ยวชาญ ระบบผู้เชี่ยวชาญได้ถูกพัฒนาขึ้นมา เพื่อใช้งานในระบบต่างๆ อย่างแพร่หลายมากว่า 30 ปี ไม่ว่าจะเป็นในแวดวงธุรกิจ การแพทย์ วิทยาศาสตร์ วิศวกรรม อุตสาหกรรม เป็นต้น ตัวอย่างของ expert system applications ได้แก่ diagnosis of faults and diseases, automobile diagnosis, interpretation of data (เช่น sonar signals), mineral exploration, personnel scheduling, computer network management, weather forecasting, stock market prediction, consumer buying advice, diet advice เป็นต้น จะเห็นได้ว่า วัตถุประสงค์หลักของระบบผู้เชี่ยวชาญ ก็คือ การช่วยในการตัดสินใจ การให้ความรู้ คำแนะนำ หรือคำปรึกษา อย่างที่เราต้องการจากผู้เชี่ยวชาญเฉพาะด้าน

ระบบข่าวสารเพื่อการบริหารชั้นสูง ( EIS) 

EIS   ย่อมาจาก   executive information system  แปลว่า ระบบสารสนเทศเพื่อผู้บริหาร

หมายถึง    การนำสารสนเทศหรือข้อมูลต่าง ๆ มาเก็บไว้ในรูปแบบที่ผู้บริหารมักจะต้องการใช้ และสามารถจะเรียกมาดู หรือใช้ได้สะดวก

              ระบบข่าวสารเพื่อการบริหารชั้นสูง (EIS) เป็นระบบข่าวสารที่มีความสำคัญต่อผู้บริหารองค์กร

ในเรื่องการพิจารณากำหนดนโยบาย วางแผนกลยุทธ์ขององค์กร ให้สามารถจัดการองค์กร ให้สามารถดำเนินการบรรลุเป้าหมายหรือแข่งขันกับองค์กรอื่น ๆ ได้อย่างมีประสิทธิภาร

           การจัดทำระบบข่าวสารเพื่อการบริหารชั้นสูง มิอาจจัดทำโดยเอกเทศได้โดยลำพัง จะต้องรอผลการพัฒนาระบบข้อมูล-ข่าวสารขั้นต้นอื่นๆ ขึ้นก่อน ข้อมูลที่ได้จากการปฏิบัติงานในระบบ TPS, MIS และ/หรือ DSS จะเป็นรากฐานที่สามารถนำมาสรุปประมวลผลกับข้อมูลภายนอก (ถ้าจำเป็น)  เพื่อประกอบการตัดสินใจ บ่อยครั้งการพัฒนาระบบ EIS จากวิธีการข้างต้น มิอาจได้ข้อมูลภายในองค์กรอย่างครบถ้วน

               การเข้าสู่วงจรการพัฒนาระบบงาน (System Development Life Cycle) เพื่อพัฒนาระบบข่าวสารจึงเป็นวิธีการพื้นฐานที่ต้องกระทำ หลายๆ องค์กรไม่ต้องการประสบปัญหาขั้นต้น การจัดทำแผนแม่บทสารสนเทศ เพื่อกำหนดกรอบของระบบงานสารสนเทศหลัก ระบบย่อย และความต้องการข้อมูลของแต่ละประเภทของระบบข่าวสาร (TPS, MIS, DSS, EIS) ไว้อย่างครบถ้วน ในขั้นต้นนั้นกำหนดความจำเป็นเร่งด่วนจะช่วยในการพิจารณาคัดเลือกระบบงานที่จะพัฒนาก่อนหลังต่อไปได้อย่างมีระบบ

ระบบสนับสนุนการตัดสินใจ (Decision Support System :DSS)

DSS   คือระบบสนับสนุนการตัดสินใจ (Decision Support System :DSS) เป็นซอฟแวร์ที่ช่วยในการ
ตัดสินใจเกี่ยวกับการจัดการ การรวบรวมข้อมูล การวิเคราะห์ข้อมูล และการสร้างตัวแบบที่ซับซ้อน ภายใต้ซอฟต์แวร์เดียวกัน นอกจากนั้น DSS ยังเป็นการประสานการทำงานระหว่างบุคลากรกับเทคโนโลยีทางด้านซอฟต์แวร์ โดยเป็นการกระทำโต้ตอบกัน เพื่อแก้ปัญหาแบบไม่มีโครงสร้าง และอยู่ภายใต้การควบคุมของผู้ใช้ตั้งแต่เริ่มต้นถึงสิ้นสุดขั้นตอนหรืออาจกล่าวได้ว่า DSS เป็นระบบที่โต้ตอบกันโดยใช้คอมพิวเตอร์ เพื่อหาคำตอบที่ง่าย สะดวก รวดเร็วจากปัญหาที่ไม่มีโครงสร้างที่แน่นอน
  ระบบสนับสนุนการตัดสินใจ
                การพัฒนาของเทคโนโลยีสารสนเทศและการขยายตัวขององค์การธุรกิจช่วงทศวรรษ 1970 ทำให้หลายหน่วยงานในสหรัฐอเมริกา ได้เริ่มพัฒนาระบบสารสนเทศที่มีขนาดและเทคโนโลยีที่เหมาะสม เพื่อใช้ในการรวบรวมข้อมูลและแบบจำลองในการตัดสินใจต่างๆ ตลอดจนพัฒนาให้ระบบสามารถสื่อสารตอบโต้อย่างฉับพลันกับผู้ใช้ เพื่อช่วยในการตัดสินใจในปัญหาแบบกึ่งโครงสร้างและไม่มีโครงสร้าง โดยที่แนวความคิดนี้ได้เป็นรากฐานของการพัฒนาระบบสนับสนุนการตัดสินใจ (Decision Support Systems) หรือที่นิยมเรียกว่า DSS ในปัจจุบัน
  มีนักวิชาการหลายท่านได้อธิบายความหมาย   DSS อาทิเช่น
                Gerrity (1971) ได้ให้ความหมายไว้ว่า DSS คือ การผสมผสานอย่างเหมาะสมระหว่างความมีเหตุผลของมนุษย์กับเทคโนโลยีสารสนเทศและชุดคำสั่งที่นำมาใช้โต้ตอบ เพื่อแก้ปัญหาที่มีความซับซ้อน ความหมายนี้จะอธิบายภาพรวมเชิงปรัชญา ซึ่งครอบคลุมลักษณะพื้นฐานของ DSS แต่ยังไม่สามารถให้คำอธิบายลักษณะของปัญหาที่จะต้องแก้ไขโดยอาศัย DSS เข้าช่วย หรือให้ภาพที่ชัดเจนของ DSS
                Kroenke และ Hatch (1994) ได้นำความหมายเดิมมาปรับปรุงและเสนอว่า DSS คือ ระบบโต้ตอบฉับพลันที่สนับสนุนโดยคอมพิวเตอร์ซึ่งนำมาช่วยอำนวยความสะดวกในการตัดสินปัญหาแบบไม่มีโครงสร้าง  ในความหมายนี้ได้มีนักวิชาการหลายท่านวิจารณ์ว่า DSS สมควรที่จะช่วยผู้บริหารในการตัดสินปัญหาทั้งแบบกึ่งโครงสร้างและไม่มีโครงสร้าง ไม่เพียงเฉพาะปัญหาแบบใดแบบหนึ่งเท่านั้น
                Laudon และ Laudon (1994) อธิบายว่า DSS คือ ระบบคอมพิวเตอร์ที่นำมาใช้ในระดับบริหารของแต่ละองค์การ โดยระบบจะประกอบด้วยข้อมูลและแบบจำลองในการตัดสินใจที่ซับซ้อน เพื่อนำมาสนับสนุนการตัดสินปัญหาแบบกึ่งโครงสร้างและไม่มีโครงสร้าง
                ดังนั้นสรุปความหมายของ DSS ได้ว่า คือ ระบบสารสนเทศที่สามารถโต้ตอบกับผู้ใช้โดยที่ระบบนี้จะรวบรวมข้อมูล และแบบจำลองในการตัดสินใจที่สำคัญ เพื่อช่วยผู้บริหารในการตัดสินปัญหาแบบกึ่งโครงสร้าง และไม่มีโครงสร้าง  

ระบบสารสนเทศภูมิศาสตร์ ( Geographic Information System : GIS )

                 ระบบสารสนเทศภูมิศาสตร์ หรือ Geographic Information System : GIS คือกระบวนการทำงานเกี่ยวกับข้อมูลในเชิงพื้นที่ด้วยระบบคอมพิวเตอร์ ที่ใช้กำหนดข้อมูลและสารสนเทศ ที่มีความสัมพันธ์กับตำแหน่งในเชิงพื้นที่ เช่น ที่อยู่ บ้านเลขที่ สัมพันธ์กับตำแหน่งในแผนที่ ตำแหน่ง เส้นรุ้ง เส้นแวง ข้อมูลและแผนที่ใน GIS เป็นระบบข้อมูลสารสนเทศที่อยู่ในรูปของตารางข้อมูล และฐานข้อมูลที่มีส่วนสัมพันธ์กับข้อมูลเชิงพื้นที่ (Spatial Data) ซึ่งรูปแบบและความสัมพันธ์ของข้อมูลเชิงพื้นที่ทั้งหลาย จะสามารถนำมาวิเคราะห์ด้วย GIS และทำให้สื่อความหมายในเรื่องการเปลี่ยนแปลงที่สัมพันธ์กับเวลาได้ เช่น การแพร่ขยายของโรคระบาด การเคลื่อนย้าย ถิ่นฐาน การบุกรุกทำลาย การเปลี่ยนแปลงของการใช้พื้นที่ ฯลฯ ข้อมูลเหล่านี้ เมื่อปรากฏบนแผนที่ทำให้สามารถแปลและสื่อความหมาย ใช้งานได้ง่าย 
                GIS เป็นระบบข้อมูลข่าวสารที่เก็บไว้ในคอมพิวเตอร์ แต่สามารถแปลความหมายเชื่อมโยงกับสภาพภูมิศาสตร์อื่นๆ สภาพท้องที่ สภาพการทำงานของระบบสัมพันธ์กับสัดส่วนระยะทางและพื้นที่จริงบนแผนที่ ข้อแตกต่างระหว่าง GIS กับ MIS นั้นสามารถพิจารณาได้จากลักษณะของข้อมูล คือ ข้อมูลที่จัดเก็บใน GIS มีลักษณะเป็นข้อมูลเชิงพื้นที่ (Spatial Data) ที่แสดงในรูปของภาพ (graphic) แผนที่ (map) ที่เชื่อมโยงกับข้อมูลเชิงบรรยาย (Attribute Data) หรือฐานข้อมูล (Database)การเชื่อมโยงข้อมูลทั้งสองประเภทเข้าด้วยกัน จะทำให้ผู้ใช้สามารถที่จะแสดงข้อมูลทั้งสองประเภทได้พร้อมๆ กัน เช่นสามารถจะค้นหาตำแหน่งของจุดตรวจวัดควันดำ - ควันขาวได้โดยการระบุชื่อจุดตรวจ หรือในทางตรงกันข้าม สามารถที่จะสอบถามรายละเอียดของ จุดตรวจจากตำแหน่งที่เลือกขึ้นมา ซึ่งจะต่างจาก MIS ที่แสดง ภาพเพียงอย่างเดียว โดยจะขาดการเชื่อมโยงกับฐานข้อมูลที่เชื่อมโยงกับรูปภาพนั้น เช่นใน CAD (Computer Aid Design) จะเป็นภาพเพียงอย่างเดียว แต่แผนที่ใน GIS จะมีความสัมพันธ์กับตำแหน่งในเชิงพื้นที่ทางภูมิศาสตร์ คือค่าพิกัดที่แน่นอน ข้อมูลใน GIS ทั้งข้อมูลเชิงพื้นที่และข้อมูลเชิงบรรยาย สามารถอ้างอิงถึงตำแหน่งที่มีอยู่จริงบนพื้นโลกได้โดยอาศัยระบบพิกัดทางภูมิศาสตร์ (Geocode) ซึ่งจะสามารถอ้างอิงได้ทั้งทางตรงและทางอ้อม ข้อมูลใน GIS ที่อ้างอิงกับพื้นผิวโลกโดยตรง หมายถึง ข้อมูลที่มีค่าพิกัดหรือมีตำแหน่งจริงบนพื้นโลกหรือในแผนที่ เช่น ตำแหน่งอาคาร ถนน ฯลฯ สำหรับข้อมูล GIS ที่จะอ้างอิงกับข้อมูลบนพื้นโลกได้โดยทางอ้อมได้แก่ ข้อมูลของบ้าน(รวมถึงบ้านเลขที่ ซอย เขต แขวง จังหวัด และรหัสไปรษณีย์) โดยจากข้อมูลที่อยู่ เราสามารถทราบได้ว่าบ้านหลังนี้มีตำแหน่งอยู่ ณ ที่ใดบนพื้นโลก เนื่องจากบ้านทุกหลังจะมีที่อยู่ไม่ซ้ำกัน

ระบบสารสนเทศเพื่อการจัดการ (Management Information System : MIS)

ระบบสารสนเทศเพื่อการจัดการ(MIS)  หมายถึง   ระบบที่รวบรวมและจัดเก็บข้อมูลจากแหล่งข้อมูลต่าง ๆ ทั้งภายใน และภายนอกองค์การอย่างมีหลักเกณฑ์ เพื่อนำมาประมวลผลและจัดรูปแบบให้ได้สารสนเทศที่ช่วยสนับสนุนการทำงาน และการตัดสินใจในด้านต่าง ๆ ของผู้บริหารเพื่อให้การดำเนินงานขององค์การเป็นไปอย่างมีประสิทธิภาพ โดยที่เราจะเห็นว่า MIS จะประ กอบด้วยหน้าที่หลัก 2 ประการ คือ 
  1. สามารถเก็บรวบรวมข้อมูลจากแหล่งต่าง ๆ ทั้งจากภายในและภายนอกองค์การมาไว้
ด้วยกันอย่างเป็นระบบ
  2. สามารถทำการประมวลผลข้อมูลอย่างมีประสิทธิภาพ เพื่อให้ได้สารสนเทศที่ช่วย
สนับสนุนการปฏิบัติงานและการบริหารงานของผู้บริหาร
          ดังนั้นถ้าระบบใดประกอบด้วยหน้าที่หลักสองประการ ตลอดจนสามารถปฏิบัติงานในหน้าที่หลักทั้งสองได้อย่างครบถ้วน และสมบูรณ์ ระบบนั้นก็สามารถถูกจัดเป็นระบบ MIS ได้ ระบบ MIS ไม่จำเป็นที่จะต้องสร้างขึ้นจากระบบคอมพิวเตอร์ MIS อาจสร้างขึ้นมาจากอุปกรณ์อะไรก็ได้ แต่ต้องสามารถปฏิบัติหน้าที่หลักทั้งสองประการได้อย่างครบถ้วนและสมบูรณ์ แต่เนื่องจากปัจจุบันคอมพิวเตอร์เป็นอุปกรณ์ที่มีประสิทธิภาพในการจัดการข้อมูล นักวิเคราะห์และออกแบบระบบ (System Analyst and  Designer ) จึงออกแบบระบบสารสนเทศให้มีคอมพิวเตอร์เป็นอุปกรณ์หลักในการจัดการสารสนเทศ
           ปัจจุบันขอบเขตการทำงานของระบบสารสนเทศขยายตัวจากการรวบรวมข้อมูลที่มาจากภายในองค์การไปสู่การเชื่อมโยงกับแหล่งข้อมูลจากสิ่งแวดล้อมภายนอก ทั้งจากภายในท้องถิ่น ประเทศ และระดับนานาชาติ ปัจจุบันธุรกิจต้องใช้เทคโนโลยีสาร สนเทศที่มีศักยภาพ สูงขึ้นเพื่อสร้าง MIS ให้สามารถปฏิบัติหน้าที่ได้อย่างมีประสิทธิภาพ และเป็นเครื่องมือสำคัญที่ช่วยเพิ่ม ขีดความสามารถของธุรกิจ และขีดความสามารถในการบริหารงานของผู้บริหารในยุคปัจจุบัน แต่ปัญหาที่น่าเป็นห่วงคือคน ส่วนใหญ่ยังไม่เข้าใจในศักยภาพและขอบเขตของการใช้งานระบบสารสนเทศ (MIS) นอกจากนี้บุคลากรบางส่วนที่ขาดความเข้าใจอย่างแท้จริงเกี่ยวกับเทคโนโลยีสารสนเทศ มีทัศนคติที่ไม่ดีต่อการใช้งานระบบสารสนเทศ ไม่ยอมเรียนรู้และเปิดรับการเปลี่ยนแปลง จึงให้ความสนใจหรือความสำคัญกับการปรับตัวเข้ากับ MIS น้อยกว่าที่ควร

ระบบสำนักงานอัตโนมัติ ( Office Automation System : OAS ) 

ระบบสำนักงานอัตโนมัติ ( Office Automation System : OAS )
เป็นระบบสำหรับเชื่อมโยงการทำงานของเจ้าหน้าที่และผู้บริหาร เพื่อใช้ในการสื่อสารข้อมูล การค้นหาข้อมูลจากฐานข้อมูล การจัดตารางนัดหมาย การประชุมทางไกล
*สนับสนุนการทำงานของเจ้าหน้าที่ที่ทำงานเกี่ยวข้องกับข้อมูลโดยตรง เช่น พนักงานป้อนข้อมูล(Data Entry Worker)*เป็นกลุ่มพนักงานที่มีความรู้ในระดับต่ำกว่าผู้ชำนาญการ (Knowledge Workers)*OAS เพิ่มประสิทธิภาพการทำงานด้วยการสนับสนุนการใช้ข้อมูลร่วมกัน และอำนวยความสะดวกในการสื่อสารระหว่างกัน
ระบบสำนักงานอัตโนมัติ
เป็นระบบที่ออกแบบขึ้นเพื่อช่วยให้การทำงานในสำนักงานมีประสิทธิภาพมากขึ้น ส่วนใหญ่เป็นการนำคอมพิวเตอร์มาเชื่อมโยงเป็นเครือข่ายกับอุปกรณ์ต่างๆ ของสำนักงาน เพื่อประโยชน์ในการใช้งาน ระบบสำนักงานอัตโนมัติประกอบด้วย
· ระบบจัดการเอกสาร
· ระบบจัดการด้านข่าวสาร
· ระบบประชุมทางไกล
· ระบบสนับสนุนสำนักงาน
ระบบสำนักงานอัตโนมัติ Office Automation Systems(OAS) ระบบสำนักงานอัตโนมัติ OAS คือ ระบบสารสนเทศที่สามารถสร้าง (Create) เก็บข้อมูล (Store) ปรับปรุงข้อมูล (Modify) แสดงภาพ (Display) และติดต่อสื่อสารระหว่างระบบธุรกิจ โดยการใช้คอมพิวเตอร์และระบบเทคโนโลยีการสื่อสาร เข้ามาช่วย แทนการพูด เขียน หรือส่งรูปภาพแบบเดิมผู้บริหารคอมพิวเตอร์ผู้บริหารคอมพิวเตอร์ อาจเป็นหัวหน้าของศูนย์คอมพิวเตอร์ หรือ ศูนย์เครือข่าย ก็ได้ อาจเรียกว่า PC Manager LAN Manager มีหน้าที่หลักในการดูแลระบบและเครื่องคอมพิวเตอร์
1. ควบคุมปริมาณเทคโนโลยีคอมพิวเตอร์
2. ควบคุมค่าใช้จ่าย
3. ความเป็นเอกภาพและความปลอดภัยของข้อมูล
4. การระมัดระวังการใช้คอมพิวเตอร์เพื่อวัตถุประสงค์อื่นๆ ที่นอกเหนือการทำงาน
ศูนย์สารสนเทศ (Information Center)
เป็นหน่วยงานที่พนักงานจะได้รับความช่วยเหลือ ในการแก้ไขปัญหาทางซอฟต์แวร์ ในองค์กรใหญ่ๆ ศูนย์ข้อมูลอาจเรียกว่า Support Center ซึ่งให้ความช่วยเหลือแก่ผู้ใช้ในรูปแบบต่าง ๆ
การให้บริการของศูนย์สารสนเทศมี ดังนี้
1. การเลือกใช้ซอฟต์แวร์
2. การเข้าถึงข้อมูล
3. การเข้าถึงเครือข่าย
4. การฝึกอบรม
5. การให้ความช่วยเหลือด้านเทคนิค
ระบบสำนักงานอัตโนมัติ ( Office Automation System : OAS )
เป็นระบบสำหรับเชื่อมโยงการทำงานของเจ้าหน้าที่และผู้บริหาร เพื่อใช้ในการสื่อสารข้อมูล การค้นหาข้อมูลจากฐานข้อมูล การจัดตารางนัดหมาย การประชุมทางไกล
* สนับสนุนการทำงานของเจ้าหน้าที่ที่ทำงานเกี่ยวข้องกับข้อมูลโดยตรง เช่น พนักงานป้อนข้อมูล (Data Entry Worker)
* เป็นกลุ่มพนักงานที่มีความรู้ในระดับต่ำกว่าผู้ชำนาญการ (Knowledge Workers)
* OAS เพิ่มประสิทธิภาพการทำงานด้วยการสนับสนุนการใช้ข้อมูลร่วมกัน และอำนวยความสะดวกในการสื่อสารระหว่างกัน