หน่วยที่ 1 รู้จักกับเว็บเพจ
ระบบเครือข่ายอินเทอร์เน็ตนับได้ว่า เป็นเทคโนโลยีที่มีบทบาทและความสำคัญสำหรับสังคมในโลกปัจจุบัน
เป็นอย่างมาก โดยเฉพาะอย่างยิ่งการใช้เวิลด์ไวด์เว็บ (World Wide Web : WWW) ซึ่งถือได้ว่าเป็นเครือข่ายที่
เชื่อมโยงข้อมูลข่าวสารครอบคลุมได้ทั่วโลก การนำเสนอข้อมูลในระบบเวิลด์ไวด์เว็บนี้ถูกพัฒนาขึ้นในช่วงปลาย
ปี ค.ศ.1989 โดยทีมงานจากห้องปฏิบัติการทางจุลภาคฟิสิกส์แห่งยุโรป (European Particle Physics Labs) หรือที่รู้จักกันในนาม CERN (Conseil European pour la Recherche Nucleaire) ประเทศสวิตเซอร์แลนด์ และได้มีการพัฒนาภาษาที่ใช้สนับสนุนการเผยแพร่เอกสารของนักวิจัย หรือ เอกสารเว็บ (Web Document) จากเครื่องบริการเว็บ (Server) ไปยังสถานที่ต่าง ๆ ในระบบเวิลด์ไวด์เว็บ
การเผยแพร่ข้อมูลสื่อประเภทเว็บเพจ (Web Page) นั้น กำลังเป็นที่นิยมในปัจจุบัน ข้อมูลที่นำเสนอสามารถเผยแพร่ได้ทั้งข้อมูลตัวอักษร ข้อมูลภาพ ข้อมูลเสียง ภาพเคลื่อนไหว ที่มีลูกเล่นและเทคนิคการนำเสนอที่หลากหลาย จึงทำให้ข้อมูลที่สามารถสืบค้นได้มีมากกว่าการโฆษณาเสนอขายสินค้าที่มักจะพบเห็นอยู่เป็นประจำ
ลักษณะเด่นของการนำเสนอข้อมูลเว็บเพจ ก็คือ สามารถเชื่อมโยงข้อมูลไปยังจุดอื่น ๆ บนหน้าเว็บ
ตลอดจนสามารถเชื่อมโยงไปยังเว็บอื่น ๆ ในระบบเครือข่าย ซึ่งเป็นที่มาของคำว่า Hypertext (ข้อความหลายมิติ)
HyperText Markup Language หรือที่เรียกย่อ ๆ ว่า HTML เป็นภาษาคอมพิวเตอร์ในรูปแบบหนึ่ง
ใช้โครงสร้างของแท๊ก (tag) เป็นตัวควบคุมการแสดงผลของเว็บเพจ รูปแบบของคำสั่งจะอยู่ภายใต้เครื่องหมาย
< >
โครงสร้างภาษา HTML ประกอบด้วยส่วนสำคัญ 3 ส่วน คือ
คำศัพท์เกี่ยวกับการสร้างเว็บเพจ
เว็บไซด์ (Web Site) คือ แหล่งข้อมูลบนอินเทอร์เน็ต เป็นที่รวบรวมกลุ่มข้อมูลของเว็บเพจ เปรียบเทียบได้กับหนังสือ 1 เล่มที่รวบรวมเนื้อหาต่าง ๆ ไว้ด้วยกัน
เว็บเพจ (Web Page) คือ เอกสารที่ประกอบด้วยข้อความ ภาพ เสียง หรือส่วนประกอบอื่นที่ใช้ใน
การสื่อสาร เป็นหน้าหนึ่งในเว็บไซด์หรือเทียบได้กับหน้าหนึ่งของหนังสือ
โฮมเพจ (Home Page) คือ หน้าแรกของเว็บไซด์ มีลักษณะเป็นเอกสารข้อความหลายมิติ โดยทั่วไปเขียนขึ้นและวางไว้ในตำแหน่งที่อยู่ของหน่วยงาน หรืออยู่ในส่วนของที่เก็บข้อมูลเฉพาะบุคคล และยอมให้ผู้อื่นเข้ามาเยี่ยมชมได้ เทียบได้กับปกหนังสือ
เว็บบราวเซอร์ (Web Browser) คือ โปรแกรมที่อยู่บนเครื่องของผู้ใช้ที่ทำการติดต่อผ่านเครือข่ายคอมพิวเตอร์เพื่อเรียกใช้และแปลผลเอกสารที่เขียนด้วยภาษา HTML มาแสดงผลบนหน้าจอคอมพิวเตอร์
ปัจจุบันเว็บบราวเซอร์ที่ได้รับความนิยม ได้แก่ Internet Explorer, Netscape, Firefox
หลักการออกแบบเว็บเพจ
การออกแบบเว็บเพจนั้น จะต้องเข้าใจทั้งทางด้านเทคนิควิธีการ และรูปแบบด้านองค์ประกอบของสิ่งที่จะนำเสนอประกอบกัน โรบิน วิลเลี่ยมได้เขียนแนวคิดของการออกแบบสิ่งพิมพ์ไว้ในหนังสือชื่อ The Non-Designer's Design Book ซึ่งสามารถนำมาสรุปเป็นหลักการออกแบบเว็บเพจโดยใช้กฎพื้นฐาน 4 ข้อ ดังนี้
1. กฎข้อที่หนึ่ง ความแปลกแตกต่าง (contrast)
กฎข้อนี้เน้นการออกแบบเว็บเพจให้มีความแปลก หลีกเลี่ยงการใช้องค์ประกอบบนจอภาพที่ดูคล้ายๆ กัน เช่น การใช้ตัวอักษร สี ขนาด ความหนาของเส้น รูปร่าง ที่ว่างบนจอ ฯลฯ ถ้าองค์ประกอบของเนื้อหาไม่ใช่สิ่งเดียวกัน ก็ควรสร้างให้เห็นความแปลกแตกต่างอย่างชัดเจน
2. กฎข้อที่สอง การย้ำซ้ำ (repetition)
ในการออกแบบเว็บเพจจะต้องมีแบบแผนหรือมีการกำหนดรูปแบบของผู้สร้างเอง จะช่วยให้เว็บเพจนั้นมีความสอดคล้องกันทั้งหมด เช่น การกำหนดรูปแบบ การให้สี การสร้างรูปร่าง การกำหนดพื้นหลัง ความสัมพันธ์ของระยะห่าง ขนาด ความหนาของตัวอักษร เป็นต้น การออกแบบด้วยการย้ำซ้ำจะต้องเน้นให้เห็นว่า ในการออกแบบเว็บเพจแต่ละหน้าในเว็บไซด์เดียวกันจะต้องมีรูปแบบเดียวกัน
3. กฎข้อที่สาม การจัดแถว วางแนว (alignment)
การจัดวางองค์ประกอบควรจะจัดให้เป็นระเบียบ โดยพิจารณาถึงองค์ประกอบที่อยู่ตามแถว หรือแนวเดียวกันเสมอ จะทำให้เว็บเพจดูสะอาดตา นำสมัย และไม่ขัดกับความรู้สึกของผู้ใช้
4. กฎข้อที่สี่ ความใกล้เคียง ความเกี่ยวเนื่อง (proximity)
กฎข้อนี้กำหนดให้วัตถุต่าง ๆ ที่อยู่บนเว็บเพจมีความเป็นระเบียบเกี่ยวเนื่องกัน จะทำให้มองเห็นได้ง่าย
ไม่กระจัดกระจาย การรวมกลุ่มเป็นวิธีการลดความยุ่งเหยิง สร้างความเป็นระเบียบ
การวางองค์ประกอบของเว็บเพจนั้นเป็นทั้งศาสตร์และศิลป์ ผู้เขียนเว็บเพจต้องเข้าใจเทคนิคการเขียนโครงสร้างภาษา HTML การใช้เทคนิคที่น่าสนใจ เช่น การสร้างภาพ การสร้างเงา สี เป็นต้น รวมถึงการนำองค์ประกอบทางศิลปะมาใช้ การนำกฎทั้ง 4 ข้อไปใช้ในการออกแบบเว็บเพจนั้นไม่ควรเน้นข้อใดข้อหนึ่ง แต่ควรพิจารณาให้สอดคล้องกัน
เป็นอย่างมาก โดยเฉพาะอย่างยิ่งการใช้เวิลด์ไวด์เว็บ (World Wide Web : WWW) ซึ่งถือได้ว่าเป็นเครือข่ายที่
เชื่อมโยงข้อมูลข่าวสารครอบคลุมได้ทั่วโลก การนำเสนอข้อมูลในระบบเวิลด์ไวด์เว็บนี้ถูกพัฒนาขึ้นในช่วงปลาย
ปี ค.ศ.1989 โดยทีมงานจากห้องปฏิบัติการทางจุลภาคฟิสิกส์แห่งยุโรป (European Particle Physics Labs) หรือที่รู้จักกันในนาม CERN (Conseil European pour la Recherche Nucleaire) ประเทศสวิตเซอร์แลนด์ และได้มีการพัฒนาภาษาที่ใช้สนับสนุนการเผยแพร่เอกสารของนักวิจัย หรือ เอกสารเว็บ (Web Document) จากเครื่องบริการเว็บ (Server) ไปยังสถานที่ต่าง ๆ ในระบบเวิลด์ไวด์เว็บ
การเผยแพร่ข้อมูลสื่อประเภทเว็บเพจ (Web Page) นั้น กำลังเป็นที่นิยมในปัจจุบัน ข้อมูลที่นำเสนอสามารถเผยแพร่ได้ทั้งข้อมูลตัวอักษร ข้อมูลภาพ ข้อมูลเสียง ภาพเคลื่อนไหว ที่มีลูกเล่นและเทคนิคการนำเสนอที่หลากหลาย จึงทำให้ข้อมูลที่สามารถสืบค้นได้มีมากกว่าการโฆษณาเสนอขายสินค้าที่มักจะพบเห็นอยู่เป็นประจำ
ลักษณะเด่นของการนำเสนอข้อมูลเว็บเพจ ก็คือ สามารถเชื่อมโยงข้อมูลไปยังจุดอื่น ๆ บนหน้าเว็บ
ตลอดจนสามารถเชื่อมโยงไปยังเว็บอื่น ๆ ในระบบเครือข่าย ซึ่งเป็นที่มาของคำว่า Hypertext (ข้อความหลายมิติ)
HyperText Markup Language หรือที่เรียกย่อ ๆ ว่า HTML เป็นภาษาคอมพิวเตอร์ในรูปแบบหนึ่ง
ใช้โครงสร้างของแท๊ก (tag) เป็นตัวควบคุมการแสดงผลของเว็บเพจ รูปแบบของคำสั่งจะอยู่ภายใต้เครื่องหมาย
< >
โครงสร้างภาษา HTML ประกอบด้วยส่วนสำคัญ 3 ส่วน คือ
| 1. ส่วนที่กำหนดให้บราวเซอร์ทราบว่า เป็นแฟ้มข้อมูลชนิด HTML ซึ่งจะมีแท๊ก <html> กำกับอยู่ที่จุดเริ่มต้นและแท๊ก </html> อยู่ที่จุดสิ้นสุดของเว็บเพจ |
โครงสร้างของภาษา HTML
<html><head> < title>ชื่อเว็บเพจ</title> </head> <body> ข้อความที่แสดง </body> </html> |
| 2. ส่วนหัวเรื่อง (head) เป็นส่วนที่กำหนดให้ข้อความ แสดงชื่อเว็บเพจนั้น ๆ ไปปรากฏที่แถบชื่อของเว็บบราวเซอร์ | |
| 3. ส่วนเนื้อหา (body) เป็นส่วนที่แสดงเนื้อหาของ เว็บเพจทั้งหมดซึ่งประกอบแท๊กต่าง ๆ เพื่อให้การแสดงผลมีความสวยงาม เช่น ข้อความ ตาราง รูปภาพ กราฟิกต่าง ๆ |
คำศัพท์เกี่ยวกับการสร้างเว็บเพจ
เว็บไซด์ (Web Site) คือ แหล่งข้อมูลบนอินเทอร์เน็ต เป็นที่รวบรวมกลุ่มข้อมูลของเว็บเพจ เปรียบเทียบได้กับหนังสือ 1 เล่มที่รวบรวมเนื้อหาต่าง ๆ ไว้ด้วยกัน
เว็บเพจ (Web Page) คือ เอกสารที่ประกอบด้วยข้อความ ภาพ เสียง หรือส่วนประกอบอื่นที่ใช้ใน
การสื่อสาร เป็นหน้าหนึ่งในเว็บไซด์หรือเทียบได้กับหน้าหนึ่งของหนังสือ
โฮมเพจ (Home Page) คือ หน้าแรกของเว็บไซด์ มีลักษณะเป็นเอกสารข้อความหลายมิติ โดยทั่วไปเขียนขึ้นและวางไว้ในตำแหน่งที่อยู่ของหน่วยงาน หรืออยู่ในส่วนของที่เก็บข้อมูลเฉพาะบุคคล และยอมให้ผู้อื่นเข้ามาเยี่ยมชมได้ เทียบได้กับปกหนังสือ
เว็บบราวเซอร์ (Web Browser) คือ โปรแกรมที่อยู่บนเครื่องของผู้ใช้ที่ทำการติดต่อผ่านเครือข่ายคอมพิวเตอร์เพื่อเรียกใช้และแปลผลเอกสารที่เขียนด้วยภาษา HTML มาแสดงผลบนหน้าจอคอมพิวเตอร์
ปัจจุบันเว็บบราวเซอร์ที่ได้รับความนิยม ได้แก่ Internet Explorer, Netscape, Firefox
| ประเภทของเว็บเพจ สามารถแบ่งออกเป็น 2 ประเภท ดังนี้ 1. สแตติกเว็บเพจ (Static Web Page) เป็นเว็บเพจที่แสดงภาพและข้อมูลโดยไม่มี การเคลื่อนไหว 2. ไดนามิกเว็บเพจ (Dynamic Web Page) เป็นเว็บเพจที่แสดงภาพ ข้อมูล เสียงประกอบ ภาพเคลื่อนไหว และโต้ตอบกับผู้ใช้งานได้ ทำให้ เว็บเพจมีการเปลี่ยนแปลงเคลื่อนไหวอยู่ตลอดเวลา ผู้ใช้จะรู้สึกถึงการมีปฏิสัมพันธ์กับเว็บเพจนั้น | 
ที่มา : http://www.ipst.ac.th/library
|
หลักการออกแบบเว็บเพจ
การออกแบบเว็บเพจนั้น จะต้องเข้าใจทั้งทางด้านเทคนิควิธีการ และรูปแบบด้านองค์ประกอบของสิ่งที่จะนำเสนอประกอบกัน โรบิน วิลเลี่ยมได้เขียนแนวคิดของการออกแบบสิ่งพิมพ์ไว้ในหนังสือชื่อ The Non-Designer's Design Book ซึ่งสามารถนำมาสรุปเป็นหลักการออกแบบเว็บเพจโดยใช้กฎพื้นฐาน 4 ข้อ ดังนี้
1. กฎข้อที่หนึ่ง ความแปลกแตกต่าง (contrast)
กฎข้อนี้เน้นการออกแบบเว็บเพจให้มีความแปลก หลีกเลี่ยงการใช้องค์ประกอบบนจอภาพที่ดูคล้ายๆ กัน เช่น การใช้ตัวอักษร สี ขนาด ความหนาของเส้น รูปร่าง ที่ว่างบนจอ ฯลฯ ถ้าองค์ประกอบของเนื้อหาไม่ใช่สิ่งเดียวกัน ก็ควรสร้างให้เห็นความแปลกแตกต่างอย่างชัดเจน
2. กฎข้อที่สอง การย้ำซ้ำ (repetition)
ในการออกแบบเว็บเพจจะต้องมีแบบแผนหรือมีการกำหนดรูปแบบของผู้สร้างเอง จะช่วยให้เว็บเพจนั้นมีความสอดคล้องกันทั้งหมด เช่น การกำหนดรูปแบบ การให้สี การสร้างรูปร่าง การกำหนดพื้นหลัง ความสัมพันธ์ของระยะห่าง ขนาด ความหนาของตัวอักษร เป็นต้น การออกแบบด้วยการย้ำซ้ำจะต้องเน้นให้เห็นว่า ในการออกแบบเว็บเพจแต่ละหน้าในเว็บไซด์เดียวกันจะต้องมีรูปแบบเดียวกัน
3. กฎข้อที่สาม การจัดแถว วางแนว (alignment)
การจัดวางองค์ประกอบควรจะจัดให้เป็นระเบียบ โดยพิจารณาถึงองค์ประกอบที่อยู่ตามแถว หรือแนวเดียวกันเสมอ จะทำให้เว็บเพจดูสะอาดตา นำสมัย และไม่ขัดกับความรู้สึกของผู้ใช้
4. กฎข้อที่สี่ ความใกล้เคียง ความเกี่ยวเนื่อง (proximity)
กฎข้อนี้กำหนดให้วัตถุต่าง ๆ ที่อยู่บนเว็บเพจมีความเป็นระเบียบเกี่ยวเนื่องกัน จะทำให้มองเห็นได้ง่าย
ไม่กระจัดกระจาย การรวมกลุ่มเป็นวิธีการลดความยุ่งเหยิง สร้างความเป็นระเบียบ
การวางองค์ประกอบของเว็บเพจนั้นเป็นทั้งศาสตร์และศิลป์ ผู้เขียนเว็บเพจต้องเข้าใจเทคนิคการเขียนโครงสร้างภาษา HTML การใช้เทคนิคที่น่าสนใจ เช่น การสร้างภาพ การสร้างเงา สี เป็นต้น รวมถึงการนำองค์ประกอบทางศิลปะมาใช้ การนำกฎทั้ง 4 ข้อไปใช้ในการออกแบบเว็บเพจนั้นไม่ควรเน้นข้อใดข้อหนึ่ง แต่ควรพิจารณาให้สอดคล้องกัน
ไม่มีความคิดเห็น:
แสดงความคิดเห็น