โปรแกรมอ่านหน้าจอ: คืออะไร ประเภทของโปรแกรมอ่านหน้าจอ และหลักการทำงาน

โปรแกรมอ่านหน้าจอคืออะไร?

โปรแกรมอ่านหน้าจอ (Screen Reader) คือเทคโนโลยีช่วยเหลือ (Assistive Technology, AT) ที่ตีความอินเทอร์เฟซผู้ใช้แบบกราฟิกและนำเสนอในรูปแบบที่ไม่ใช่ภาพ: ผ่านคำพูดสังเคราะห์หรือจออักษรเบรลล์แบบสัมผัส โปรแกรมอ่านหน้าจอเป็นวิธีการหลักในการเข้าถึงคอมพิวเตอร์และอุปกรณ์มือถือสำหรับผู้ที่สูญเสียการมองเห็นทั้งหมดหรือบางส่วน

โปรแกรมอ่านหน้าจอแรกปรากฏในช่วงปลายทศวรรษ 1980 สำหรับ MS-DOS (เช่น Vocal-Eyes) และต่อมาสำหรับ Windows (JAWS, NVDA) บนแพลตฟอร์มมือถือ โปรแกรมอ่านหน้าจอถูกรวมไว้ในระดับระบบ: Apple รวม VoiceOver ใน iPhone 3GS ในปี 2009, Google รวม TalkBack ใน Android 1.6 ในปีเดียวกัน ภายในปี 2025 สมาร์ทโฟนสมัยใหม่เกือบทั้งหมดมีโปรแกรมอ่านหน้าจอในตัวที่ไม่ต้องติดตั้งซอฟต์แวร์เพิ่มเติม

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

โปรแกรมอ่านหน้าจอทำงานอย่างไร?

โปรแกรมอ่านหน้าจอทำงานอย่างใกล้ชิดกับระบบปฏิบัติการ โดยเข้าถึงการแสดงอินเทอร์เฟซภายในของระบบ — แผนผังการช่วยเหลือ (Accessibility Tree) กลไกนี้เหมือนกันบน iOS และ Android แม้ว่าชื่อ API จะแตกต่างกัน

การแปลงข้อความเป็นคำพูด (TTS)

ช่องทางส่งออกหลักของโปรแกรมอ่านหน้าจอคือเครื่องสังเคราะห์เสียง (Text-To-Speech, TTS) เมื่อโฟกัสการช่วยเหลือมาถึงองค์ประกอบ โปรแกรมอ่านหน้าจอจะดึงเนื้อหาข้อความ (หรือคำอธิบายที่นักพัฒนาให้ไว้) และส่งไปยังเอนจิน TTS เอนจิน TTS สมัยใหม่ เช่น Apple Speech Synthesis และ Google Text-to-Speech ใช้โครงข่ายประสาทเทียมเพื่อสร้างคำพูดที่เป็นธรรมชาติด้วยน้ำเสียง การหยุด และการเน้นที่ถูกต้องตามเครื่องหมายวรรคตอนและประเภทเนื้อหา

ผู้ใช้สามารถปรับความเร็วในการพูด (โดยปกติ 60–80% ของสูงสุดเพื่อการรับรู้ที่สบาย) ระดับเสียงสูงต่ำและระดับความดัง โปรแกรมอ่านหน้าจอบางตัวรองรับหลายเสียงและสลับระหว่างเสียงตามประเภทเนื้อหา — ตัวอย่างเช่น เสียงช้าสำหรับอ่านข้อความและเสียงเร็วสำหรับการนำทางอินเทอร์เฟซ จออักษรเบรลล์ เชื่อมต่อผ่าน Bluetooth และแสดงอักขระสูงสุด 40–80 ตัวในแต่ละครั้ง อัปเดตบรรทัดทุกครั้งที่มีการเปลี่ยนโฟกัส

การจัดการโฟกัสและการนำทาง

โปรแกรมอ่านหน้าจอใช้แนวคิดของโฟกัสการช่วยเหลือ (Accessibility Focus) ซึ่งแตกต่างจากโฟกัสอินพุตมาตรฐาน ผู้ใช้ย้ายโฟกัสการช่วยเหลือด้วยท่าทาง (การแตะ ปัด) และโปรแกรมอ่านหน้าจอจะประกาศองค์ประกอบภายใต้โฟกัส ลำดับการนำทางโดยค่าเริ่มต้นเป็นไปตามลำดับภาพ: จากซ้ายไปขวา จากบนลงล่าง นักพัฒนาสามารถแทนที่ลำดับนี้สำหรับเลย์เอาต์ที่ซับซ้อน

โปรแกรมอ่านหน้าจอยังรองรับโหมดการนำทางต่างๆ ที่ผู้ใช้สลับผ่านโรเตอร์ (VoiceOver) หรือเมนู (TalkBack): ตามหัวเรื่อง ลิงก์ อักขระ คำ ฟอร์ม ในโหมดหัวเรื่อง โปรแกรมอ่านหน้าจอจะเคลื่อนที่ระหว่าง H1–H6 เท่านั้น — ซึ่งสำคัญอย่างยิ่งสำหรับการนำทางอย่างมีประสิทธิภาพผ่านหน้าเว็บและเอกสารยาว โหมดอักขระช่วยเมื่อป้อนรหัสยืนยันหรือรหัสผ่านที่ซับซ้อน โดยออกเสียงแต่ละอักขระแยกกัน

โปรแกรมอ่านหน้าจอหลักสำหรับแพลตฟอร์มมือถือ

โปรแกรมอ่านหน้าจอสองตัวครองแพลตฟอร์มมือถือ: VoiceOver บน iOS และ TalkBack บน Android พวกมันมี API ท่าทางและความสามารถที่แตกต่างกัน แต่หลักการร่วมคือการอ่านแผนผังการช่วยเหลือและการควบคุมด้วยท่าทาง

VoiceOver (iOS)

VoiceOver คือโปรแกรมอ่านหน้าจอของ Apple ที่สร้างไว้ใน iOS, iPadOS และ macOS ใช้ API UIAccessibility เพื่อรับข้อมูลเกี่ยวกับองค์ประกอบและรองรับโรเตอร์สำหรับสลับโหมดนำทาง VoiceOver ถูกรวมกับ iCloud (ซิงค์การตั้งค่าระหว่างอุปกรณ์), Apple Pay (ยืนยันการชำระเงินผ่าน Touch ID หรือ Face ID) และข้อความแบบไดนามิก (ฟอนต์ปรับตามการตั้งค่าผู้ใช้)

ท่าทางของ VoiceOver แตกต่างจาก TalkBack: ใช้การหมุนสองนิ้ว (โรเตอร์), การแตะสามครั้งสำหรับ Screen Curtain และการแตะสองครั้งด้วยสองนิ้วเพื่อยกเลิกการกระทำ VoiceOver รองรับโรเตอร์ที่กำหนดเองซึ่งนักพัฒนาเพิ่มผ่าน UIAccessibilityCustomRotor — ตัวอย่างเช่น สำหรับการนำทางอย่างรวดเร็วผ่านส่วนต่างๆ ของแอปโดยข้ามลำดับมาตรฐาน

TalkBack (Android)

TalkBack คือโปรแกรมอ่านหน้าจอของ Google ซึ่งเป็นส่วนหนึ่งของ Android Accessibility Suite ใช้ AccessibilityService และ AccessibilityNodeInfo เพื่อเข้าถึงอินเทอร์เฟซ TalkBack รองรับเมนูทั่วโลกผ่านการปัดรูปตัว L การกระทำที่กำหนดเองสำหรับองค์ประกอบ และ LiveRegion สำหรับการอัปเดตแบบไดนามิก เริ่มตั้งแต่ Android 14 TalkBack ได้รับการรองรับท่าทางมือเดียวและการรวมกับ Google Assistant ที่ดีขึ้น

TalkBack มีระบบท่าทางที่ยืดหยุ่นกว่า VoiceOver: ผู้ใช้สามารถกำหนดท่าทางเกือบทุกอย่างให้กับการกระทำใดก็ได้ TalkBack ยังรองรับการป้อนอักษรเบรลล์บนหน้าจอ (BrailleBack) — ผู้ใช้ป้อนข้อความด้วยอักษรเบรลล์โดยตรงบนหน้าจอสัมผัสในเลย์เอาต์พิเศษ 3×2 ต่อนิ้ว ซึ่งช่วยเร่งการป้อนข้อความอย่างมากเมื่อเทียบกับแป้นพิมพ์บนหน้าจอ

นอกจาก VoiceOver และ TalkBack ยังมีโปรแกรมอ่านหน้าจอมือถือที่พบได้น้อยกว่า: Select to Speak (Android, อ่านพื้นที่ที่เลือก), Samsung Voice Assistant (แทนที่ TalkBack บนอุปกรณ์ Samsung ที่ใช้ One UI) และโซลูชันของบริษัทอื่นสำหรับกลุ่มเฉพาะ — ตัวอย่างเช่น สำหรับผู้ใช้สมาร์ทโฟนจีนที่ไม่มีบริการ Google

โปรแกรมอ่านหน้าจอโต้ตอบกับแอปอย่างไร

โปรแกรมอ่านหน้าจอไม่สามารถเข้าถึงส่วนประกอบ UI ของแอปได้โดยตรง แต่จะทำงานผ่านชั้น — API การช่วยเหลือของระบบปฏิบัติการ ระบบปฏิบัติการสร้างแผนผังการช่วยเหลือ (Accessibility Tree) ซึ่งโปรแกรมอ่านหน้าจอจะสำรวจและวิเคราะห์

แผนผังการช่วยเหลือบน iOS และ Android

บน iOS แผนผังการช่วยเหลือสร้างจากออบเจกต์ UIAccessibilityElement ที่สอดคล้องกับแต่ละ View บนหน้าจอ แต่ละองค์ประกอบประกอบด้วย label (ข้อความหลัก), traits (ประเภทองค์ประกอบ: ปุ่ม, หัวเรื่อง, ลิงก์), hint (คำแนะนำ), value (ค่าปัจจุบันสำหรับแถบเลื่อนและตัวบ่งชี้) และ frame (พื้นที่สัมผัส) ระบบสร้างองค์ประกอบโดยอัตโนมัติสำหรับส่วนประกอบ UI มาตร ฐาน แต่นักพัฒนาสามารถเพิ่มและปรับแต่งได้

บน Android แผนผังการช่วยเหลือสร้างจากออบเจกต์ AccessibilityNodeInfo แต่ละโหนดประกอบด้วย: text (ข้อความหรือ contentDescription), className (ประเภทองค์ประกอบ), contentDescription (คำอธิบาย), stateDescription (สถานะ), isEnabled, isChecked, isClickable และแฟล็กอื่นๆ Android ยังรองรับ AccessibilityAction — รายการการกระทำที่โปรแกรมอ่านหน้าจอสามารถดำเนินการในนามของผู้ใช้: คลิก กดค้าง เลื่อน ตั้งค่าโฟกัส ตั้งค่าข้อความ

เหตุการณ์การช่วยเหลือ

เมื่อเกิดการเปลี่ยนแปลงในอินเทอร์เฟซ (องค์ประกอบใหม่ปรากฏขึ้น ข้อความเปลี่ยน องค์ประกอบปรากฏหรือหายไป) ระบบปฏิบัติการจะส่ง AccessibilityEvent โปรแกรมอ่านหน้าจอสมัครรับเหตุการณ์เหล่านี้และตอบสนองต่อเหตุการณ์เหล่านั้น: ตัวอย่างเช่น เมื่อกล่องโต้ตอบปรากฏขึ้น โปรแกรมอ่านหน้าจอจะย้ายโฟกัสไปยังหัวเรื่องโดยอัตโนมัติและประกาศเนื้อหา

// การรับฟังเหตุการณ์การช่วยเหลือบน Android
class CustomAccessibilityService : AccessibilityService() {
    override fun onAccessibilityEvent(event: AccessibilityEvent?) {
        event ?: return
        when (event.eventType) {
            TYPE_VIEW_CLICKED ->
                handleClick(event)
            TYPE_WINDOW_STATE_CHANGED ->
                handleWindowChange(event)
            TYPE_VIEW_TEXT_CHANGED ->
                handleTextChange(event)
        }
    }
}

บน iOS เหตุการณ์ที่คล้ายกันถูกจัดการผ่าน UIAccessibility.Notification: layoutChanged (เลย์เอาต์เปลี่ยน), screenChanged (หน้าจอใหม่ทั้งหมด), announcement (ประกาศที่กำหนดเอง), pageScrolled (เลื่อนหน้า) นักพัฒนาส่งเหตุการณ์เหล่านี้ผ่าน UIAccessibility.post เพื่อให้โปรแกรมอ่านหน้าจอตอบสนองต่อการเปลี่ยนแปลงอย่างถูกต้อง ตัวอย่างเช่น เมื่อเปิดหน้าต่างโมดอล ต้องส่ง screenChanged พร้อมหัวเรื่องใหม่ — มิฉะนั้น VoiceOver จะยังคงอยู่ที่องค์ประกอบก่อนหน้าภายใต้หน้าต่าง

การพัฒนาแอปสำหรับโปรแกรมอ่านหน้าจอ

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

กฎการช่วยเหลือพื้นฐาน

องค์ประกอบเชิงโต้ตอบทั้งหมดต้องมีคำอธิบายที่มีความหมาย: ปุ่ม “ส่ง” ควรถูกอธิบายเป็น “ส่งข้อความ” ไม่ใช่แค่ “ปุ่ม” องค์ประกอบตกแต่ง (ตัวคั่น, รูปภาพพื้นหลัง, ไอคอนที่ไม่มีฟังก์ชัน) ควรถูกซ่อนจากโปรแกรมอ่านหน้าจอ ลำดับการนำทางควรเป็นไปตามกระแสตรรกะของหน้าจอ ไม่ใช่การจัดวางตามภาพ คอนทราสต์ของข้อความควรอย่างน้อย 4.5:1 สำหรับข้อความปกติและ 3:1 สำหรับข้อความขนาดใหญ่ (WCAG AA)

// iOS: การกำหนดค่าที่ถูกต้องสำหรับองค์ประกอบที่ซับซ้อน
let customControl = UIControl()
customControl.isAccessibilityElement = true
customControl.accessibilityLabel = "ระดับเสียง"
customControl.accessibilityValue = "75 เปอร์เซ็นต์"
customControl.accessibilityTraits = [
    .adjustable,
    .button
]
customControl.accessibilityHint =
    "เพิ่มหรือลดระดับเสียง"

// อัปเดตเมื่อค่าเปลี่ยน
func didChangeVolume(newValue: Float) {
    customControl.accessibilityValue =
        "\(Int(newValue)) เปอร์เซ็นต์"
    UIAccessibility.post(
        notification: .layoutChanged,
        argument: customControl
    )
}

บน iOS แฟล็ก isAccessibilityElement เปิดใช้งานการรองรับ VoiceOver สำหรับองค์ประกอบที่กำหนดเอง การรวม traits (.adjustable + .button) บอก VoiceOver ว่าองค์ประกอบสามารถปรับได้โดยการปัดขึ้น/ลงและเปิดใช้งานด้วยการแตะสองครั้ง หลังจากเปลี่ยนค่าแล้ว ต้องส่งการแจ้งเตือน layoutChanged — มิฉะนั้น VoiceOver จะยังคงประกาศค่าเก่า

คำแนะนำเฉพาะแพลตฟอร์ม

สำหรับ iOS: ใช้ accessibilityElements เพื่อแทนที่ลำดับการอ่าน, accessibilityCustomActions สำหรับการกระทำเพิ่มเติมในเมนูบริบท และ shouldGroupAccessibilityChildren เพื่อจัดกลุ่มองค์ประกอบเป็นกลุ่มตรรกะ สำหรับ SwiftUI ใช้ตัวปรับแต่ง .accessibilityLabel(), .accessibilityAddTraits() และ .accessibilityRespondsToUserInteraction() หลีกเลี่ยงการตั้งค่า isAccessibilityElement = false บนคอนเทนเนอร์ที่มีองค์ประกอบย่อยเชิงโต้ตอบ — สิ่งนี้จะซ่อนพวกมันจาก VoiceOver

สำหรับ Android: ใช้ accessibilityTraversalBefore และ accessibilityTraversalAfter สำหรับลำดับการนำทาง, AccessibilityDelegate สำหรับองค์ประกอบที่กำหนดเอง และ LiveRegion (polite/assertive) สำหรับการอัปเดตแบบไดนามิก ใน Compose ใช้ตัวปรับแต่ง .semantics {} กับ contentDescription, stateDescription และ customActions หลีกเลี่ยงการตั้งค่า focusable = true บนองค์ประกอบที่ไม่โต้ตอบ — สิ่งนี้สร้างจุดโฟกัสปลอมสำหรับ TalkBack และทำให้ผู้ใช้สับสน

เครื่องมือทดสอบ

การทดสอบกับโปรแกรมอ่านหน้าจอต้องทำบนอุปกรณ์จริง อีมูเลเตอร์/ซิมูเลเตอร์ให้ความเข้าใจพื้นฐาน แต่ท่าทางและความเร็วในการตอบสนองแตกต่างกัน ใช้ Accessibility Inspector (Xcode) สำหรับ iOS และ Accessibility Scanner (Android) สำหรับการตรวจจับปัญหา อัตโนมัติ

สถานการณ์ทดสอบหลัก: การลงทะเบียน (การกรอกฟอร์ม การตรวจสอบ การส่ง), การค้นหาและการนำทางแคตตาล็อก, การชำระเงิน, การกู้คืนรหัสผ่าน แต่ละสถานการณ์ควรสามารถทำให้สำเร็จได้โดยไม่ต้องควบคุมด้วยสายตา — ผ่านคำแนะนำด้วยเสียงของโปรแกรมอ่านหน้าจอเท่านั้น หากผู้ใช้โปรแกรมอ่านหน้าจอไม่สามารถทำให้สถานการณ์สำเร็จในเวลาเดียวกับผู้ใช้ทั่วไป (±50%) แอปต้องการการปรับปรุงการช่วยเหลือ