Tips Pengujian Aksesibilitas DIY untuk WordPress

Di dunia sekarang ini, nama permainannya adalah inklusi. Dan sementara aksesibilitas web bukanlah konsep baru, dalam beberapa tahun terakhir aksesibilitas web menjadi lebih mudah diakses dengan sendirinya.

Pada intinya, aksesibilitas web adalah praktik mendesain dan membangun situs web agar berfungsi bagi sebanyak mungkin pengguna. Pengguna tunanetra akan berinteraksi dengan situs web secara berbeda dari pengguna tunanetra, atau buta warna, atau seseorang dengan gangguan keterampilan motorik.

Awalnya dirilis sebagai versi 2.0 pada tahun 2008 dan dikembangkan oleh World Wide Web Consortium (W3C), Pedoman Aksesibilitas Konten Web (WCAG) adalah standar emas untuk aksesibilitas web. Versi saat ini, WCAG 2.1, menguraikan praktik terbaik di ruang aksesibilitas web dalam 4 kategori berbeda: dapat dipahami, dapat dioperasikan, dapat dipahami, dan kuat. Diperkirakan bahwa versi berikutnya, 2.2, akan dirilis pada akhir tahun 2022 untuk lebih mendefinisikan pedoman yang ada dan menambahkan beberapa pedoman baru.

Selain itu, aksesibilitas tertanam dalam komunitas WordPress, dan mereka berkomitmen untuk memasukkan praktik terbaik aksesibilitas dalam perangkat lunak itu sendiri. Beberapa pengembang WordPress bahkan melampaui tema dan plugin mereka. Misalnya, tema Total WPExplorer sendiri menjaga aksesibilitas di garis depan, sedemikian rupa sehingga pengembang AJ sering membuat peningkatan aksesibilitas reguler sendiri.

Aksesibilitas WordPress sangat penting dan tidak sesulit dinavigasi seperti dulu. Saat mengerjakan proyek desain ulang situs web, atau bahkan hanya menambahkan fitur baru ke situs web Anda yang sudah ada, berikut adalah beberapa item yang perlu dipertimbangkan selama proses desain dan pembuatan yang akan membantu situs Anda sesuai dengan standar aksesibilitas saat ini.

Desain dan Pembuatan Awal

Standar aksesibilitas web harus dipertimbangkan selama durasi proyek WordPress. Meskipun proses pengujian pasca-pembuatan kemungkinan akan menangkap kesalahan apa pun yang terlewatkan dalam pembangunan awal, selalu yang terbaik adalah membangun situs sebersih mungkin untuk pertama kalinya. Dalam fase proyek situs web Anda, pertimbangkan hal berikut:

Kontras Warna

Salah satu elemen web termudah untuk menguji aksesibilitas adalah warna. WCAG 2.1 menetapkan rasio kontras warna tertentu untuk 2 warna apa pun di situs web (latar depan dan latar belakang). Rasio kontras setidaknya harus 4,5:1 untuk teks berukuran normal (di bawah 18pt) dan 3:1 untuk teks yang lebih besar (18pt dan lebih tinggi).

Tapi bagaimana Anda tahu apa rasio kontras warna? WebAim, pemimpin tepercaya dalam aksesibilitas web selama lebih dari 20 tahun, telah menciptakan alat yang hebat untuk memeriksa rasio kontras warna warna Anda. Tambahkan kode hex warna latar depan dan kode hex latar belakang dan alat akan menghitung rasio kontras. Jika rasionya tidak cukup tinggi, nilai setiap warna dapat disesuaikan melalui penggeser untuk membantu menentukan kombinasi yang lewat dalam cerita warna yang sama.

Untungnya, mengubah dan bereksperimen dengan pilihan warna yang berbeda di situs web Anda adalah proses yang relatif sederhana. Pembuat Gutenberg asli WordPress memungkinkan Anda untuk dengan mudah mengubah warna seluruh blok konten atau secara khusus menargetkan sejumlah kata tertentu. Anda juga dapat melakukan penyesuaian di panel tema untuk melakukan pengeditan warna global.

Warna mundur

Saat ini, sebagian besar situs dirancang dengan banyak citra. Namun karena berbagai alasan, beberapa pengguna mungkin menonaktifkan gambar atau gaya di situs Anda untuk mendapatkan informasi yang mereka butuhkan dengan lebih cepat atau lebih mudah.

Bayangkan Anda memiliki panel dengan gambar besar dan teks putih di atasnya. Saat gambar dimatikan di browser web, latar belakang situs secara default menjadi putih. Teks putih itu sekarang tidak terlihat di latar belakang putih. Bagaimana jika itu adalah konten penting, seperti ajakan bertindak atau proposisi nilai?

Untuk mengatasi masalah ini, pastikan untuk menambahkan warna mundur ke semua panel di situs Anda dengan teks di atas gambar. Pada contoh sebelumnya, mengubah warna mundur panel itu menjadi hitam akan menyelesaikan masalah, teks putih akan terlihat. Jika Anda tidak yakin warna apa yang akan digunakan sebagai warna mundur, alat kontras warna Web Aim adalah panduan yang bagus.

Beberapa Opsi Navigasi

Desain menu yang bagus bisa menjadi fitur yang menonjol di sebuah situs, tetapi juga penting untuk menyertakan beberapa opsi navigasi. Beberapa pengguna mungkin dapat menemukan informasi yang mereka cari lebih cepat jika navigasi situs disajikan dengan cara lain.

Peta situs yang ditautkan di footer situs web bisa menjadi solusi yang bagus. Ini memungkinkan pengguna untuk melihat semua halaman yang tersedia di satu area dan dapat meningkatkan pengalaman pengguna mereka. Plugin Halaman Peta Situs WP adalah opsi yang solid untuk dengan mudah menambahkan peta situs sederhana yang dapat mencantumkan halaman, posting blog, studi kasus, item portofolio, dan banyak lagi.

Pilihan lain adalah menambahkan fungsi pencarian ke situs Anda sehingga pengguna dapat dengan cepat mencari situs lengkap Anda untuk kata kunci atau frasa tertentu. Secara default WordPress menyertakan widget pencarian dasar yang dapat Anda gunakan di sidebar atau footer Anda, tetapi ada juga blok pencarian di dalam Gutenberg (juga sebagian besar pembuat halaman lainnya) dan seringkali pengembang tema akan membuat kotak pencarian atau ikon ke dalam header tema. Plus, Anda dapat menyesuaikan dan meningkatkan fungsionalitas pencarian WordPress dengan berbagai plugin yang bermanfaat.

Formulir Umpan Balik Aksesibilitas

Footer situs web Anda juga idealnya menautkan ke formulir umpan balik aksesibilitas. Bahkan jika Anda mengambil langkah aksesibilitas sebanyak mungkin, selalu ada ruang untuk peningkatan seiring dengan berkembangnya pedoman dan teknologi untuk mengakomodasi pengguna dengan lebih baik.

Menyertakan halaman dengan formulir umpan balik aksesibilitas memungkinkan pengguna Anda untuk mengirimkan komentar atau kekhawatiran tambahan mengenai aksesibilitas situs web Anda jika ada sesuatu yang hilang dan membatasi kunjungan mereka (ingatlah untuk menggunakan formulir WordPress yang dapat diakses). Ini juga membuat mereka tahu bahwa Anda peduli dengan pengalaman web mereka. Anda kemudian dapat menggunakan umpan balik ini untuk meningkatkan situs Anda bagi pengguna tersebut dan pengguna masa depan yang membutuhkan akomodasi serupa. Mendengarkan komunitas dan menyesuaikan diri saat dibutuhkan adalah bagian penting dari proses.

Proses Pengujian Pasca-Pembuatan

Setelah sebagian besar situs Anda dibuat, saatnya untuk memulai putaran pengujian aksesibilitas yang lebih mendalam. Ini harus mencakup pengujian otomatis dan pengujian manual. Pengujian otomatis adalah sumber daya dan penghemat waktu yang hebat untuk menangkap masalah tertentu. Namun, aksesibilitas adalah masalah berbasis manusia dan AI tidak mampu mengenali semua nuansa yang ada. Oleh karena itu, sama pentingnya untuk menguji elemen tertentu dari situs dengan tangan.

Pengujian Otomatis

Ada berbagai alat pengujian otomatis yang hebat untuk mendorong alur kerja aksesibilitas yang lancar. Penting untuk diingat bahwa lulus pengujian otomatis tidak cukup untuk membuat situs dapat diakses, tetapi ini adalah titik awal yang bagus.

Untuk melihat sekilas apakah situs Anda melewati standar aksesibilitas dasar, alat WAVE adalah kumpulan alat evaluasi otomatis yang pada dasarnya memindai halaman web dan melaporkan kegagalan WCAG dan item yang memerlukan penyelidikan tambahan. Dengan bantuan ekstensi browser, alat WAVE akan menunjukkan kegagalan aksesibilitas yang jelas dengan warna merah. Mereka dibagi menjadi kesalahan dan kesalahan kontras. Kesalahan biasanya terkait dengan pengkodean situs Anda. Kesalahan kontras disebabkan ketika skema warna Anda gagal standar kontras (diulas sebelumnya dalam artikel).

Setelah Anda siap untuk mengatasi kesalahan kontras di situs Anda, ada opsi plugin seperti Equalize Digital Accessibility Checker yang dapat menyederhanakan proses penyesuaian di bagian belakang situs Anda. Versi gratis dari plugin akan secara otomatis memeriksa halaman dan posting dasar untuk melaporkan kesalahan reguler dan kesalahan kontras pada setiap halaman. Memutakhirkan ke versi pro memungkinkan pemindaian jenis kiriman khusus. Plugin memudahkan untuk mengidentifikasi kesalahan dalam kode dan membuat perubahan sesuai kebutuhan.

Pengujian Manual

Seperti disebutkan, ada batasan dalam alat saat ini dan proses hukum yang tersedia untuk pengujian otomatis. Alat WAVE dan Equalize Checker adalah sumber yang bagus untuk pemindaian otomatis dan dapat menghemat banyak waktu. Tetapi AI yang diciptakan manusia tidak memerlukan akomodasi yang sama dengan pengguna manusia yang cacat.

Penting untuk meninjau situs secara manual dan menggunakan beberapa alat yang mungkin digunakan oleh pengguna yang dinonaktifkan untuk melihat apakah navigasi dan pengumpulan informasi dimungkinkan. Beberapa aspek yang harus diperiksa secara manual termasuk kemampuan zoom halaman, navigasi keyboard, pembaca layar, dan teks alternatif.

Pengujian zoom halaman harus memeriksa untuk melihat apakah halaman dapat diperbesar hingga 200% tanpa kehilangan konten atau fungsionalitas apa pun. Ini harus dimungkinkan hanya dengan menggunakan kemampuan zoom asli browser dan tidak ada teknologi bantu lainnya. Anda juga ingin memastikan memperbesar tidak mengharuskan pengguna untuk menggulir di kedua arah (atas-bawah dan kiri-kanan).

Beberapa pengguna tidak dapat (atau memilih untuk tidak) menggunakan mouse untuk menavigasi situs web. Mereka malah akan menggunakan keyboard untuk menavigasi, sering menggunakan tombol TAB dan beberapa tombol lain untuk berpindah antar elemen. Untuk pengujian navigasi keyboard , Anda harus memastikan bahwa elemen interaktif di situs Anda memiliki garis fokus yang terlihat saat keyboard menargetkan elemen tersebut. Periksa juga semua fitur hover untuk memastikan TAB mengungkapkan konten tersembunyi apa pun. Meskipun proses ini bisa menakutkan, mulailah dengan halaman utama Anda dan coba TAB melalui masing-masing halaman. Apakah Anda dapat mengakses semua konten dan tautan dengan benar?

Pengujian pembaca layar bisa menjadi yang paling sulit karena teknologinya lebih khusus. Cara terbaik untuk memeriksa aksesibilitas situs Anda untuk pengguna pembaca layar adalah dengan benar-benar menjalankan situs Anda dengan pembaca layar. Apakah hierarki halaman web Anda jelas? Apakah Anda menggunakan tajuk dengan benar dan menunjukkan elemen tertentu yang diperlukan untuk pembaca layar?

Pengujian manual dapat memakan waktu dan sulit untuk memastikan situs Anda dapat diakses oleh semua alat bantu yang tersedia untuk digunakan. Namun, ini adalah langkah yang sangat penting karena akomodasi ini akan diabaikan.

Di dunia saat ini, inklusivitas adalah kebijakan terbaik. Situs web yang dapat diakses berarti lebih banyak pengunjung dapat memperoleh informasi tentang perusahaan Anda dan berpotensi menjangkau. Meskipun belum ada persyaratan situs web khusus yang sesuai dengan ADA, jika beberapa pengguna tidak dapat mengakses informasi di situs web Anda yang mereka butuhkan untuk mengambil langkah selanjutnya, Anda kehilangan calon pelanggan atau klien.

Gunakan informasi yang disajikan dalam artikel ini sebagai titik awal untuk perjalanan aksesibilitas Anda. Ingatlah bahwa aksesibilitas web adalah proses berkelanjutan karena standar dan pedoman sering diperbarui untuk melayani komunitas dengan lebih baik. Dekati dunia ini dengan pikiran terbuka dan pemahaman bahwa itu mungkin bukan proses yang terbuka dan tertutup. Pada akhirnya, ini semua tentang meningkatkan pengalaman pengguna untuk semua pengguna Anda.