การช่วยสำหรับการเข้าถึงเว็บ 101: การออกแบบเพื่อทุกคน
เผยแพร่แล้ว: 2022-01-10การออกแบบเว็บเป็นเรื่องเกี่ยวกับการเข้าถึง นักออกแบบเว็บไซต์ส่วนใหญ่ตั้งเป้าที่จะสร้างผลิตภัณฑ์สำหรับกลุ่มผู้ชมที่ใหญ่ที่สุด โดยแยกการออกแบบออกมาราวกับแหว่งเพื่อให้มีผู้ใช้หลั่งไหลเข้ามามากที่สุด
และถึงแม้ว่าจะมีตรรกะในหลักการออกแบบนั้น แต่ก็บดบังหลักการที่ค่อนข้างเรียบง่ายและครอบคลุมมากขึ้น นั่นคือ การออกแบบสำหรับทุกคน ไม่ใช่ส่วนใหญ่
ปรับเนื้อหาให้เหมาะสมเพื่อให้ผู้ใช้ทุกคนสามารถเพลิดเพลินและโต้ตอบกับเว็บไซต์ของคุณและเข้าถึงข้อมูลและข้อมูลที่มีอยู่ การมีส่วนร่วมในแนวทางปฏิบัตินี้จะช่วยพัฒนาตลาดที่กว้างขึ้นและกระจายฐานลูกค้าของคุณ 15% ของประชากรโลกมีความพิการในระดับหนึ่ง
คนเหล่านี้คือผู้ที่ใช้อินเทอร์เน็ตบ่อยครั้งและพึ่งพาการสื่อสารและเครื่องมือดิจิทัล เช่นเดียวกับคนอื่นๆ การเพิ่มประสิทธิภาพเว็บไซต์ของคุณเพื่อให้แน่ใจว่าผู้ใช้สามารถเพลิดเพลินกับประสบการณ์ที่ยอดเยี่ยมสามารถขยายเว็บการโต้ตอบของคุณได้ ด้วยการฝึกปฏิบัติในการออกแบบของคุณ คุณจะสามารถเข้าถึงผู้คนนับล้านที่มักถูกมองข้ามได้
การออกแบบเพื่อการช่วยสำหรับการเข้าถึงไม่ใช่เรื่องยาก ต้องเรียบง่ายและคำนึงถึงผู้ใช้ที่มีศักยภาพทั้งหมด ต่อไปนี้คือวิธีการเพิ่มประสิทธิภาพเว็บไซต์ของคุณเพื่อให้สามารถเข้าถึงได้สูงสุด
ทำความเข้าใจผู้ใช้ของคุณ
การรู้จักผู้ชมของคุณเป็นสิ่งสำคัญในทุกโครงการ จึงเป็นจุดเริ่มต้นที่ดีที่สุด ทำความเข้าใจว่าผู้ใช้ของคุณสามารถรวมบุคคลที่มีความสามารถต่างกันได้ ผู้ใช้บางคนอาจมีความบกพร่องทางการได้ยินหรือการมองเห็น คนอื่นอาจมีอาการชัก คนอื่นอาจมีปัญหาด้านการเคลื่อนไหว
แม้ว่าคุณจะไม่สามารถออกแบบสำหรับทุกสถานการณ์ที่เป็นไปได้ แต่คุณจะขยายขอบเขตการออกแบบของคุณหากคุณใช้เวลาในการคิดให้มากที่สุด หลังจากที่คุณได้คิดเกี่ยวกับกลุ่มเป้าหมายที่ขยายแล้ว ให้หาข้อมูล อ่านกรณีศึกษา พูดคุยกับเพื่อนที่มีประสบการณ์ ปรึกษาคู่มือการช่วยเหลือพิเศษ
อาจลองใช้หน้าจากสาขาวิชาศึกษา หลักการออกแบบสากลเป็นข้อมูลอ้างอิงที่ดี
คิดว่าUX
เมื่อคุณได้พัฒนาความเข้าใจกับผู้ใช้ในอนาคตของคุณแล้ว ให้ใส่ความเข้าใจนั้นลงในเฟรมเวิร์กประสบการณ์ผู้ใช้ (UX) ของคุณ ขั้นตอนนี้จะช่วยให้คุณเห็นอกเห็นใจผู้ใช้ของคุณและพิจารณาสิ่งที่คุณอาจไม่เคยคิดมาก่อน นอกจากนี้ยังจะชี้ให้คุณเห็นถึงแนวทางของคำจำกัดความเทคโนโลยีสิ่งอำนวยความสะดวกที่หลากหลาย
เช่นเดียวกับนักออกแบบควรพิจารณาพฤติกรรมของเว็บไซต์ในทุกเบราว์เซอร์หลัก เทคโนโลยีอำนวยความสะดวกควรเป็นส่วนหนึ่งของรายการตรวจสอบการทำงาน บางครั้ง แม้แต่การเปลี่ยนแปลงเพียงเล็กน้อยในการออกแบบเว็บก็สามารถเปิดประตูใหม่ให้กับผู้ใช้ที่พิการได้
การเปลี่ยนแปลงที่เรียบง่าย
ตัวอย่างเช่น การเปลี่ยนแปลงที่ง่ายที่สุดในการใช้งานคือวิธีที่คุณใช้แท็กเน้น

ด้วยสายตา ไม่มีความแตกต่างระหว่าง <b>
และ <strong>
และ <i>
ก็ไม่แตกต่างไปจาก <em>
แต่สำหรับผู้ทุพพลภาพ แท็กเหล่านี้สามารถเปลี่ยนประสบการณ์ของผู้ใช้ได้อย่างรวดเร็ว
แม้ว่าแท็กเหล่านี้จะแสดงผลเหมือนกัน ตัวหนา และ ตัวเอียง ความแตกต่างระหว่างแท็กเหล่านี้ก็คือฟังก์ชันของแท็ก แม้ว่าแท็กตัวหนาและตัวเอียงที่ง่ายกว่าจะเป็นการนำเสนอ (เปลี่ยนวิธีการแสดงข้อความ) การเน้นหนักและการเน้นจะระบุรูปแบบคำพูดที่แตกต่างกันสำหรับเทคโนโลยีอำนวยความสะดวก
แต่มันไม่ง่ายเหมือนกับการแทนที่ทั้งหมด <b>
ด้วย <strong>
โดยสุ่มสี่สุ่มห้า ส่วนหัวจำนวนมากใช้ข้อความตัวหนาเพื่อตัดกัน ตัวอย่างเช่น อาจไม่ดีที่สุดสำหรับผู้ใช้ที่มีความทุพพลภาพที่จะสัมผัสแท็ก <strong>
ที่นี่ คิดว่า " ข้อความนี้ จำเป็นต้องพูดแตกต่างออกไปหรือไม่เพื่อให้ผู้ใช้ได้สัมผัสกับความหมายที่สมบูรณ์" หากไม่เป็นเช่นนั้น ให้ลองวาง <strong>
หรือ <em>
เว้นแต่จำเป็นจริงๆ
การเปลี่ยนแปลงและการพิจารณาที่ละเอียดอ่อนเช่นนี้สามารถสร้างความแตกต่างให้กับผู้ใช้ที่มีความทุพพลภาพได้ สิ่งสำคัญคือต้องอัปเกรดและไม่ดาวน์เกรด UX
การออกแบบสำหรับผู้พิการทางสายตา
แม้ว่าคำแนะนำข้างต้นจะเป็นประโยชน์ต่อผู้พิการทางสายตาอยู่แล้ว แต่ไม่ใช่ทุกคนที่มีปัญหาทางสายตาจะมีระดับหรือประเภทความบกพร่องเหมือนกัน การเสนอตัวเลือกที่สามารถรองรับผู้ที่ยังคงใช้สายตาก็มีความสำคัญไม่แพ้กัน
พิจารณาองค์ประกอบเหล่านี้:
- อนุญาตให้ผู้ใช้ขยายแบบอักษร เบราว์เซอร์ส่วนใหญ่จะทำเช่นนี้โดยที่คุณไม่ยินยอม แต่จะดูดีกว่าถ้าคุณมี CSS ที่เตรียมไว้
- หลีกเลี่ยงการผสมสีบางอย่าง เช่น สีแดงและสีเขียว หรือสีน้ำเงินและสีเหลือง ทำไมไม่ลองใช้สีเพื่อเพิ่มการแปลงในขณะที่เพิ่มการช่วยสำหรับการเข้าถึงแทน
- รหัสใน "ข้อความแสดงแทน" เทคโนโลยีอำนวยความสะดวกสามารถอ่านข้อความแสดงแทนได้และอธิบายกราฟิกบนหน้า
- ใช้จุดเป็นตัวย่อหรือแม้แต่ตัวที่รู้จักกันดี วิธีที่โปรแกรมอ่านหน้าจอประมวลผลข้อมูลมักจะเป็นการออกเสียง: ลองนึกภาพการได้ยิน “Fibby” กับ FBI
สำหรับข้อมูลเพิ่มเติมเกี่ยวกับวิธีการรวมองค์ประกอบสำหรับผู้ใช้ที่มีความบกพร่องทางสายตา โปรดดู American Foundation for the Blind
การออกแบบสำหรับผู้บกพร่องทางการได้ยิน
แม้ว่าผู้บกพร่องทางการได้ยินต้องการที่พักน้อยลง แต่แนวโน้มล่าสุดในการใช้วิดีโอบนเว็บไซต์ได้เพิ่มความต้องการตัวเลือกการออกแบบที่ชาญฉลาด ดังนั้น หากเว็บไซต์ของคุณมีองค์ประกอบด้านการได้ยิน ให้ใช้คำบรรยายแบบปิดหรือการตีความภาษามือ
หลีกเลี่ยงการทดลองใช้คำบรรยายอัตโนมัติ หยุดโดยสุ่มวิดีโอที่ได้รับการประมวลผลโดยใช้การถอดเสียงอัตโนมัติเพื่อดูคำแปลที่ไม่สมเหตุสมผลและสามารถนับได้
สำหรับหลักเกณฑ์คำอธิบายภาพโดยเฉพาะ สามารถดูคำแนะนำของ National Association of the Deaf ได้ที่นี่
การออกแบบสำหรับโรคลมบ้าหมูที่ไวต่อแสง
การออกแบบอย่างหนึ่งเกี่ยวข้องกับการใช้วิดีโออย่างแพร่หลาย โดยเฉพาะอย่างยิ่งวิดีโอที่ใช้ฟังก์ชันเล่นอัตโนมัติ ล้อมรอบผู้ใช้ที่เป็นโรคลมบ้าหมูที่ไวต่อแสง ผู้ใช้เหล่านี้อาจมีอาการชักที่เกิดจากเอฟเฟกต์แสงแฟลชหรือภาพเคลื่อนไหว นักออกแบบเว็บไซต์สามารถใช้เครื่องมือวิเคราะห์โรคลมบ้าหมูที่ไวต่อแสงเพื่อตรวจสอบโอกาสที่เนื้อหาของพวกเขาจะกระตุ้นให้เกิดการจับกุม
หากเนื้อหาถูกระบุว่ามีความเสี่ยงแต่ไม่สามารถเปลี่ยนแปลงเพื่อลดความเสี่ยงได้ ให้เตือนเกี่ยวกับศักยภาพเสมอและอย่าเล่นวิดีโอโดยอัตโนมัติ ตรวจสอบให้แน่ใจว่ามองเห็นคำเตือนและอยู่ใกล้ปุ่มเล่น
การออกแบบสำหรับผู้บกพร่องด้านการเคลื่อนไหว
ความบกพร่องในการเคลื่อนไหวบางอย่างอาจมีตั้งแต่การสูญเสียการควบคุมมอเตอร์ที่ดีไปจนถึงการสั่นเล็กน้อย ความบกพร่องระดับใดระดับหนึ่งส่งผลให้ผู้ใช้ได้รับประสบการณ์เดียวกันบนเว็บไซต์ที่ไม่ได้พิจารณา:
- ผู้ใช้ต้องใช้ความพยายามมากขึ้นในการเข้าถึงลิงก์และอาจเหนื่อยเร็ว
- ผู้ใช้ไม่สามารถไปยังส่วนต่างๆ ของเว็บไซต์ได้ เนื่องจากไม่อนุญาตให้ใช้แป้นพิมพ์
- การต้องเลื่อนดูหน้ายาวๆ ส่งผลให้เมื่อยล้าเพราะไม่มีตัวเลือก “กลับไปด้านบน” หรือข้าม
ไซต์ที่ได้รับการปรับให้เหมาะสมสำหรับหน้าจอสัมผัสหรือการป้อนข้อมูลด้วยเมาส์แบบละเอียดสามารถนำเสนอด้วยผลกระทบที่รุนแรงมากขึ้นสำหรับผู้บกพร่องด้านการเคลื่อนไหว อาจทำให้ไซต์ใช้งานไม่ได้
การผสมผสานองค์ประกอบการออกแบบ เช่น การนำทางที่สามารถใช้งานได้โดยใช้แป้นพิมพ์และลิงก์สมอบ่อยๆ ซึ่งสามารถดึงดูดผู้ใช้ไปยังส่วนต่างๆ ของหน้าสามารถช่วยผู้ใช้เหล่านี้ได้อย่างมาก
สร้างตัวเลือกเว็บไซต์ "พื้นฐาน"
การออกแบบของคุณไร้ที่ติ โต้ตอบได้ และโดดเด่น ใช้เทรนด์ล่าสุดและยิ่งใหญ่ที่สุดที่มีในตลาดเปิด และผู้ใช้ที่อธิบายข้างต้นเข้าถึงได้ยาก
ถ้านั่นฟังดูเหมือนกับการออกแบบเว็บของคุณ ทางเลือกอื่นที่ง่ายกว่าคือการสร้างเลย์เอาต์ "ธรรมดา" ที่ผู้ใช้สามารถเปิดหรือปิดได้ สิ่งนี้จะดึงดูดใจมากกว่าผู้ใช้ที่พิการ: สำหรับผู้ใช้ที่มีอาการไมเกรนที่ถูกกระตุ้นด้วยคอนทราสต์สูง การสลับปุ่มสลับที่เข้าถึงได้ง่ายอาจสร้างความแตกต่างระหว่างการเป็นลูกค้าหรือการออกไปต่อสู้กับไมเกรนสามชั่วโมง
อย่าหยุดเพียงแค่นั้นเช่นกัน ใช้ตัวเลือกเดียวกันสำหรับรายการสมัครใช้งานของคุณ เพื่อให้ผู้ใช้แก้ไขการตั้งค่าของตนเองได้อย่างง่ายดายก่อนรับการตลาดทางอีเมล
ทำความเข้าใจผู้ใช้ที่แตกต่างกันของคุณ คิดเกี่ยวกับพวกเขาต่อไป ยิ่งคุณเข้าใจและเห็นอกเห็นใจผู้ใช้ของคุณมากขึ้น การออกแบบ UX ที่เข้าถึงได้ง่ายขึ้นจะกลายเป็น ใครจะรู้? คุณอาจจะเปลี่ยนโลกของใครบางคน