อ่านประมาณ 7 นาที
ระดับเริ่มต้น
หมวด: UX/UI
อ้างอิง: GitHub Blog — Your alt text passes automated checks. That doesn't mean it's any good.
เครื่องมือตรวจการเข้าถึงบอกได้แค่ว่ามีข้อความแทนภาพหรือไม่ แต่บอกไม่ได้ว่าข้อความนั้นมีประโยชน์จริงหรือเปล่า บทความนี้สรุปสถิติที่น่าตกใจ วิธีจำแนกประเภทรูปภาพเพื่อตัดสินใจ และแนวทางที่ทีมนำไปใช้ได้ทันที
ตัวเลขที่บอกว่าปัญหาใหญ่กว่าที่คิด
รายงานประจำปี 2026 ของ WebAIM ระบุว่ารูปภาพมากกว่าหนึ่งในสี่บนหน้าแรกของเว็บยอดนิยม มีข้อความแทนภาพที่หายไป กำกวม หรือคัดลอกมาจากรูปข้างเคียง แยกเป็นรูปที่ไม่มีข้อความแทนภาพเลย 16.2% และรูปที่มีข้อความแต่ไม่ช่วยอะไรอีก 10.8% เช่นใส่ชื่อไฟล์หรือคำทั่วไปที่ไม่สื่อความหมาย
ข้อจำกัดพื้นฐานคือเครื่องพิสูจน์จากมาร์กอัปไม่ได้ว่าประโยคหนึ่งบรรยายภาพในบริบทนั้นได้เพียงพอหรือไม่ เครื่องมือจึงเลือกที่จะแจ้งเตือนเฉพาะกรณีที่พิสูจน์ได้ว่าบกพร่องจริง เพื่อเลี่ยงการแจ้งเตือนเท็จ ผลคือข้อความแทนภาพที่แย่จำนวนมากผ่านการตรวจไปได้
ตัวอย่างที่ผ่านเครื่องตรวจแต่ไร้ประโยชน์
กรณีที่พบบ่อยได้แก่ การใส่ชื่อไฟล์อย่าง IMG_2847.png การใส่คำว่า image เฉย ๆ การใส่ข้อความว่า TODO ค้างไว้ตั้งแต่ตอนพัฒนา และการใส่ข้อความเดียวกันซ้ำกับไอคอนทุกตัว เช่น ไอคอนดาวห้าดวงที่ทุกดวงเขียนว่าสามในห้าดาวเหมือนกันหมด ทำให้ผู้ใช้โปรแกรมอ่านหน้าจอได้ยินข้อความเดิมห้ารอบ
สิ่งที่ทำให้เรื่องนี้ยากคือบริบท ข้อความเดียวกันอาจใช้ได้ในที่หนึ่งแต่ใช้ไม่ได้ในอีกที่หนึ่ง ตัวอย่างเช่นคำว่าคนกำลังยิ้มอาจเหมาะกับภาพประกอบเพื่อสร้างอารมณ์ แต่ใช้ไม่ได้ถ้าอยู่ใต้หัวข้อที่ระบุชื่อบุคคลนั้นชัดเจน
ภาพประกอบบทความหมวดUX/UI
ลำดับการตัดสินใจสี่ขั้น
แนวทางที่บทความเสนอคือจำแนกรูปตามลำดับแล้วหยุดที่ข้อแรกที่ตรง ขั้นที่หนึ่งคือรูปตกแต่งที่ไม่สื่อข้อมูลใด ให้ปล่อยข้อความแทนภาพเป็นค่าว่าง ขั้นที่สองคือรูปที่ซ้ำกับคำบรรยายใต้ภาพที่มีอยู่แล้ว ก็ไม่ต้องบรรยายซ้ำ ขั้นที่สามคือรูปที่ทำหน้าที่เป็นลิงก์ ข้อความแทนภาพต้องบอกว่าคลิกแล้วไปไหน ไม่ใช่บรรยายว่าภาพหน้าตาอย่างไร และขั้นที่สี่คือรูปที่ให้ข้อมูล จึงบรรยายเนื้อหาสำคัญของภาพ
การหยุดที่ข้อแรกที่ตรงเป็นรายละเอียดที่สำคัญ เพราะช่วยตัดวงจรการถกเถียงไม่รู้จบว่าควรบรรยายละเอียดแค่ไหน ซึ่งเป็นสาเหตุที่ทำให้หลายทีมเลิกทำเรื่องนี้ไปเลย
แยกสิ่งที่พิสูจน์ได้ออกจากสิ่งที่ได้แค่สงสัย
หลักคิดที่ผู้เขียนสรุปไว้คือให้แยกสิ่งที่พิสูจน์ได้ออกจากสิ่งที่ทำได้แค่สงสัย แล้วตั้งค่าเริ่มต้นให้ต่างกัน การตรวจที่พิสูจน์ได้แน่นอน เช่น มีแอตทริบิวต์หรือไม่ เป็นชื่อไฟล์หรือไม่ เป็นคำทั่วไปคำเดียวหรือไม่ และซ้ำกับรูปข้างเคียงหรือไม่ ควรเปิดใช้เป็นค่าเริ่มต้น ส่วนการตรวจที่ต้องใช้โมเดลช่วยประเมินคุณภาพ ควรเป็นสิ่งที่ผู้ใช้เลือกเปิดเอง และต้องถือว่าผลที่ได้เป็นข้อเสนอแนะ ไม่ใช่คำตัดสิน
ข้อควรระวังที่บทความย้ำคือ การตรวจอัตโนมัติเป็นเพียงพื้นขั้นต่ำ ไม่ใช่การรับรองว่าผ่านมาตรฐาน การทดสอบกับผู้ใช้ที่ใช้เทคโนโลยีช่วยเหลือจริงยังจำเป็นเสมอ และเครื่องมือกลุ่มนี้มักครอบคลุมเฉพาะแท็ก img เท่านั้น ไม่รวม SVG ภาพพื้นหลังจาก CSS และ canvas
ภาพประกอบบทความหมวดUX/UI
นำไปใช้กับทีมไทยอย่างไร
ข้อเสนอที่ทำได้ทันทีคือเพิ่มการตรวจแบบพิสูจน์ได้เข้าไปในไปป์ไลน์ก่อน เพราะได้ผลเร็วและไม่มีข้อโต้แย้ง จากนั้นจึงเขียนแนวทางสั้น ๆ ไว้ในเอกสารของทีมว่ารูปแต่ละประเภทควรเขียนอย่างไร พร้อมตัวอย่างจริงจากงานของตัวเอง ซึ่งมีประโยชน์กว่าการอ้างมาตรฐานล้วน ๆ
อีกเรื่องที่ทีมไทยควรระวังเป็นพิเศษคือเว็บภาษาไทยจำนวนมากใช้ภาพที่มีตัวหนังสืออยู่ในภาพ เช่น แบนเนอร์โปรโมชันหรืออินโฟกราฟิก กรณีเหล่านี้ข้อความแทนภาพต้องถ่ายทอดข้อความสำคัญในภาพออกมา ไม่ใช่เขียนว่าแบนเนอร์โปรโมชัน เพราะผู้ใช้ที่มองไม่เห็นจะพลาดเงื่อนไขและราคาไปทั้งหมด
สรุปสาระสำคัญ ตัวเลขที่บอกว่าปัญหาใหญ่กว่าที่คิด ตัวอย่างที่ผ่านเครื่องตรวจแต่ไร้ประโยชน์ ลำดับการตัดสินใจสี่ขั้น
แหล่งอ้างอิง เรียบเรียงจาก GitHub Blog — Your alt text passes automated checks. That doesn't mean it's any good. —
อ่านบทความต้นฉบับ ภาพปก: GitHub Blog · ลิขสิทธิ์ภาพเป็นของเจ้าของต้นฉบับ ใช้ประกอบการรายงานพร้อมอ้างอิงแหล่งที่มา
มีคำถามเพิ่มเติมเกี่ยวกับบทความนี้? เขียนหาเราได้ที่
info@smart-cyber-tech.com
บริการที่เกี่ยวข้องจากทีมงาน Smart Cyber Tech
แบ่งปันบทความนี้:
LINE
Facebook
X
คัดลอกลิงก์
ปรึกษาทีมของเรา