HTML5 ฉบับนิยาย

ตัวอย่าง HTML5 ในแต่ละบท

ตัวอย่าง

<!DOCTYPE html>
<html>
<body>
<video width="420" controls>
  <source src="mov_bbb.mp4" type="video/mp4">
  <source src="mov_bbb.ogg" type="video/ogg">
 เบราเซอร์ของคุณไม่สนับสนุนแท็กวิดีโอ
</video>
</body>
</html>

ทดลองด้วยตัวเอง

คลิกที่ "ทดลองด้วยตัวเอง" ที่นี่เพื่อดูว่าตัวอย่างนี้จะทำงานได้อย่างไร

อะไรคือ HTML5?

HTML5 คือมาตรฐาน HTML ล่าสุด

HTML5 ถูกออกแบบเพื่อรองรับเนื้อหาเว็บที่มีความรุ่นรส โดยไม่จำเป็นต้องใช้ปลั๊กอินตัวเอง

HTML5 มีองค์ประกอบทางวิเคราะห์ กราฟิก และสื่อมัลติมีเดียใหม่

HTML5 มีองค์ประกอบและ API ใหม่ที่ทำให้การสร้างโปรแกรมเว็บเพิ่มขึ้น

HTML5 คือแบบรู้เครื่องที่สามารถทำงานบนทุกประเภทของฮาร์ดแวร์ (PC ตั้งโต๊ะ แท็บเล็ต มือถือ โทรทัศน์และอื่น ๆ)

หมายเหตุ：ในบทที่ต่อไปนี้ คุณจะเรียนวิธีที่จะ "ช่วย" ให้เบราเซอร์รุ่นเก่าประสบความสำเร็จในการใช้ HTML5

เนื้อหาใหม่ของ HTML5 คืออะไร?

การประกาศประเภทเอกสาร (DOCTYPE) ใหม่ของ HTML5 นั้นง่ายมาก:

<!DOCTYPE html>
การประกาศตัวอักษรที่ใช้ (charset) ใหม่นั้นง่ายมากเช่นกัน:
<meta charset="UTF-8">

ตัวอย่าง HTML5:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>หัวข้อของเอกสาร</title>
</head>
<body>
เนื้อหาของเอกสาร......
</body>
</html>

หมายเหตุ：ตัวอักษรที่ใช้เป็นข้อเท็จจริงของ HTML5 คือ UTF-8

HTML5 - กฎภาษาคุณสมบัติใหม่

HTML5 มีกฎภาษาที่ใช้สำหรับคุณสมบัติ 4 รูปแบบ

ตัวอย่างนี้แสดงให้เห็นวิธีการใช้กราฟิกต์ภาษาต่าง ๆ ในแท็ก <input> ตามตัวอย่างนี้:

ประเภท ตัวอย่าง
Empty <input type="text" value="Bill Gates" disabled>
Unquoted <input type="text" value=Bill Gates>
Double-quoted <input type="text" value="Bill Gates">
Single-quoted <input type="text" value='Bill Gates'>

ในมาตราฐาน HTML5 อาจจะใช้ทั้ง 4 ชุดกราฟิกต์ภาษาเพื่อตามความต้องการของแอตทริบิวต์

HTML5 - คุณสมบัติใหม่

คุณสมบัติที่น่าสนใจของ HTML5 ที่มีมากที่สุด:

  • องค์ประกอบทางเนื้อหาใหม่ อย่างเช่น <header>, <footer>, <article>, และ <section>
  • ควบคุมฟอร์มใหม่ อย่างเช่น ตัวเลข วันที่ เวลา ปฏิทิน และ slider
  • การสนับสนุนรูปภาพที่แรงยิ่ง (ผ่าน <canvas> และ <svg>)
  • การสนับสนุนมีดาตามีเสียงและวิดีโอที่แรงยิ่ง (ผ่าน <video> และ <audio>)
  • API ใหม่ที่มีความสามารถแรงยิ่ง อย่างเช่น การใช้เก็บข้อมูลท้องที่แทน cookie

HTML5 - องค์ประกอบที่ถูกลบออก

องค์ประกอบ HTML 4.01 ต่อไปนี้ถูกลบออกจาก HTML5:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>