alt ว่างและรูปภาพตกแต่งที่ซ่อนอยู่

สำหรับรูปภาพตกแต่ง วิธีที่ถูกต้องคือใช้ข้อความแสดงแทนแบบ ค่าว่าง นั่นคือเขียนแอตทริบิวต์ข้อความแสดงแทนให้เท่ากับเครื่องหมายอัญประกาศสองตัวโดยไม่มีอะไรอยู่ข้างใน

ข้อความแสดงแทนค่าว่างระบุว่ารูปภาพเป็นรูป ตกแต่ง ทำให้โปรแกรมอ่านหน้าจอข้ามรูปนั้นทั้งหมดและไม่ประกาศรูปภาพ

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

หากไม่มีข้อความแสดงแทนเลย โปรแกรมอ่านหน้าจอจำนวนมากจะย้อนกลับไปอ่าน ชื่อไฟล์ออกเสียง เช่น IMG ขีดล่าง 4823 จุด jpg

กฎนั้นง่ายมาก รูปภาพทุกภาพต้องมีแอตทริบิวต์ ข้อความแสดงแทน คำถามมีเพียงว่าจะเว้นว่างหรือใส่เนื้อหา

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

อย่าเว้นวรรคระหว่างเครื่องหมายอัญประกาศ ข้อความแสดงแทนค่าว่างจริง ๆ ต้องไม่มี อะไรอยู่ข้างใน แม้แต่ช่องว่างเพียงหนึ่งตัว

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

คุณยังสามารถซ่อนภาพกราฟิกตกแต่งด้วยการตั้งค่า ซ่อนจากเทคโนโลยีช่วยเหลือเป็น true ซึ่งมักใช้กับไอคอน SVG แบบแทรกในบรรทัดที่อยู่ข้างข้อความที่มองเห็น

โปรดระวัง อย่าใส่ข้อความแสดงแทนค่าว่างหรือการซ่อนจากเทคโนโลยีช่วยเหลือให้กับรูปภาพที่ ให้ข้อมูล มิฉะนั้นคุณจะลบรูปนั้นออกจากการรับรู้ของผู้ใช้บางกลุ่มโดยไม่รู้ตัว

หากรูปภาพตกแต่งอยู่ภายในลิงก์ ลิงก์นั้นยังต้องมี ข้อความที่เข้าถึงได้อยู่ที่ใดที่หนึ่ง มิฉะนั้นลิงก์จะไม่มีชื่อ

ลองแยกแยะความแตกต่างที่สำคัญ

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