Cara Membuat Pengalaman Pasca-Klik Anda Dapat Diakses oleh Semua Orang dengan Mengikuti Standar Kepatuhan ADA & WCAG

Diterbitkan: 2020-03-30

Saat membuat halaman arahan pasca-klik, berapa banyak pengiklan yang berpikir tentang aksesibilitas web?

Jika ini pertama kalinya Anda memikirkan aksesibilitas, kemungkinan Anda telah kehilangan konversi. Faktanya adalah bahwa satu dari lima pengguna online memerlukan akomodasi untuk menggunakan halaman web. Statistik dari CDC dan Yayasan Epilepsi ini menekankan perlunya halaman arahan pasca-klik agar dapat diakses oleh semua orang:

Statistik disabilitas kepatuhan ADA

Memastikan halaman pasca-klik Anda sesuai dengan ADA dan WCAG adalah cara untuk memastikan aksesibilitas ke semua orang.

Dalam posting hari ini, kami mengeksplorasi apa yang dimaksud dengan kepatuhan ADA dan WCAG dan mengapa penting bagi pengiklan untuk menerapkan standar aksesibilitas ini di halaman mereka.

Apa yang dimaksud dengan kepatuhan ADA online?

Undang-Undang Penyandang Disabilitas Amerika (ADA) dilembagakan pada tahun 1990 dalam upaya untuk mengakhiri diskriminasi berdasarkan kemampuan yang berbeda. Persyaratan khusus untuk memenuhi kepatuhan cenderung agak kabur dan membingungkan karena ADA tidak secara eksplisit membahas kepatuhan online.

Namun, seseorang dapat melihat ke pedoman paling komprehensif untuk membangun dan memelihara situs web yang dapat diakses untuk panduan — Pedoman Aksesibilitas Konten Web (WCAG), yang diterbitkan oleh W3C.

Apa itu WCAG?

WCAG adalah pedoman yang memastikan setiap halaman web dapat diakses oleh orang-orang dengan beragam pendengaran, gerakan, penglihatan, dan kemampuan kognitif.

Aksesibilitas web mencakup pembuatan situs web, alat, dan teknologi sehingga penyandang disabilitas dapat menggunakannya. Lebih khusus, pengunjung dapat melihat, memahami, menavigasi, dan berinteraksi dengan halaman dan berkontribusi ke halaman.

WCAG memiliki tiga versi:

  • WCAG 1.0 dirancang pada tahun 1999
  • WCAG 2.0 diterbitkan pada tahun 2008
  • WCAG 2.1 dibuat pada Juni 2018

Versi 2.1 mencakup 17 kriteria keberhasilan baru (lebih lanjut tentang itu di bawah) di mana masalah Aksesibilitas dikategorikan ke dalam empat kelompok berbeda di bawah pedoman WCAG. Masalah-masalah ini dapat diringkas dengan akronim POUR:

  • Dapat dilihat: Dapatkah semua pengguna melihat konten di halaman?
  • Dapat dioperasikan: Bisakah semua pengguna berinteraksi dengan halaman?
  • Dapat dimengerti: Bisakah semua pengguna memahami konten di halaman?
  • Kuat: Dapatkah konten ditafsirkan oleh berbagai macam program dan perangkat, termasuk pembaca layar?

Pedoman WCAG memecah masalah aksesibilitas dan rekomendasi menjadi tiga tingkatan:

  • Level A: Ini adalah level yang paling mendesak dan mencakup masalah yang dapat sangat membatasi kemampuan pengunjung yang dinonaktifkan untuk menavigasi atau menggunakan halaman.
  • Level AA: Level ini dianggap sebagai standar untuk sebagian besar situs web komersial. Ini membahas area di mana peningkatan diperlukan untuk memberi pengguna yang dinonaktifkan pengalaman penuh dari halaman web.
  • Level AAA: Ini adalah standar tertinggi, termasuk penyesuaian pada masalah yang ditangani oleh level A dan AAA. Namun, kepatuhan AAA kemungkinan berada di luar jangkauan sebagian besar halaman web.

Bagaimana Anda bisa membuat halaman arahan pasca-klik Anda dapat diakses?

Berikut adalah sembilan cara untuk memastikan halaman pasca-klik Anda memenuhi standar aksesibilitas:

1. Buat halaman Anda ramah keyboard: Pengunjung harus dapat menavigasi halaman pasca-klik Anda meskipun mereka tidak memiliki mouse, hanya menggunakan tombol 'Tab' keyboard. Melakukan hal ini membantu audiens yang menggunakan teknologi bantu untuk menavigasi dan menggulir halaman dan mengklik tombol CTA.

2. Jadikan semua konten dapat diakses: Banyak halaman pasca-klik menggunakan konten dinamis — konten yang berubah berdasarkan tag yang telah ditentukan. Ini bisa menjadi masalah jika halaman tidak menginformasikan alat bantu tentang perubahan karena banyak pembaca layar hanya akan "membaca" konten halaman seperti yang muncul saat pertama kali dimuat. Saat menggunakan konten dinamis, pastikan untuk menandai konten dinamis sebagai wilayah langsung, ini memungkinkan pembaca layar dan perangkat serupa untuk memahami konten saat berubah.

3. Sertakan teks Alt dengan semua gambar: Menambahkan teks alternatif ke gambar menjamin bahwa teks muncul sebagai pengganti gambar jika gagal memuat, mendeskripsikan, dan memberi konteks tentang gambar.

4. Tambahkan kontras ke halaman: Ini adalah langkah yang diperlukan untuk memastikan salinan dan semua elemen halaman menonjol dari latar belakang dan dapat dilihat oleh pengguna dengan disabilitas visual. Idealnya, Anda harus mengatur warna gelap dengan warna terang, memastikan bahwa mereka tidak menyatu satu sama lain:

Kontras warna aksesibilitas kepatuhan ADA

5. Gunakan header untuk menyusun konten: H1, H2, dan H3 membantu menyusun salinan Anda dan memudahkan pengguna untuk menafsirkannya.

6. Beri label pada bidang formulir: Konfirmasikan bahwa setiap bidang formulir di halaman Anda diberi label dengan jelas karena ini memungkinkan pengguna dengan pembaca layar untuk memahami bagaimana mereka dapat mengisi formulir. Halaman Amplitudo menampilkan bidang formulir berlabel:

Label bidang formulir aksesibilitas kepatuhan ADA

7. Buat halaman responsif: Halaman responsif memformat ulang dan menyusun ulang pada perangkat apa pun terlepas dari ukuran layar. Skala halaman dari layar ponsel, tablet, dan laptop kecil yang lebih kecil, hingga layar desktop standar dan bahkan monitor layar lebar yang lebih besar — ​​semuanya sambil menawarkan fleksibilitas dan kegunaan yang luar biasa bagi pengguna di semua perangkat.

8. Hindari pemutaran otomatis media dan penggeser: Pemutaran otomatis video dapat membuat frustrasi pengguna yang menggunakan pembaca layar karena sulit untuk membisukan atau menjedanya. Demikian pula, slider dan carousel dapat menyebabkan pengguna memiliki masalah dengan pemahaman.

9. Buat salinan yang dapat diakses: Jauhi akronim dan jargon teknis sehingga semua pengguna memahami apa yang Anda tawarkan.

Bagaimana Anda dapat memeriksa apakah halaman Anda sesuai dengan ADA dan WCAG?

Banyak sumber daya online memungkinkan Anda untuk memeriksa apakah halaman Anda sesuai. Yang diperlukan hanyalah memasukkan URL dan alamat email Anda.

Biro Aksesibilitas Internet

BOIA memungkinkan pengiklan untuk memeriksa apakah halaman mereka sesuai dengan standar aksesibilitas:

Kepatuhan ADA BoIA

AudioMata

AudioEye memindai halaman Anda secara gratis dan melihat bagaimana ukurannya dalam hal aksesibilitas:

Kepatuhan ADA AudioEye

Perbaikan situs

Siteimprove memeriksa aksesibilitas halaman Anda dan menyediakan pengujian otomatis yang mematuhi standar WCAG:

Peningkatan kepatuhan ADA Situs

Anda juga dapat mengunduh ekstensi Chrome berikut untuk memeriksa aksesibilitas.

Alat evaluasi gelombang

Alat evaluasi Wave memberikan umpan balik visual tentang aksesibilitas konten web Anda dengan menyuntikkan ikon dan indikator ke halaman Anda. Ini memfasilitasi evaluasi manusia dan mendidik tentang masalah aksesibilitas. Alat ini memberikan detail tentang sejumlah masalah, elemen struktural, kesalahan kontras, peringatan, dan teks alternatif:

Evaluasi gelombang kepatuhan ADA

Cara Pengguna

Pengiklan dapat mengunduh widget UserWay untuk menilai solusi aksesibilitas halaman tanpa memfaktorkan ulang kode yang ada – memastikan kerangka kerja kepatuhan hukum dan peraturan yang komprehensif yang mencakup ADA, Bagian 508, dan WCAG 2.1 AA.

Widget tersedia untuk semua platform CMS terkemuka serta situs HTML/CSS/JS biasa. Alat ini menawarkan fitur aksesibilitas penting dan berbagai pilihan fungsi yang dapat dipadukan dan dicocokkan pengguna untuk memenuhi kebutuhan aksesibilitas individual mereka:

Aksesibilitas kepatuhan ADA UserWay

Round Table Pizza menampilkan widget UserWay untuk memastikan aksesibilitas. Pertama, dengan garis panduan membaca, lalu membalik warna di layar:

Panduan membaca Meja Bundar kepatuhan ADA

Kontras warna Meja Bundar kepatuhan ADA

ChromeVox

ChromeVox adalah pembaca layar yang menghadirkan kecepatan, kesederhanaan, dan keamanan Chromebook bagi pengguna dengan gangguan penglihatan. ChromeVox sudah terpasang sebelumnya di Chromebook, tetapi dapat diunduh sebagai ekstensi.

Ekstensi menyoroti setiap bagian halaman dan membacanya dengan keras untuk pengguna:

Contoh ChromeVox kepatuhan ADA

Apa yang dapat Anda lakukan di Instapage untuk memenuhi kepatuhan

Instapage merekomendasikan dan memfasilitasi semua pengguna untuk mematuhi standar aksesibilitas situs web dan membuat halaman yang disesuaikan untuk semua audiens. Ini termasuk:

  • Memberikan pengguna cara mudah untuk menambahkan teks alternatif gambar ke semua gambar halaman
  • Membuat halaman keyboard dapat diakses
  • Mengizinkan pembaca layar mengenali semua input formulir dan tombol kirim
  • Menambahkan tag HTML yang sesuai
  • Menambahkan atribut bahasa ke halaman dengan mengirimkan permintaan ke tim dukungan

Menetapkan bahasa halaman dengan atribut lang adalah persyaratan WCAG, dan dengan melakukan itu menguntungkan pengguna dalam dua cara:

  1. memungkinkan layanan terjemahan seperti Google Chrome berfungsi dengan benar
  2. atribut memberi tahu pembaca layar cara mengucapkan konten halaman dengan benar

Jadikan halaman pasca-klik Anda dapat diakses oleh semua orang

Untuk menjamin bahwa semua pengguna yang mengunjungi halaman pasca-klik Anda memiliki kesempatan yang sama untuk berkonversi, penting agar halaman dapat diakses oleh semua orang.

Untuk mempelajari lebih lanjut tentang membuat halaman arahan pasca-klik yang dapat diakses dan dipersonalisasi dalam skala besar, minta demo Instapage Enterprise hari ini.