test-web1

เทคนิคการสร้าง

และออกแบบ Website

ครูกรรณิการ์ หมูปิน

ความรู้เบื้องต้นเกี่ยวกับอินเตอร์เน็ต

• อินเตอร์เน็ต (Internet) เป็นเครือข่ายคอมพิวเตอร์ที่ใหญ่ที่สุดในโลกซึ่งรวมเอาเครือข่ายย่อยเป็นจำนวนมากต่อเชื่อมภายใต้มาตรฐานเดียวกันจนเป็น เครือข่ายคอมพิวเตอร์ขนาดใหญ่ ทำให้ทั่วโลกเชื่อมโยงกัน เป็นเครือข่ายเดียวกันได้ในแพลตฟอร์มของ เวิลด์ ไวด์ เว็บ (World Wide Web)ลักษณะของเวิล์ด ไวด์ เว็บ (World Wide Web)

• เวิล์ด ไวด์ เว็บ (World Wide Web – www) หรือเรียกย่อ ๆ ว่า เว็บ (web) เป็นอินเตอร์เน็ตชนิดหนึ่ง ที่อยู่ในรูปแบบของกราฟิกและมัลติมีเดีย ซึ่งประกอบด้วยข้อความ (Text) ภาพ (Graphic) เสียง(Sound) และ ภาพเคลื่อนไหว (Movie)

• 
  

เว็บไซต์ (Website) และเว็บเพจ (Webpage)

เอกสารหรือส่วนที่ติดต่อกับผู้ใช้ในเว็บ เรียกว่า เว็บเพจ (Webpage) หมายถึง เอกสารหนึ่งหน้า การใช้เว็บก็คือการเปิดอ่านหรือเปิดใช้เว็บแต่ละหน้า เมื่อนำเว็บเพจหลายๆ หน้ามารวมกัน และระบุอยู่ในอินเตอร์เน็ต หรือ ยูอาร์แอล (Uniform Resource Locator – URL) ให้กับเว็บเพจกลุ่มนั้นจะเรียกว่า เว็บไซต์ (Web Site) เมื่อเปิดเว็บไซต์ขึ้นมาจะพบกับหน้าแรกของเว็บไซต์ ซึ่งเรียกว่าโฮมเพจ (Homepage)

เว็บเบราเซอร์ (Web Browser)

เว็บเบราเซอร์ (Web Browser) คือโปรแกรมที่ใช้สำหรับเปิดเว็บเพจหรือ รับส่งข้อมูลตามที่เครื่องลูกข่ายร้องขอเมื่อเราเปิดเข้าสู่อินเตอร์เน็ต เว็บเบราเซอร์ที่ได้รับความนิยมปัจจุบันมีหลายโปรแกรม เช่น Microsoft Internet Explorer (IE), Mozilla Firefox, Opera, และ Google Chrome

โดเมนเนม (Domain Name)

• โดเมนเนม (Domain Name) หรือที่เข้าใจกันทั่วไป คือ ชื่อเรียกเว็บไซต์นั่นเอง การจดทะเบียน

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

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

• การวางแผน  

• การกำหนดเนื้อหาและจุดประสงค์ของเว็บไซต์  

• การกำหนดกลุ่มเป้าหมาย  

• การเตรียมข้อมูล  

• การเตรียมสิ่งต่างๆ ที่จำเป็น  

• การจัดโครงสร้างข้อมูล 

ส่วนประกอบของหน้าเว็บเพจ

1. ส่วนหัว (Page Header) อยู่บริเวณบนสุดของหน้าเว็บเพจ เป็นส่วนที่แสดงชื่อเว็บไซต์ โลโก้ แบนเนอร์โฆษณา ลิงก์สำหรับข้ามไปยังหน้าเว็บอื่น

       2. ส่วนเนื้อหา (Page Body) อยู่บริเวณตอนกลางของหน้าเว็บเพจ ซึ่งเป็นส่วนที่แสดงเนื้อหาภายในหน้าเว็บเพจนั้น โดยประกอบด้วยข้อความ ข้อมูล ภาพเคลื่อนไหว เป็นต้น

       3. แถบข้าง (Slide Bar) อยู่ด้านซ้ายมือหรือขวามือของเว็บไซต์ สำหรับวางป้ายโฆษณา หรือเมนูสำหรับลิงค์ไปยังหน้าเว็บเพจอื่น ๆ หรือเว็บไซต์อื่น ๆ

       4. ส่วนท้าย (Page Footer) อยู่บริเวณด้านล่างสุดของหน้าเว็บเพจ ส่วนมากใช้สำหรับแสดงชื่อเจ้าของเว็บไซต์ อีเมลของผู้ดูแลเว็บไซต์สำหรับติดต่อกับทางเว็บไซต์

ลักษณะของเว็บไซต์ที่ดี

• 1. ความทันสมัย (Currency) เป็นข้อมูลที่ใหม่ ทันต่อสถานการณ์

• 2. เนื้อหาและข้อมูล (Content and Information) ต้องมีเนื้อหาและข้อมูลที่เป็นประโยชน์ 

•     3. ความน่าเชื่อถือ (Authority) คือ ผู้จัดทำเว็บเป็นผู้ที่เกี่ยวข้องโดยตรงกับเนื้อหา หรือเป็นองค์กรที่รับผิดชอบด้านนั้นโดยตรง 

• 4. การเชื่อมโยงข้อมูล (Navigation) ควรจะแสดงการเชื่อมโยงไปยังส่วนต่างๆ ในรูปแบบที่เข้าใจง่าย 

• 5. การปฏิบัติจริง (Experience) ต้องทำให้ผู้เข้าชมรู้สึกว่าไม่เสียเวลา ไมไร้ประโยชน์หรือเว็บเพจไม่เป็นไปตามวัตถุประสงค์

ลักษณะของเว็บไซต์ที่ดี

• 6. ความเป็นมัลติมีเดีย (Multimedia) องค์ประกอบที่สำคัญของความเป็น multimedia ภายในเว็บไซด์ คือ เสียง ภาพ กราฟิก ภาพเคลื่อนไหว ควรสอดคล้องกับเนื้อหาภายในเว็บ

         

• 7. การให้ข้อมูล (treatment) ควร จะเข้าถึงได้ง่ายและรวดเร็ว โดยไม่มีความสลับซับซ้อน มีการจัดรูปแบบและหมวดหมู่ของข้อมูลอย่างเป็นระบบ เพื่อให้ง่ายต่อการตรวจสอบและใช้งานข้อมูล

• 8. การเข้าถึงข้อมูล (Access) สามารถแสดงผลข้อมูลได้อย่างรวดเร็ว เมื่อผู้ใช้เข้าสู่เว็บไซต์

• 9. ความหลากหลายของข้อมูล (Miscellaneous) เว็บควรมีความหลากหลายและมีเรื่องที่เป็นประโยชน์หลาย ๆ เรื่อง มีความน่าเชื่อถือและตรวจสอบข้อมูลได้ ข้อมูลนั้นก็จะได้ความนิยมและแนะนำกันให้เข้ามาชมอีก

•   

การเลือกใช้สีให้เหมาะสม

• แบ่งออกเป็น 3 กลุ่มดังต่อไปนี้

• 1.    สีโทนร้อน (Warm Colors) เป็นสีแห่งความอบอุ่น ปลอบโยนและกระตุ้นความสุขได้ดี ซึ่งจะทำให้ผู้เข้าชมรู้สึกมีชีวิตชีวาและมีแรงผลักดันมากขึ้น อีกทั้งยังช่วยดึงดูดให้ผู้ชมรู้สึกอยากติดตามเนื้อหามากขึ้น

• 2.    สีโทนเย็น (Cool Colors) เป็นสีแห่งความสุภาพและความอ่อนโยน ทำให้ผู้ชมรู้สึกผ่อนคลายและเพลิดเพลินมากขึ้น และยังสามารถใช้โน้มน้าวจากในระยะไกลได้อีกด้วย

• 3.    สีโทนกลาง (Neutral Colors) สีเหล่านี้มักจะถูกนำไปผสมกับสีอื่นๆ เพื่อให้เกิดสีที่เป็นกลางมากขึ้น และให้ความรู้สึกที่เป็นธรรมชาติ

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

• 
  

Multiple Choice

Home Page หมายถึงข้อใด

• เอกสารข้อมูลในแต่ละหน้า

• ที่เก็บเว็บเพจ

• เว็บเพจที่เป็นหน้าแรก

• โปรแกรมที่ใช้เรียกเว็บไซต์

Multiple Choice

Website หมายถึงข้อใด

• เอกสารข้อมูลแต่ละหน้า

• หน้าเว็บเพจหลายๆ หน้า ซึ่งเชื่อมโยงกันผ่านทางไฮเปอร์ลิงก์

• เว็บเพจที่เป็นหน้าแรก

• โปรแกรมที่ใช้เรียกเว็บไซต์

Multiple Choice

ข้อใดไม่ใช่แม่สี

• สีแดง

• สีเขียว

• สีเหลือง

• สีน้ำเงิน

Multiple Choice

ข้อใดถูกต้อง

• เว็บไซต์ประกอบด้วยหลายๆ โฮมเพจ แต่จะมีเว็บเพจเพียงเว็บเพจเดียว

• เว็บเซิร์ฟเวอร์จะเก็บเฉพาะโฮมเพจเท่านั้น

• โฮมเพจคือหน้าแรกของเว็บเพจ ที่เป็นหน้าแรกสุดที่ผู้ใช้ต้องพบ

• เว็บไซต์โดยทั่วไปนิยมสร้างโฮมเพจไว้เป็นเว็บเพจแรกเสมอ

Multiple Choice

ข้อใด ไม่ใช่ โปรแกรมเว็บบราวเซอร์ (Web Browser)