การเข้าถึง

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

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

คำแถลงการเข้าถึงอย่างเป็นทางการ

มาตรฐานที่มุ่งหมาย

WCAG 2.2 AA ตลอดทั้งประสบการณ์ การจัดการ AAA เกี่ยวกับรูปลักษณ์โฟกัส (วงแหวนความคมชัดสูงหนา ไม่ถูกบดบัง) และการติดป้ายกำกับแบบฟอร์ม + การกู้คืนข้อผิดพลาด ติดตามตาม W3C Recommendation ไม่ใช่การถอดความ

การตรวจสอบภายในครั้งล่าสุด

2026-04-19 ทีมของเราผ่านด้วยตนเองกับหน้าแรก print-size ฮับ /standards/ + 9 หน้าผู้มีอำนาจ และ 45 หน้าปลายทางรูปแบบการชำระเงิน

การตรวจสอบภายนอก

ได้รับมอบหมาย รายงานรอดำเนินการ เผยแพร่เมื่อมาถึงที่ /accessibility/audit/ พร้อมบันทึกการแก้ไข, ข้อบกพร่องยังคงอยู่ ไม่มีการเลือกเฉพาะ

รอบการทดสอบซ้ำ

การตรวจสอบแบบสุ่มรายเดือน + ผ่านด้วยตนเองอย่างสมบูรณ์หลังการเปลี่ยนแปลง UI หลักใดๆ การตรวจสอบอัตโนมัติ (การตรวจสอบความคมชัด การสแกนเกณฑ์ใหม่ WCAG 2.2) ทำงานในทุกการปรับใช้

ติดต่อ + SLA

hello@abundera.ai, เรายืนยันรายงานการเข้าถึงภายใน 2 วันทำการ จัดประเภทภายใน 5 วัน และถือว่าตัวบล็อกแป้นพิมพ์ / โปรแกรมอ่านหน้าจอ / ความรู้ความเข้าใจเป็นปัญหาสำคัญ

การปฏิบัติตาม WCAG 2.2 AA ตามเกณฑ์ความสำเร็จ

เกณฑ์ใหม่ใน 2.2 ที่เราติดตามอย่างจริงจัง สถานะสะท้อนสิ่งที่เราตรวจสอบภายใน การตรวจสอบภายนอกจะแทนที่

การสนับสนุนการเคลื่อนไหวและสีที่บังคับ

• prefers-reduced-motion: reduce, การเคลื่อนไหวลอยและการเปลี่ยนแปลงซีดจางของออร์บแวดล้อมถูกระงับ การเปลี่ยนแปลงเชิงฟังก์ชันคงสั้น ตรวจสอบด้วย macOS Reduce Motion และ Windows "แสดงแอนิเมชัน" ปิดใช้งาน
• forced-colors: active (โหมดความคมชัดสูงของ Windows), วงแหวนโฟกัสใช้สี Highlight ของระบบ เส้นขอบรับสี CanvasText ของระบบ ตรวจสอบใน Edge บน Windows 11 High Contrast

ข้อจำกัดที่ทราบ

• JAWS ยังไม่ได้ทดสอบ รอบ AT ถัดไปมุ่งเป้า JAWS บน Edge บน Windows 11
• นักออกแบบนามบัตร ออกแบบมาโดยใช้เมาส์เป็นหลักสำหรับการดูตัวอย่างแบบลาก-วาง ทุกตัวควบคุมมีทางเลือกแป้นพิมพ์ แต่ลูปข้อเสนอแนะสดยังคงเป็นภาพ
• รายงานการตรวจสอบภายนอก รอดำเนินการ สถานะที่รับรองตนเองในตารางด้านบนจะถูกแทนที่ด้วยผลการค้นพบของผู้ตรวจสอบเมื่อรายงานมาถึง
• เทคโนโลยีช่วยเหลือของบุคคลที่สามบางอย่าง (Dragon NaturallySpeaking, Speech-to-text บน Android) ไม่อยู่ใน matrix การถดถอยของเรา เรารับรายงานชุมชนและแก้ไขตามตั๋ว

บันทึกการเปลี่ยนแปลงการเข้าถึง

• 2026-04-19 (PM), แก้ไขการเปิดสองครั้งของภูมิภาคสด TalkBack: ลบ aria-live="polite" จาก wrapper #qr-preview การประกาศตอนนี้มาจากป้ายความสามารถในการสแกน role="status" เท่านั้น ครั้งละหนึ่งครั้งต่อการสร้าง Modal BCD: ตัวเลือกสีได้รับการผูก <label for> ที่เหมาะสม คอนเทนเนอร์กริดพรีเซ็ตได้รับ role="group" + aria-label ตาราง Accessibility ได้รับ <caption> + scope="col"/"row"
• 2026-04-19 (AM), อัปเกรดตัวบ่งชี้โฟกัส (3 px + สำรอง box-shadow) เพิ่มการสนับสนุน forced-colors + prefers-reduced-motion การตรวจสอบขนาดเป้าหมาย: เพิ่มขนาด .saved-profile-delete, .type-search-clear, .compat-toggle-btn เป็น ≥ 28 px แก้ไขการข้ามระดับหัวเรื่อง (หัวเรื่องย่อย vCard/MECARD h4 → h3) เผยแพร่คำแถลง WCAG 2.2 AA อย่างเป็นทางการ + matrix AT
• 2026-04-18, บันทึกการผ่านพื้นฐาน WCAG 2.2 AA ด้วยตนเอง แถบความน่าเชื่อถือสี่เสาหลักยุบตัวเพื่อลำดับชั้นที่ชัดเจนขึ้น
• 2026-03-08, เผยแพร่หน้า /accessibility/ เริ่มต้น

สิ่งที่เราให้คำมั่น

• การนำทางด้วยแป้นพิมพ์เต็มรูปแบบ ทุกตัวควบคุมตัวสร้าง ทุก modal และทุกกระแสการส่งออกสามารถเข้าถึงได้โดยไม่ต้องใช้เมาส์
• สถานะโฟกัสที่มองเห็นได้ อินพุต ปุ่ม และลิงก์ที่โฟกัสจะแสดงวงแหวนชัดเจน เราไม่พึ่งพาสีเพียงอย่างเดียว
• ป้ายกำกับทุกช่อง อินพุตแบบฟอร์มมีองค์ประกอบ <label> ที่เกี่ยวข้องหรือแอตทริบิวต์ aria-label ข้อความตัวยึดตำแหน่งไม่เคยถูกใช้เป็นป้ายกำกับเดียว
• ภูมิภาค ARIA สดสำหรับการดูตัวอย่าง QR และ toast โปรแกรมอ่านหน้าจอได้ยิน "สร้าง QR แล้ว" และข้อความ toast เมื่อเปิดใช้งาน
• ทางเลือกข้อความสำหรับปุ่มไอคอนเท่านั้น aria-label บนปุ่ม SVG เท่านั้นทุกปุ่ม
• ความหมายสถานะที่ไม่ขึ้นกับสี ป้ายความสามารถในการสแกนและชิปความเข้ากันได้จับคู่สีกับสัญลักษณ์และป้ายข้อความ
• ชื่อรูปแบบการส่งออกที่ชัดเจน ปุ่มดาวน์โหลดระบุ "ดาวน์โหลด PNG" "ดาวน์โหลด SVG" เป็นต้น ไม่ใช่แค่ "ดาวน์โหลด"
• เป้าหมายการแตะมือถือขนาดใหญ่ องค์ประกอบโต้ตอบอย่างน้อย 44 × 44 พิกเซล CSS บนตัวชี้หยาบตาม WCAG 2.5.8
• เคารพการเคลื่อนไหวลดลง การเปลี่ยนแปลงถูกปิดใช้งานภายใต้ prefers-reduced-motion: reduce

ที่เรายังขาด

• JAWS ยังไม่ได้ทดสอบ ได้รับใบอนุญาต JAWS แล้ว จองช่องเวลาทดสอบสำหรับรอบ AT ถัดไป ผู้อ่านหลักอื่นๆ ทั้งหมด (VoiceOver macOS + iOS, NVDA, Narrator, TalkBack) ผ่านการถดถอยล่าสุด
• นักออกแบบนามบัตร พึ่งพาเมาส์มากตามการออกแบบ (ลากเพื่อวางตำแหน่ง ดูตัวอย่าง canvas) มีทางเลือกแป้นพิมพ์สำหรับทุกตัวควบคุม แต่ลูปข้อเสนอแนะดูตัวอย่างสดยังคงเป็นภาพเป็นหลัก ตัวควบคุมสีตอนนี้ใช้การผูก <label for> ที่เหมาะสม + role="group" บนตัวเลือกพรีเซ็ต (2026-04-19)
• กระแสตัวสร้างที่ซับซ้อน (CSV แบบกลุ่ม วิซาร์ดหลายขั้นตอน) อาจใช้โครงสร้างลิงก์ข้ามที่ดีกว่า วางแผนแล้ว
• สรุปตารางเชิงพรรณนา ตาราง Accessibility + ความเข้ากันได้ตอนนี้มีแอตทริบิวต์ <caption> + scope (2026-04-19) ยังคงวางแผนสรุปเชิงเล่าเรื่องระดับแถวที่ยาวขึ้นสำหรับทุกแถว

Matrix การสนับสนุนเทคโนโลยีช่วยเหลือ

ผลงานวิศวกรรม ไม่ใช่แถลงการณ์ประชาสัมพันธ์ แต่ละแถวคือการผสมผสานเบราว์เซอร์ + AT + แพลตฟอร์มจริงที่เราจับต้องได้ด้วยตนเอง สถานะสะท้อนการผ่านด้วยตนเองล่าสุด คำเตือนบันทึกสิ่งที่ยังคงบล็อกการผ่านสมบูรณ์

รอบการออกใหม่: matrix จะรันใหม่กับการเปลี่ยนแปลง UI หลักทุกครั้ง "ผ่าน" = ไม่มีตัวบล็อก คำเตือนคือการถดถอยด้านความสวยงามหรือขอบเขตแคบที่อยู่ในคิวสำหรับรุ่นถัดไป "ยังไม่ได้ทดสอบ" = เรายังไม่ได้รันการผสมผสานด้วยตนเอง, เราบอกแทนที่จะละเว้น

แผนที่แป้นพิมพ์

• Tab / Shift+Tab: เลื่อนไปข้างหน้า / ข้างหลังผ่านองค์ประกอบที่โฟกัสได้
• Enter / Space: เปิดใช้งานปุ่มและสวิตช์
• ปุ่มลูกศร: เลื่อนระหว่างตัวเลือกภายในกลุ่มวิทยุ (ตัวเลือกประเภท ตัวเลือกเทมเพลต แถบแท็บ)
• Escape: ปิด modal (นักออกแบบนามบัตร preflight บริการพิมพ์ ครอบตัดภาพ)
• Home / End ภายในเมนูล้นเพื่อข้ามไปยังรายการแรก / สุดท้าย

การตรวจสอบภายใน, 2026-04-19

การผ่าน WCAG 2.2 AA ด้วยตนเองกับ หน้าแรก, /print-size/, ฮับ /standards/ ใหม่ + 9 หน้าผู้มีอำนาจ และ 45 หน้าปลายทางรูปแบบการชำระเงิน (ที่รับช่วงจากเทมเพลตที่ใช้ร่วมกัน) สิ่งที่เราตรวจสอบ สิ่งที่เราแก้ไข และสิ่งที่ยังเปิดอยู่:

ตรวจสอบว่าผ่านแล้ว

• เป้าหมายลิงก์ข้ามมีอยู่, ลิงก์ข้าม (href="#generator") แก้ไขเป็นองค์ประกอบที่มองเห็นได้ในทุกรูปแบบหน้า
• สไตล์โฟกัสที่มองเห็นได้, :focus-visible ประกาศทั่วโลกด้วยโครงร่าง 2px บวกกับการแทนที่ต่ออินพุตด้วยเส้นขอบสี + เงา ยืนยันผ่านการตรวจสอบ CSS ที่บรรทัด 34 และ 88 ของ site/css/style.c17bfd85.css
• อินพุตแบบฟอร์มทั้งหมดมีป้ายกำกับ, ทุก <input> / <select> / <textarea> ในตัวสร้างมี <label for="..."> ที่ชัดเจนหรือ <label> ที่ครอบ ไม่ใช้ตัวยึดตำแหน่งเป็นป้ายกำกับที่ไหนเลย
• ปุ่มมีชื่อที่เข้าถึงได้, ทุก <button> มีเนื้อหาข้อความหรือ aria-label ปุ่มเฉพาะ SVG (hamburger, แชร์, ติดตั้ง) ทั้งหมดมี aria-label
• SVG ตกแต่งถูกทำเครื่องหมายว่าซ่อน, aria-hidden="true" บนไอคอนตกแต่งทุกอันเพื่อให้โปรแกรมอ่านหน้าจอข้ามแทนที่จะประกาศรูปทรงเรขาคณิต
• บทบาท ARIA ที่ถูกต้อง, role="radiogroup" บนตัวเลือกประเภทด้วย role="radio" + aria-checked บนแต่ละตัวเลือก role="tablist" / role="tab" + aria-selected บนแท็บแผง
• ความคมชัดของข้อความ, ข้อความหลักคือ #f5f5f5 บน #08090a (≈ 17:1, WCAG AAA) ข้อความเบา #a3a3a3 บนพื้นหลังเดียวกันคือ ≈ 8:1 (เหนือ AAA 7:1)
• ตัวสลับภาษา มี aria-label="Language" แม้ว่าป้ายกำกับที่มองเห็นได้จะเป็นนัย

แก้ไขในการผ่านนี้

• การข้ามระดับหัวเรื่อง, หัวเรื่องย่อยสามตัวภายในส่วนช่องเพิ่มเติม vCard / MECARD เป็น <h4> ภายใต้ <h2> โดยไม่มี <h3> ระดับกลาง เครื่องมือโครงร่างโปรแกรมอ่านหน้าจอตั้งค่าสถานะว่า "ระดับที่ข้าม" เปลี่ยนเป็น <h3> เพื่อให้โครงร่างอ่าน h1 → h2 → h3 → h3 อย่างสะอาด

ข้อจำกัดที่ทราบ

• การสแกนเต็มรูปแบบ Axe / NVDA / VoiceOver ต้องใช้เบราว์เซอร์ + AT ที่เราไม่สามารถรันจาก build pipeline ได้ กำหนดการผ่านด้วยตนเองตามเบราว์เซอร์รายเดือน
• การตรวจสอบอิสระจากบุคคลที่สาม ได้รับมอบหมายแล้ว (ดูตัวยึดตำแหน่ง /accessibility/audit/) รายงานจะเผยแพร่เมื่อมาถึงแม้มีผลการค้นพบ
• แป้นพิมพ์ลัด "/" สำหรับแผงคำสั่งมีความเสี่ยงการชนเล็กน้อยบนหน้าที่มีช่องค้นหา เราใช้ preventDefault() เฉพาะเมื่อโฟกัสอยู่นอกอินพุต บันทึกแล้วแต่ยังไม่ได้ตรวจสอบกับ AT

รายงานปัญหา

หากมีบางอย่างที่เข้าถึงไม่ได้ด้วยแป้นพิมพ์ ติดป้ายกำกับผิด หรือใช้งานไม่ได้กับการตั้งค่าของคุณ ส่งอีเมลไปที่ hello@abundera.ai ใส่เบราว์เซอร์ ระบบปฏิบัติการ AT และกระแสเฉพาะของคุณ เราถือว่าบัก Accessibility เป็นปัญหาสำคัญ

ตรวจสอบล่าสุด: 2026-04-19 การตรวจสอบครั้งต่อไป: หลังจากการเปลี่ยนแปลง UI หลักครั้งต่อไป