หน้าเว็บ

Lecture

พื้นฐานสำคัญเกี่ยวกับเว็บ


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


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


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


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


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


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


ความหมายของซับโดเมน
Com กลุ่มองค์การค้า(Commercial)
เช่น www.ibm.com
edu กลุ่มการศึกษา(Education)
เช่น www.chula.edu
gov กลุ่มองค์การรัฐบาล(Government)
เช่น www.whitehouse.gov
mit กลุ่มองค์การทหาร(Military)
เช่น www.dtic.mil
net กลุ่มองค์การบริการเครือข่าย(Network Services)
org กลุ่มองค์กรอื่นๆ (Organizations)
เช่น www.greenpeace.org


โดเมนที่เป็นชื่อย่อของประเทศที่น่าสนใจ
โดเมนเนมเหล่านี้ จะใช้ต่อตอนท้ายสุด เพื่อสะดวกในการอ้างอิงว่าเป็นโฮสต์หรือเว็บไซต์ที่อยู่ในประเทศใด เช่น www.ksc.net.th จะเห็นว่า ลงท้ายด้วย th จะเป็นโดเมนของประเทศไทย
au ออสเตรเลีย Austtralia
fr ฝรั่งเศส France
hk ฮ่องกง Hong Kong
jp ญี่ปุ่น Japan
th ไทย Thailand
sg สิงคโปร์ Singapore
uk อังกฤษ United Kingdom


ความหมายของซับโดเมน
ac สถาบันการศึกษา(Academic)
co องค์กรธุรกิจ(Commercail)
or องค์กรอื่นๆที่ไม่แสวงหากำไร(Organizations)
net ผู้วางระบบเน็ตเวิร์ค(Networking)
go หน่วยงานรัฐบาล(Government)



การพัฒนาเว็บไซต์

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

Phase 1สำรวจปัจจัยสำคัญ(Research)1. รู้จักตัวเอง-กำหนดเป้าหมายและสำรวจความพร้อม2. เรียนรู้ผู้ใช้-ระบุกลุ่มผู้ใช้และศึกษาความต้องการการ3. ศึกษาคู่แข่ง-สำรวจการแข่งขันและการเรียนรู้คู่แข่ง

Phase 2พัฒนาเนื้อหา(Site Content)4. สร้างกลยุทธ์การออกแบบ5. หาข้อสรุปขอบเขตเนื้อหา

Phase 3พัฒนาโครงสร้างเว็บไซท์(Site Structure)6. จัดระบบข้อมูล7. จัดทำโครงสร้างข้อมูล8. พัฒนาระบบเนวิเกชัน

Phase 4ออกแบบและพัฒนาหน้าเว็บ(Visual Design)9. ออกแบบลักษณะหน้าตาเว็บ10. พัฒนาเว็บต้นแบบและข้อกำหนดสุดท้าย

Phase 5พัฒนาและดำเนินการ (Production & Operation)11. ลงมือพัฒนาเว็บ12. เปิดเว็บไซท์13. ดูแลและพัฒนาต่อเนื่อง




เลือกใช้สีสำหรับเว็บไซต์

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

ประโยชน์ของสีในเว็บไซต์

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