HTML5 คืออะไร

View :7487
Added:2010-04-07 11:35:14
License:

Tag: html5,

HTML5 เป็นภาษาที่ถูกพัฒนาขึ้นเพื่อเป็นภาษามาร์กอัปสำหรับ WWW รุ่นต่อไปของ HTML ถูกพัฒนาขึ้นในปี 2004 โดยกลุ่ม WHATWG(The Web Hypertext Application Technology Working Group) โดยเรียกชื่อว่า Web applications 1.0 โดยดราฟต์แรกได้ปรากฏออกมาเมื่อ 22 มกราคม พ.ศ. 2551

โดย HTML5 จะช่วยลดการใช้พวกปลั๊กอินพิเศษอย่างพวก Adobe Flash, Microsoft Silverlight, Apache Pivot และ
Sun JavaFX HTML5 มาพร้อมกับองค์ประกอบ และคุณลักษณะใหม่ ๆ ที่แสดงให้เห็นการใช้งานทั่ว ๆ ไปของเว็บไซต์ต่าง ๆ ในปัจจุบัน หรือพูดง่าย ๆ ก็คือเอามาแทนที่ตัวเดิม ๆ ที่เราเคยใช้กันอย่างเช่น div และ span ตัวอย่างเช่นปกติถ้าเราจะสร้างเมนูบาร์ก็จะใช้

<div id="nav">
<ul>
<li>Home</li>
<li>Contact Us</li>
<li>About Us</li>
</ul>
</div>

ก็จะใช้

<nav>
<ul>
<li>Home</li>
<li>Contact Us</li>
<li>About Us</li>
</ul>
</nav>

แล้วก็ยังมีตัวอื่นอีก คือ header, section, article, aside, และ footer ส่วนองค์ระกอบอื่น ๆ ที่เคยใช้ และได้พวก search engine ให้ความสำคัญ อย่างเช่น title, h1 ถึง h6, p เป็นต้น ก็ยังคงใช้อยู่

ตัวอย่างแบบที่ใช้ div

same html before html5

<body>
     <div id="header">
          <h1>HTML 5</h1>
          <p>By ofebia</p>
     </div>

     <div id="nav">
          <ul>
              <li>Home</li>
              <li>Contact Us</li>
              <li>About Us</li>
          </ul>
     </div>

     <div id="content">
          <span id="entry">
               <h1>A - Z : Chapter 1</h1>
               <p>abcdefghijklmnopqrstuvwxyz</p>
          </span>
     </div>

     <div id="sidebar">
          <h1>Archives</h1>
          <ul>
               <li>ABC</li>
               <li>abc</li>
               <li>123</li>
          <ul>
     </div>

     <div id="footer">© 2010 web.ofebai</div>
</body>

ตัวอย่าง HTML5

html5 structure

<body>
     <header>
          <h1>HTML 5</h1>
          <p>By ofebia</p>
     </header>     <nav>
          <ul>
               <li>Home</li>
               <li>Contact Us</li>
               <li>About Us</li>
          </ul>
     </nav>
     <article>          <section>
               <h1>A - Z : Chapter 1</h1>
               <p>abcdefghijklmnopqrstuvwxyz</p>
          </section>
     </article>

     <aside>
          <h1>Archives</h1>
          <ul>
               <li>ABC</li>
               <li>123</li>
               <li>abc</li>
          </ul>
     </aside>

     <footer>© 2010 web.ofebai</footer>
</body>

แล้วก็ยังมีแท็กจำพวก video, audio และอื่น ๆ ที่ทำให้เว็บไซต์ของเรามีความหมายที่เข้าใจง่ายสำหรับพวก search engine สามารถทำให้รู้ได้ว่าใครพูดอะไร อันไหนคือรูปภาพ อันไหนคือหัวข้อหลักของเว็บไซต์ แล้วนอกจากนี้ยังทำให้หน้าเว็บไซต์ต่าง ๆ มีมาตราฐานที่เหมือนกัน ไม่เหมือนรูปแบบเก่าที่ขึ้นอยุ่กับผู้พัฒนาเว็บไซต์จะสร้างขึ้น

ยังไงก็ต้องดูกันว่า HTML5 จะได้รับความนิยมมากขนาดไหน เพราะว่าในปัจจุบันนี้เว็บไซต์ดัง ๆ ในไทยหลาย ๆ เว็บไซต์ก็ยังไม่ค่อยมีใครนิยมใช้พวก div, span และ CSS กันมากนัก แต่ยังไงก็ต้องปรับตามให้รองรับลูกพี่ใหญ่อย่างค่าย search engine ดัง ๆ กันอยู่แล้ว ต้องมารอดูกันว่าอนาคตจะเป็นยังไง