Жеке парағыңыздағы қолданбаларды экранды оқырмандармен жұмыс жасаңыз

Автор: Monica Porter
Жасалған Күн: 13 Сапта Жүру 2021
Жаңарту Күні: 15 Мамыр 2024
Anonim
Жеке парағыңыздағы қолданбаларды экранды оқырмандармен жұмыс жасаңыз - Шығармашылық
Жеке парағыңыздағы қолданбаларды экранды оқырмандармен жұмыс жасаңыз - Шығармашылық

Бір беттік қолданбалар көріністі өзгерту туралы хабарлауға келгенде қол жетімділікке үлкен қиындық тудырады. Парақ жаңартылмаса, экран оқырмандары осы маңызды интерфейстік өзгерістерді қабылдамайды, бұл көру қабілеті нашар пайдаланушыларды шатастырады және білмейді.

Бір шешім - парақтың тақырыбына негізделген хабарлама құру және ARIA тірі аймағын жаңа көрініс жүктелгені туралы пайдалы хабарлама арқылы нақты хабарлау үшін пайдалану. Алдымен viewContent жаңартылған кезде шақырылатын функцияны жасаңыз. AngularJS осы мақсат үшін $ viewContentLoaded оқиғасын ұсынады. Контроллер кодында оқиғаны тыңдап, функцияны шақырыңыз (CoffeeScript-те):

app.controller ’PageController’, ($ ауқымы, $ орналасуы, $ http) -> $ ауқымы. $ on '$ viewContentLoaded ’, annunciation_view_loaded

Annunciation_view_loaded функциясында парақтың тақырыбын жаңартыңыз және хабарлама туралы хабарлаңыз. Бір парақты рамкалар бет атауын автоматты түрде жаңартпаса да, бет атауын ағымдағы көрініспен синхрондау қолданушылардың көріністі түсінуін жақсартады.


Мұның бір тәсілі - көрініс тақырыбын сақтау үшін көріністің бір жерінде деректер атрибутын пайдалану:

document.title = $ (’[data-viewtitle]’). data ’viewtitle’

Жаңартылған беттің атауын пайдаланып хабарлама жасаңыз және оны жариялаңыз:

$ .announce (document.title + ’, қарау жүктелген ')

$ .announce () - бұл мазмұнды жариялау үшін бір, көрінбейтін тірі аймақты қолданатын jQuery функциясы. Бұл тәсіл тірі аймақтарды уақытша қолданумен салыстырғанда кодты және күйін келтіру әрекеттерін жеңілдетуге көмектеседі. Дегенмен, есте сақтау керек бірнеше жақсы тәжірибелер бар.

Алдымен, өзіңіздің парағыңызда aria-live = «polite | assertive» көмегімен мазмұнды жариялау үшін жалғыз ‘диктор’ аймағын құрыңыз. Тікелей аймақ рөлдерін қоса, кез-келген басқа аймақтарды пайдаланбаңыз (мысалы, рөл = «ескерту | таймер | журнал»). Тірі аймақтың мысалы:

div aria-live = «polite» id = «e'lonшы»> (Мұнда қосылған немесе жаңартылған мәтін жарияланады) / div>

Екіншіден, мазмұн жаңартылғаннан кейін көп ұзамай тірі аймақтың мазмұнын тазалаңыз. Бұл пайдаланушылардың ескі хабарламаларға кедергі келтіруіне жол бермейді.


Сонымен, кез-келген қол жетімділік техникасында сияқты, $ .announce () -ді орынды қолданыңыз. Оны интерфейстің маңызды жаңартулары туралы хабарлау үшін ғана пайдалану керек.

Сөздер: Патрик Фокс

Патрик Фокс - Остиндегі Razorfish компаниясының Web UI технологиясының директоры. Бұл мақала бастапқыда нет журналдың 271 санында шыққан.

Ұнады ма? Оларды оқыңыз!

  • Сандық қол жетімділікке арналған дизайнер нұсқаулығы
  • Сценарийдің ең жақсы қаріптері
  • Тегін граффити шрифтін таңдау
Бүгін Қызықты
YouTube-те көруге болатын 10 шығармашылық деректі фильм
Ары Қарай Оқу

YouTube-те көруге болатын 10 шығармашылық деректі фильм

Кезінде деректі фильмдер тек академиялық және интеллектуалды түрлерге қызығушылық танытты. 2000 жылдары олар «Боулинг Колумбина үшін» және «Ыңғайсыз шындық» сияқты кинокартиналарме...
Flexbox көмегімен тегіс CSS макеттерін жасаңыз
Ары Қарай Оқу

Flexbox көмегімен тегіс CSS макеттерін жасаңыз

Бәрімізге орналасу үшін әр түрлі шешімдер жасауға тура келді. Біз кестелік / реляциялық мәліметтерге арналған кестелерді қолдандық. Біз мәтінді өзгермелі фигураларды айналдыра алатындай етіп дәстүрлі ...
D&AD жылдың үздік дизайны туралы жариялайды
Ары Қарай Оқу

D&AD жылдың үздік дизайны туралы жариялайды

1960 жылдары британдық коммерциялық емес ұйым және білім беру қайырымдылығы ретінде құрылған D&AD (De ign & Art Direction) әлемдегі ең маңызды дизайнерлік конкурстардың бірі болып табылатын жы...