บทที่ 8 การสร้างตาราง

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

การสร้างตาราง

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

คำสั่งที่ใช้ในการสร้างตาราง

โครงสร้างของตารางนั้นจะประกอบไปด้วยแถวและคอลัมถ์ โดยช่องที่อยู่ในแนวนอนเดียวกันก็คือแถว และช่อง
ข้อมูลที่อยู่ตรงกันในแนวตั้งคือคอลัมถ์นั่นเอง โดยใช้คำสั่งต่าง ๆ เป็นตัวกำหนดตำแหน่งของแถวและสดมภ์ โดย
รูปแบบของคำสั่งที่เกี่ยวกับตารางมีดังนี้
* TABLE กำหนดการสร้างตาราง และคำสั่งปิดคือ / TABLE
* CAPTION การกำหนดคำ หรือ ข้อความอธิบายตาราง และมีคำสั่งปิดคือ /CAPTION
* TR (Table Row) เป็นการกำหนดแถวของตาราง และคำสั่งปิดคือ /TR
* TH (Table Head) เป็นการกำหนดหัวเรื่องในคอลัมถ์ และคำสั่งปิดคือ /TH
*TD (Table)เป็นการกำหนดข้อมูลในแต่ละสดมภ์ในตาราง และคำสั่งปิดคือ /TD
การใช้งานคำสั่ง ถ้าทำการเปิดด้วยคำสั่งใด ต้องทำการเปิดด้วยคำสั่งนั้นก่อนเช่นเดียวกับการเปิด/ปิดวงเล็บของ

สมการทางคณิตศาสตร์

องตารางข้างต้น สามารภสรุปจำนวนของแถวและสดมภ์ได้ คือ มีจำนวนแถวเท่ากับ 3
และมีจำนวนสดมภ์เท่ากับ 2

การกำหนดเส้นขอบของตาราง

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

ตัวอย่าง การกำหนดเส้นขอบของตาราง

รูปแสดงการสร้างตารางโดยกำหนดขนาดของเส้นกรอบข้อมูล

ตัวอย่าง การกำหนดสีเส้นขอบของตาราง

รูป แสดงการสร้างตารางโดยกำหนดขนาดเส้นสีของเส้นกรอบข้อมูล

การกำหนดความกว้างและความสูงของตาราง

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

ตังอย่าง กำหนดความกว้างและความสูงของตาราง

รูปแสดงการสร้างตารางโดยกำหนดความกว้างและความสูงของตาราง

การกำนดระยะเว้นขอบภายในเซลข้อมูล

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

ตัวอย่าง การกำหนดระยะเว้นขอบภายในเซลข้อมูล

รูปแสดงการสร้างตารางโดยกำหนดระยะเว้นของภายในของแต่ละข้อมูล

การกำหนดตำแหน่งของตาราง

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

ตัวอย่าง การกำหนดตำแหน่งของตาราง

รูปแสดงการสร้างตารางโดยกำหนดตำแหน่งของการจัดวางตาราง

การใส่รูปภาพลงในตาราง

การใส่รูปภาพในตารางก็คล้ายกับการใส่ข้อความไว้ในตาราง ฏดดยใช้คำสั่ง IMG SRC = "Image File" ไว้ในคำสั่ง TD


ตัวอย่าง การใส่รูปภาพในตาราง

บทที่ 9 การการสร้างเฟรม

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

การแบ่งส่วนของจอภาพ

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

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

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

จากตัวอย่างเป็นการแบ่งเฟรมแบบสองแถว โดยกำหนดให้แถวแรกสูงเท่ากับส่วนที่เหลือจากแถวแรกทั้งหมด

จากตัวอย่างเป็นการแบ่งเฟรมแบบ 2 แถวแรก สูง 30% ของหน้าจอส่วนแถวที่เหลือมีความสูง 70% ของหน้าจอ
การกำหนดหน้าที่และการแสดงผลใน Frame

รูปแบบคำสั่ง

ตัวอย่างเช่น หากต้องการสร้างเอกสารเว็บที่มีลักษณะเป็นเฟรม โดยแบ่งเฟรมออกตามแนวนอน โดยนำแฟ้มข้อมูล
Frame1.html ดังแสดงในรูปที่ 9.1 และ Frame2.html ดังแสดงในรูปที่ 9.2 มาแสดงรวมกันในหน้าจอของโปรแกรมเว็บ
เบราเซอร์เดียวกัน สามารถทำได้ดังแสดงในรูปที่ 9.3

รูป แสดงข้อมูลของเอกสารเอชทีเอ็มแอล Frame2.html

ตัวอย่าง การสร้างเอกสารเว็บโดยกำหนดเฟรมตามแนวนอน

COLS เป็นการกำหนดเฟรมโดยแบ่งตามแนวตั้งของหน้าจอ ซึ่งสามารถกำหนดขนาดได้ 2 วิธี คือแบบกำหนดเป็นพิกเซล
(Pixel) กับการกำหนดเป็นเปอร์เซ็นต์ เช่นเดียวกับคำสั่ง ROWS สามารถแสดงรูปแบบการใช้งานคำสั่งได้ดังนี้

คำสั่งย่อยที่อยู่ภายใต้คำสั่ง FRAMESET

1.FRAME SRC = "ชื่อไฟล์ที่ต้องการแสดง"เป็นการกำหนดว่าส่วนที่ถูกแบ่งออกเป็นส่วนย่อยนั้นจะนำแฟ้มข้อมูลใดไป
แสดง โดยสามารถแสดงได้ทั้งแฟ้มข้อมูลที่เป็นภาษาเอชทีเอ็มแอล(.html,.htm)หรือแฟ้มข้อมูลรูปภาพ(.gif,.jpg)

2.NOFRAME คำสั่งนี้จะถูกเรียกใช้งานเมื่อ เว็บเพจนั้นถูกนำไปแสดงผลบนโปรแกรมเว็บเบราเซอร์รุ่นเก่าที่ไม่สามารถ
แสดงผลเป็นแบบเฟรมได้ โดยจะนำเอาข้อมูลที่อยู่ภายใต้คำสั่งนี้ไปแสดงผลที่จอภาพแทนการนำข้อมูลที่เป็นลักษณะ
เฟรมมาแสดงผล
3.FRAMESET ใช้สำหรับการแบ่งเฟรมที่ได้ทำการแบ่งเรียบร้อยแล้ว ออกเป็นเฟรมย่อยซ้อนไปอีชั้นหนึ่ง โดยจะมีรูป
แบบเช่นเดียวกับคำสั่ง FRAMESET ทุกประการ สามารถแสดงได้ดังนี้
* FRAMESET ROWS = "pixels,%*",หรือ
* FRAMESET COLS = "pixels,%*",

การกำหนดพื้นที่วางรอบเฟรม

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

การกำหนดค่าตัวเลื่อน

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

ตัวอย่าง การกำหนดค่าตัวเลื่อนแบบ Auto

รูปแสดงรูปแบบการใช้งานคำสั่งโดยการกำหนดค่าตัวเลื่อนเป็นค่ามาตรฐานหรือ AUTO

ตัวอย่าง การกำหนดค่าตัวเลื่อนเป็น NO (ไม่แสดงตัวเลื่อน)

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

ตัวอย่าง การปรับขนาดของเฟรม

รูปแสดงรูปแบบการใช้งานคำสั่งโดยไม่ระบุการปรับเปลี่ยนขนาดของเฟรมที่ 3
ตัวอย่าง ไม่สามารถปรับขนาดของเฟรมได้

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

ตัวอย่าง การแสดงเส้นขอบของเฟรม

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

รูปแบบการใช้งานร่วมกับ แฟ้มข้อมูลเอชทีเอ็มแอล แบบสมบูรณ์ สามารถแสดงได้ดังนี้

จากตัวอย่างภาษาเอชทีเอ็มแอล หน้าจอของโปรแกรมเว็บเบราเซอร์ที่ใช้สำหรับแสดงผลนั้น สามารถแบ่งออก
เป็น 3 ส่วนคือ
1.เฟรมทางด้านบน จะนำเอาแฟ้มข้อมุลที่ชื่อว่า "frame1.html" มาแสดงผลโดยกำหนดให้มีความสูงเท่ากับ 80 พิกเซล
และตั้งชื่อเฟรมนี้ว่า "logo"
2.เฟรมทางด้านซ้าย จะเป็นส่วนของเมนูโดยจะนำเอาแฟ้มข้อมูล "menu.html" มาแสดงผล โดยเฟรมนี้จะมีความกว้าง
เท่ากับ 120 พิกเซล และตั้งชื่อเฟรมนี้ว่า "menu"
3.เฟรมทางด้านขวา จะนำเอาแฟ้มข้อมูลที่ชื่อว่า "frame3.html" มาแสดงผลวึ่งความกว้างของเฟรมนี้จะมีค่าเท่ากับส่วน
ที่เหลือจากเฟรมแรกทั้งหมด และตั้งชื่อเฟรมนี้ว่า "data"

บทที่ 10 การนำเสนอในระบบอินเทอร์เน็ต

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

เว็บเซอร์เวอร์

เครื่องคอมพิวเตอร์ที่ทำหน้าที่ในการให้บริการบนระบบเครือข่ายนั้น มีชื่อเรียกว่าเครื่องคอมพิวเตอร์แม่ข่ายหรือ
เครื่องเซอร์เวอร์ (Server)ตัวอย่างเช่นเครื่องที่ให้บริการสำหรับเป็นแม่ข่ายของระบบจดหมายอิเล็กทรอนิกส์ มีชื่อเรียกว่า
เมล์เซอร์เวอร์ (Mailserver)เครื่องที่ให้บริการสำหรับการเก็บแฟ้มข้อมูล ที่เรียกชื่อว่า ไฟล์เวอร์เวอร์ (Files Server)สำหรับ
ระบบเว็บเพจนั้นเครื่องคอมพิวเตอร์ที่ทำหน้าที่สำหรับให้บริการสำหรับระบบนี้คือ เว็บเซอร์เวอร์ (Web server)
เว็บเซอร์เวอร์จะเป็นเครื่องแม่ข่าย ที่ทำหน้าที่ให้บริการข้อมูลเกี่ยวกับระบบเว็บเพจ โดยจะทำหน้าที่เก็บข้อมูลต่าง ๆ
สำหรับให้ผู้อื่นทำการเรียกดูผ่านทางโปรแกรมเว็บเบราเซอร์กล่าวคือข้อมูลใดที่ต้องการเผยแพร่ผ่านทางระบบเว็บเพจนั้น
จะต้องนำข้อมูลเหล่านั้นมาเก็บไว้ในเครื่องคอมพิวเตอร์ที่ทำหน้าที่เป็นเว็บเบราเซอร์
การที่จะทำในเครื่องคอมพิวเตอร์เครื่องหนึ่ง ทำหน้าที่เป็้นเครื่องคอมพิวเตอร์แม่ข่ายที่ให้บริการเกี่ยวกับระบบเว็บ
เพจนั้น จะต้องทำการติดตั้งโปรแกรมที่ทำหน้าที่ให้บริการเกี่ยวกับระบบเว็บเพจเข้าไปด้วย โปรแกรมที่เป็นท่รู้จักกันเช่น
โปรแกรมอาปาเช่ เว็บเซอร์เวอร์ (Apache Web Server)และโปรแกรมไอไอเอส (IIs: Internet Information Server)
ของบริษัทไมโครซอฟต์เป็นต้น
โดยทั่วไปแล้ว ระบบปฏิบัติการที่ถูกออกแบบมาสำหรับใช้ติดตั้งบนเครื่องสคอมพิวเตอร์แม่ข่าย เช่น Windows XP
professional,Windows 2000 Server,Windows 2003 Server จะสามารถทำการเพิ่มเติมระบบรองรับที่ทำหน้าที่เป็น
เครื่องเว็บเซอร์เวอร์ได้โดยง่าย ซึ่งในกลุ่มระบบปฏิบัติการวินโดวส์นั้น โปรแกรมที่ทำหน้าที่ให้บริการทางด้านนี้คือ
โปรแกรมไอไอเอส บนระบบปฏิการ Windows XP Professional ซึ่งมีขั้นตอนดังนี้
1.เปิดกลุ่มของโปรแกรม Control Panal
2.เลือก Add and Remove Programs
3.เลือก Add/Remove Windows Component
4.เลือก Internet Information Server (IIs)
5.เลือก Next เป็นขั้นตอยสุดท้าย
เมื่อทำการติดตั้งโปรแกรมไอไอเอส (IIs)เรียบร้อยแล้ว สามารถทำการทดสอบได้โดยเปิดโปรแกรมเว็บเบราเซอร์
แล้วทำการเปิดที่ URL http://localhost หากทำการติดตั้งเรียบร้อยแล้ว

การนำข้อมูลเข้าสู่เว็บเซอร์เวอร์

เมื่อทำการติดตั้งโปรแกรมที่ทำหน้าที่เป็นเว็บเซอร์เวอร์แล้ว วิธีการสำหรับนำขอมูลต่าง ๆ เข้าสู่เครื่องคอมพิวเตอร์
แม่ข่ายเพื่อจะนำเผยแพร่สู่ระบบทั้งหมด เข้าไปเก็บไว้ยังตำแหน่งที่โปรแกรมที่ให้บริการเหล่านั้นจัดเตรียมไว้
ตัวอย่างเช่น โปรแกรมไอไอเอส (IIs)ตำแหน่งของที่เก็บข้อมูลที่ต้องการนำเสนอเข้าสู่ยังระบบเครือข่ายอินเตอร์เน็ต
นั้น จะถูกเก็บไว้ที่ตำแหน่งของดฟล์เดอร์ที่ชื่อว่า Interpub/wwwrooot การนำข้อมูลเข้าสู่ระบบสามารถทำได้โดย คัดลอก
แฟ้มข้อมูลเข้าไปเก็บไว้ยังโฟล์เดอร์นี้เท่านั้นโดยแฟ้มข้อมูลที่เเป็นหน้าที่แรกของเว็บไซต์นั้น โดยปกติจะชื่อว่า default.html,index.html,default.htm, iisstart.asp เป็นต้น ซึ่งสามารถกำหนดชื่อแฟ้มข้อมูลมาตรฐานในภายหลังได้
เมื่อทำการคัดลอกแฟ้มข้อมูลเข้าไปเก็บไว้ยังตำแหน่งที่เตรียมแล้วนั้น สามารถทำการทดสอบได้โดยเปิดโปรแกรม
เว็บเบราเซอร์ จากนั้นทำการพิมพ์ตำแหน่งของ ยูอาร์แอล (URL)เป็น http://localhost ก็จะปรากฏข้อมูลเว็บเพจที่ต้องการ
นำเสนอในระบบเว็บเพจของเครื่องนั้น สำหรับการทดสอบของเครื่องคอมพิวเตอร์ข้างเคียง สามารถทำได้โดยการเปลี่ยน
จากข้อความว่า Iocalhost เป็นหมายเลขไอพีแอดเรส (IP Address) ที่เป็นหมายเลขของเครื่อง คอมพิวเตอร์ที่เก็บข้อมูล
ตัวอย่างเช่น http:// 5203.158.106.44 เป็นต้น เมื่อหมายเลขไอพีของคอมพิวเตอร์ที่เก็ยข้อมูล ตัวอย่างเช่น คือ
203.158.106.44
สำหรับการนำข้อมูลเข้าสู่เครื่องเว็้บเซอรืที่หน่วยงานอื่นรับผิดชอบ ไม่ว่าจะเป็นหน่วยงานที่ให้บริการฟรี หรือ
หน่วยงานที่คิดค่าบริการรายเดือน จะต้องทำการติดต่อผู้บริหารเครื่องเว้บเซอร์ของหน่วยงานนั้น เพื่อสอบถามถึงวิธี
การนำข้อมูลเข้าไปยังเครื่องเว็บเซอร์เวอร์ซึ่งแต่ละหน่วยงานก็จะมีวิธีการต่างกันออกไป

เว็บไซค์ที่ให้บริการนำเสนอข้อมูลในระบบเครือข่ายอินเตอร์เน็ต

การที่จะนำข้อมูลเผยแพร่สู่ระบบครือข่ายอินเตอรืเน็ตนั้น จำเป็นต้องมีเครื่องคอมพิวเตอรืแม่ข่ายที่ทำหน้าที่เป็นเว็บ
เซอร์เวอร์ หากไม่มีเครื่องคอมพิวเตอร์แม่ข่ายที่ให้บริการรนี้ก็ไม่ใช้เรื่องใหญ่ในการนำเสนอข้อมูลเข้าสู่ระบบเครือข่าย
ปัจจุบันจะมีหน่วยงานที่ให้บริการเกี่ยวกับการให้พื้นที่สำหรับเป็นที่เก็บข้อมูลที่จะนำเสนอเข้าสู่ระบบเครือข่าย ซึ่งมีทั้งที่ให้
บริการฟรี (Free Web Hosting)และเก็บค่าบริการรายเดือน
กรณีของหน่วยงานที่ให้บริการโดยไม่คิดมูลค่านั้นอาจจะมีข้อจำกัดในเรื่องขนาดพื้นที่สำหรับเก็บข้อมูลหรืออาจมีการ
ขอลงโฆษณาลงในเว็บไซค์ของผู้ที่นำข้อมูลไปฝากเป็นการแลกเปลี่ยนแต่ก็เหมาะสำหรับผู้ที่ทดลองจะทำเว็บไซค์ของ
ตนเองแต่ไม่มีเครื่องคอมพิวเตอร์แม่ข่ายตัวอย่างเช่น www.thai.net,www.geocities.com/เป็นต้น
ส่วนหน่วยงานที่ให้บริการโดยคิดค่าบริการรายเดือนนั้น จะสามารถเก็บข้อมูลได้มากขึ้นและมีระบบรองรับต่าง ๆ
มากมายเช่นรองรับระบบฐานข้อมูลเป็นต้น อีกทั้งยังมีผู้คอยให้คำปรึกษาเกี่ยวกับการนำข้อมูลเข้าสู่ระบบ ซึ่งเหมาะ
สำหรับหน่วยงานขนาดเล็กที่ต้องการนำเสนอข้อมูลของหน่วยงานเข้าสู่ระบบเครือข่ายอินเตอรืเน็ต หน่วยงานที่ให้บริการ
ทางด้านนี้ เช่น www.nowthai.com,www.bythailand.com เป็นต้น
การนำเสนอข้อมูลเข้าสู่ระบบเครือข่ายอินเตอร์เน็ตโดยอาศัยเครื่องคอมพิวเตอรืแม่ข่ายของหน่วยงานที่ให้บริการ
เหล่านี้ข้อกำหนดของแต่ละหน่วยงานจะเป็นผู้กำหนดขึ้นมาเอง โดยทั่วไปแล้วจะมีวิธีการใช้งานอธิบายในเว็บไซค์
ของหน่วยงานที่ให้บริการนั้น

บทที่ 1 การทำงานของระบบเว็บเพจ

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

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

ความหมายของอินเตอร์เน็ต

“อินเตอร์เน็ต” มาจากคำว่าInternational Networkเป็นเครือข่ายของการสื่อสารข้อมูลขนาดใหญ่ อันประกอบด้วย เครือข่ายคอมพิวเตอร์จำนวนมาก เชื่อมโยงแหล่งข้อมูลจากองค์กรต่างๆ ทั่วโลกเข้าด้วยกัน
คำว่า “เครือข่าย” หมายถึง
1. การที่มีคอมพิวเตอร์ตั้งแต่ 2 เครื่องขึ้นไป เชื่อมต่อเข้าด้วยกันด้วยสายเคเบิล(ทางตรง) และหรือสายโทรศัพท์ (ทางอ้อม)
2. มีผู้ใช้คอมพิวเตอร์
3. มีการถ่ายเทข้อมูลระหว่างกัน

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

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

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

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

หมายเลขไอพี

หมายเลขไอพี หรือ ไอพีแอดเดรส (IP Address, Internet Protocol address) คือหมายเลขค่าหนึ่งใช้ในระบบเครือข่าย ที่ใช้โปรโตคอล Internet Protocol คล้ายกับหมายเลขโทรศัพท์ ที่เครื่องคอมพิวเตอร์ เครื่องเราท์เตอร์ เครื่องแฟกซ์ จะมีหมายเลขเฉพาะตัวโดยใช้เลขฐานสอง จำนวน 32 บิต โดยการเขียนจะเขียนเป็นชุด 4 ชุด โดยแต่ละชุดจะใช้เลขฐานสองจำนวน 8 บิต ซึ่งโดยทั่วไปแล้วผู้คนส่วนใหญ่จะคุ้นเคยกับระบบเลขฐานสิบจึงมักแสดงผลโดยการใช้เลขฐานสิบจำนวน 4 ชุด ซึ่งแสดงถึงหมายเลขเฉพาะของเครื่องนั้น สำหรับการส่งข้อมูลภายในเครือข่ายแลน แวนหรือ อินเทอร์เน็ต โดย หมายเลขไอพีมีไว้เพื่อให้ผู้ส่งรู้ว่าเครื่องของผู้รับ คือใคร และผู้รับสามารถรู้ได้ว่าผู้ส่งคือใคร
ตัวอย่างของหมายเลขไอพี ได้แก่ 207.142.131.236 ซึ่งเมื่อแปลงกลับมาในรูปแบบที่อ่านได้จะเรียกว่า โดเมนแอด- เดรส ผ่านทาง โดเมนเนมซีสเทม (Domain Name System) ซึ่งหมายเลขนั้นหมายถึง www.wikipedia.org ไอพีเวอร์ชัน 4 ระบบตัวเลขไอพีที่ใช้ในปัจจุบันเป็นระบบ ไอพีเวอร์ชั่นที่ 4 ซึ่งจะเป็นระบบ 32 บิตหรือสามารถ ระบุเลขไอพีได้ตั้ง 0.0.0.0 ถึง 255.255.255.255 (ตัวเลขบางตัวเป็นไอพีสงวนไว้สำหรับหน้าที่เฉพาะเช่น 127.0.0.0 จะเป็นการระบุถึงตัวอุปกรณ์เองไม่ว่าอุปกรณ์นั้นจะมีไอพีสื่อสารจริงๆเป็นเท่าไร) อย่างไรก็ตามจากระบบตัวเลขที่จำกัด นี้สามารถเพิ่มขยายด้วยเทคนิคของไอพีส่วนตัว (private IP) กับการแปลงไอพี (Network Address Translation หรือ NAT) ไอพีเวอร์ชัน 6 ถูกพัฒนาขึ้นมาด้วยจุดประสงค์หลักในการแก้ปัญหาการขาดแคลนจำนวนหมายเลขไอพีซึ่งกำหนด โดยมาตรฐานไอพีเวอร์ชั่นที่ 4 ซึ่งในมาตรฐานของเวอร์ชั่น 6 นี้จะใช้ระบบ 128 บิตในการระบุหมายเลยไอพี

ระบบชื่อโดเมน
ระบบชื่อโดเมน (Domain Name System) หรือ ดีเอ็นเอส (DNS) เป็นระบบการตั้งชื่อให้กับ "ทรัพยากรเครือข่าย” แต่ที่พบโดยทั่วไปคือ การตั้งชื่อโฮสต์เพื่อใช้แทนไอพีแอดเดรส ดีเอ็นเอสเป็นระบบชื่อที่มีฐานข้อมูลแบบกระจาย โดยไม่มีหน่วยงานหรือสถาบันใดควบคุมหรือมีฐานข้อมูลเดี่ยว ครอบคลุมทั้งอินเทอร์เน็ต แต่ละเครือข่ายใน อินเทอร์เน็ตจะมีดีเอ็นเอสเซอร์ฟเวอร ์เก็บรักษาฐานข้อมูลและบริหารข้อมูล อย่างอิสระเพื่อให้ไคลเอ็นต์ขอบริการ สอบถามข้อมูลตามแบบโปรโตคอลที่กำหนด ดีเอ็นเอสจึงเป็นทั้งระบบการตั้งชื่อและโปรโตคอลรวมอยู่ด้วยกันการติดต่อ กับผู้ใช้งานประจำเครื่องใดๆ เช่นการส่งอิเล็กทรอนิกส์เมลอาจใช้ ไอพีแอดเดรสระบุถึงคอมพิวเตอร์ปลายทาง ได้เช่น somchai@176.16.0.1 หรือใช้เบราเซอร์เปิดอ่านเว็บเพจโดยใช้ http://192.0.34.65 แต่การใช้ไอพีแอดเดรสดังตัวอย่าง ที่กล่าวมานั้น ไม่อำนวยสะดวกต่อการจดจำ ในอินเทอร์เน็ตจึงใช้วิธีตั้งชื่อให้กับเครื่องเพื่อให้ผู้ใช้จดจำ ได้ง่ายกว่าตัวอย่างเช่นอีเมลแอดเดรสข้างต้นอาจเขียนแทนด้วย somchai@ku.ac.th หรือการเปิดอ่านเว็บเพจโดยใช้ http://www.isoc.org/เมื่อใช้ชื่อแทนไอพีแอดเดรสสำหรับเรียกใช้บริการหนึ่งๆ โปรแกรมประยุกต์ที่เกี่ยวข้องกับบริการนั้นจะใช้ กลไกของ ระบบเพื่อแปลงชื่อไปเป็นไอพีแอดเดรส และนำไอพีแอดเดรสนั้นติดต่อไปยัง คอมพิวเตอร์ปลายทางต่อไป

รูปแบบการเขียน

การเขียนชื่อคอมพิวเตอร์ประจำโดเมนใดๆจะเริ่มต้นจากชื่อเครื่องตามด้วยชื่อโดเมนย่อยที่คั่นด้วยจุดและปิดท้าย ด้วยจุดซึ่งแสดงถึงจุดบนสุดหรือเรียกว่า ราก (root) เครื่องหมายจุดเป็นสัญลักษณ์ที่ใช้ระบุว่าชื่อได้สิ้นสุดโดยไม่มีชื่อต่อท้ายอีกและเรียกชื่อชื่อนั้นว่าเป็นชื่อสัมบูรณ์ (absolute name) ทั้งนี้เพื่อป้องกันความสับสนกับชื่อที่เขียนแบบสัมพัทธ์ ตัวอย่างเช่นชื่อ www.moe.go.th. มีความหมายดังต่อไปนี้
www ชื่อเครื่อง (host name)
moe ชื่อโดเมนกระทรวงศึกษาธิการ
go ชื่อโดเมนในหมวดหน่วยงานราชการ
th ชื่อโดเมนสัญชาติไทย
. สัญลักษณ์แทนราก

เทคโนโลยีเว็บเพจ

การนำเสนอข้อมูลในระบบ WWW (World Wide Web) พัฒนาขึ้นมาในช่วงปลายปี 1989 โดยทิม เบอร์เนอร์ ลี นักวิศวกรรมซอฟต์แวร์ จาก ห้องปฏิบัติการทางจุลภาคฟิสิกส์แห่งยุโรป (EuropeanParticle Physics Labs) หรือที่รู้จักกัน ในนาม CERN (Conseil European pour la Recherche Nucleaire) ประเทศสวิตเซอร์แลนด์ และได้มีการพัฒนาภาษา ที่ใช้สนับสนุน การเผยแพร่เอกสาร ของนักวิจัย หรือเอกสารเว็บ (Web Document) จากเครื่องแม่ข่าย (Server) ไปยังสถานที่ต่างๆ ในระบบ WWW เรียกว่า ภาษา HTML (HyperText Markup Language)
การเผยแพร่ข้อมูลทางอินเทอร์เน็ต ผ่านสื่อประเภทเว็บเพจ (WebPage) เป็นที่นิยมกันอย่างสูงในปัจจุบันไม่ เฉพาะข้อมูลโฆษณาสินค้า ยังรวมไปถึงข้อมูลทางการแพทย์ การเรียน งานวิจัยต่างๆ เพราะเข้าถึงกลุ่มผู้สนใจได้ทั่วโลก ตลอดจนข้อมูลที่นำเสนอออกไป สามารถเผยแพร่ได้ทั้งข้อมูลตัวอักษร ข้อมูลภาพ ข้อมูลเสียง และภาพเคลื่อนไหว มีลูก เล่นและ เทคนิคการนำเสนอที่หลากหลาย อันส่งผลให้ระบบ WWW เติบโตเป็นหนึ่ง ในรูปแบบบริการ ที่ได้รับความ นิยมสูงสุด ของระบบอินเทอร์เน็ต

ลักษณะเด่นของการนำเสนอข้อมูลเว็บเพจ คือ สามารถเชื่อมโยงข้อมูล ไปยังจุดอื่นๆ บนหน้าเว็บได้ ตลอดจน สามารถ เชื่อมโยงไปยังเว็บอื่นๆ ในระบบเครือข่าย อันเป็นที่มาของคำว่า HyperText หรือข้อความที่มีความสามารถ มากกว่า ข้อความปกตินั่นเอง จึงมีลักษณะคล้ายกับว่าผู้อ่านเอกสารเว็บ สามารถโต้ตอบกับเอกสารนั้นๆ ด้วยตนเอง ตลอดเวลาที่มีการใช้งานนั่นเอง ด้วยความสามารถดังกล่าวข้างต้น จึงมีผู้ให้คำนิยาม Web ไว้ดังนี้
"World Wide Web as a global, interactive, cross-platform, distributed, graphical hypertext information system that
runs over the Internet."

The Web is a Graphical Hypertext Information System.

การนำเสนอข้อมูลผ่านเว็บ เป็นการนำเสนอด้วยข้อมูลที่สามารถเรียกหรือโยงไปยังจุดอื่นๆ ในระบบกราฟิกซึ่งทำ ให้ข้อมูลนั้นๆ มีจุดดึงดูดให้น่าเรียกดู The Web is interactive.
การทำงานบนเว็บเป็นการทำงานแบบโต้ตอบกับผู้ใช้โดยธรรมชาติอยู่แล้ว ดังนั้นเว็บจึงเป็นระบบ Interactive ในตัวมันเอง เริ่มตั้งแต่ผู้ใช้เปิดโปรแกรมดูผลเว็บ (Browser) พิมพ์ชื่อเรียกเว็บ (URL : Uniform Resource Locator) เมื่อเอกสารเว็บแสดงผลผ่าน เบราเซอร์ ผู้ใช้ก็สามารถคลิกเลือกรายการ หรือข้อมูลที่สนใจ อันเป็นการทำงานแบบ โต้ตอบไปในตัวนั่นเอง

ภาษาเอชทีเอ็มแอล

เอชทีเอ็มแอล (HTML) เป็นภาษาคอมพิวเตอร์ที่ใช้สร้างเว็บเพจ ย่อมาจาก HyperText Markup Language เว็บเพจ
คือ เอกสารเอชทีเอ็มแอลที่ประกอบด้วยข้อความและแท็กเอชทีเอ็มแอล (HTML tags) เว็บเบราว์เซอร์จะแปลความหมาย
ของแท็กที่อยู่ในเอกสารเอชทีเอ็มแอล แล้วแสดงเอกสารออกมาเป็นเว็บเพจ

โปรแกรมสร้างเอกสารเว็บ

โปรแกรมสร้างเอกสารเว็บ การพัฒนาเว็บเพจ หรือเอกสารเว็บนับเป็นศาสตร์หนึ่งที่นักคอมพิวเตอร์ และผู้สนใจ ทั่วไปสนใจที่จะศึกษา เพื่อสร้างสรรค์ผลงานชิ้นงานในดวงใจ ผ่านเครือข่ายอินเทอร์เน็ต เผยแพร่สู่สายตามวลชน อย่างกว้างไกล แต่เดิมการพัฒนาเว็บเพจจะอาศัยโปรแกรมประเภท Text Editor โดยผู้พัฒนาจะต้องศึกษาภาษา HTML(HyperText Markup Language) ซึ่งสร้างภาระให้กับผู้สนใจในกลุ่มที่ไม่ได้ศึกษาด้านไอทีมาโดยตรง รวมทั้งปัจจุบัน เทคโนโลยีเว็บเพจได้เปลี่ยนรูปแบบ มีการนำภาษาคอมพิวเตอร์ เช่น VBScript, JavaScript, Java ฯลฯ มาผสมผสาน เพื่อเพิ่มประสิทธิภาพของเว็บเพจ และฟังก์ชันการทำงานให้ตรงกับความต้องการมากขึ้นกว่าเดิม ดังนั้นเครื่องมือพัฒนา เว็บเพจ จึงเป็นหัวข้อหลักของโปรแกรมเมอร์สาขานี้ ที่จะพัฒนาออกมาเผยแพร่ให้กับผู้สนใจเพื่อเลือกใช้งาน

เครื่องมือพัฒนาเว็บเพจ ที่มีใช้งานในปัจจุบัน สามารถแบ่งได้ดังนี้

Simple Text Editors
HTML Enhanced Text Editors
WYSIWYG HTML Generator & Website Managers
Save AS HTML Capabilities
Browser-based HTML Editors
Web Server/Developer Platforms

การพัฒนาเว็บเพจด้วยการลงรหัส HTML ด้วยโปรแกรม Simple Text Editors

เครื่องมือพัฒนาเว็บลักษณะนี้นับเป็นเครื่องมือพื้นฐานที่สุด โดยจะอาศัยโปรแกรม Text Editor ต่างๆ ที่มักติดตั้ง มาพร้อมกับระบบปฏิบัติการ (Operating System; OS) เช่น QEdit, Editor, NotePad, WordPad, vi editor, pico editor, SimpleText เป็นเครื่องมือลงรหัสคำสั่ง HTML หรือภาษาอื่นๆ ตามแต่ลักษณะของเว็บที่ต้องการนำเสนอ โดยผู้พัฒนา จะต้องมีความรู้เกี่ยวกับการใช้งานโปรแกรมเหล่านี้ ความรู้เกี่ยวกับภาษาพัฒนาเว็บต่างๆ รวมทั้งความคิดจินตนาการ ที่ตรงกับแผนการพัฒนาที่กำหนดไว้ก่อนหน้า เนื่องจากผู้พัฒนาจะไม่สามารถเห็นผลลัพธ์ของเว็บได้ทันที
แม้ในปัจจุบันจะมีโปรแกรมช่วยเหลือในการพัฒนาเว็บออกมาอย่างมากมาย แต่นักพัฒนาเว็บระดับมืออาชีพส่วนมาก ก็ยังเลือกที่จะใช้ Text Editor กลุ่มนี้อยู่ เนื่องจากความคุ้นเคยในการลงรหัส ความสะดวกในการเรียกใช้งาน และแก้ไขเอกสาร ความสามารถในการควบคุมการจัดตำแหน่งเอกสารเพื่อการแก้ไขในภายหน้า และที่สำคัญที่สุดก็คือ ภาษา HTMLรวมทั้งภาษาพัฒนาเว็บอื่นๆ ยังมีการพัฒนาคำสั่งอยู่ตลอดเวลา การพัฒนาเว็บด้วยวิธีนี้ จึงสามารถลงรหัสคำสั่งใหม่ๆ ได้ ตามต้องการ ในขณะนี้โปรแกรมพัฒนาเว็บอื่นๆ อาจจะยังไม่รู้จักคำสั่งใหม่ๆ เหล่านี้
อย่างไรก็ตามวิธีนี้ ก็ไม่เหมาะสำหรับ ผู้พัฒนาในระดับต้น เพราะต้องศึกษาคำสั่ง HTML และใช้เวลาในการพัฒนาพอ สมควร ในแต่ละหน้าเว็บ ตลอดจนไม่เห็นผลลัพธ์ จากการป้อนคำสั่งทันที ต้องเรียกผ่านโปรแกรมเบราเซอร์