หัวข้อ (Headings)


HTML Headings

การสร้างหัวข้อด้วยโค้ด HTML ทำโดยระบุ HTML Tag <h1> ถึง <h6>

<h1> ใช้แทนหัวข้อที่สำคัญมากที่สุด <h6> ใช้แทนหัวข้อที่สำคัญน้อยที่สุด

ตัวอย่าง

<h1>This is header 1</h1>
<h2>This is header 2</h2>
<h3>This is header 3</h3>
<h4>This is header 4</h4>
<h5>This is header 5</h5>
<h6>This is header 6</h6>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

หัวข้อมีความสำคัญอย่างไร ?

Search engines จะใช้หัวข้อในการทำ index ของโครงสร้างเว็บไซต์ของคุณ

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

หัวข้อ <h1> ใช้สำหรับหัวข้อหลัก และตามด้วยหัวข้อ <h2> จากนั้นหัวข้อที่สำคัญน้อยกว่าก็เป็น <h3> ไปเรื่อยๆ จนถึง <h6>

HTML Horizontal Rules (เส้นแนวนอน)

Tag <hr> คือโค้ดกำหนดเส้นแบ่งหัวข้อบนหน้าเว็บเพ ซึ่งจะแสดงผลเป็นเส้นแนวนอนยาวคั่นกลาง ใช้สำหรับแบ่งเนื้อหาออกเป็นส่วนๆ

ตัวอย่าง

<h1>This is header 1</h1>
<p>This is paragraph 1</p>
<hr>
<h1>This is header 2</h1>
<p>This is paragraph 2</p>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

HTML <head>

Element <head> ไม่เกี่ยวกับหัวข้อที่แสดงผลบนหน้าเบราว์เซอร์

Element <head> คือส่วนที่เก็บข้อมูล metadata ที่เกี่ยวกับเอกสาร HTML ทั้งหมดซึ่งจะไม่แสดงผลบนเบราว์เซอร์

<head> จะอยู่ระหว่าง Tag <html> และ <body>

ตัวอย่าง

<!DOCTYPE html>
<html>
<head>
    <title>Example</title>
    <meta charset="UTF-8">
</head>
<body>
<h1>This is header</h1>
<p>This is paragraph</p>
</body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

ดูโค้ด HTML ของเว็บอื่นๆ

คุณเคยเข้าไปดูเว็บของคนอื่น แล้วคิดว่า "เฮ้ ทำแบบนี้ยังไงหน่ะ"

คุณสามารถดูโค้ด HTML ของเว็บไซต์ต่างๆ ได้ ถ้าคุณใช้เบราว์เซอร์ Chrome ให้คลิกขวา แล้วเลือก Inspect

เบราว์เซอร์จะขึ้นหน้าต่างใหม่ ที่ประกอบด้วยโค้ด HTML ของหน้านั้น



HTML Tag

Tagอธิบาย
<html>เป็น Tag พื้นฐานของเอกสาร HTML
<body>กำหนดเนื้อหาที่ต้องการแสดงผล
<head>บรรจุ element ส่วน head ทั้งหมด (title, script, style, meta)
<h1> ถึง <h6>ระบุหัวข้อ
<hr>เส้นแบ่งเนื้อหา

แสดงความคิดเห็น

0ความคิดเห็น

แสดงความคิดเห็น (0)