วันอังคารที่ 29 เมษายน พ.ศ. 2557

เริ่มต้นกับ Html5

มีอะไรใหม่ใน HTML5
หลายเว็บอาจจะใช้ <div class="foot"> <div class="head"> แต่ก็อาจไม่ได้ fix ไปตายตัวเลยว่า head นี้จะอยู่ส่วนไหน เพราะทั้ง foot และ head เราเป็นคนกำหนดขึ้นมาเอง และจะต่อยอดเป็นข้อมูลแบบมีโครงสร้างที่จำเป็นในการทำ Seo Onpage ในอนาคตได้ครับ ทำให้บอทเข้าใจหมวดหมู่และเรื่องราวในเว็บเรามากขึ้น

HTML5 ได้มีแท็กใหม่ขึ้นมาเพื่อกำหนดหน้าที่ของแต่ละแท็กอย่างชัดเจนขึ้นเช่น


  • <header>
  • <nav>
  • <section>
  • <article>
  • <aside>
  • <figure>
  • <figcaption>
  • <Footer>
  • <details>
  • <summary>
  • <mark>
  • <time>




สำหรับ HTML5 1 เพจต้องมีอย่างน้อยดังโค๊ดด้านล่างนี้

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>
<body>
 เนื้อหา - ข้อมูลเว็บ
</body>
</html>



อธิบายแท็ก HTML5 พื้นฐาน

<section>

เป็นการจัดกลุ่มของเนื้อหา ยกตัวอย่างในกรณีที่หน้าเว็บมีเนื้อหามากกว่า 1 อย่างขึ้นไป
ส่วนใหญ่จะอยู่ภายใต้แท็ก <article> ตัวอย่างเช่นใน 1 หน้าเพจมี

<section>
  <h1>ตลาด</h1>
  <p>ป็นการชุมนุมกันทางสังคม แลกเปลี่ยนสินค้ากัน ในภาษาทั่วไป ตลาดหมายความรวมถึงสถานที่ที่มนุษย์มาชุมนุมกันเพื่อค้าขาย ในทางเศรษฐศาสตร์ ตลาดหมายถึงการแลกเปลี่ยนซื้อขาย </p>
</section>

<section>
  <h1>ตลาดรถ</h1>
  <p>รถบ้าน หมายถึงรถมือสองที่ไม่ได้ขายผ่านเต้นท์รถ ตลาดรถ หรือศูนย์จำหน่ายรถมือสอง แต่เป็นรถที่เจ้าของรถคันนั้นเช่น คนรู้จัก เพื่อร่วมงาน ญาติพี่น้องที่คุณเห็นเขาขับรถคันนั้นเกือบทุกวัน หรือเห็นบ่อยๆและคุณก็รู้ว่าเขาดูแลรถดีหรือไม่ดีอย่างไร ได้ขายให้คุณด้วยตัวเอง</p>
</section>

จุดสังเกตสำหรับ section นี้คือ ไม่จำเป็นต้องมีเนื้อหาต่างกันเสมอไป แต่อาจจะเอาไว้แยกกลุ่ม ตามที่เจ้าของเว็บต้องการก็ได้ครับ สามารถมี header หรือ article หรืออื่นๆ ภายใต้ tag นี้ได้ด้วยครับ