WCAG

  • suarise
  • No Comments

Uji Aksesibilitas Cepat dengan #KamisKeyboard: Mencoba Berselancar di Website Tanpa Mouse
150 150 suarise

Apa itu #KamisKeyboard

#KamisKeyboard adalah salah satu gerakan advokasi aksesibilitas yang diinisiasi oleh Suarise yang bisa diikuti semua orang. Caranya adalah dengan mencoba mengakses setidaknya satu website di hari Kamis, dari komputer/laptop, tanpa menggunakan mouse atau trackpad untuk membaca maupun berinteraksi dengan menu-menu ataupun fitur di laman website tersebut.

Navigasi keyboard adalah salah satu standar aksesibilitas website

Ada banyak hal yang menjadi kriteria sebuah website dikatakan sudah memenuhi standar aksesibilitas. Salah satunya adalah website tersebut bisa dioperasikan hanya dengan menggunakan keyboard saja (tanpa mouse). Kriteria ini diatur lebih detail di dalam standar aksesibilitas konten website, atau disebut WCAG (Web Content Accessibility Guidelines).

Di dalam WCAG 2.1 poin Keyboard Accessible merupakan turunan dari salah satu prinsip aksesibilitas digital, yaitu Operable. Operable memiliki makna bahwa sebuah website bisa dioperasikan dengan menggunakan beragam input, baik secara mandiri ataupun bersama.

5 Tombol Penting

Tombol utama yang paling krusial di #KamisKeyboard adalah tombol TAB pada keyboard. 5 tombol penting lainnya:

  1. Tab
  2. Shift
  3. Arrow
  4. Space bar
  5. Enter

Tab dan Shift Tab berfungsi untuk bergerak maju/mundur antar elemen interaktif. Tab dan Enter/Spacebar berlaku untuk berinteraksi dengan elemen interaktif (memilih/mengisi). Tab dan Tanda panah berlaku jika bertemu dengan drop down atau elemen expansion/collapsed.

Yang harus dicek: kembali lagi ke Address Bar

Setelah memasukan alamat website di kolom address bar, tekan tab terus sampai balik lagi ke address bar. Perhatikan kemana kursornya bergerak setiap tombol TAB. Isu yang mungkin ditemukan:

  • Keyboard Trap: Kursor “nyangkut” dan tidak bisa gerak maju atau mundur.
  • Focus Visible: Mata tidak bisa mengikuti kemana kursor bergerak karena styling (outline) dihilangkan.
  • Highlight elemen non-interaktif: Teks paragraf yang mendapat fokus keyboard padahal tidak bisa diklik.

Contoh praktik #KamisKeyboard di sebuah website

Audit Aksesibilitas Website Profesional

Suarise menyediakan layanan untuk audit aksesibilitas website sesuai standar WCAG 2.1. Audit ini memastikan sebuah website maupun aplikasi ramah untuk beragam tipe disabilitas. Audit meliputi evaluasi kode dan tes dengan menggunakan beberapa alat bantu, salah satunya pembaca layar. Suarise juga memberikan rekomendasi kode untuk perbaikan website tersebut kedepannya agar memenuhi standar aksesibilitas internasional.

Baca juga:

  1. Bagaimana Cara Tunanetra Mengakses Internet?
  2. Video: Tutorial Kamis Keyboard
  3. Video: Aksesibilitas Aplikasi Grab vs Gojek bagi Disabilitas Netra

Referensi:

  • suarise
  • No Comments

Perkenalan Navigasi Keyboard – Bisa Berselancar Tanpa Mouse Kalau….
150 150 suarise

Pernahkah kamu melihat seseorang mengetik dengan papan ketik (keyboard) tapi tatapan orang yang sedang mengetik full ke layar saja? Bahkan orang tersebut tidak melihat kemana jarinya menari di atas keyboard dan ketikannya tetap benar?

Teknik ini dikenal dengan metode touch-typing atau juga dikenal sebagai sistem pengetikan 10 jari. Skill ini biasanya dimiliki orang yang intens mengetik, entah itu notulis (note-taker) dan programmer. Tapi tahukah kamu kalau metode pengetikan yang sama juga digunakan oleh teman-teman disabilitas, termasuk disabilitas netra? Gak cuma ngetik, disabilitas netra mayoritas hanya menggunakan keyboard saja untuk berselancar di perambaan internet dan melakukan aktivitas di komputer secara umum.

Lalu, gimana ya caranya disabilitas netra berselancar di web hanya dengan keyboard saya?

Perkenalan Navigasi Keyboard

Sebetulnya kita bisa melakukan aktivitas apapun di komputer, baik itu menjalankan program komputer ataupun membuka laman sebuah website hanya dengan keyboard saja. Tapi ada catatannya, yaitu jika program/perangkat lunak dan website tersebut sudah memenuhi standarisasi aksesibilitas digital. Jika tidak, maka akan ada fungsi tertentu yang hanya bisa dioperasikan dengan cara lain, misal hanya dengan tetikus (mouse).

Kombinasi pengetikan ataupun menekan beberapa tombol sekaligus bisa berfungsi untuk memanggil sebuah fitur/fungsi tertentu, atau menekan dan memilih layaknya penggunaan mouse. Bahkan seringkali, navigasi keyboard mempercepat eksekusi sesuatu dibandingkan penggunakan sebuah mouse karena tangan tidak harus berpindah dari atas keyboard untuk memegang mouse.

Kenapa Disabilitas netra menggunakan keyboard tanpa mouse

Layout pada perangkat lunak (software) maupun website biasanya mengikuti alur baca visual. Dan untuk bisa berinteraksi dengan sebuah tombol, misalnya, maka biasanya pengguna yang awas mengarahkan pointer mouse ke lokasi untuk klik tombol tersebut. Apakah tombol itu di atas, bawah, kiri, kanan, tengah, mouse mengarahkan itu semua.

Tidak semua disabilitas netra tidak memiliki kemampuan melihat sama sekali. Beberapa ada yang masih bisa melihat dengan jarak yang dekat sekali dengan layar. Jika kondisinya demikian, maka tetikus masih memungkinkan untuk digunakan. Jika disabilitas netra tersebut merupakan pengguna pembaca layar untuk mendapatkan informasi yang tampak secara visual, maka tetikus tidak digunakan lagi karena pointernya membutuhkan akurasi lokasi. Tapi bukan berarti tombol tersebut tidak bisa dibaca ataupun di klik. Dengan teknik navigasi keyboard, tombol tersebut bisa dibaca, dicari, dan di klik. Hal ini berlaku untuk seluruh informasi maupun fitur yang dimiliki oleh web tersebut.

Pentingnya Pintasan/Shortcut dalam navigasi keyboard

Navigasi keyboard terjadi karena adanya pintasan/shortcut. Pintasan bisa berupa satu atau lebih tombol yang ditekan pada keyboard. Pernah menggunakan Ctrl + C untuk menyalin sesuatu? Nah itu contoh pintasan yang paling populer untuk menyalin kata, gambar, ataupun file.

Macam navigasi keyboard

Secara sederhana, ada 2 mode navigasi saat kita menggunakan keyboard:

  1. Mode browsing/membaca
  2. Mode fokus/pengetikan

Lebih jauh, beberapa mode terkadang memiliki pengaturan yang lebih mutakhir jika perangkat asistif/alat bantu seperti pembaca layar diaktifkan.

Contoh: Untuk menemukan sebuah tombol dengan navigasi keyboard saja, kamu bisa tekan “TAB” hingga sampai di tombol tersebut. Dan untuk klik tombol tersebut, kamu bisa tekan spasi atau enter. Jika kamu melakukan navigasi dengan keyboard dengan kondisi pembaca layar aktif, kamu bahkan bisa mengakses pintasan (shortcut) yang memunculkan semua tombol yang dimiliki laman tersebut.

Mode browsing/membaca

Seperti namanya, mode ini fungsinya untuk membaca tanpa melakukan pengetikan sama sekali. Aktivitas skimming (membaca singkat/cepat) contohnya. Biasanya pengguna tetikus melakukan scrolling sebuah halaman dengan menggulirkan scroll wheel, dengan klik panah atas bawah, atau dengan menggerakan indikator panjang halaman di sisi kanan layar. Hal yang sama bisa dilakukan dengan menekan tombol Page Up dan Page Down.

Jika pembaca layar diaktifkan, mode skimming dilakukan dengan cara yang berbeda. Hal ini dikarenakan tidak hanya layar yang bergeser, tapi juga informasinya harus dibacakan. Oleh karena itu, ada pilihan cara membaca, apakah itu berdasarkan judul, paragraf, baris, atau bahkan hal spesifik saja seperti gambar, tabel, ataupun tombol saja. Masing-masing diaktifkan dengan cara/pintasan keyboard yang berbeda.

Mode fokus/pengetikan

Mode fokus/pengetikan biasanya ketika pengetikan sedang terjadi, apakah itu sifatnya dokumen maupun form. Pembagian dua mode ini berlaku saat pembaca layar diaktifkan. Saat mode browsing, pengguna pembaca layar tidak usah khawatir jika menekan pintasan akan menambah tulisan pada dokumen/form. Dan sebaliknya, pintasan tertentu tidak aktif saat mode fokus diaktifkan karena tombol pada keyboard tersebut digunakan untuk pengetikan.

Pergantian antara mode fokus ke mode browsing tidak otomatis. Pengguna pembaca layar bisa mengaktifkan pergantian mode ini dengan 2 cara:

  1. Pintasan screen reader (umumnya tombol insert atau tombol capslock) ditekan bersamaan dengan space bar.
  2. Menekan Enter saat sampai di bagian form yang mau diisi. Dan untuk kembali ke mode browsing, tekan Esc.

Pintasan keyboard tidak bisa dijalankan? Bisa jadi ada isu aksesibilitas!

Pintasan umumnya bersifat umum, artinya, mau websitenya apapun, kurang lebih sama. Kecuali untuk software, bisa jadi ada perbedaan.

Contoh untuk mute/unmute mik di aplikasi video conferencing:

  • Zoom : Ctrl + Shift + M
  • Google Meet: Ctrl + D
  • Microsoft Teams : Ctrl + Shift + M

Bisa dinavigasikan dengan keyboard saja adalah salah satu kriteria standar aksesibilitas digital, yaitu WCAG 2.1 Keyboard accessible yang terdiri atas empat kriteria turunan:

  • 2.1.1 Keyboard
  • 2.1.2 No Keyboard Trap
  • 2.1.3 Keyboard (No Exception)
  • 2.1.4 Character Key Shortcuts

Cobain langsung navigasi keyboard sambil ikutan Gerakan #KamisKeyboard, cuma pake tombol TAB

Navigasi keyboard bisa diterapkan dan bermanfaat untuk pengguna dengan ataupun tanpa pembaca layar. Yuk cobain navigasi keyboard sambil ikut gerakan #KamisKeyboard dari Suarise.

#KamisKeyboard adalah gerakan untuk mengakses setidaknya 1 (satu) website setiap hari Kamis, hanya dengan menggunakan keyboard saja.

Caranya simpel, cukup tekan tombol TAB sambil cek aksesibilitas website tersebut.

Cek Step-by-step #KamisKeyboard di Instagram SuariseID atau tutorial #KamisKeyboard di Youtube untuk info detailnya.

Ditulis oleh Bayu Aji F.

Talent Content Writer Disabilitas Netra Suarise.

Faktor yang Mempengaruhi Aksesibilitas di Game Berbasis Web, Apps dan Konsol
2560 1801 Rahma Utami

Pernahkah kalian melihat teman-teman difabel bermain game digital di hp, komputer, ataupun konsol? Pernah terpikirkan gak bagaimana game yang mereka mainkan memfasilitasi tunarungu yang tidak bisa mendengar suara, tunanetra yang tidak bisa melihat grafis, atau tunadaksa yang memiliki kesulitan memegang kontrol? Jika  teman-teman difabel bisa memainkan tugas dalam game baik tanpa ataupun dengan assistive technology, artinya game tersebut memiliki aksesibilitas yang baik. Tapi apa saja sih faktor aksesibilitas di game?

Perlu diingat bahwa pada saat berbicara tentang aksesibilitas, tak terkecuali pada game, artinya kita sedang membicarakan akomodasi untuk beragam tipe disabilitas, bukan hanya satu disabilitas saja. Namun, tidak bisa dipungkiri beberapa game lebih ramah pada kategori difabel yang satu dibandingkan yang lainnya.

Faktor yang Mempengaruhi Aksesibilitas pada Game

Ada 3 hal perlu diperhatikan saat ingin membuat game yang aksesibilitasnya baik bagi difabel: game design, struktur teknis, dan sound design. Secara garis besar, ketiga hal ini juga berlaku bagi game-game konsol seperti Xbox, Nitendo, maupun Sony Playstation.

1. Game Design

Game yang bisa dimainkan difabel belum tentu dedesain khusus dengan fitur aksesibilitas. Terkadang, game design dan game mechanic itu menjadi faktor utama yang membuat game tersebut memiliki aksesibilitas yang baik. Umumnya hal ini sering terjadi untuk tipe game casual.

Sudah banyak casual game yang menerapkan kaidah aksesibilitas sehingga ramah dimainkan oleh difabel. Namun demikian, bukan berarti hanya casual game yang bisa menjadi ramah bagi difabel. Berbagai macam implementasi pada game RPG juga bisa membuat game ini ramah difabel, seperti pada game Gears of War, dan lebih jauh lagi seperti yang kemudian diterapkan pada Last of Us Part II.

Faktor-faktor seperti (device) input, mekanisme untuk melakukan action, mekanisme memenuhi dan menyajikan quest, hingga bagaimana display informasi pada game adalah beberapa hal yang perlu dipertimbangakan sejak awal pembuatan game.

Foto joystik play station di depan sebuah laptop

Input menjadi pertimbangan mendasar saat ingin membuat game yang inklusif

2. Struktur Teknis

Karena game digital non konsol pada dasarnya juga merupakan website dan atau aplikasi selular. Maka dari itu, prinsip-prinsip POUR (Perceivable-Operable-Understanable-Robust) dan WCAG juga berlaku untuk menjamin kelangsungan aksesibilitas game diluar gameplay atau game mechanic. Beberapa diantaranya adalah:

  • Menggunakan label pada tombol, sehingga tunanetra bisa mendengar label tombol itu dengan menggunakan screen reader
  • Tidak menggunakan gambar untuk teks, sehingga bisa di zoom, diubah warnanya, dan di suarakan oleh berbagai jenis assistive technology
  • Jika terpaksa image text, maka gambar tersebut dilengkapi Alt text
  • Menggunakan script yang benar sehingga jika ada action yang mengeluarkan notifikasi, maka screen reader bisa langsung menyuarakan dan fokus keyboardnya langsung pindah jika diperlukan
  • Kontras warna yang baik untuk teks maupun komponen game yang memiliki nilai informasi sehingga mudah dibaca oleh orang dengan butawarna
  • Dan lain sebagainya.
Contoh penamaan tombol dengan atribut aria-label. Aria-label=menu pada icon 3 garis horizontal (hamburger)

Label tombol, faktor penunjang aksesibilitas yang sederhana tapi paling sering dilupakan, tak terkecuali di game.

Implementasi WCAG yang benar menjamin website dan aplikasi bisa diakses orang-orang dengan latar belakang disabilitas. Hal ini dikarenakan implementasi WCAG memastikan website dan aplikasi seluler kompatibel dengan berbagai jenis input (mouse, keyboard, haptic) dan berbagai jenis assistive technology (magnifier, colour enhancer, screen reader, dragon naturally speaking, dll).

3. Sound design vs Caption

Sound design menjadi komponen penting saat mendesain aksesibilitas game.  Immersive sound experience juga menjadi hal yang dilirik agar game menawarkan pengalaman maksimal bagi gamer tunanetra. Bagi tunanetra, suara menjadi petunjuk indikasi aksi dan narasi.

Sebaliknya, bagi tunarungu, apapun informasi yang disampaikan melalui suara harus bisa dimunculkan dalam teks/caption. Caption juga berguna bagi gamer pada umumnya jika tidak menggunakan headphone ataupun sedang dalam situasi yang tidak memungkinkan untuk menyalakan suara.

Contoh sederhana dari implementasi sound design adalah pada game Frequency Missing. Sementara itu, pada game yang lebih advance, sound design memiliki berbagai turunan yang membuat kompleksitas game RPG sehingga memungkinkan untuk dimainkan oleh tunanetra sekalipun.

 

Baca juga: Sound Design, Aksesibilitas pada Game RPG sebelum Last of Us Part II

Jika kamu adalah seorang  developer game…

Dan ingin membuat game yang kamu buat bisa di akses seluruh kalangan difabel, atau ramah difabel tertentu, kamu bisa mulai menerapkan WCAG. Selain itu, mengaktifkan fitur assistive technology seperti screen reader untuk melakukan testing juga merupakan komponen yang penting. Bisa juga dengan mematikan seluruh volume suara dan hanya bermodalkan visual, atau malah memejamkan mata dan hanya menggunakan suara pada saat memainkan game tersebut untuk simulasi.

Selain itu, kamu juga bisa berkolaborasi dengan Suarise. Suarise menyediakan jasa konsultan dan user testing dengan tester dari berbagai latar belakang disabilitas, khususnya tunanetra. Kami merupakan satu-satunya konsultan khusus di bidang aksesibilitas digital di Indonesia. Tim kami sebelumnya telah berpengalaman dalam melakukan accessibility audit di Inggris.

Yuk jadikan game semakin inklusif dan #BisaDiAkses semua orang tanpa kecuali!

5 Pedoman Pembuatan Website Inklusif bagi Tunanetra untuk Pengembang Perangkat Lunak
150 150 Rahma Utami

Di era digital ini, internet menjadi sumber informasi yang sangat vital tak bagi masyarakat tak terkecuali tuna netra. Berbagai informasi bisa diakses kawan-kawan Tunanetra baik melalui komputer maupun perangkat seluler lainnya. Berselancar di dunia maya, baik mengakses berbagai website, melakukan pencarian melalui Google, mengakses dan update social media seperti twitter, Facebook, dan Instagram, dan ‘menonton’ Youtube merupakan hal biasa dilakukan sehari-hari untuk mendapatkan informasi terbaru. Rasanya, sebagian besar talent Suarise berselancar di dunia maya setiap hari! Tentunya, kawan-kawan tuna netra bisa mengakses informasi dari kanal-kanal yang sedikit banyak sudah menerapkan kaidah website inklusif, terlepas dari tinggi rendahnya tingkat aksesibilitas website yang bersangkutan.

Tentunya, segala informasi yang tersaji di website diterjemahkan oleh speech synthesizer/screen reader bawaan yang terdapat pada gawai mereka, ‘Voice Over’ untuk Apple, ataupun JAWS dan NVDA untuk Windows. Meskipun demikian, tantangan terbesar bagi kawan-kawan tunanetra untuk mengakses informasi adalah jika websitenya tidak terlalu aksesibel. Jika aksesibilitas website dioptimalkan, tunanetra tidak harus terlalu bergantung pada buku braille yang tak hanya lama untuk diproduksi, namun juga mahal secara produksi, dan terbatas dalam distribusi. Akurasi dan kecepatan informasi ini sangat penting untuk akselerasi khasanah pengetahuan kawan-kawan tunanetra terutama untuk mendalami berbagai topik sesuai minat mereka.

5 prinsip website inklusif untuk mengoptimalkan aksesibilitas

Meski pedoman komperhensif untuk membuat website yang tingkat aksesibilitasnya tinggi terutama untuk tunanetra tersedia di WCAG, ada 5 prinsip sederhana website inklusif yang selalu bisa mulai diterapkan, terutama oleh rekan-rekan pengembang perangat lunak, terutama desainer dan developer, agar informasi di website dapat diakses dengan mudah oleh kawan-kawan tunanetra.

1. Hirarki Informasi

Hirarki informasi ini tidak melulu soal tulisan dari artikel, melainkan juga mencakup atribusi dan peletakan tombol action. Hirarki ini mempermudah speech sythesizer/screen reader untuk membaca informasi di website secara terorganisir, membantu kawan-kawan tunanetra dalam mengkategorikan konten yang sedang mereka dengarkan, dan menjadi navigasi selama dalam website maupun halaman yang sedang diakses. Coba dengarkan rekaman di bawah ini deh untuk hasil tulisan yang hirarki informasinya mempermudah tunanetra dalam membaca.

1.1 Tetapkan struktur Heading

Umumnya sebuah website bisa memiliki hingga 6 jenis heading. Penting untuk mengorganisir mana heading yang berdiri sendiri, mana yang repetitive. Heading 1 (H1) contohnya, hanya untuk hal yang paling penting, yaitu judul. Sangat tidak disarankan menggunakan heading 1 lebih dari satu kali. Heading 2 dan seterusnya bisa di ulang secara sistematis tergantung informasi yang dijabarkan.
Sebagai tambahan, level dari heading tidak sama dengan ukuran teks–meski pada beberapa kondisi, seperti website dari penyedia layanan website seperti wix, wordpress maupun lainnya, setiap level heading sudah memiliki pendekatan visual masing-masing termasuk ukuran huruf. Tapi jika development dari scratch, level tidak ada hubungannya dengan besarnya huruf.
Hal yang penting adalah hindari memiliki struktur heading yang lompat (misal dari H2 lalu H4) karena ini berpotensi membingungkan dalam navigasi informasi website tersebut.

Terutama untuk rekan-rekan developer, cek simulasi heading untuk HTML 5 di link berikut: http://accessiblehtmlheadings.com/

1.2 Jangan mengandalkan styling visual

            Speech sythesizer/screen reader tidak membaca styling sehingga kawan-kawan tunanetra, terutama yang total, tidak mengidentifikasi jika tulisan tersebut terlihat sebagai sub judul, bold, ukurannya lebih besar, ataupun italic. Adapun styling visual ini melengkapi fungsi aesthetic dari heading marking. Cek rekaman di bawah ini untuk mengetahui bagaimana poin ini dibaca­; contoh menggunakan voice over di Apple.

1.3 Heading bisa tersembunyi

2. Selalu lengkapi ALT-Text

Alternative text adalah komponen mahapenting nomer dua setelah heading dalam menerapkan aksesibilitas website. Hal ini dikarenakan speech sythesizer/screen reader tidak bisa mendeskripsikan gambar. Berikut ini contoh gambar dengan dan tanpa alt teks.

Alt text ini tidak hanya diterapkan pada foto tapi pada elemen visual apapun. Jika ada lebih dari satu elemen visual (foto, ilustrasi, infografis, tombol, icon, symbol) ada baiknya menggunakan kata penunjuk kategori visual tersebut agar mempermudah mengidentifikasi.

3. Pemilihan Redaksi Kata (Copywriting)

Dalam membuat copywriting, terutama untuk gambar, selalu lakukan pertimbangan dengan mengacu ke tujuh pertanyaan berikut:

  • Informasi penting apa yang harus disampaikan dan apa tujuan informasi tersebut ada, baik itu tulisan maupun gambar?
  • Apa atau siapa fokus pada gambar tersebut?
  • Sepenting apa setting atau lokasi?
  • 2E: Adakah ekspresi dan emosi yang terlihat dan penting untuk disampaikan
  • Apakah warna penting untuk dijelaskan?
  • Apakah subjek atau objek di dalam gambar tersebut sedang melakukan aksi?
  • Adakah konteks dari gambar tersebut untuk dijelaskan?

3.1 Deskriptif

Jabarkan informasi secara deskriptif. Maksud deskriptif disini bukan melulu soal visual, tapi mengarahkan dan membantu ekspektasi membaca. Sebagai contoh, di Suarise, kami menghindari menggunakan kata “beberapa”. Alih-alih menggunakan kata tersebut, kami langsung menyebut jumlah atau kuantitasnya. Jadi, hindari menulis “ada beberapa hal yang harus dihindari…”, dan tulislah “ada 6 hal yang harus dihindari…”

Begitu pula dalam membuat deskripsi elemen visual berupa caption maupun Alt-Text. Jangan terlalu simpel, jangan pula terlalu panjang. Berapa banyak idealnya? Tidak ada kaidah tetap, selama alt teks tersebut ringkas dan concise. Kami dari Suarise menyarankan setidaknya 80 karakter atau jangan lebih banyak dari limitasi karakter di twitter 😉 Jangan lupa mencantumkan kategori dari elemen visual tersebut (foto, gambar, ilustrasi, desain, logo, symbol, icon, dll)

3.2 Instruksional

Redaksi yang sifatnya instruksional menjadi penting terutama bagi elemen visual yang memiliki action call­–bisa di klik, bertujuan mengarah pada halaman website tertentu, ataupun mengarahkan ke aksi selanjutnya. Biasanya visual yang memiliki action call, alt teks-nya berisi 2 kalimat: kalimat pertama sifatnya deskriptif, kalimat kedua sifatnya instruksional.

Sebagai contoh, rekaman selanjutnya ini akan membaca layout diantara kalimat ini dengan rekaman tersebut.

 

3.3 Batasi animasi, dan hindari parallax scrolling

3.4 Kontras Warna 4,5:1

Sekilas mungkin terdengar membingungkan, kok aksesibilitas tunanetra membahas warna. Perlu diketahui, kawan-kawan tunanetra ada yg mengalami gangguan penglihatan total ada pula yang parsial (sebagian). Kontras dibutuhkan agar para tunanetra parsial bisa langsung mendeteksi pembagian halaman website dan yang paling penting identifikasi tombol action pada website tersebut.

Kontras ini juga bisa disebut luminance, dan untuk menghitung ini, kita harus menggunakan koefisien RGB. Nilai ini harus dibandingkan antar 2 warna, yaitu warna foreground dan warna background. Bingung? Jangan sedih. Penulis juga sempat bingung. Untuk mendemonstrasikan hal ini, penulis telah berkonsultasi ke senior software engineer, Didiet Noor agar hal ini lebih mudah dipahami yang terangkum dalam percakapan berikut ini:

Simulasi cara menghitung kontras warna 4,5:1 untuk aksesibilitas website melalui percakapan whatsapp

Salah satu tips yang bisa diterapkan dalam mendesain website yang aksesibel bagi tunanetra adalah dengan berpedoman pada mobile first alias desain dan struktur dibuat untuk pengguna telepon genggam atau gawai seluler lainnya.

BONUS untuk pebisnis yang menerapkan website inklusif:
Website yang ramah bagi tuna netra sudah pasti memiliki performa dan usability yang tinggi. Salah satu yang diungkapkan oleh Sami Keijonen adalah dengan poin-poin aksesibilitas website cukup banyak yang overlapping dengan SEO. Dengan demikian, dengan menerapkan website inklusif berarti juga mendongkrak SEO score website tersebut.

Bulan depan, Suarise membahas cara dan tools-tools apa saja yang bisa membantu untuk mengecek tingkat aksesibilitas website yang sudah dibuat. Stay tune ya!

Lebih jauh tentang aksesibilitas website, silakan telusuri tautan berikut ini:

Artikel ini adalah bagian dari upaya Suarise untuk membangun ekosistem digital di Indonesia menjadi 100persenAksesibilitas. Untuk mengetahui lebih lanjut mengenai gerakan ini,

Ikuti tagar #BisaDiAkses di instagram dan akun instagram @tantanganAksesibilitas, 

Start Typing