Kategori
Web Accessibility

Pengecualian Aksesibilitas Web

Diperbarui 12 Agustus 2010 oleh Dani Iswara

Rekomendasi aksesibilitas Web versi W3C tidaklah kaku. Ada pengecualian di beberapa kriteria suksesnya. Catatan tidak penting ini akan menggabungkan pendapat subjektif saya dan WCAG 2.0.

1. Tiap konten non-teks harus disertai konten berbasis teks

Tidak untuk semua konten non-teks. Ada pengecualian. Terutama bagi konten non-teks yang terkait dengan sensor spesifik tertentu. Misalnya musik instrumentalia, ‘Completely Automated Public Turing test to tell Computers and Humans Apart’ (CAPTCHA), objek grafis dekoratif, dan tes bahasa (bicara/percakapan).

Presentasi multimedia pun tidak semuanya harus menyajikan transkrip. Terutama jika berupa konten ‘real-time’, terbatas waktu, dan bukan interaktif. Pun kalau konten multimedia berupa ‘rebroadcast’ dari media lain yang sudah memenuhi unsur aksesibilitas, konten ini lolos kriteria sukses. Asal berada pada kondisi yang serupa saat konten awal dites. Misal jika suatu konten yang dinyatakan aksesibel hanya berisi instrumentalia tapi disetel di dekat kebisingan, ya percuma.

2. Kontras sesuai ‘Luminosity Contrast Ratio’

Meliputi kontras warna dan suara. Kontras suara serupa butir 1 di atas. Silakan baca kembali tulisan tidak penting saya di blog ini, Cek Kontras Warna Blog dengan Ekstensi Firefox. Rekomendasi kontras warna tidak berlaku bagi huruf yang berukuran besar, seukuran 18 ‘point’ atau 14 ‘point’ yang tebal. Teks yang berupa dekoratif, CAPTCHA, juga bisa diabaikan. Begitu juga dengan teks dalam logo.

3. Teks dapat diperbesar hingga 200% tanpa merusak desain

Resize text:

1.4.4. Except for captions and images of text, text can be resized without assistive technology up to 200 percent without loss of content or functionality (Level AA).

Sehingga set huruf/’font’ dianjurkan memakai ukuran relatif seperti em dan % (persen). Kecuali untuk teks dalam gambar. Apalagi yang hanya sekadar dekoratif. Sebaiknya teks dalam gambar disajikan dalam ukuran yang jelas terbaca.

4. Warna latar pastel lebih direkomendasikan

Advisory Techniques for 1.4.3 – Contrast (Minimum)


Using a light pastel background rather than a white background behind black text to create sufficient but not extreme contrast…

Bukan berarti tidak boleh memakai latar gelap sama sekali. Latar gelap masih terasa baik untuk menyajikan teks dalam jumlah sedikit. Teks sebaiknya berukuran agak besar disertai tipografi sedemikian rupa. Sehingga masih memiliki keterbacaan yang baik. Latar gelap juga layak pakai untuk galeri karya grafis. Objek jadi lebih fokus di mata.

5. Hindari penulisan pranala yang tidak deskriptif

Terutama yang berdiri sendiri. Tidak dalam konteks suatu kalimat. Seperti pada ‘klik di sini’, ‘di sana’, ‘di sini’, dan ‘unduh’. Agar tidak ambigu. Untuk jelasnya, silakan kunjungi tulisan Understanding Blind Users di Dani Iswara .com. Pengecualian pada pertimbangan target pencapaian rata-rata klik dan ‘calls-to-action’. Misalnya tombol ‘submit’ pada kolom isian komentar dan ‘subscribe’ pada kotak langganan via surel.

6. Pemakaian ‘breadcrumb’

Ada konvensi yang menyebut navigasi ‘breadcrumb’ tidak perlu dipakai pada kondisi tertentu. Misalnya satu artikel ada dalam multi-kategori dan kedalaman menu tidak lebih dari 3-4 level. Prinsipnya, ‘breadcrumb’ hanya menu tambahan.

7. Untuk setiap tag img, sertakan pula atribut alt

Tapi tidak semua atribut alt (teks alternatif) harus diisi nilai atau deskripsi. Misalnya gambar yang dekoratif (ikon ‘bullet’), gambar tabel yang sudah dideskripsikan dalam konten di sekitar gambar itu sendiri, dan gambar foto yang sudah jelas dinarasikan di sekitar foto.

8. Disarankan memakai set huruf sans serif

Berdasarkan rekomendasi untuk memenuhi kriteria sukses 1.4.8 WCAG2, memang demikian. Beberapa yang terkait teks:

  • Using a hover effect to highlight a paragraph, list items, or table cells (HTML, CSS),
  • Presenting text in sans serif font or providing a mechanism to achieve this (CSS),
  • Using vertical (bulleted or numbered) lists rather than inline lists,
  • Using upper and lower case according to the spelling conventions of the text language,
  • Providing large fonts by default,
  • Avoiding scaling font sizes smaller than the user-agent default,
  • Providing sufficient inter-column spacing (future link),
  • Avoiding centrally aligned text,
  • Avoiding chunks of italic text,
  • Avoiding overuse of different styles on individual pages and in sites,
  • Putting an em-space or two spaces after sentences.

Tapi dengan tipografi tertentu, set huruf serif bisa memiliki keterbacaan yang baik. Nyatanya, set huruf serif biasanya menjadi setelan standar di tiap peramban.

7 tanggapan untuk “Pengecualian Aksesibilitas Web”

Bli OOT,
Saya coba buka kembali artikel lama blog ini dan menemukan artikel pengecekan kontras warna dengan pengaya FX, walau ada penjelasan Bli Dani pada artikel saya masih kagok.
Ada test WCAG1 dan WCAG2 pada level AA dan AAA, dalam pengertian saya Jika Semuanya dicontreng pada WCAG1 dan berlatarhijau pada WCAG2 seperti blog ini berarti kontras tidak bermasalah ?

Tambahan Bli,
Jika pada WCAG1 level AAA kecerahan warna disilang merah berarti bermasalah, tetapi pada WCAG2 level AAA semua berlatar hijau.
Yang saya ingin tahu hubungan antara WCAG1 dan WCAG2, saya coba cari referansi lain menggunakan Bahasa yang tidak saya pahami :(

PF,
teorinya begitu, Pak Aldy. Lolos tes WCAG1 jika tercentang hijau semua, dan lolos tes WCAG2 jika tidak ada blok merah.

Memang ada perbedaan perbandingan/algoritma kontras warna pada WCAG1 dan WCAG2. Disarankan memakai WCAG2.

Sepertinya ini belum di luar topik, Pak. Mungkin harus coba lebih keras lagi untuk keluar topik.

Dimas,
jangan segan untuk mengajukan protes jika ada kesulitan akses ya, Mas Dimas. Sekarang makin banyak narablog Indonesia yang peduli aksesibilitas Web. Kami saling mengoreksi aksesibilitas dan kebergunaan diantara situs kami sendiri. Walau kami hanya berpatokan pada ‘best practice’ para pakar. Belum melibatkan pengguna seperti Mas Dimas dan kawan-kawan lain. Terima kasih sudah bekunjung.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Situs ini menggunakan Akismet untuk mengurangi spam. Pelajari bagaimana data komentar Anda diproses.