Situs Ritel yang Paling Mudah Diakses untuk Tunanetra

Diterbitkan: 2021-07-12

Di Inggris, lebih dari 2 juta orang hidup dengan kehilangan penglihatan dan 3 juta dengan buta warna. Selain itu, 360.000 terdaftar sebagai buta atau sebagian terlihat.

Membuat situs web Anda dapat diakses oleh tunanetra tidak hanya membantu pengguna ini tetapi juga bisnis Anda. Lima juta pembeli di Inggris Raya adalah pasar yang signifikan untuk disingkirkan – terutama ketika banyak masalah aksesibilitas mudah diperbaiki.

Bahkan Google sekarang lebih mementingkan aksesibilitas situs web. Baru bulan ini, mereka merilis pembaruan pengalaman halaman baru, yang memperhitungkan (Anda dapat menebaknya) pengalaman pengguna di halaman. Dan jika pengguna yang cacat secara teratur memiliki pengalaman yang buruk, Google mungkin memilih untuk memberi peringkat pada pesaing yang berkinerja lebih baik.

Di LCN, kami percaya pada kekuatan merancang situs web dengan mempertimbangkan aksesibilitas. Dan kami selalu mencari cara untuk meningkatkan desain kami sendiri untuk memberikan pengalaman yang mudah bagi semua pengguna kami.

Dengan pemikiran ini, kami ingin melakukan audit aksesibilitas mini dari 50 beranda ritel teratas di Inggris Raya. Kami kemudian ingin menyoroti beberapa cara situs web ini dapat berkinerja lebih baik untuk pengguna dengan gangguan penglihatan.

Untuk ini, kami beralih ke dua alat utama yang secara teratur digunakan oleh evaluator aksesibilitas: Google Lighthouse dan Wave by WebAim.

Yang pertama memberi webmaster skor kinerja dari 0-100. Yang terakhir menunjukkan bagaimana situs dapat ditingkatkan.


Situs Ritel yang Paling Banyak (dan Paling Sedikit) Dapat Diakses Secara Keseluruhan

Situs Ritel Skor Aksesibilitas Mercusuar Google
H&M 100
Laura Ashley 99
Teluk Kecantikan 98
B&Q 98
Sainsbury's 98
Ann Summers 96
jahat 96
Karen Millen 91
Oasis 91
tesco 91
John Lewis 91
Amazon 90
apel 90
Siklus Evans 90
Ruang NK 89
asos 88
Golf Amerika 87
Belanda & Barrett 86
Dunelm 86
Morrison 84
pelayan 84
Rumah Fraser 81
Sangat 81
Argos 81
Schuh 80
obat super 80
axminster 79
Pulau sungai 79
Bukit pasir London 78
Bros lumut. 77
ao.com 77
sepatu bot 77
JD Williams 75
Berikutnya 75
JD Olahraga 75
Debenhams 75
asda 75
Sekrup 74
Nisbet 74
Cukup Jadilah 72
Jacamo 72
Marks & Spencer 72
Kantor 71
Toko Parfum 71
kari 69
Siklus Reaksi Berantai 67
Wilko 63
Penampilan baru 63
Gudang Mobil 58
Halfords 47

Beranda yang menawarkan pengalaman yang dapat diakses harus berusaha setidaknya 90-100 di Google Lighthouse. Setiap situs yang terkena ini memiliki skor mereka disorot dalam warna hijau.

H&M membanggakan skor sempurna untuk beranda Inggris mereka. Entri terkenal lainnya termasuk Laura Ashley, Beauty Bay, B&Q dan Sainsbury's.

Di sisi lain, jika Google yakin sebuah beranda perlu diperbaiki, skor biasanya berada di antara 50 hingga 89. Ini tidak berarti laman ini menawarkan aksesibilitas yang buruk.

Situs yang dapat melakukan beberapa perbaikan termasuk Superdrug, Boots dan Carphone Warehouse.

Skor di bawah 50 menunjukkan aksesibilitas yang buruk. Hanya satu situs yang saat ini memiliki skor di bawah 50 di berandanya: Halfords.

Wave by WebAim membantu kami memahami disabilitas visual mana di situs tertentu yang mungkin perlu mendapat perhatian ekstra.


Situs yang Paling Banyak (dan Paling Sedikit) Dapat Diakses untuk Pengguna Buta Warna

Buta warna adalah salah satu gangguan penglihatan yang paling umum. Ini juga salah satu yang sering diabaikan, karena dapat kurang dipahami oleh mereka yang memiliki penglihatan biasa.

Menurut Pedoman Aksesibilitas Konten Web (WCAG) saat ini, untuk lulus level AA, situs harus mengupayakan rasio kontras 4:5:1 untuk teks normal dan 3:1 untuk teks besar. Untuk lulus level AAA harus ada rasio kontras 7:1 untuk teks normal dan 4:5:1 untuk teks besar.

Teks besar didefinisikan sebagai 14 titik (biasanya 18.66px) dan tebal atau lebih besar.

Untuk grafik, disarankan untuk mengusahakan rasio kontras 3:1.

Wave by WebAim mengidentifikasi situasi apa pun di beranda yang gagal memenuhi rasio kontras ini.

Enam dari situs yang dipelajari saat ini tidak memiliki masalah. Tetapi seperti yang terlihat di bawah, Superdrug memiliki masalah kontras warna paling banyak yang dapat memengaruhi pengguna buta warna:

Situs Ritel Kesalahan Kontras Warna
obat super 251
Wilko 86
Cukup Jadilah 47
Nisbet 40
Toko Parfum 40
Situs Ritel Kesalahan Kontras Warna
Laura Ashley 0
Oasis 0
Berikutnya 0
Ruang NK 0
Golf Amerika 0
Dunelm 0

*CATATAN: 6 situs terdaftar karena semuanya terikat untuk posisi teratas

Kami telah menggunakan penggeser interaktif untuk menampilkan seperti apa tampilan beranda Superdrug saat ini, dibandingkan dengan tampilan yang seharusnya melewati pedoman AAA tingkat WCAG.

Di bawah ini Anda dapat melihat perubahan warna yang sangat kecil ke beranda Superdrug yang memungkinkan aksesibilitas untuk orang buta warna:

Seret penggeser untuk membandingkan situs superdrug saat ini dan yang dimodifikasi.

Situs web obat super dengan warna asliSitus web obat super dengan warna yang direkomendasikan WCAG

Mengingat kesalahan kontras warna sering kali disebabkan oleh margin yang kecil, ini berarti situs biasanya dapat memperbaikinya tanpa merombak total situs mereka.


Situs yang Paling Banyak (dan Paling Sedikit) Dapat Diakses untuk Pengguna Pembaca Layar

Pembaca layar memungkinkan mereka yang kehilangan penglihatan untuk mengakses versi audio halaman web daripada melihatnya. Dengan cara ini mereka masih dapat menavigasi, mengakses konten, dan membeli produk dengan percaya diri.

Untuk memastikan pembaca layar berjalan secara efisien, situs web harus dikodekan secara akurat, tanpa elemen yang hilang, kosong, atau duplikat.

Kedua, Anda dapat menerapkan elemen Accessible Rich Internet Application (ARIA) di HTML Anda. Ini akan membantu teknologi pembaca layar bantu apa pun seperti Apple VoiceOver, JAWS, atau TalkBack.

Di bawah ini Anda dapat melihat situs mana yang dapat meningkatkan pengalamannya bagi pengguna pembaca layar:

Situs Ritel Kesalahan Pembaca Layar
sepatu bot 178
JD Williams 78
Penampilan baru 66
kari 57
Sangat 56
Situs Ritel Kesalahan Pembaca Layar
B&Q 0
Sainsbury's 0
Teluk Kecantikan 1
Dunelm 1
Ann Summers 2
H&M 2

*CATATAN: 6 situs terdaftar sebagai B&Q dan Sainsbury terikat

Sepatu bot khususnya memiliki ruang untuk perbaikan. Sebagian besar ini disebabkan oleh fakta bahwa situs webnya salah menerapkan beberapa elemen ARIA dalam menu. Ini berarti ketika pengguna pembaca layar mencoba menavigasi menu, mereka tidak mendapatkan pengalaman penuh seperti yang didapatkan pengguna yang mampu secara visual.


Situs yang Paling Banyak (dan Paling Sedikit) Dapat Diakses untuk Pengguna dengan Penglihatan Sebagian

Pengguna dengan penglihatan sebagian mungkin dapat mengakses sebagian besar situs Anda dengan mudah. Tetapi masalah mulai muncul ketika Anda memasukkan skenario teks kecil.

Skenario teks kecil didefinisikan sebagai teks apa pun yang berukuran 10 piksel atau lebih kecil.

Sebagian besar situs berkinerja sangat baik di sini. 36% dari semua beranda yang dianalisis tidak memiliki skenario teks kecil , ini termasuk:

  • kari
  • Halfords
  • JD Olahraga
  • Toko Parfum
  • Siklus Reaksi Berantai
  • obat super
  • asos
  • Debenhams
  • Argos
  • asda
  • tesco
  • Belanda & Barrett
  • John Lewis
  • pelayan
  • Golf Amerika
  • Teluk Kecantikan
  • Dunelm
  • B&Q
  • Sainsbury's

Situs berikut memiliki skenario teks kecil di beranda mereka yang mungkin sulit dibaca oleh pengguna dengan penglihatan sebagian:

5 Situs Teratas yang Paling Tidak Dapat Diakses untuk Pengguna dengan Penglihatan Sebagian


Situs Ritel Skenario Teks Kecil
Gudang Mobil 32
Wilko 31
Amazon 18
Sekrup 14
axminster 14

Carphone Warehouse memposting paling banyak masalah teks kecil pada saat analisis (32). Kami telah mengambil beberapa tangkapan layar dari menu mereka sebelum perbaikan. Di sini, mereka menyertakan label 'Baru', di samping beberapa opsi menu. Teks ini kemungkinan terlalu kecil untuk dibaca oleh pengguna dengan penglihatan sebagian.

situs gudang mobil

Dengan meningkatkan ukuran label 'Baru' menjadi di atas 10 piksel, Carphone Warehouse akan memiliki menu yang dapat diakses sepenuhnya untuk pengguna dengan penglihatan sebagian.


Kesimpulan & Temuan Utama

Selalu ada elemen untuk ditingkatkan dalam hal aksesibilitas situs web. Sebaiknya luangkan waktu untuk melihat beranda Anda untuk memastikannya dapat diakses sepenuhnya oleh mereka yang memiliki gangguan penglihatan.

Google Lighthouse menawarkan skor kinerja awal – yang bertindak sebagai tolok ukur yang berguna untuk ulasan situs web yang sedang berlangsung – sementara Wave oleh WebAim mengidentifikasi dengan tepat di mana Anda mungkin salah.

Beranda adalah dan akan selalu menjadi halaman terpenting Anda – ini adalah halaman pertama yang akan dikunjungi sebagian besar pengguna. Jadi, Anda perlu memprioritaskan membuat perubahan di sini. Setelah Anda memiliki sumber daya, area lain dari situs Anda juga dapat dianalisis.

Untuk meringkas, ini adalah temuan utama:

  • H&M adalah situs ritel yang paling mudah diakses untuk pengguna tunanetra.
    • Halfords adalah situs ritel paling tidak dapat diakses untuk pengguna tunanetra.
  • Semua Laura Ashley, Oasis, Space NK, American Golf, Dunelm, dan Next menawarkan opsi yang dapat diakses oleh pengguna buta warna.
    • Superdrug memiliki masalah beranda paling banyak untuk pengguna buta warna.
  • B&Q dan Sainsbury's memiliki sedikit masalah bagi mereka yang menggunakan pembaca layar.
    • Boots memiliki masalah beranda paling banyak bagi mereka yang menggunakan pembaca layar.
  • 38% dari beranda ritel teratas tidak memiliki masalah bagi mereka yang memiliki sedikit kehilangan penglihatan.
    • Gudang Carphone memiliki masalah beranda paling banyak bagi mereka yang memiliki sedikit kehilangan penglihatan

Sebagian besar beranda hanya membutuhkan sedikit perubahan untuk meningkatkan skor Google Lighthouse mereka. Setelah ini, lebih banyak orang dapat mengakses situs Anda sepenuhnya, meningkatkan peluang Anda untuk mendorong konversi untuk produk dan layanan Anda.

Untuk informasi lebih lanjut tentang bagaimana Anda dapat membuat situs web Anda lebih mudah diakses, silakan merujuk ke Pedoman Aksesibilitas Konten Web (WCAG).


Metodologi

Kami memilih untuk menganalisis beranda saja, karena ini adalah dan harus selalu menjadi halaman terpenting di situs web mana pun. Namun, sejak awal, kami tahu bahwa aksesibilitas harus diperluas lebih dari sekadar beranda. Jadi, peringkat kami mungkin tidak mewakili gambaran penuh.

Google Lighthouse dan Wave oleh WebAim digunakan untuk mengaudit semua situs.

Skor Google Lighthouse dari 0-100 digunakan untuk memberi peringkat situs secara keseluruhan untuk aksesibilitas di seluler saja.

Untuk menentukan peringkat situs berdasarkan aksesibilitasnya bagi pengguna buta warna, kesalahan kontras warna diidentifikasi menggunakan Wave oleh WebAim. Sementara Pemeriksa Kontras Warna mereka digunakan untuk mengidentifikasi apa yang bisa dilakukan Superdrug untuk melewati WGAG.

Untuk memberi peringkat situs berdasarkan aksesibilitasnya bagi pengguna pembaca layar, semua kesalahan di sekitar elemen yang hilang, kosong, atau duplikat dijumlahkan, di samping elemen ARIA yang rusak.

Untuk memberi peringkat situs berdasarkan aksesibilitasnya untuk sebagian yang terlihat, semua peringatan teks kecil dihitung.