Capaian Ke Standard Web ARIA & Kebolehan Aplikasi HTML
Teknologi web yang benar-benar terbuka dan inklusif yang membolehkan pengguna kurang upaya bergantung kepada teknologi bantuan untuk menikmati kandungan web yang dinamik dan aplikasi web moden. Standard web aksesibiliti W3C bertujuan menampung web dengan Aplikasi Internet Kaya Kaya (ARIA) yang pengguna kurang upaya dapat menggunakan dengan cekap.
ARIA adalah salah satu daripada piawaian dan garis panduan kebolehaksesan yang diterbitkan oleh Web Accessibility Intitiative (WAI). Ia menyediakan markup tambahan yang boleh dimasukkan dengan mudah ke dalam dokumen HTML. WAI-ARIA adalah penyelesaian rentas peranti merentas platform yang mensasarkan Platform Web Terbuka, jadi jangan hanya berfikir tentang laman web, tetapi juga tentang permainan, hiburan digital, penjagaan kesihatan, mudah alih dan jenis aplikasi lain.
Dalam catatan ini, kami akan melihat bagaimana anda boleh menambah akses kepada dokumen HTML anda dengan bantuan piawai WAI-ARIA.
Rangka Kerja ARIA
Sintaks HTML tidak selalu membenarkan pemaju untuk menerangkan elemen dengan betul, untuk mengenal pasti peranan mereka, dan menentukan hubungan di antara mereka. Walaupun itu jarang menjadi masalah bagi pelawat yang memiliki sepenuhnya deria mereka, ia boleh menghalang pengguna teknologi bantuan dari memahami apa yang berlaku di skrin dan meneroka pilihan mereka.
Ini adalah titik di mana ARIA datang untuk membantu kami, kerana ia memungkinkan untuk menentukan tujuan unsur-unsur yang berbeza dengan bantuan peranan penting, dan menggambarkan sifat mereka dengan atribut atribut aria. Atribut atribut Aria mempunyai dua jenis: hartanah yang menggambarkan ciri-ciri yang cenderung tidak berubah sepanjang kitaran hayat halaman, dan negeri yang memberi maklumat mengenai perkara yang mungkin berubah kerana interaksi pengguna.
Peranan Landmark
Peranan landasan adalah bentuk Peranan ARIA yang paling terkenal (yang lain adalah Peranan Abstrak, Peranan Widget, dan Peranan Struktur Dokumen). Peranan landasan membolehkan pemaju mengenal pasti besar kawasan yang boleh dibayangkan di laman web yang pengguna teknologi bantuan mungkin ingin mengakses dengan cepat.
Terdapat 8 jenis peranan mercu tanda ARIA, dan mereka perlu ditambahkan sebagai atribut kepada tag HTML yang berkaitan.
peranan =”sepanduk”
Peranan sepanduk bertujuan untuk digunakan terutamanya untuk kandungan yang berkaitan dengan seluruh tapak, bukan hanya untuk halaman individu. Ia biasanya ditambah sebagai atribut ke tajuk utama tapak untuk logo dan maklumat penting laman web yang penting. Adalah penting bahawa anda boleh menggunakan peranan banner hanya sekali dalam sebarang dokumen atau aplikasi HTML.
peranan =”utama”
Peranan utama merujuk kepada kandungan utama dokumen. Ia tidak boleh digunakan lebih daripada sekali pada mana-mana halaman HTML. Ia biasanya mengikuti Peranan navigasi bertujuan untuk digunakan untuk menunjukkan kawasan yang mengandungi elemen navigasi seperti pautan dan senarai pada tapak. Peranan penting pelengkap menggambarkan kandungan tambahan yang berkaitan dengan kandungan utama laman web ini. Ia perlu diletakkan ke tahap yang sama dalam hierarki DOM sebagai Peranan contentinfo memberitahu ejen pengguna tentang kehadiran rantau di mana pelbagai jenis metadata, seperti maklumat hak cipta, pernyataan undang-undang dan privasi boleh didapati. Ia biasanya digunakan untuk tapak tapak. Peranan mercu bentuk menunjukkan satu bentuk menunggu input pengguna. Untuk borang carian yang perlu anda gunakan Peranan carian cukup jelas, ini bertujuan untuk membantu teknologi bantuan mengenal pasti fungsi pencarian laman web. Anda boleh menggunakan peranan mercu tanda aplikasi untuk rantau yang anda mahu mengisytiharkan sebagai aplikasi web, bukannya dokumen web. Ia tidak disyorkan untuk memasukkannya ke dalam laman web tradisional, kerana ia memberi petunjuk kepada teknologi bantuan untuk bertukar dari mod penyemakan biasa ke mod penyemakan imbas. Anda hanya perlu menggunakan peranan penting ini dengan berhati-hati. Walaupun peranan membolehkan anda menentukan maksud tag HTML, negeri dan sifat memberikan pengguna maklumat tambahan tentang cara berinteraksi dengan mereka. Kedua-dua negeri dan hartanah ditandakan dengan atribut atribut aria dengan sintaks aria- *. Atribut ARIA yang paling terkenal mungkin adalah harta yang diperlukan oleh aria dan keadaan yang diperiksa aria. Aria yang diperlukan adalah a harta kerana ia merupakan ciri kekal elemen input (iaitu pengguna mesti mengisinya), sementara pemeriksaan aria adalah negeri kerana kotak semak sering menukar nilainya disebabkan oleh interaksi pengguna. Negeri-negeri dan hartanah kadang-kadang mengambil nilai-nilai token (satu set nilai-nilai yang telah ditentukan sebelumnya), contohnya harta aria-hidup boleh mempunyai 3 nilai yang berbeza: off, sopan, tegas. Sintaks dalam contoh ini kelihatan seperti ini: Dalam kes lain, nilai-nilai atribut prefix aria diwakili oleh tali, nombor, integer, Rujukan ID atau betul salah nilai-nilai. Gunakan atribut hubungan untuk menunjukkan hubungan antara unsur-unsur yang berlainan di laman web anda, yang tidak dapat ditentukan dari struktur dokumen. Contohnya Selepas anda menetapkan peranan mercu tanda ARIA untuk kawasan yang dapat dibayangkan pada halaman HTML anda, ia boleh membantu banyak teknologi bantuan jika anda mengubah keadaan prefix ARIA dan sifat unsur kanak-kanak mengikut peristiwa yang berlaku di skrin. Ini boleh menjadi penting di mana pengguna perlu berinteraksi dengan laman web ini, contohnya mengisi borang atau menjalankan pertanyaan carian. Peraturan umum mengenai reka bentuk aksesibiliti adalah keadaan semasa antara muka pengguna yang sentiasa perlu dilihat oleh teknologi bantuan. Sebagai contoh jika pengguna memilih pilihan dalam bentuk, ia perlu muncul dipilih untuk teknologi bantuan juga. Ini dapat dengan mudah dicapai dengan menggunakan keadaan yang dipilih oleh aria dengan sintaks berikut: Tuntutan Praktik Wai-ARIA W3C's W3C boleh memberi anda banyak idea hebat lain tentang bagaimana untuk mengharmonikan visual dan antara muka yang dapat diakses dari tapak anda. Menggunakan peranan dan atribut ARIA kadangkala boleh berlebihan. Apabila anda menggunakan tag semantik HTML5 seperti Sebagai contoh, tidak perlu menggunakannya borang peranan penting untuk menentukan Jadi, jika anda telah menambah tersembunyi Atribut HTML pada input borang, tidak perlu untuk menambah aria-hidden nyatakan, kerana pelayar menyertakannya secara lalai.. Yang terakhir telah ditambahkan kepada spesifikasi W3C dengan tujuan pemetaan utama Peranan penting ARIA kepada elemen HTML semantik.
peranan =”navigasi”
peranan =”pelengkap”
peranan = "utama"
. Jawatan yang berkaitan, artikel popular, komen terkini adalah contoh tipikal kandungan pelengkap autonomi.peranan =”contentinfo”
peranan =”borang”
peranan = "carian"
sebaliknya.peranan =”carian”
peranan =”permohonan”
Negeri dan Hartanah
Sintaks Aria-prefixed Atribut
Cara Membuat Penggunaan Negara dan Hartanah ARIA
1. Membina Hubungan Antara Elemen Dengan Sifat Hubungan
aria-labelledby
harta mengenal pasti unsur yang menandakan unsur semasa.aria-labelledby
- antara banyak perkara lain - boleh mengikat tajuk ke ARIA mercu tanda dengan cara berikut:Ini Adakah Tajuk A
Kandungan utama… 2. Menyegerakkan Negeri dan Hartanah Dengan Siklus Hidup Elemen
3. Padankan Antara Muka Visual dan Yang Dapat Dihubungi
.
Jangan terlalu banyak menggunakan ARIA
atau
, pelayar web moden menambah semantik ARIA yang sesuai secara lalai. Dalam kes ini tidak masuk akal untuk menetapkan peranan mercu ARIA secara berasingan.
elemen. Sebaliknya
sintaks ia cukup sempurna untuk digunakan hanya
. Ia juga berguna untuk menggunakan atribut asli HTML bersama dengan atribut ARIA yang sesuai.