HTML5 Text-level semantics คือการเอากลุ่มของภาษา html4 ผสมกับ xhtml2 แล้วเอาสิ่งที่มีมาตีความใหม่ ใส่ความหมายเข้าไปให้กับ Element ที่มีอยู่ก่อนแล้วเพื่อให้ Elements ต่างๆ มีความหมายในตัวของมัน
ก่อนหน้านี้ใน HTML4 Elements บางส่วนที่ถือกำเนิดขึ้นนั้น มีอยู่เพื่อการแสดงผลด้าน Screen โดยไม่ได้คำนึงถึงความหมายที่แฝงอยู่ เช่น b เอาไว้ทำตัวหนา i เอาไว้ทำตัวเอียง u เอาไว้ขีดเส้นใต้
ส่วน XHTML ที่สร้าง Element อย่างเช่น strong หรือ em เข้ามาใหม่ ได้ลบ b และ i ออกไป
เมื่อถึงเวลาที่ต้องพูดถึง ความหมายในเชิงลึก อันถึงขั้นที่ต้องให้ซึ้ง กับพระธรรมคำของของ xhtml แล้ว การใช้ <p>, <span>, <strong> หรือ <em> นั้น จริงๆ เขานำไปใช้กันยังไง หรือว่าเอาไปประยุกต์ใช้กันยังไง ทุกๆ Element มีความหมายในตัวของมันนะครับ สุ่มห้าสุ่มหกไป ไม่ดี
เมื่อถึงเวลาที่ต้องพูดถึง ความหมายในเชิงลึก อันถึงขั้นที่ต้องให้ซึ้ง กับพระธรรมคำของของ xhtml แล้ว การใช้ <p>, <span>, <strong> หรือ <em> นั้น จริงๆ เขานำไปใช้กันยังไง หรือว่าเอาไปประยุกต์ใช้กันยังไง ทุกๆ Element มีความหมายในตัวของมันนะครับ สุ่มห้าสุ่มหกไป ไม่ดี
สำหรับใครที่ยังไม่กระจ่างแจ้งกับการใช้ ผมขอแยกแยะประเด็นและความสำคัญหลักๆ ของแต่ละ Element เป็นข้อๆ นะขอรับ
1.<p> (Paragraph)
ความหมายของการใช้งาน
ความหมายตามตัวครับ “ย่อหน้า” เมื่อใดก็ตามที่มีการย่อหน้าใหม่ เราควรใช้ <p> เป็นตัวแบ่งเนื้อหาในแต่ละย่อหน้านั้นๆ
คุณลักษณะ
เป็น Element ที่อยู่ในหมวด Structural Module ซึ่งแสดงผลเป็น Block Element ด้วย และสามารถ ใช้xhtml elements ในตระกูล Content Model แบบ Text | List | blockcode | blockquote | pre | table ใส่เข้าไปข้างในได้ แต่ไม่สามารถ เอา <p> ซ้อนเข้าไปในตัวของมันเองได้
2.<span>, <strong> และ <em>
เคยสงสัยไหมครับว่า ทำไม px และ em จึงต้องมีพร้อมๆ กัน
ซึ่ง em ในที่นี้คือหน่วยของความกว้าง ความสูง นะครับ ไม่ใช่ em ที่มักใช้คู่ๆ ไปกับ span อย่าเพิ่งสับสน
ทำไมต้องมี em ??
เคยลองมั้ยครับ เวลาที่เราเข้าเว็บบางเว็บแล้วตัวหนังสือมันเล็ก แล้วเราอยากให้มันใหญ่ขึ้น แต่พอเราเข้าไปที่ Text Size ของ IE แล้วขยายยังไงมันก็ไม่ขึ้น แต่กลับบราวเซอร์ อื่นๆ มันก็ขยายตามความต้องการของเรา หรือจะย่อตัวหนังสือ มันก็ลดลงตามความต้องการ นั่นแหละครับ หน้าเพจนั้น ได้ถูกกำหนดขนาดตัวหนังสือด้วย px ไว้เรียบร้อยแล้ว