หลายคนใช้การพัฒนาแบบขับเคลื่อนด้วยคอมโพเนนต์โดยใช้คู่มือสไตล์ของแพตเทิร์น, ไลบรารีคอมโพเนนต์ หรือระบบการออกแบบแบบเต็มในกระบวนการเวิร์กโฟลว์การพัฒนา แม้ว่าคุณจะไม่ได้ใช้เครื่องมือเหล่านี้อย่างเป็นทางการ แต่ก็เป็นไปได้ว่าคุณจะใช้กระบวนการที่คล้ายกันเพื่อแบ่งการออกแบบขนาดใหญ่สำหรับเว็บไซต์, แอป หรือผลิตภัณฑ์ดิจิทัลอื่นๆ ออกเป็นส่วนๆ ที่จัดการได้
การสร้างโครงสร้างทางกายภาพก็เช่นกัน คุณต้องสร้างทีละส่วน เริ่มจากฐานราก โครงสร้าง ผนัง หน้าต่าง หลังคา และทุกสิ่งทุกอย่างที่อยู่ระหว่างนั้น เครื่องมือการพัฒนาแบบขับเคลื่อนด้วยคอมโพเนนต์ช่วยให้เราทำสิ่งนี้กับเว็บไซต์, แอป และผลิตภัณฑ์ดิจิทัลอื่นๆ ได้
ข้อดีบางประการของการพัฒนาแบบขับเคลื่อนด้วยคอมโพเนนต์ ได้แก่ การแบ่งสิ่งต่างๆ ออกเป็นส่วนๆ ที่จัดการได้ ซึ่งจะช่วยลดเวลาในการพัฒนาด้วยคอมโพเนนต์ที่นำกลับมาใช้ใหม่ได้เหล่านี้ นอกจากนี้ยังช่วยให้นักออกแบบ นักพัฒนาส่วนหน้าและส่วนหลัง รวมถึงทีม QA สามารถทำงานพร้อมกันได้ และลูกค้า นักออกแบบ ผู้จัดการผลิตภัณฑ์ และอื่นๆ ต่างก็ชื่นชอบเพราะสามารถแสดงตัวอย่างกระบวนการบิลด์และใช้คู่มือสไตล์ที่ใช้งานได้จริงเป็นข้อมูลอ้างอิงหลังจากเปิดตัวเว็บไซต์แล้ว
อย่างไรก็ตาม เมื่อเราพิจารณาแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบโดยคำนึงถึงการช่วยเหลือพิเศษ ก็อาจเกิดคำถามขึ้นมา คุณจะทราบได้อย่างไรว่าแพตเทิร์นใดดีที่สุดในแง่ของการช่วยเหลือพิเศษ คุณควรใช้แพตเทิร์นหรือไลบรารีที่มีอยู่แล้ว หรือสร้างแพตเทิร์นใหม่ คุณจะทราบได้อย่างไรว่าแพตเทิร์นเหล่านี้จะช่วยผู้ใช้ได้จริง
ตัวเลือกมากมายที่มีอยู่อาจทำให้คุณสับสนเกี่ยวกับแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบ โมดูลนี้มีเป้าหมายเพื่อให้ข้อมูลทั่วไปเกี่ยวกับวิธีประเมินแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบเพื่อการช่วยเหลือพิเศษ รวมถึงให้จุดเริ่มต้นที่จะช่วยให้คุณเลือกตัวเลือกที่เข้าถึงได้ง่ายขึ้น
คิดอย่างมีวิจารณญาณ
การเลือกแพตเทิร์น, คอมโพเนนต์ หรือระบบการออกแบบที่เข้าถึงได้ง่ายไม่ใช่เรื่องยาก แต่ต้องใช้เวลาและการคิดอย่างมีวิจารณญาณ ในความเป็นจริง ไม่มีแพตเทิร์นที่สมบูรณ์แบบเพียงอย่างเดียว แต่อาจมีตัวเลือกมากมายที่ใช้ได้ สิ่งสำคัญคือการเรียนรู้ที่จะเลือกตัวเลือกที่ดีที่สุดสำหรับสถานการณ์เฉพาะของคุณ
ในโมดูลการทดสอบถัดไป คุณจะได้อ่านเพิ่มเติมเกี่ยวกับเทคนิคและวิธีการประเมินแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบเพื่อการช่วยเหลือพิเศษ ก่อนจะไปถึงจุดนั้น คุณต้องถามคำถามพื้นฐานบางอย่างกับตัวเอง เช่น
- มีแพตเทิร์น, คอมโพเนนต์ หรือระบบการออกแบบที่เข้าถึงได้ง่ายและเป็นที่ยอมรับอยู่แล้วหรือไม่
- ฉันรองรับเบราว์เซอร์และเทคโนโลยีความช่วยเหลือพิเศษ (AT) ใดบ้าง
- มีข้อจำกัดด้านโค้ดหรือเฟรมเวิร์กหรือไม่ มีปัจจัยอื่นๆ การผสานรวม หรือความต้องการของผู้ใช้ที่ฉันควรพิจารณาหรือไม่
คุณอาจมีคำถามเพิ่มเติมหรือคำถามที่แตกต่างจากคำถามเหล่านี้ ทั้งนี้ขึ้นอยู่กับสภาพแวดล้อมการพัฒนาและความต้องการของผู้ใช้ ลองใช้คำถามเหล่านี้เป็นจุดเริ่มต้นในการประเมินการช่วยเหลือพิเศษ
แหล่งข้อมูลที่เป็นที่ยอมรับ
ก่อนที่จะสร้างสิ่งใหม่ๆ คุณควรทำการสอบทานธุรกิจและตรวจสอบว่ามีแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบที่เข้าถึงได้ง่ายอยู่แล้วหรือไม่ คุณอาจประหลาดใจที่พบโซลูชัน (หรือหลายโซลูชัน) ที่เหมาะกับความต้องการของคุณ เพียงแค่ทำการค้นหาเล็กน้อย
แหล่งข้อมูลที่ยอดเยี่ยมสำหรับแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบที่เข้าถึงได้ง่าย ได้แก่
- คอมโพเนนต์ที่เข้าถึงได้ง่าย
- ไลบรารี ARIA ของ Deque University
- ระบบการออกแบบ Gov.UK
- คอมโพเนนต์ที่ครอบคลุม
- MagentaA11y
- ระบบการออกแบบเว็บของสหรัฐอเมริกา (USWDS), ซึ่งสร้างขึ้นสำหรับรัฐบาลกลางของสหรัฐอเมริกา
- รายการแพตเทิร์นที่เข้าถึงได้ง่ายจาก Smashing Magazine
สำหรับเฟรมเวิร์ก JavaScript แหล่งข้อมูลต่อไปนี้เข้าถึงได้ง่ายพอสมควรโดยค่าเริ่มต้นหรือปรับแต่งเพื่อการช่วยเหลือพิเศษได้
- เมื่อ CSS ไม่เพียงพอ: ข้อกำหนด JavaScript สำหรับคอมโพเนนต์ที่เข้าถึงได้ง่าย
- React
- Angular: ไลบรารี Material
- Vue: Vuetensils
อย่างไรก็ตาม คุณไม่ควรเพียงแค่คัดลอก/วางโค้ดและคิดว่าโค้ดนั้นจะเหมาะกับสภาพแวดล้อมของคุณและตอบสนองความต้องการของผู้ใช้โดยอัตโนมัติ ซึ่งเป็นจริงสำหรับแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบทั้งหมด แม้ว่าจะระบุว่าเข้าถึงได้ง่ายอย่างสมบูรณ์ก็ตาม
คุณควรพิจารณาแหล่งข้อมูลทั้งหมดเป็นจุดเริ่มต้น และอย่าลืมทดสอบทุกอย่าง
การรองรับเบราว์เซอร์และเทคโนโลยีความช่วยเหลือพิเศษ (AT)
หลังจากค้นหาแพตเทิร์น, คอมโพเนนต์ หรือระบบการออกแบบแบบเต็มพื้นฐาน 2-3 รายการที่อาจเหมาะกับสภาพแวดล้อมการพัฒนาของคุณแล้ว คุณก็สามารถไปยังการรองรับเทคโนโลยีความช่วยเหลือพิเศษได้ เทคโนโลยีความช่วยเหลือพิเศษประเภทหลักที่คุณควรให้ความสำคัญเมื่อประเมินแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบคือโปรแกรมอ่านหน้าจอ
โปรแกรมอ่านหน้าจอสร้างขึ้นโดยคำนึงถึงเบราว์เซอร์บางเบราว์เซอร์ และจะทำงานได้ดีที่สุดเมื่อใช้ร่วมกับเบราว์เซอร์เหล่านั้น เราจะพูดถึงหัวข้อนี้โดยละเอียดมากขึ้น ในโมดูลเกี่ยวกับการทดสอบ AT แต่สำหรับการประเมินแพตเทิร์น การทำความเข้าใจว่ามีการใช้ร่วมกันเหล่านี้อยู่จะเป็นประโยชน์เพื่อให้คุณทราบว่าต้องการอะไรบ้างในแง่ของการรองรับ
| โปรแกรมอ่านหน้าจอ | ระบบปฏิบัติการ | ความเข้ากันได้กับเบราว์เซอร์ | ค่าใช้จ่าย |
|---|---|---|---|
| Job Access with Speech (JAWS) | Windows | Chrome, Firefox, Edge | ต้องมีใบอนุญาต (มีเวอร์ชันฟรี 40 นาที) |
| Non-Visual Desktop Access (NVDA) | Windows | Chrome และ Firefox | ฟรี (ต้องดาวน์โหลด) |
| ผู้บรรยาย | Windows | Edge | ฟรี (มีอยู่ในเครื่อง Windows) |
| VoiceOver | macOS | Safari | ฟรี (มีอยู่ในเครื่อง macOS) |
| Orca | Linux | Firefox | ฟรี (มีอยู่ในการแจกจ่ายที่อิงตาม Gnome) |
| TalkBack | Android | Chrome และ Firefox | ฟรี (มีอยู่ในระบบปฏิบัติการ Android บางเวอร์ชัน) |
| VoiceOver | iOS | Safari | ฟรี (มีอยู่ในอุปกรณ์ iOS) |
โดยทั่วไปการรองรับเบราว์เซอร์เป็นเรื่องที่ซับซ้อน และจะซับซ้อนยิ่งขึ้นเมื่อคุณเพิ่มอุปกรณ์ AT และข้อกำหนด ARIA เข้ามา
แต่ก็ไม่ได้มีแต่ข่าวร้าย โชคดีที่มีแหล่งข้อมูลที่ยอดเยี่ยม เช่น HTML5 Accessibility, Accessibility Support และรายการตรวจสอบการพัฒนาที่เข้าถึงได้ง่ายของ WCAG สำหรับการควบคุมที่กำหนดเอง ซึ่งช่วยให้เราเข้าใจการรองรับเบราว์เซอร์และอุปกรณ์ AT ในปัจจุบันได้ดียิ่งขึ้น รวมถึงช่วยให้ทราบว่าควรใช้ ARIA เมื่อใด
แหล่งข้อมูลเหล่านี้สรุปองค์ประกอบย่อยต่างๆ ของแพตเทิร์น HTML และ ARIA ที่มีอยู่ ซึ่งรวมถึงการทดสอบของชุมชนโอเพนซอร์ส นอกจากนี้ คุณยังดูตัวอย่างแพตเทิร์นสำหรับเดสก์ท็อป เบราว์เซอร์บนมือถือ และอุปกรณ์ AT ได้ด้วย ดังนั้น แหล่งข้อมูลเหล่านี้จึงช่วยให้คุณตัดสินใจได้ง่ายขึ้นเกี่ยวกับแพตเทิร์น, คอมโพเนนต์ และระบบการออกแบบที่คุณอาจต้องการใช้
ข้อควรพิจารณาอื่นๆ
เมื่อเลือกแพตเทิร์นหรือคอมโพเนนต์พื้นฐานที่เข้าถึงได้ง่าย 2-3 รายการและพิจารณาการรองรับเบราว์เซอร์และอุปกรณ์ AT แล้ว คุณก็สามารถไปยังคำถามตามบริบทที่เฉพาะเจาะจงมากขึ้นเกี่ยวกับแพตเทิร์น, คอมโพเนนต์, ระบบการออกแบบ และสภาพแวดล้อมการพัฒนาได้
ตัวอย่างเช่น หากคุณทำงานในระบบการจัดการ (CMS) หรือมีโค้ดเดิม อาจมีข้อจำกัดเกี่ยวกับแพตเทิร์นที่คุณใช้ได้ เมื่อตรวจสอบแล้ว ตัวเลือกแพตเทิร์นหลายรายการอาจถูกตัดออกอย่างรวดเร็วเหลือเพียง 1 หรือ 2 ตัวเลือก
เฟรมเวิร์ก JavaScript หลายรายการอนุญาตให้นักพัฒนาใช้แพตเทิร์นเกือบทุกแพตเทิร์นที่ต้องการ ในกรณีเช่นนี้ คุณอาจมีข้อจำกัดน้อยลงและสามารถเลือกตัวเลือกแพตเทิร์นที่เข้าถึงได้ง่ายที่สุด
นอกจากนี้ยังมีข้อควรพิจารณาเพิ่มเติมที่ต้องพิจารณาเมื่อเลือกแพตเทิร์น, คอมโพเนนต์ หรือระบบการออกแบบ เช่น
- ประสิทธิภาพ
- ความปลอดภัย
- การปรับแต่งเว็บไซต์ให้ติดอันดับบนเครื่องมือการค้นหา
- การรองรับการแปลภาษา
- การผสานรวมกับบุคคลที่สาม
ปัจจัยเหล่านี้จะมีบทบาทอย่างไม่ต้องสงสัยในการเลือกแพตเทิร์น แต่คุณควรพิจารณาผู้ที่สร้างเนื้อหาและโค้ดด้วย แพตเทิร์นที่คุณเลือกต้องมีความแข็งแกร่งเพียงพอที่จะจัดการกับข้อจำกัดที่อาจเกิดขึ้นเกี่ยวกับเนื้อหาที่สร้างโดยเอดิเตอร์หรือเนื้อหาที่ผู้ใช้สร้างขึ้น รวมถึงต้องสร้างขึ้นในลักษณะที่นักพัฒนาที่มีความรู้ด้านการช่วยเหลือพิเศษทุกระดับสามารถใช้ได้