𝗧𝗵𝗲 𝗜𝗻𝗹𝗶𝗻𝗲 𝗛𝗧𝗠𝗟 𝗔𝗹𝗺𝗼𝘀𝘁 𝗡𝗼𝗯𝗼𝗱𝘆 𝗨𝘀𝗲𝘀 HTML แบบ Inline ที่แทบไม่มีใครใช้
นักพัฒนาส่วนใหญ่รู้จัก <b>, <i>, และ <a>
คุณอาจจะมองข้ามแท็กอื่นๆ อย่าง <ins>, <dfn>, <abbr>, <var>, <q>, และ <mark> ไป เพราะคุณมักจะเลือกใช้ <span class="something"> แทน
การใช้ element เหล่านี้ช่วยเพิ่มความหมาย (semantic) เพราะ span ที่ตกแต่งสไตล์มาแล้วไม่ได้บอกอะไรกับเครื่องจักรเลย แต่ element เหล่านี้จะให้ข้อมูลแก่ screen readers และ search engines
นี่คือ element ที่มีประโยชน์ที่คุณควรทราบ:
• <ins> และ <del>: ใช้สำหรับติดตามการเปลี่ยนแปลง โดยใช้ <del> สำหรับข้อความที่ถูกลบ และ <ins> สำหรับข้อความใหม่ ทั้งสองทำงานร่วมกันเพื่อแสดงการแก้ไข
• <s>: ใช้สำหรับเนื้อหาที่ไม่ถูกต้องอีกต่อไป ซึ่งต่างจากการลบ (deletion) โดยใช้เพื่อระบุข้อมูลที่ล้าสมัย เช่น ราคาเก่า
• <sub> และ <sup>: ใช้สำหรับสูตรทางเคมีหรือเลขยกกำลังทางคณิตศาสตร์ อย่าใช้เพียงเพื่อทำให้ข้อความตัวเล็กลง
• <var>: ใช้สำหรับตัวแปรในทางคณิตศาสตร์หรือในโค้ด
• <mark>: ใช้ไฮไลต์ข้อความเพื่อแสดงความเกี่ยวข้อง ซึ่ง search engines จะใช้สิ่งนี้เพื่อแสดงผลลัพธ์ที่ตรงกับคำค้นหา
• <abbr>: ใช้แสดงคำเต็มของคำย่อผ่าน tooltip
• <dfn>: ใช้เพื่อระบุตำแหน่งที่คุณทำการนิยามคำศัพท์นั้นๆ
• <cite>: ใช้สำหรับชื่อผลงาน เช่น หนังสือหรือบทความวิจัย ไม่ใช่ใช้สำหรับชื่อบุคคล
• <q>: ใช้สำหรับคำพูดแบบ inline โดยเบราว์เซอร์จะใส่เครื่องหมายอัญประกาศให้คุณโดยอัตโนมัติ
ค่าเริ่มต้นของเบราว์เซอร์มักจะดูไม่สวยงาม เช่น <mark> จะดูเหมือนไฮไลต์สีเหลือง หรือ <q> ที่อาจมีเครื่องหมายแปลกๆ
คุณไม่จำเป็นต้องหลีกเลี่ยงแท็กเหล่านี้ เพียงแค่ต้องเพิ่ม CSS เข้าไปเท่านั้น
ลองกำหนดสีแบรนด์ให้กับ <mark> หรือใส่เส้นใต้แบบจุดให้กับ <abbr> วิธีนี้จะเปลี่ยนโค้ดที่มีความหมาย (semantic code) ให้กลายเป็นงานพิมพ์ (typography) ที่สวยงาม
การใช้แท็กที่ถูกต้องเพียงปีละครั้ง ยังดีกว่าการใช้ span ที่บิดเบือนความหมายที่แท้จริงของเนื้อหา
Source: https://dev.to/dimonb19a/the-inline-html-almost-nobody-uses-205d