HTML คืออะไร
HTML มาจากคำว่า Hyper Text Markup Language เป็นรูปแบบของภาษาที่ใช้ในการเขียนโปรแกรมในเว็บเพจเพื่อแสดงผลบนเว็บบราวเซอร์ เกิดขึ้นจากการพัฒนาระบบ World Wide Web ลักษณะของภาษา HTML จะเป็นเท็กซ์ไฟล์ธรรมดาที่ต้องอาศัยการแปลความจากเว็บบราวเซอร์ ในรูปแบบต่างๆเพื่อให้แสดงผลเป็น ข้อความ รูปภาพ เสียง ภาพเคลื่อนไหว มัลติมิเดีย เป็นต้น
ในเดือนมีนาคม 1989 โดยนักวิจัยจากสถาบัน CERN (Conseil European Pour La Recherche Nucleaire) ซึ่งเป็นห้องทดลองในเมืองเจนีวา ประเทศสวิสเซอร์แลนด์ ชื่อ ทิม เบอร์เนอร์ - ลี (Tim Berners - Lee) ซึ่ง ทิม เบอร์เนอร์ - ลี ได้นำแนวความคิดในเรื่อง Hypertext ของ Vannevar Bush และ Ted Nelson มาใช้เพื่อกระจายข้อมูลในองค์กรต่อมามีการพัฒนาและกำหนดมาตรฐานโดยองค์กรที่ชื่อว่า W3C (World Wide Web Consortium)
ภาษา HTML เป็นภาษาที่มีลักษณะของข้อมูลที่เป็นตัวอักษรในมาตรฐานของรหัสแอสกี (ASCII Code) โดยเขียนอยู่ในรูปของเอกสารข้อความ (Text Document) จึงกำหนดรูปแบบและโครงสร้างได้ง่าย ภาษา HTML ได้ถูกพัฒนาขึ้นอย่างต่อเนื่องตั้งแต่ HTML Level 1 (รุ่นดั้งเดิม), HTML 2.0, HTML 3.0, HTML 3.2 และ HTML 4.0 HTML 4.01 ซึ่งเป็นรุ่นที่นิยมเขียนกันในปัจจุบัน (ขณะนี้ ได้พัฒนา HTML 5 ออกมาแล้ว) จึงทำให้ภาษา HTML ในปัจจุบันสามารถแสดงภาพทางกราฟิกระบบเสียงและมัลติมีเดียได้ เพื่อตอบสนองในการทำงานในปัจจุบัน
เครื่องมือที่ใช้ในการเขียนภาษา HTML สามารถสร้างขึ้นได้จากโปรแกรมสร้างไฟล์ข้อความ (Text Editor) ได้แก่ Notepad (มาพร้อมกับ Windows) ,Text Editor (อยู่ใน Mac) ,Aloha Editor , Adobe Dreamweaver , MacFlux, Maqetta และ EditPlus เป็นต้น ไฟล์ที่ได้จากการสร้างเอกสาร HTML มีขนาดเล็กนามสกุลของไฟล์ HTML เป็นไฟล์นามสกุล .htm หรือ .html
Tag คือคำสั่งของภาษา HTML ซึ่งโดยทั่วไปจะอยู่ในรูปแบบ <>……..> เว็บบราวเซอร์จะแปลงคำสั่งแล้วแสดงผลให้เห็น โดยปกติการพัฒนาเว็บไซต์ด้วยภาษา HTML โดยใช้ เอดีเตอร์ต่างๆ เช่น NotePad ของ Windows หรือโปรแกรม Editplus ซึ่งเป็นเรื่องที่ดีทำให้ผู้เขียนโปรแกรมเข้าใจโครงสร้างโดยรวมทั้งหมด โปรแกรมเมอร์จะต้องเข้าใจรูปแบบคำสั่งหรือแท็กของ HTML ทั้งหมด
โครงสร้างภาษา html
ตัวอย่างที่ 1 แสดงคำสั่งโครงสร้างตาราง
<html>
<head>
<title> โรงเรียนชะอวดวิทยาคาร </title>
</head>
<body>
คำสั่งหรือข้อความที่ต้องการแสดงผลบนเว็บบราวเซอร์
</body>
</html>
แสดงผลตัวอย่างที่ 1
1 คำสั่ง (tag) <html> ... </html>
เป็นคำสั่ง แรกที่จะต้องมีในเอกสาร และจะครอบคลุมคำสั่ง (tag) ต่างๆ คือ เอกสาร html ทุกเอกสารจะต้องขึ้นต้นด้วย <html> และ ปิดท้ายด้วย </html> แต่ละ file และคำสั่งอื่นๆ จะถูกเขียนอยู่ในคำสั่ง (tag) นี้ โดยจะมีคำสั่งหลักๆ อยู่ 2 คำสั่ง ก็คือ คำสั่ง (tag) head และbody
2 คำสั่ง (tag) <head> ... </head>
เป็นส่วนหัวเรื่องของเอกสาร ภายในจำเป็นจะมี คำสั่ง <title>... </title> ซึ่งจะเป็นคำสั่ง ผู้เขียน html นั้นใช้ตั้งเป็นไตเติ้ลสำหรับบอกโดยรวมว่าเอกสารนั้นต้องการเสนออะไร แล้วเวลาที่จะ bookmark ชื่อที่จะ save คือชื่อที่อยู่ใน คำสั่ง title นี้ ชื่อไตเติ้ลนี้จะต้องมีความยาวไม่เกิน 64 ตัวอักษร
3 คำสั่ง (tag) <body> ... </body>
เป็นคำสั่ง (tag) ที่บรรจุข้อมูลต่างๆ ที่ต้องการให้แสดงบน browser ไม่ว่าจะเป็น ข้อความ รูป ตาราง หรือคำสั่ง (tag) ที่ใช้ในการกำหนดรูปแบบของเอกสาร
4 คำสั่ง (tag) Comment (หมายเหตุ)
การเขียนโปรแกรมต้องมีการเขียน comment เพื่อช่วยเป็นหมายเหตุ รูปแบบของคำสั่ง comment คือ <! เป็นคำสั่งเปิด และใช้ > เป็นคำสั่งปิดข้อความที่อยู่ระหว่าง <!...> จะไม่ถูกแสดงบน เว็บบราวเซอร์
การบันทึกแฟ้มเอกสาร HTML
ถ้าเป็นเอกสาร html ล้วนๆ แฟ้มที่บันทึก ต้องมีนามสกุล html หรือ html เท่านั้น ไม่สามารถ ใช้เป็นอย่างอื่นได้ แต่ถ้ามีการแทรกภาษาสคริปต์อื่น ๆ ก็สามารถ ใช้นามสกุลอื่นๆ ได้ เช่น php, asp, aspx, jsp เป็นต้น
การปรับแต่งเอกสาร HTML
ในการใส่รูปแบบนั้นจะใส่เพิ่มในส่วนของคำสั่งเปิด ของคำสั่ง เพราะคำสั่งนี้เป็นส่วนขยายที่เรียกว่า Attribute ของคำสั่ง นั้นเอง โดยจะมีรูปแบบ คือ
แบบใส่สีให้พื้นหลัง bgcolor = "ชื่อสี" หรือ bgcolor = "#รหัสสี"
แบบใส่ภาพให้พื้นหลัง background = "ชื่อภาพ"
รูปแบบการใส่สีให้พื้นหลัง
ตัวอย่างที่ 2 การใส่สีให้พื้นหลัง
<html>
<head><title> ....การใส่สีให้พื้นหลังเป็นสีแดง....</title></head>
<body bgcolor = "red">
</body>
<html>
แสดงผลตัวอย่างที่ 2
รูปแบบการใส่ภาพให้พื้นหลัง
ตัวอย่างที่ 3 การใส่ภาพพื้นหลัง
<html>
<head><title> ....การใส่ภาพให้พื้นหลัง....</title></head>
<body background = "bg.jpg">
</body>
</html>
แสดงผลตัวอย่างที่ 3