องค์ประกอบข้อความ: ย่อหน้า รายการ และการเน้น

ข้อความเป็นส่วนใหญ่ของเว็บ การทำมาร์กอัปให้ถูกต้องจึงสำคัญมาก องค์ประกอบข้อความที่เหมาะสมทำให้ทุกคนอ่านเนื้อหาได้ รวมถึงผู้ใช้โปรแกรมอ่านหน้าจอ

ครอบข้อความแต่ละช่วงด้วยแท็ก p แท็กนี้จัดประโยคให้เป็นย่อหน้าจริง ซึ่งเทคโนโลยีช่วยเหลือสามารถนำทางได้ทีละส่วน

หลีกเลี่ยงการวาง div ว่างหรือแท็ก br ซ้อนกันเพื่อเว้นระยะข้อความ ให้ใช้ย่อหน้าจริงและให้ CSS จัดการช่องว่าง โครงสร้างควรมาจากแท็ก ไม่ใช่การตกแต่ง

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

ใช้ ul เมื่อไม่สำคัญว่าลำดับจะเป็นอย่างไร และใช้ ol เมื่อลำดับสำคัญ เช่น ขั้นตอนต่าง ๆ แต่ละรายการต้องอยู่ใน li ไม่ใช่ div ที่ลอยอยู่เดี่ยว ๆ

แท็ก emใช้ทำเครื่องหมายคำที่คุณจะเน้นเมื่อพูด โปรแกรมอ่านหน้าจออาจเปลี่ยนน้ำเสียง ทำให้ผู้ใช้ได้ยินการเน้นจริง ไม่ใช่แค่เห็น

แท็ก strongใช้ทำเครื่องหมายข้อความที่สำคัญมาก เช่น คำเตือน นี่คือความหมาย ไม่ใช่เพียงการทำตัวหนา จึงสื่อความสำคัญไปยังเทคโนโลยีช่วยเหลือด้วย

แท็ก b และ i เปลี่ยนเพียงรูปลักษณ์โดยไม่เพิ่มความหมาย ให้เลือกใช้ em และ strong เมื่อการเน้นหรือความสำคัญมีความหมายจริง

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

ครอบโค้ดในบรรทัดด้วย code และเขียนคำย่อเต็มด้วย abbr แท็กเล็ก ๆ เหล่านี้เพิ่มความหมายที่ชัดเจน ซึ่งผู้อ่านที่มองเห็นมักอนุมานได้จากบริบท

กฎสำหรับข้อความนั้นเรียบง่าย เลือกแท็กตามความหมาย แล้วค่อยตกแต่งได้อย่างอิสระ รูปลักษณ์เป็นหน้าที่ของ CSS ส่วนโครงสร้างเป็นหน้าที่ของ HTML

ใช้ p สำหรับข้อความ ใช้ ul และ ol สำหรับรายการ และใช้ em กับ strong สำหรับการเน้นจริง เลือกแท็กตามความหมาย แล้วปล่อยให้ CSS จัดการรูปลักษณ์ 🎉