บทเรียนออนไลน์ คุณครูอิทธิวิธิ สินศิริ

3. คำสั่งในการกำหนดโครงสร้างหลัก

      โครงสร้างหลักของเอกสาร HTML จะประกอบด้วยแท็กคำสั่งหลักๆซึ่งมีรายละเอียดดังนี้

       3.1 ประกาศชนิดของเอกสาร (HTML DOCTYPE)
               บรรทัดแรกสุดของเอกสาร HTML จะเป็นการประกาศชนิดของเอกสาร หรือ Document TypeDeclaration
(DTD) , หรือเรียกสั้นๆว่า การประกาศ DOCTYPE ซึ่งจะเป็นการบอกถึงรุ่นของ HTML หรือ XHTML ที่เราใช้และ
ยังบอกถึงเบราว์เซอร์รู้ด้วยว่าจะต้องแปลคำสั่งต่างๆในส่วนถัดๆ มาอย่างไร
               ใน HTML รุ่นก่อนการประกาศชนิดของเอกสารจะใช้คำสั่งที่ยุ่งยาก ตัวอย่างเช่น ใน HTML4 จะประกาศดังนี้

               <!DOCTYPE HTMLPUDLIC”-//W3C//DTD HTML 4.01//EN”
                  “http://www.w3.org/TR/html4/loose.dtd”>

                แต่ใน HTML5 จะใช้การประกาศชนิดของเอกสารที่ง่ายขึ้นกว่าเดิมมาก โดยเขียนดังนี้

<!DOCTYPE html>

3.2 เริ่มต้นเอกสารด้วยแท็กคำสั่ง <html>

หลังจากที่เราประกาศ DOCTYPE แล้วเราจะใส่แท็กคำสั่ง <html> ซึ่งเป็นคำสั่งแบบแท็กคู่เพื่อใช้บอก
จุดเริ่มต้นและจุดจบของเอกสารโดยแท็กคำสั่งนี้จะคลุมเนื้อหาทั้งหมดในหน้าเว็บเพจนั้นไว้

     <!DOCTYPE html>
     <html>

     </html>

3.3 กำหนดส่วนหัวของเอกสารด้วยแท็ก <head>

โครงสร้างของเอกสาร HTML จะรียงตามลำดับชั้น ซึ่งเอกสารส่วนใหญ่จะต้องมีสวนหัวของเอกสาร
ดังนั้นเราจะกำหนดส่วนหัวของเอกสารต่อจากแท็กคำสั่ง <html> ทันทีโดยใช้แท็ก <head> ในการกำหนด
จุดเริ่มต้นของส่วนหัว และปิดท้ายด้วยแท็ก </head>

     <!DOCTYPE html>
     <html>
          <head>
          </head>
      </html>

                ส่วนหัวของเอกสารถือเป็นองค์ประกอบหลักของเอกสาร HTML โดยจะประกอบด้วยข้อมูลพื้นฐาน
เช่น ชื่อเรื่อง (Title) และข้อมูลของข้อมูล (Metadata คือข้อมูลที่อธิบายให้ทราบรายละเอียดของข้อมูลที่ต้องการ)
เช่น คำหลัก (keyword),ชุดอักขระ (character encoding),ข้อมูลผู้เขียนเว็บ,และคำอธิบาย

                การใส่ชื่อเรื่องด้วยแท็กคำสั่ง <title>

                แท็กคำสั่ง <title> …… </title> เป็นคำสั่งที่ใช้กำหนดข้อความที่ต้องการนำมาแสดงผล
บนแถบชื่อเรื่อง (Title bar) โดยกำหนดความยาวของข้อความได้ไม่เกิน 64 ตัวอักษร

                การใส่ข้อมูล metadata ด้วยแท็ก <meta>

                ตัวอย่างเช่น การกำหนดชุดอักขรที่จะใช้ในหน้าเว็บใน HTML5 จะเขียนได้ง่ายๆ ดังนี้

อันที่จริงเราไม่จำเป็นต้องรู้ลึกถึงการเข้ารหัสอักขระ ซึ่งโดยพื้นฐานก็คือ การกำหนดชุดของอักขระ
ในภาษาที่มนุษย์เข้าใจที่จะนำมาใช้ในเอกสารของเรา มันจะเป็นการดีที่จะกำหนดให้เป็น UTF-8 ซึ่งเป็นชุดอักขระสากล
(Universal Character set) ที่ใช้ได้กับทุกภาษานอกจากเรายังอาจใส่ข้อมูลอื่นๆได้อีก เช่น