ไซต์ค้าปลีกที่เข้าถึงได้มากที่สุดสำหรับผู้พิการทางสายตา

ในสหราชอาณาจักร ผู้คนกว่า 2 ล้านคนกำลังสูญเสียการมองเห็น และ 3 ล้านคนตาบอดสี ยิ่งไปกว่านั้น มีคนลงทะเบียน 360,000 คนว่าตาบอดหรือมองเห็นเพียงบางส่วน

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

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

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

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

สำหรับสิ่งนี้ เราหันไปใช้เครื่องมือหลักสองอย่างที่ใช้เป็นประจำโดยผู้ประเมินการช่วยสำหรับการเข้าถึง: Google Lighthouse และ Wave by WebAim

อันดับแรกให้คะแนนประสิทธิภาพการทำงานของเว็บมาสเตอร์ตั้งแต่ 0-100 หลังแสดงให้เห็นว่าไซต์สามารถปรับปรุงได้อย่างไร

เว็บไซต์ค้าปลีกที่เข้าถึงได้มากที่สุด (และน้อยที่สุด) โดยรวม

หน้าแรกที่ให้ประสบการณ์ที่เข้าถึงได้ควรพยายามอย่างน้อย 90-100 ใน Google Lighthouse ไซต์ใดก็ตามที่เข้าชมไซต์นี้ คะแนนจะถูกเน้นด้วยสีเขียว

H&M ภูมิใจนำเสนอคะแนนที่สมบูรณ์แบบสำหรับหน้าแรกของสหราชอาณาจักร รายการเด่นอื่นๆ ได้แก่ Laura Ashley, Beauty Bay, B&Q และ Sainsbury's

ในทางกลับกัน หาก Google เชื่อว่าหน้าแรกจำเป็นต้องปรับปรุง คะแนนมักจะอยู่ระหว่าง 50 ถึง 89 ซึ่งไม่ได้หมายความว่าหน้าเหล่านี้มีความยากในการเข้าถึง

ไซต์ที่สามารถปรับปรุงได้บ้าง ได้แก่ Superdrug, Boots และ Carphone Warehouse

คะแนนต่ำกว่า 50 หมายถึงการเข้าถึงได้ไม่ดี ปัจจุบันมีเพียงเว็บไซต์เดียวที่มีคะแนนต่ำกว่า 50 ในหน้าแรก: Halfords

Wave by WebAim ช่วยให้เราเข้าใจว่าความพิการทางสายตาแบบใดในไซต์บางแห่งอาจต้องให้ความสนใจเป็นพิเศษ

ไซต์ที่เข้าถึงได้มากที่สุด (และน้อยที่สุด) สำหรับผู้ใช้ตาบอดสี

ตาบอดสีเป็นหนึ่งในความบกพร่องทางสายตาที่พบบ่อยที่สุด นอกจากนี้ยังเป็นสิ่งที่มักถูกมองข้ามเนื่องจากผู้ที่มีวิสัยทัศน์ปกติอาจเข้าใจได้ไม่ดี

ตามหลักเกณฑ์การเข้าถึงเนื้อหาเว็บปัจจุบัน (WCAG) เพื่อให้ผ่านระดับ AA ไซต์ต่างๆ ควรพยายามให้มีอัตราส่วนคอนทราสต์ที่ 4:5:1 สำหรับข้อความปกติ และ 3:1 สำหรับข้อความขนาดใหญ่ หากต้องการผ่านระดับ AAA จะต้องมีอัตราส่วนคอนทราสต์ 7:1 สำหรับข้อความปกติและ 4:5:1 สำหรับข้อความขนาดใหญ่

ข้อความขนาดใหญ่ถูกกำหนดเป็น 14 จุด (โดยทั่วไปคือ 18.66px) และเป็นตัวหนาหรือใหญ่กว่า

สำหรับกราฟิก ขอแนะนำให้ใช้อัตราส่วนคอนทราสต์ 3:1

Wave by WebAim ระบุสถานการณ์ใดๆ บนโฮมเพจที่ไม่ตรงตามอัตราส่วนคอนทราสต์เหล่านี้

สถานที่ศึกษา 6 แห่งในปัจจุบันไม่มีปัญหา แต่ดังที่แสดงด้านล่าง Superdrug มีปัญหาด้านความคมชัดของสีส่วนใหญ่ที่อาจส่งผลต่อผู้ใช้ที่ตาบอดสี:

5 อันดับแรกที่เข้าถึงได้น้อยที่สุด Top 5 ที่เข้าถึงได้มากที่สุด

เว็บไซต์ขายปลีก	ข้อผิดพลาดด้านความคมชัดของสี
Superdrug	251
วิลโก	86
ซิมพลี บี	47
Nisbets	40
ร้านขายน้ำหอม	40

เว็บไซต์ขายปลีก	ข้อผิดพลาดด้านความคมชัดของสี
ลอร่า แอชลีย์	0
โอเอซิส	0
ถัดไป	0
อวกาศ NK	0
อเมริกันกอล์ฟ	0
Dunelm	0

*หมายเหตุ: มี 6 ไซต์อยู่ในรายการเนื่องจากทั้งหมดผูกติดอยู่กับตำแหน่งบนสุด

เราใช้แถบเลื่อนแบบโต้ตอบเพื่อแสดงลักษณะของหน้าแรกของ Superdrug ในปัจจุบัน เปรียบเทียบกับลักษณะที่ควรผ่านเพื่อให้ผ่านหลักเกณฑ์ระดับ AAA ของ WCAG

ด้านล่างนี้ คุณจะเห็นเพียงการเปลี่ยนสีเพียงเล็กน้อยในหน้าแรกของ Superdrug ที่อนุญาตให้คนตาบอดสีเข้าถึงได้:

ลากตัวเลื่อนเพื่อเปรียบเทียบปัจจุบันและเว็บไซต์ superdrug ที่แก้ไข

เมื่อพิจารณาถึงข้อผิดพลาดเกี่ยวกับคอนทราสต์ของสีมักเกิดจากระยะขอบเล็กน้อย ซึ่งหมายความว่าไซต์ต่างๆ สามารถแก้ไขได้โดยไม่ต้องยกเครื่องไซต์อย่างสมบูรณ์

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

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

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

ประการที่สอง คุณสามารถใช้องค์ประกอบที่เข้าถึงได้ Rich Internet Application (ARIA) ใน HTML ของคุณ สิ่งเหล่านี้จะช่วยกับเทคโนโลยีตัวอ่านหน้าจอช่วยเหลือต่างๆ เช่น Apple VoiceOver, JAWS หรือ TalkBack

ด้านล่างนี้ คุณสามารถดูได้ว่าไซต์ใดบ้างที่สามารถปรับปรุงประสบการณ์ของผู้ใช้โปรแกรมอ่านหน้าจอได้:

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

ไซต์ที่เข้าถึงได้มากที่สุด (และน้อยที่สุด) สำหรับผู้ใช้สายตาบางส่วน

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

สถานการณ์สมมติข้อความขนาดเล็กถูกกำหนดเป็นข้อความใดๆ ที่มีขนาด 10 พิกเซลหรือเล็กกว่า

ไซต์ส่วนใหญ่ทำงานได้ดีมากที่นี่ 36% ของโฮมเพจทั้งหมดที่วิเคราะห์ไม่มีสถานการณ์ที่เป็นข้อความขนาดเล็ก ซึ่งรวมถึง:

• แกงกะหรี่
• Halfords
• JD Sports
• ร้านขายน้ำหอม
• วัฏจักรปฏิกิริยาลูกโซ่
• Superdrug
• Asos
• เดเบนแฮมส์
• Argos
• อัสดา
• เทสโก้
• ฮอลแลนด์และบาร์เร็ตต์
• จอห์น ลูอิส
• เวทโทรส
• อเมริกากอล์ฟ
• บิวตี้ เบย์
• Dunelm
• B&Q
• Sainsbury's

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

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

ด้วยการเพิ่มขนาดของป้ายกำกับ 'ใหม่' เป็น 10 พิกเซลขึ้นไป Carphone Warehouse จะมีเมนูที่เข้าถึงได้ทั้งหมดสำหรับผู้ใช้ที่มองเห็นบางส่วน

บทสรุป & ข้อค้นพบที่สำคัญ

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

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

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

โดยสรุป สิ่งเหล่านี้เป็นข้อค้นพบที่สำคัญ:

• H&M เป็นไซต์ค้าปลีกที่เข้าถึงได้มากที่สุดสำหรับผู้ใช้ที่มีความบกพร่องทางสายตา
  • Halfords เป็นไซต์ค้าปลีกที่เข้าถึงได้น้อยที่สุดสำหรับผู้ใช้ที่มีความบกพร่องทางสายตา
• Laura Ashley, Oasis, Space NK, American Golf, Dunelm และ Next ทั้งหมดเสนอตัวเลือกที่เข้าถึงได้สำหรับผู้ใช้ที่ตาบอดสี
  • Superdrug มีปัญหาหน้าแรกสำหรับผู้ใช้ที่ตาบอดสีมากที่สุด
• B&Q และ Sainsbury's มีปัญหาน้อยที่สุดสำหรับผู้ที่ใช้โปรแกรมอ่านหน้าจอ
  • บู๊ทส์มีปัญหาหน้าแรกมากที่สุดสำหรับผู้ที่ใช้โปรแกรมอ่านหน้าจอ
• 38% ของหน้าแรกของร้านค้าปลีกชั้นนำไม่มีปัญหาสำหรับผู้ที่สูญเสียการมองเห็นเล็กน้อย
  • Carphone Warehouse มีปัญหาโฮมเพจมากที่สุดสำหรับผู้ที่สูญเสียการมองเห็นเล็กน้อย

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

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับวิธีการทำให้เว็บไซต์ของคุณสามารถเข้าถึงได้มากขึ้น โปรดดูที่แนวทางการเข้าถึงเนื้อหาเว็บ (WCAG)

ระเบียบวิธี

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

Google Lighthouse และ Wave by WebAim ใช้สำหรับตรวจสอบไซต์ทั้งหมด

คะแนน Google Lighthouse ตั้งแต่ 0-100 ถูกใช้เพื่อจัดอันดับไซต์โดยรวมสำหรับการช่วยสำหรับการเข้าถึงบนมือถือเท่านั้น

ในการจัดอันดับไซต์ตามความสามารถในการเข้าถึงสำหรับผู้ใช้ที่ตาบอดสี ข้อผิดพลาดด้านคอนทราสต์ของสีถูกระบุโดยใช้ Wave โดย WebAim ในขณะที่ตัวตรวจสอบความเปรียบต่างของสีถูกใช้เพื่อระบุสิ่งที่ Superdrug สามารถทำได้เพื่อให้ผ่าน WGAG

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

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