ทำหน้าชำระเงินให้ผู้ใช้ทุกกลุ่มใช้ได้ ตัวอักษรอ่านง่าย ปุ่มกดง่าย

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

ตัวอักษรและสี

ขนาดและน้ำหนักตัวอักษร

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

คอนทราสต์ของสี

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

ปุ่มและการกด

• ปุ่มมีพื้นที่กดใหญ่พอและเว้นระยะจากปุ่มข้างเคียง
• ข้อความบนปุ่มบอกการกระทำชัด เช่น "อัปโหลดสลิป" แทนคำว่า "ตกลง"
• ปุ่มที่มีผลถาวร เช่น ยกเลิกคำสั่งซื้อ ควรมีการยืนยันอีกครั้ง
• ปุ่มต้องใช้งานได้ด้วยแป้นพิมพ์ (กด Tab และ Enter) สำหรับผู้ใช้ที่ไม่ใช้เมาส์

ข้อความที่เข้าใจง่าย

เขียนด้วยภาษาธรรมดา ประโยคสั้น หนึ่งประโยคหนึ่งความคิด หลีกเลี่ยงศัพท์เทคนิคอย่าง "ธุรกรรมไม่สำเร็จ รหัสผิดพลาด 4002" ให้บอกว่าเกิดอะไรขึ้นและต้องทำอะไรต่อ เช่น "ยอดเงินในสลิปไม่ตรงกับคำสั่งซื้อ กรุณาตรวจสอบยอดแล้วอัปโหลดใหม่" ข้อความผิดพลาดควรอยู่ใกล้ช่องที่เกี่ยวข้อง ไม่ใช่ปรากฏไกลจากจุดที่ลูกค้ากำลังดู

รองรับเทคโนโลยีช่วยเหลือ

ผู้ใช้บางคนใช้โปรแกรมอ่านหน้าจอ ช่วยให้ได้ผลโดยทำสามอย่าง คือ ใช้ป้ายกำกับ (label) ที่ถูกต้องกับทุกช่องกรอก ใส่ข้อความทดแทน (alt) ให้รูปสำคัญ เช่น QR ว่าเป็นรหัสชำระเงินจำนวนเท่าใด และเรียงลำดับเนื้อหาในโค้ดให้ตรงกับลำดับที่ตาเห็น นอกจากนี้ถ้ามีเวลานับถอยหลังหมดอายุ ควรแจ้งเตือนล่วงหน้าและให้ขยายเวลาหรือขอลิงก์ใหม่ได้ เพราะบางคนต้องใช้เวลานานกว่าปกติ

ตารางตรวจเร็ว

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

ทดสอบแบบง่าย ๆ

1. ขยายตัวอักษรของเบราว์เซอร์หรือมือถือเป็น 200 เปอร์เซ็นต์ แล้วดูว่ายังใช้งานได้
2. ลองกดใช้งานทั้งหน้าด้วยแป้นพิมพ์อย่างเดียว
3. ถ่ายภาพหน้าจอเป็นขาวดำเพื่อดูว่าข้อมูลสำคัญยังเห็นชัดโดยไม่พึ่งสี
4. ให้ผู้ปกครองหรือผู้สูงอายุในครอบครัวลองจ่ายเงิน แล้วสังเกตโดยไม่ช่วย

เช็กลิสต์สรุป

• ตัวอักษรอ่านง่าย คอนทราสต์ดี
• ปุ่มใหญ่ ข้อความตรงไปตรงมา
• ข้อความผิดพลาดบอกวิธีแก้
• ใช้งานด้วยแป้นพิมพ์ได้
• ไม่มีขั้นตอนที่บังคับให้รีบจนเกินไป

เมื่อปรับหน้าให้ใช้ง่ายแล้ว ลองอ่านวิธีลดงานตามเก็บเงินเพิ่มเติมที่ ลดการทวงถามเรื่องการชำระเงิน หรือดูคำถามทั่วไปที่ FAQ