# ออกแบบบริการสำหรับผู้สูงอายุ WCAG 2.2 กับช่องทางติดต่อคนจริง

> ที่มา: https://phygital.co.th/insights/elderly-friendly-digital-service-design · เผยแพร่ 27 สิงหาคม 2568 · อ่าน 11 นาที · โดย PARANATH PANARATANA

ออกแบบบริการสำหรับผู้สูงอายุด้วยเกณฑ์ WCAG 2.2 ปุ่มอย่างน้อย 24 pixel ขยายตัวอักษร 200% ไม่ให้กรอกซ้ำ และวางช่องทางติดต่อคนจริงไว้ตำแหน่งเดิมทุกหน้าตามเกณฑ์ 3.2.6

## Key Takeaways

- **W3C ระบุว่าผู้สูงอายุจำนวนมากมีความสามารถที่ลดลงตามวัยในสี่ด้าน** — คือการมองเห็น การเคลื่อนไหวของมือ การได้ยิน และความจำระยะสั้น ความต้องการเหล่านี้ทับซ้อนกับความต้องการของคนพิการ เว็บไซต์ที่ผ่านมาตรฐานการเข้าถึงจึงใช้ง่ายขึ้นสำหรับผู้สูงอายุด้วย
- **เอกสาร WCAG 2.2 ฉบับวันที่ 12 ธันวาคม 2024 มีเกณฑ์ใหม่ที่ตรงกับผู้สูงอายุหลายข้อ** — เช่น ปุ่มขนาดอย่างน้อย 24×24 CSS pixel ไม่บังคับให้กรอกข้อมูลเดิมซ้ำ และไม่บังคับให้จำรหัสผ่านเป็นทางเดียวในการยืนยันตัวตน
- **เกณฑ์ข้อ 3.2.6 Consistent Help กำหนดให้ช่องทางช่วยเหลืออยู่ลำดับเดิมทุกหน้า** — รวมถึงช่องทางติดต่อคนจริง บริการที่ผสมหน้าจอกับพนักงานจึงมีมาตรฐานสากลรองรับ

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

ผู้สูงอายุไทยตามทะเบียนเดือนสิงหาคม 2569 มีมากกว่า 14 ล้านคน และส่วนใหญ่ยังทำกิจวัตรประจำวันได้เอง รายละเอียดตัวเลขแยกช่วงอายุและจังหวัดอยู่ใน[บทการตลาดผู้สูงอายุไทย 14.49 ล้านคน แยกตามช่วงอายุและจังหวัด](https://phygital.co.th/insights/marketing-elderly-thailand-super-aged-society) บทนี้ต่อจากตัวเลขชุดนั้น ไปที่คำถามว่าหน้าจอและช่องทางบริการควรหน้าตาแบบไหน

## ผู้สูงอายุเจออุปสรรคอะไรบนหน้าจอ

[หน้า Older Users and Web Accessibility ของ W3C](https://www.w3.org/WAI/older-users/) สรุปว่าผู้สูงอายุจำนวนมากมีความสามารถที่ลดลงตามวัย ซึ่งกระทบการใช้เว็บในสี่ด้าน

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

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

### **ทำไมทีมออกแบบควรใช้มาตรฐานการเข้าถึงแทนการเดาว่าผู้สูงอายุต้องการอะไร**

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

## เกณฑ์ WCAG 2.2 ที่ตรงกับผู้สูงอายุ

[Web Content Accessibility Guidelines (WCAG) 2.2](https://www.w3.org/TR/WCAG22/) เป็นข้อแนะนำของ W3C ลงวันที่ 12 ธันวาคม 2024 เกณฑ์ต่อไปนี้ตรงกับอุปสรรคสี่ด้านในตารางก่อนหน้า ช่องระดับบอกว่าเกณฑ์อยู่ในระดับ A AA หรือ AAA

| เกณฑ์                                     | ระดับ | สาระ                                                                                 |
| ----------------------------------------- | ----- | ------------------------------------------------------------------------------------ |
| 1.4.3 Contrast (Minimum)                  | AA    | ข้อความกับพื้นหลังมีคอนทราสต์อย่างน้อย 4.5:1                               |
| 1.4.4 Resize Text                         | AA    | ข้อความขยายได้ 200% โดยไม่เสียเนื้อหาหรือการใช้งาน                          |
| 2.2.1 Timing Adjustable                   | A     | หน้าที่จำกัดเวลาต้องให้ปิด ปรับ หรือขอต่อเวลาได้                            |
| 2.5.7 Dragging Movements                  | AA    | ทุกฟังก์ชันที่ต้องลากต้องมีทางทำด้วยการแตะครั้งเดียว                    |
| 2.5.8 Target Size (Minimum)               | AA    | เป้าหมายที่กดได้มีขนาดอย่างน้อย 24×24 CSS pixel หรือเว้นระยะตามที่กำหนด |
| 3.2.6 Consistent Help                     | A     | ช่องทางช่วยเหลือที่ซ้ำหลายหน้าต้องอยู่ลำดับเดิม                           |
| 3.3.7 Redundant Entry                     | A     | ข้อมูลที่กรอกแล้วในขั้นตอนเดียวกันต้องเติมให้อัตโนมัติหรือให้เลือกได้ |
| 3.3.8 Accessible Authentication (Minimum) | AA    | ขั้นตอนยืนยันตัวตนต้องมีทางที่ไม่ต้องใช้ความจำหรือแก้ปริศนา          |

เกณฑ์ 2.5.7 2.5.8 3.2.6 3.3.7 และ 3.3.8 เป็นเกณฑ์ใหม่ใน WCAG 2.2 ทีมที่เคยตรวจเว็บด้วย WCAG 2.1 จึงควรตรวจห้าข้อนี้เพิ่ม

### **คลิปสอนใช้งานสำหรับลูกค้าสูงวัยต้องมีอะไรบ้าง**

ต้องมีคำบรรยายใต้ภาพ และเสียงพูดต้องได้ยินชัดกว่าเสียงประกอบ เกณฑ์ 1.2.2 Captions (Prerecorded) ระดับ A ให้สื่อวิดีโอที่อัดไว้ล่วงหน้ามีคำบรรยายครบทุกเสียงในคลิป ส่วนเกณฑ์ 1.4.7 Low or No Background Audio ระดับ AAA ใช้กับไฟล์เสียงล้วนที่เน้นเสียงพูด ให้ไม่มีเสียงพื้นหลัง ปิดเสียงพื้นหลังได้ หรือเสียงพื้นหลังเบากว่าเสียงพูดอย่างน้อย 20 เดซิเบล เกณฑ์ข้อหลังตรงกับที่ W3C เขียนว่าผู้สูงอายุแยกเสียงซ้อนได้ยาก เมื่อมีดนตรีประกอบ ร้านที่ทำคลิปสอนใช้แอปจึงควรลดเสียงดนตรีลงหรือตัดออกในช่วงที่มีคนพูด

### **ข้อความแจ้งข้อผิดพลาดควรเขียนแบบไหน**

บอกให้ชัดว่าช่องไหนผิดและผิดอย่างไร เกณฑ์ 3.3.1 Error Identification ระดับ A ให้ระบบที่ตรวจพบข้อผิดพลาดอัตโนมัติชี้ช่องที่ผิดและอธิบายเป็นข้อความ ส่วนเกณฑ์ 3.3.2 Labels or Instructions ให้มีป้ายหรือคำแนะนำทุกช่องที่ต้องกรอก ข้อความอย่าง "ข้อมูลไม่ถูกต้อง" ที่ไม่บอกว่าช่องไหน ทำให้ผู้ใช้ที่ความจำระยะสั้นลดลงต้องไล่ตรวจทุกช่องใหม่ ข้อความที่ดีกว่าคือ "เบอร์โทรศัพท์ต้องมี 10 หลัก ตอนนี้กรอกไว้ 9 หลัก"

### **ปุ่มขนาด 24 pixel พอสำหรับลูกค้าสูงวัยหรือยัง**

เป็นขั้นต่ำของระดับ AA WCAG 2.2 ยังมีเกณฑ์ 2.5.5 Target Size (Enhanced) ระดับ AAA ที่ให้เป้าหมายมีขนาดอย่างน้อย 44×44 CSS pixel ร้านที่ลูกค้าส่วนใหญ่อายุเกิน 60 ปี ควรเลือกปุ่มที่กดบ่อยที่สุดสามถึงห้าปุ่ม ได้แก่ ปุ่มชำระเงิน ปุ่มโทรหาพนักงาน และปุ่มยืนยันนัดหมาย แล้วขยายปุ่มกลุ่มนี้ให้ถึงระดับ 44 pixel ซึ่งทำได้ไม่ยาก และเป็นจุดที่ลูกค้ากดพลาดแล้วเสียมากที่สุด

## ช่องทางคนจริงควรอยู่ตรงไหน

เกณฑ์ 3.2.6 Consistent Help ระบุกลไกช่วยเหลือไว้สี่แบบ คือรายละเอียดติดต่อคน กลไกติดต่อคน ทางเลือกให้ช่วยตัวเอง และกลไกติดต่อแบบอัตโนมัติทั้งหมด ถ้าหน้าเว็บมีกลไกเหล่านี้ซ้ำหลายหน้าในชุดเดียวกัน ต้องอยู่ลำดับเดียวกันเมื่อเทียบกับเนื้อหาอื่น เว้นแต่ผู้ใช้เป็นคนเปลี่ยนเอง

| กลไกช่วยเหลือตามเกณฑ์ 3.2.6 | ตัวอย่างในธุรกิจไทย                                |
| ------------------------------- | ----------------------------------------------------- |
| รายละเอียดติดต่อคน           | เบอร์โทรศัพท์ร้าน เวลาที่มีคนรับสาย            |
| กลไกติดต่อคน                  | ปุ่มแชตที่มีพนักงานตอบ ปุ่ม LINE ที่แอดมินตอบ |
| ทางเลือกให้ช่วยตัวเอง      | หน้าคำถามที่พบบ่อย คลิปสอนใช้งาน               |
| กลไกติดต่ออัตโนมัติทั้งหมด   | แชตบอต                                               |

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

### **ลูกค้าสูงวัยติดขั้นตอนกลางทาง ธุรกิจควรให้ติดต่อคนจริงทางไหน**

ทางที่ลูกค้าไม่ต้องเล่าเรื่องใหม่ตั้งแต่ต้น ถ้าลูกค้ากดปุ่มโทรจากหน้าชำระเงิน พนักงานควรเห็นว่าลูกค้าค้างอยู่ขั้นไหน ถ้าช่องทางคนจริงเป็น LINE ข้อความแรกควรส่งชื่อขั้นตอนที่ลูกค้าติดมาให้พนักงานอัตโนมัติ หลักนี้สอดคล้องกับเกณฑ์ 3.3.7 ที่ไม่ให้ลูกค้ากรอกข้อมูลเดิมซ้ำในขั้นตอนเดียวกัน

## บริการของรัฐที่เปิดหลายช่องทางพร้อมกัน

โครงการบัตรสวัสดิการรอบปี 2569 ของกระทรวงการคลังเป็นตัวอย่างบริการที่ออกแบบให้คนเลือกช่องทางเองได้ ประกาศของกระทรวงการคลังเลขที่ 41/2569 เปิดให้ยืนยันสิทธิได้ทั้งแอปเป๋าตัง แอปทางรัฐ เว็บไซต์โครงการ ตู้ ATM ของธนาคารกรุงไทย และหน่วยรับลงทะเบียนห้าธนาคาร ส่วนประกาศเลขที่ 79/2569 บอกว่าผู้ต้องแก้ข้อมูลติดต่อหน่วยงานเจ้าของข้อมูลหรือศูนย์ One Stop Service ระดับอำเภอได้

| ช่องทาง                        | ลักษณะ                             |
| ------------------------------- | ---------------------------------- |
| แอปเป๋าตัง และแอปทางรัฐ    | ทำเองบนมือถือ                  |
| เว็บไซต์โครงการ                | ทำเองบนคอมพิวเตอร์หรือมือถือ |
| ตู้ ATM ธนาคารกรุงไทย         | ทำเองที่ตู้                     |
| หน่วยรับลงทะเบียนห้าธนาคาร | มีพนักงานช่วย                    |
| One Stop Service ระดับอำเภอ    | มีเจ้าหน้าที่ช่วยแก้ข้อมูล    |

ช่องทางทั้งห้าแบบรับงานเดียวกัน คนที่ถนัดมือถือทำจบได้เอง คนที่ต้องการคนช่วยก็มีจุดให้ไปหา ท้ายประกาศเลขที่ 79/2569 ยังแยกเบอร์สอบถามตามประเภทปัญหา ปัญหาการลงทะเบียนและบัตรโทรศูนย์ของกระทรวงมหาดไทยที่ 1548 เรื่องคุณสมบัติและวงเงินติดต่อสำนักงานเศรษฐกิจการคลัง และเรื่องการใช้บัตรโทรศูนย์ลูกค้าสัมพันธ์ 0-2109-2345 ผู้ใช้จึงรู้ก่อนโทรว่าเรื่องแบบไหนต้องคุยกับใคร ธุรกิจที่มีหลายแผนกทำแบบเดียวกันได้บนหน้าติดต่อเรา เกณฑ์ทั้งหมดของโครงการนี้และผลต่อร้านค้าที่รับสิทธิ์อยู่ใน[บทกลุ่มผู้มีรายได้น้อยกับร้านธงฟ้า](https://phygital.co.th/insights/marketing-grassroots-consumers-thailand)

### **ธุรกิจเล็กจะมีหลายช่องทางแบบนี้ได้อย่างไร**

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

ส่วนธุรกิจที่อยากช่วยลูกค้าสูงวัยใช้มือถือตั้งแต่พื้นฐาน เช่น ตั้งขนาดตัวอักษรหรือจดจำไอคอน ดูวิธีสอนทีละขั้นได้ใน[บทสอนผู้สูงอายุใช้สมาร์ทโฟน](https://phygital.co.th/insights/elderly-basic-smartphone-guide) และเรื่องความปลอดภัยของแอปธนาคารอยู่ใน[คู่มือแอปธนาคารและพร้อมเพย์สำหรับผู้สูงอายุ](https://phygital.co.th/insights/elderly-mobile-banking-promptpay-safety-guide) ทั้งสองบทต่อยอดจากเกณฑ์หน้าจอในบทนี้ไปถึงการใช้งานจริงของลูกค้าเจ้าของเครื่อง

## ห้าจุดที่ตรวจได้ในสัปดาห์นี้

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

### **ทีมเล็กที่จ้างนักพัฒนาเป็นครั้งคราว เริ่มจากข้อไหนก่อนดี**

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

## สรุป

W3C ระบุว่าผู้สูงอายุจำนวนมากมีการมองเห็น การเคลื่อนไหวของมือ การได้ยิน และความจำระยะสั้นที่ลดลงตามวัย และความต้องการเหล่านี้ทับซ้อนกับคนพิการ WCAG 2.2 ลงวันที่ 12 ธันวาคม 2024 จึงเป็นมาตรฐานที่ใช้ได้ตรงที่สุด เกณฑ์ที่ควรเริ่มคือคอนทราสต์ 4.5:1 การขยายข้อความ 200% ปุ่มขนาดอย่างน้อย 24×24 CSS pixel หรือ 44×44 ในระดับ AAA การไม่ให้กรอกซ้ำ การยืนยันตัวตนที่ไม่ต้องจำรหัส และช่องทางช่วยเหลือที่อยู่ลำดับเดิมทุกหน้าตามเกณฑ์ 3.2.6 โครงการบัตรสวัสดิการรอบปี 2569 แสดงว่าบริการเดียวกันเปิดได้ทั้งช่องทางทำเองและช่องทางที่มีคนช่วย ธุรกิจเล็กเริ่มได้จากหน้าเว็บที่ผ่านเกณฑ์กับช่องทางคนจริงหนึ่งช่องทาง

## คำถามที่พบบ่อย (FAQ)

### มีแนวทางสากลเรื่องเว็บไซต์สำหรับผู้สูงอายุไหม

หน้าแนวทางสำหรับผู้ใช้สูงวัยของ W3C ชี้ไปที่มาตรฐานการเข้าถึงสากลที่มีอยู่ โดยเฉพาะ WCAG ซึ่งครอบคลุมผู้สูงอายุที่มีความต้องการด้านการเข้าถึงจากวัยด้วย ฉบับล่าสุดคือ WCAG 2.2

### ตัวอักษรบนเว็บควรขยายได้แค่ไหน

เกณฑ์ 1.4.4 ระดับ AA ให้ขยายข้อความได้ถึงสองเท่าโดยไม่ต้องใช้เครื่องมือช่วย และเนื้อหาหรือการใช้งานต้องไม่เสีย

### เว็บที่ให้กรอก OTP ภายในเวลาจำกัดผิดเกณฑ์ไหม

เกณฑ์ 2.2.1 ให้เนื้อหาที่ตั้งเวลาไว้ต้องให้ผู้ใช้ปิด ปรับ หรือขอต่อเวลาได้ มีข้อยกเว้นบางกรณี เช่น เวลาที่เป็นส่วนจำเป็นของกิจกรรมแบบเรียลไทม์ ทีมพัฒนาควรอ่านข้อยกเว้นทั้งหมดในเอกสาร WCAG ก่อนสรุปว่าหน้าไหนเข้าข่าย

### แชตบอตแทนพนักงานได้ไหม

เกณฑ์ 3.2.6 นับแชตบอตเป็นกลไกช่วยเหลือแบบหนึ่ง แยกจากกลไกติดต่อคน ธุรกิจจึงมีแชตบอตได้ แต่ลูกค้าที่ต้องการคุยกับคนควรมีทางไปถึงพนักงาน และทางนั้นต้องอยู่ตำแหน่งเดิมทุกหน้า

### ต้องให้ผู้สูงอายุทดสอบเว็บจริงไหม

หน้าแนวทางของ W3C แนะนำให้ศึกษาผู้ใช้สูงวัยโดยตรงผ่านการนำผู้ใช้จริงเข้ามาร่วมทดสอบ การตรวจตามเกณฑ์บอกได้ว่าหน้าผ่านมาตรฐานหรือไม่ แต่การทดสอบกับผู้ใช้จริงบอกได้ว่าลูกค้าทำรายการจบหรือไม่

## ลูกค้าสูงวัยที่โทรมากลางขั้นตอน ต้องเล่าเรื่องใหม่ตั้งแต่ต้นหรือเปล่า

ลองให้ PHYGITAL AGENCY เปิดขั้นตอนบนเว็บของคุณเทียบกับบทสนทนาของพนักงานรับสาย แล้วรับรายการจุดที่ต้องแก้ทั้งฝั่งหน้าจอและฝั่งคน

- [นัดประชุมผ่าน Google Meet](https://calendar.app.google/DotQdE7Ca8LZG6Us5)
- [เพิ่มเพื่อนใน LINE](https://lin.ee/J8Qq8Do)