HTML คืออะไร? คู่มือสำหรับมือใหม่
DF Ploy
14 February 2025
Software development tips
มีใครเคยสงสัยไหมว่า "HTML คืออะไร?" หรือ "ถ้าเราอยากสร้างเว็บต้องเริ่มจากตรงไหน?" วันนี้เรามีคำตอบให้ทุกคน
HTML คืออะไร? 🌍
HTML (HyperText Markup Language) เป็นภาษาที่ใช้สร้างและจัดโครงสร้างของหน้าเว็บ ให้ดูเป็นเว็บ ไม่ใช่เป็นแค่ไฟล์เอกสารธรรมดาๆ
HTML ทำหน้าที่กำหนดโครงสร้างของเนื้อหาบนเว็บ เช่น ข้อความต้องอยู่ตรงไหน รูปภาพต้องวางตรงจุดใด หรือลิงก์จะพาผู้ใช้ไปที่หน้าไหน นอกจากนี้ HTML ยังเป็นภาษาพื้นฐานที่ทำงานร่วมกับ CSS และ JavaScript ที่มีหน้าที่ทำให้เว็บไซต์มีสีสันและฟังก์ชันที่ตอบโต้กับผู้ใช้ได้ด้วย 🤩 (ถ้าสนใจเรื่องการทำงานร่วมกันระหว่าง HTML, CSS และ JavaScript ลองอ่านเพิ่มได้ที่นี้นะ 👉🏼 จิ้มๆ )
โครงสร้างของ HTML ลองคิดซะว่ามันคือโครงกระดูกของเว็บ 💀
โครงกระดูกเป็นส่วนหนึ่งที่ช่วยค้ำจุนร่างกายให้เรายืนได้ ไม่กองเป็นก้อนเจลลี่เหมือนพี่ผีคนนี้ 👻
HTML ก็ทำหน้าที่คล้ายกับกระดูก เป็นเหมือนโครงสร้างหลักที่ทำให้หน้าเว็บเป็นรูปเป็นร่างขึ้นมา ก่อนที่เราจะตกแต่งและเพิ่มฟังก์ชันต่างๆ ให้กับมัน
ภาษา HTML จะเขียนด้วยสิ่งที่เรียกว่า "แท็ก" (Tags) ซึ่งใช้กำหนดว่าแต่ละส่วนของเว็บคืออะไร เช่น
<html>
เป็นแท็กหลักที่ครอบทุกองค์ประกอบของ HTML เหมือนปกหนังสือที่ครอบเนื้อหาทั้งหมด<head>
ส่วนหัวของเอกสาร มักใช้กำหนดข้อมูลเกี่ยวกับหน้าเว็บ เหมือนสารบัญของหนังสือ<body>
ส่วนที่แสดงเนื้อหาบนหน้าเว็บ เช่น ข้อความ รูปภาพ ลิงก์ เหมือนเนื้อหาของหนังสือที่ผู้อ่านต้องการ<h1> - <h6>
ใช้กำหนดหัวข้อของเนื้อหา เหมือนหัวข้อแต่ละบทของหนังสือ<p>
ใช้กำหนดย่อหน้าของข้อความ<a>
ใช้สร้างลิงก์ไปยังหน้าอื่นๆ<img />
ใช้แสดงรูปภาพบนเว็บ
จริง ๆ แล้ว HTML Tag ยังมีอีกหลายแบบ เอาง่ายๆ คือแต่ละแท็กมีหน้าที่ของตัวเอง ถ้าดูตัวอย่างโค้ดด้านล่าง จะเห็นว่า Tag แต่ละแบบให้ผลลัพธ์ที่ออกมาแตกต่างกัน และเราต้องเลือกใช้ให้ถูกต้อง เพื่อให้เว็บทำงานได้อย่างที่เราต้องการนั่นเอง ลองดูตัวอย่างข้างล่างได้เลย
สรุป
ถ้าโลกนี้ไม่มี HTML ตอนที่เราเปิดเว็บขึ้นมา คงเจอแต่หน้าจอขาวโพลน ไม่มีข้อความ ไม่มีรูปภาพ ไม่มีอะไรเลย... เพราะ HTML คือโครงสร้างพื้นฐานของทุกเว็บไซต์ ไม่ว่าจะเป็น Google, Facebook, YouTube หรือแม้แต่เว็บที่พวกเรากำลังอ่านอยู่ตอนนี้ก็ตาม 🎉
บทความที่น่าสนใจ
ดูทั้งหมด
