Intinya...

Tambahkan atribut <html lang=""> pada setiap halaman untuk menyatakan bahasa utama konten, menggunakan kode ISO 639-1 yang tepat (misalnya lang="id" untuk Bahasa Indonesia).

Apa itu WCAG 3.1.1?

Konten bisa disajikan dalam berbagai bahasa, bahkan terkadang dalam beberapa bahasa sekaligus di satu halaman. Teknologi bantu membutuhkan halaman web untuk secara programatik mengidentifikasi bahasa utama yang digunakan, supaya mereka bisa menyajikan teks dengan pelafalan dan aturan bahasa yang benar.

Mengidentifikasi bahasa halaman memungkinkan teknologi bantu untuk:

  • Memuat aturan pelafalan yang sesuai,
  • Membantu browser menampilkan karakter dengan benar, dan
  • Membantu media player menampilkan teks terjemahan atau caption yang tepat.

Tujuan dari kriteria ini adalah memastikan teknologi bantu dapat menentukan bahasa default halaman secara programatik.

Sebuah halaman web dan tabel, dijelaskan pada caption

Sebuah halaman web berbahasa Prancis ditampilkan di samping tabel perbandingan pelafalan bahasa Inggris dan Prancis: 'Propos' diucapkan proh-poh dalam Prancis, tapi praw-pus dalam Inggris. 'Appelez' diucapkan ah-puh-lay dalam Prancis, tapi ap-ull-lez dalam Inggris. 'Faisons' diucapkan feh-zohn dalam Prancis, tapi fay-zuns dalam Inggris.

Mengapa ini penting?

Kalau halaman web tidak mengidentifikasi bahasa default secara programatik, atau malah mengidentifikasikannya secara salah, pengguna bisa menghadapi beberapa kendala, terutama pengguna teknologi bantu seperti:

  • Screen reader,
  • Teknologi teks-ke-suara (text-to-speech), atau
  • Translasi Braille.

Teknologi bantu ini membutuhkan informasi bahasa supaya bisa menggunakan aturan pelafalan yang benar. Jika tidak, teks yang dibacakan bisa terdengar aneh atau sulit dimengerti.

Beberapa bahasa juga menggunakan karakter khusus, dan tanpa pengaturan bahasa yang tepat, browser bisa salah menampilkan karakter, membuat teks tidak terbaca oleh pengguna visual.

Selain itu, program teks terjemahan (captioning) juga bergantung pada pengaturan bahasa halaman. Ini penting terutama di situs multibahasa, di mana satu video bisa memiliki beberapa set caption dalam bahasa berbeda. Tanpa pengaturan bahasa yang benar, caption yang ditampilkan bisa salah.

Siapa yang terpengaruh?

Pengguna low vision dan penglihatan terbatas, pengguna netra, pengguna yang mengalami kesulitan membaca materi tertulis, dan pengguna dengan gangguan kognitif.

Pengguna low vision dan penglihatan terbatas atau netra paling terdampak karena mereka kemungkinan besar menggunakan teknologi screen reader, terjemahan braille, atau teknologi teks ke ucapan. Teknologi bantu ini dapat menyampaikan teks dengan lebih akurat ketika bahasa diidentifikasi, dan membantu pengguna ini menghindari kebingungan.

Pengguna yang mengalami kesulitan membaca materi tertulis atau yang memiliki gangguan kognitif tertentu, seperti disabilitas bahasa dan belajar, mungkin menghadapi tantangan tambahan dalam mengenali karakter dan alfabet atau dalam memahami kata-kata. Mereka juga mungkin mengandalkan teknologi teks ke ucapan, di mana pengucapan yang tidak akurat bisa membuat teks menjadi membingungkan atau sulit dipahami.

Cara menerapkan 3.1.1

Bagian ini menawarkan penjelasan yang disederhanakan dan contoh-contoh untuk membantu kamu memulai. Untuk panduan lengkap, selalu rujuk ke dokumentasi resmi WCAG.

Atribut bahasa pada elemen <html>

Identifikasi bahasa utama atau default dari halaman web, lalu atur atribut bahasa pada elemen <html> di halaman tersebut ke bahasa ini. Ketika sebuah halaman web menggunakan beberapa bahasa, bahasa default haruslah bahasa yang paling banyak digunakan di halaman itu.

Untuk memastikan, periksa bahwa elemen <html> di halaman memiliki atribut lang dan bahwa nilainya sesuai dengan BCP 47: Tags for the Identification of Languages atau gunakan daftar ini untuk subtags bahasa umum, serta memastikan bahwa nilai tersebut mencerminkan bahasa utama dari halaman.

Contoh di mana elemen <html> untuk halaman web menggunakan bahasa Spanyol, dan atributnya diatur ke lang=”es”.

<!doctype html>
<html lang="es">
<head>
    <meta charset="utf-8">
        <title>documento escrito en español</title>
    </head>
    <body>
        … documento escrito en español …
    </body>
</html>

Kesimpulan

Mengatur bahasa utama sebuah halaman web menggunakan atribut lang sangat penting untuk membuat konten web menjadi lebih aksesibel dan ramah pengguna. Ini memastikan bahwa teknologi bantu dapat berfungsi dengan benar dan efektif. Langkah sederhana untuk mengidentifikasi bahasa default ini memungkinkan pengembang secara signifikan meningkatkan aksesibilitas dan kegunaan situs web mereka untuk semua pengguna.