Designing for Accessibility in UI/UX

Ammar Hisyam Fakhrudin
4 min readFeb 23, 2023

--

photo by freepik

Hal ini terpikir ketika lagi research mengenai website pendidikan inklusif di masa yang akan datang nanti tuh gimana sih? sehingga rasa penasaran tumbuh buat ngulik mengenai bagaimana desain UI/UX dapat diakses oleh pengguna dengan berbagai kebutuhan dan tantangan aksesibilitas, dan bagaimana desainer dapat mengoptimalkan desain mereka untuk memastikan aksesibilitas mereka?

Sebelum ngebahas mengenai aksesibilitas sendiri, desain inklusif ada beberapa perspektif loh mulai dari adil (equitable), dapat digunakan (usable), mudah diakses (accessible), dan etis (ethical). aksesibilitas sendiri merupakan bagian penting dari bagian dari inklusi, namun hal tersebut hanya satu aspek saja. Dalam konteks ini, aksesibilitas berperan sebagai fitur yang dapat meningkatkan pengalaman pengguna yang dapat diakses oleh semua orang.

oke mari kita bahas terlebih dahulu dari segi definisi. Aksesibilitas adalah aspek penting dalam desain UI/UX yang memastikan produk, layanan, dan teknologi dapat digunakan oleh orang dengan disabilitas atau kebutuhan khusus. Penting bagi desainer untuk memprioritaskan aksesibilitas untuk memastikan bahwa semua orang dapat mengakses dan menggunakan produk dan layanan mereka.

Merancang produk dan layanan yang dapat diakses oleh semua orang penting karena aksesibilitas adalah hak yang dijamin oleh hukum di beberapa negara. Selain itu, desain yang ramah aksesibilitas dapat memperluas basis pelanggan, membantu pengguna dengan kebutuhan khusus, dan mengurangi kecenderungan diskriminasi.

Terlebih lagi, memprioritaskan aksesibilitas dalam desain UI/UX dapat memberikan manfaat tambahan dalam bentuk peningkatan SEO dan kemampuan pencarian, serta pengurangan biaya dan waktu yang dibutuhkan untuk perbaikan dan perubahan pada desain di masa depan.

Hal apa saja sih yang perlu dipertimbangan ketika kita sedang merancang untuk Aksesibilitas pada UI/UX? Oke, mari kita jabarkan.

  1. Pertimbangkan Kebutuhan Pengguna dengan Berbagai Kondisi

Pertimbangkan kebutuhan pengguna dengan berbagai kondisi seperti dari segi penglihatan, pendengaran, motorik, dan kognitif. Pahami dan cari tahu kebutuhan spesifik pengguna untuk menentukan bagaimana desain dapat menyesuaikan dengan kondisi mereka.

photo by https://webaim.org

2. Gunakan Kontras Warna yang Tepat

Pastikan kontras warna yang digunakan dalam desain memadai untuk memungkinkan pengguna dengan gangguan penglihatan dapat membaca dan melihat dengan jelas. Hindari penggunaan warna yang sangat pucat atau terlalu cerah yang dapat membuat teks sulit dibaca. bagaimana kita mengecek kontras warna yang tepat? gunakan color checker setiap desain yang kamu gunakan dan sesuai panduan Aksesibilitas Konten Web (WCAG).

Apa yang dimaksud dari WCAG? mereka merupakan bagian dari serangkaian panduan aksesibilitas web yang diterbitkan oleh Web Accessibility Initiative (WAI) dari World Wide Web Consortium (W3C), organisasi standar internasional utama untuk Internet. Mereka adalah serangkaian rekomendasi untuk membuat konten Web lebih mudah diakses, terutama untuk penyandang disabilitas.

Bagaimana cara mengecek warna yang kamu gunakan sudah sesuai dengan WCAG? kamu bisa kunjungi beberapa website tersebut

a.) https://coolors.co/contrast-checker/112a46-acc8e5

b.) https://contrastchecker.com/

c.) https://accessibleweb.com/color-contrast-checker/

3. Gunakan Teks yang Jelas dan Mudah Dibaca

Gunakan font yang mudah dibaca dengan ukuran yang cukup besar dan jarak antar huruf dan baris yang cukup. Jangan menggunakan font yang rumit atau sulit dibaca, serta hindari penggunaan font berukuran kecil yang tidak mudah dibaca oleh pengguna dengan kebutuhan khusus. Kustomisasi ukuran dan font juga termasuk menerapkan nilai aksesibilitas loh. Contoh ini diterapkan sama sebuah platform discord yang sangat menarik

Discord Settings

4. Berikan Alternatif untuk Media Non-Teks

Pastikan bahwa pengguna dengan gangguan pendengaran atau kebutuhan khusus lainnya dapat mengakses informasi pada media non-teks seperti gambar, video, atau audio. Berikan deskripsi dan alternatif teks yang jelas dan mudah dipahami. Hal ini juga diterapkan di twitter ketika kita ingin mengunggah sebuah gambar, maka kita menambahkan deskripsi pada gambar tersebut.

5. Pertimbangkan Aksesibilitas dengan Berbagai Perangkat

Pastikan bahwa desain Anda mudah diakses dan dapat digunakan dengan berbagai perangkat seperti komputer desktop, laptop, tablet, atau smartphone. Pastikan bahwa desain responsif dan mudah diakses pada layar dengan ukuran berbeda.

photo by interaction design foundation

tulisan ini bakal update trus seiring berjalanannya waktu! terima kasih telah membaca hingga selesai.

Referensi Sumber yang saya dapat :

--

--

Ammar Hisyam Fakhrudin

UI/UX designer dedicated to producing enjoyable, usable and captivating experiences.