Website yang aksesibel bisa dipakai oleh orang dengan penglihatan lemah, buta warna, keterbatasan gerak, atau pengguna screen reader. Website itu juga bekerja lebih baik untuk semua orang: seseorang di bawah sinar matahari terik, seseorang yang memakai satu tangan di kereta yang penuh. Inilah lima pengecekan yang kami lakukan di setiap halaman sebelum peluncuran.

Aksesibilitas website bisa terdengar seperti standar teknis yang panjang, dan versi lengkapnya memang begitu. Tetapi sebagian besar masalah yang kami temukan di situs nyata bermuara pada lima hal yang sama, dan siapa pun bisa mengeceknya dalam satu sore, tanpa alat khusus.

1. Kontras

Teks isi membutuhkan rasio kontras minimal 4,5:1 terhadap latar belakangnya, dan teks besar minimal 3:1. Teks abu-abu muda di atas putih sering tidak lolos, dan sulit dibaca di luar ruangan.

Untuk mengeceknya, ambil warna teks dan warna latar belakang lalu masukkan ke pengecek kontras WebAIM. Cek juga tombol, teks placeholder di formulir, dan teks di atas foto: bagian-bagian itulah yang paling sering gagal.

2. Fokus

Semua yang bisa diklik juga harus bisa dipakai dengan keyboard, dan elemen yang sedang fokus perlu garis tepi yang terlihat jelas. Menghapus garis tepi demi tampilan membuat pengguna keyboard tersesat.

3. Judul

Satu judul utama per halaman, lalu judul lainnya berurutan. Pengguna screen reader melompat dari judul ke judul untuk memindai halaman, seperti pengunjung lain memindai dengan matanya.

4. Teks alt

Gambar yang bermakna diberi deskripsi singkat tentang isinya. Gambar dekoratif diberi deskripsi kosong, agar screen reader melewatinya.

Alt text yang baik menjelaskan apa yang penting dari gambar untuk halaman ini. Untuk foto produk, itu adalah produk dan warnanya; untuk foto tim, siapa saja yang ada di dalamnya. Jangan diawali dengan “gambar dari”: pembaca layar sudah mengumumkan bahwa itu gambar.

5. Area sentuh

Tombol dan tautan harus cukup besar, dan cukup berjarak, untuk diketuk dengan ibu jari. Ukuran yang nyaman sekitar 44 kali 44 piksel.

Aksesibilitas bukan fitur tambahan. Begitulah seharusnya situs bekerja.

Aksesibilitas website di luar lima pengecekan itu

Lima pengecekan itu menangkap masalah yang paling umum. Beberapa lagi layak ditambahkan setelah semuanya beres:

Formulir: setiap kolom punya label yang terlihat, bukan hanya placeholder, dan pesan error menjelaskan apa yang salah serta cara memperbaikinya.
Link: teks link menyebutkan tujuannya. “Lihat harga kami” tetap jelas di luar konteks; “klik di sini” tidak.
Zoom: halaman tetap berfungsi saat teks diperbesar hingga 200%, tanpa ada konten yang terpotong.
Gerakan: animasi menghormati pengaturan “kurangi gerakan” di perangkat pengunjung, dan tidak ada yang berkedip.
Video: teks untuk ucapan, agar video tetap bisa dipahami tanpa suara.

Standar lengkapnya adalah Web Content Accessibility Guidelines (WCAG) 2.2. Level AA adalah target umum untuk website bisnis. Pengecekan mudah dari W3C adalah langkah berikutnya yang baik setelah lima hal di atas.

Mengapa ini baik untuk bisnis

Situs yang aksesibel biasanya lebih mudah dipakai semua orang, artinya lebih banyak orang menyelesaikan apa yang ingin mereka lakukan. Banyak dasar aksesibilitas yang sejalan dengan praktik terbaik mesin pencari, seperti heading yang jelas, link yang deskriptif, dan alt text. Dan ini memang bagian dari membangun sesuatu dengan benar, seperti memastikan pintu depan bisa dibuka.

Pertanyaan yang sering diajukan

Apakah aksesibilitas website diwajibkan oleh hukum di Indonesia?

Hukum Indonesia mengakui hak penyandang disabilitas, termasuk akses terhadap informasi, meskipun persyaratan teknis khusus untuk website swasta tidak serinci di beberapa negara. Jika Anda menjual ke luar negeri, cek aturan di pasar-pasar tersebut. Bagaimanapun, pengecekan di atas adalah praktik yang baik.

Bisakah plugin atau overlay aksesibilitas memperbaiki semuanya?

Tidak. Overlay tidak bisa memperbaiki label yang hilang, struktur yang buruk, atau warna yang tak terbaca di dalam desainnya sendiri. Aksesibilitas harus dibangun ke dalam desain dan kodenya.

Bagaimana cara menguji dengan pembaca layar?

Setiap ponsel sudah punya pembaca layar bawaan: VoiceOver di iPhone dan TalkBack di Android. Nyalakan, pejamkan mata, dan coba temukan detail kontak Anda. Pengalaman ini membuat rendah hati, dan sangat informatif.

Aksesibilitas website adalah bagian dari cara kami mendesain dan membangun setiap situs dalam layanan web design kami. Ini juga berkaitan dengan kecepatan dan tipografi: lihat mengapa website terasa lambat di ponsel dan memilih font untuk dua bahasa.