Укратко, атрибут АРИА:

• Даје или побољшава семантику несемантичких или семантичких елемената,

• Осигурава да динамички (живи) садржај остане доступан.

• Пружа улогу за описивање дефинисаног типа „виџета“ (мени, ставка стабла, клизач, мерач напретка итд.).

• Пружа улогу за описивање структуре веб странице (заглавља, региони и табеле).

• Пружа статус додаци (означено, има искачуће прозоре итд.).

• Пружа својства превлачења и испуштања која описују изворе повлачења и испуштање циљева.

Шта је приступачност у веб дизајну?

Кад год дизајнирате садржај, размислите о две ствари: како је садржај уочљив и како је оперативан . Испитајмо неке примере да бисмо илустровали доступност у веб дизајну.

Претпоставимо да дизајнирате падајући мени по мери. Ево параметара које треба узети у обзир приликом дизајнирања елемента:

• Означи различита стања: омогућено, онемогућено, само за читање.

• Означите ставку када добије статус фокуса / корака.

• Означите сваку ставку опције када добијете статус фокуса / корака.

• Уверите се да је садржај и даље читљив када се само текст зумира на ниво од 200%

• Обавезно има довољан контраст између текста и његове позадине. Ово помаже људима са умерено слабим видом или онима који користе уређаје у екстремним условима осветљења, на пример, на директној сунчевој светлости или на екрану слабе осветљености, да прочитају садржај.

Други пример би могао бити избор боје за опис стања. Ево тачака које треба узети у обзир приликом дизајнирања одељка у којем ће корисник моћи да одабере боју:

• Постоје људи којима је тешко да разликују одређене боје. Дакле, зелена не значи зелено за све ваше посетиоце. Да бисте то поправили, додајте опис сваке боје у којем је детаљно наведена сврха боје.

• Означите сваку ставку када добијете статус фокуса / корака.

• Уверите се да између елемената има довољно простора како би се сваки могао лако активирати, на пример, на уређајима са мањим приказивачем.

3. Тестирање приступачности: одакле почети?

Не постоји једносмерно да бисте проверили и осигурали да је веб садржај у потпуности доступан. Неколико техника је потребно за верификацију и решавање проблема са приступачношћу. Можете почети са дефинисати проблеме , решења И. приоритети .

Дефиниција проблема

Док радите на проблемима приступачности, увек покушајте да креирате једна карта по проблему са јасним насловом. Ово би требало да поједностави разумевање проблема и помогне у дефинисању приоритета.

Лош пример: Корисник не може да користи тастатуру на страници.

Добар пример: Не можете користити навигацију на тастатури у главном менију.

Лош пример доводи до случаја који ће бити прилично тешко затворити у трену. Дискусије о разним темама могле би започети у одељку за коментаре, јер је наслов карте превише генерички.

Добар пример циља тачно на проблем и фокусира се само на једно: навигација тастатуром у главном менију.

Дајте приоритет питањима веб приступачности

Приоритети су важни јер дефинишу које проблеме треба прво решити. На пример, ВЦАГ су подељени са три нивоа усаглашености : А, АА, ААА, што значи да би требало да кренете од минималног нивоа А, али то не значи аутоматски да су нивои АА и ААА искључиво „лепи за имати“. Сви нивои су важни и важно је не постављати приоритете под претпоставком да је ниво А довољан.

Међутим, нивое ВЦАГ (или било ког другог водича) понекад је прилично тешко разумети и мало поједноставити, такође можете узети у обзир следеће дефиниције приоритета:

• Критичан - Проблеми који спречавају кориснике да користе апликацију. Нема доступних решења.

• Више - Проблеми који ометају и / или дезоријентишу употребу апликације, али не блокирају могућност корисника да доврши операцију.

• Мање - Проблеми који су досадни, али не ометају употребу или побољшања која би могла да се унесу у апликацију.

• Инфо - Не придржава се најбоље праксе. Опште препоруке за побољшања.

Решења

Ниједна од смерница - под тим мислим ВЦАГ , Члан 508 или ПОСТОЈИ —Дат ће вам директно решење у смислу техничког кода да бисте знали како одређени проблем треба решити. Они дефинишу само очекивано понашање. Међутим, ВЦАГ је такође дефинисао испитне процедуре које помажу да се разуме како репродуковати проблем и постоји ВЦАГ група за аутоматско праћење, В3Ц заједница са фокусом на развоју правила поуздан, за тестове приступачности Интернета, како аутоматизовани тако и полуаутоматизовани.

Пример за техника ВЦАГ Г4 („Дозволи заустављање и поновно покретање садржаја од места где је стао“):

Поступак испитивања

На страници са помичним или мобилним садржајем,

1. Користите механизам који пружа веб страница или кориснички агент да бисте паузирали садржај током премештања или померања.
2. Проверите да ли је кретање или помицање заустављено и да се не покреће само од себе.
3. Користите обезбеђени механизам за поновно покретање садржаја у покрету.
4. Проверава да ли је кретање или померање настављено од места где је заустављено.

Очекивани резултати

Бр. 2 и бр. 4 су тачни.

Као што видимо, нема техничких решења, али је очекивано понашање дефинисано. Као веб програмери Они ће то спровести, то је потпуно на њима.

Смернице за веб-доступност и В3Ц стандарди

Следеће основне веб стандарде треба да вам буду полазна основа:

• Најчешћи је Смернице за приступачност веб садржаја познат као ВЦАГ. ВЦАГ 2.0 је_ 'стабилан и референтни технички стандард који има 12 смерница организованих под 4 принципа: уочљиви, оперативни, разумљиви и робусни . За сваку смерницу постоје проверљиви критеријуми успеха који су у три нивоа: А, АА и ААА . ”_

• Технике за ВЦАГ 2.0 је свеобухватан водич за ауторе веб садржаја.

• Кориснички захтеви за В3Ц медијску доступност - Овај документ представља захтеве за приступачност које корисници са инвалидитетом могу имати у погледу аудио и видео записа на Интернету.

• Закон о приступачности и приступу комуникацијама КСКСИ века - ЦВАА је подељен у два наслова или широка одељења. Наслов И бави се приступом комуникацијама тако да производи и услуге који користе широкопојасну мрежу буду у потпуности доступни особама са инвалидитетом. Наслов ИИ закона о приступачности отвара нове начине да се особама са инвалидитетом олакша гледање видео програма на телевизији и Интернету.

• Члан 508 - захтеви за приступ информационим и комуникационим технологијама (ИКТ) који се примењују на све савезне агенције када развијају, набављају, одржавају или користе електронску и информациону технологију.

• Доступност веб странице под насловом ИИ Закон о Американцима са инвалидитетом (АДА) - Тамо ћете научити како се захтеви за недискриминацију из наслова ИИ АДА односе на државне и локалне веб странице.

Тестирање веб приступачности: Како да знам да ли је мој садржај доступан или не?

Ево основних и основних контролних тачака које би вам требале помоћи да свој веб садржај учините доступнијим од првог корака:

• Потврдите свој ХТМЛ. Уверите се да ХТМЛ структура не садржи грешке, јер помоћне технологије могу имати проблема с тумачењем садржаја на страници.

• Испробајте само тастатуру. Обавезно приступите свим извршним ставкама само помоћу тастатуре. Такође, све радње морате бити у стању да извршите помоћу тастатуре, на пример подношење обрасца.

• Тестирајте помоћу алата за валидацију приступачности и валидатора. Користите алате који анализирају и верификују могуће грешке у приступачности.

• Динамички садржај. Обавестите читаче екрана о динамичким променама, нпр. када су се резултати претраге променили.

• Не ослањајте се на боје да бисте описали значење. Користите боју заједно са описом, нпр. [Жути оквир] упозорење.

Не елиминишите зацртано у фокусу. Ово је најчешће уклањана функција помоћу ЦСС-а outline: 0; Не чините то, јер ће корисници тастатуре изгубити оријентацију на страници. Можете размислити о уклањању шеме фокуса за кориснике који нису са тастатуре, али увек пружа обрис фокуса за кориснике тастатуре.

• Поруке о грешкама . Увек говори кориснику како да исправи грешку. Немојте само указивати да су подаци неваљани.

• Редослед картица. Уверите се да навигација заснована на табелама следи конвенције постављене у графичком корисничком интерфејсу. У најмању руку, требало би да следите смернице апликације за читање на подразумеваном језику. На пример, у енглеском језику редослед читања је од врха до дна, слева надесно; на арапском је одозго надоле, здесна налево.

• Зоом. Уверите се да садржај странице остаје читљив док зумирате до 200%.

• Онемогући слике. Можете ли и даље користити страницу на удобан начин? Постоје ли алтернативни текстови за све слике?

• Читач екрана Проверите да ли можете читати и кретати се кроз садржај помоћу најмање једног читача екрана, на пример ВоицеОвер, Виндовс Нарратор или НВДА.

• Режим високог контраста. Проверите да ли је садржај и даље читљив док прелазите у режим високог контраста.

• Величина слова. Уверите се да величина фонта на страници није мања од 10 пиксела.

4. Уобичајене грешке у веб приступачности

Најчешћа грешка је не идентификовање захтева за приступачност пре развоја . Нажалост, каснија приступачност биће део развоја, а најтеже ће бити применити решења.

Ово је листа неких од најчешћих грешака које програмери праве приликом примене приступачности:

• Нема могућности навигације путем садржаја користећи само тастатура .

• Неправилна употреба својства ЦСС шеме У већини случајева користи се outline: 0;, што значи да обрис око сваког елемента који се може применити више није видљив. ** Не користите outline: 0; или outline: 0! Important; **. Корисник ће изгубити могућност да види тренутно фокусирани елемент током навигације кроз садржај, осим ако не постоји друга алтернатива, на пример, коришћењем својства ЦСС border

• Губитак фокуса тренутног елемента, на пример, због ДОМ манипулација или употребе методе blur() То се често дешава код апликација на једној страници.

• Нема обавештења за кориснике читача екрана да се нешто променило, на пример: садржај је преузет помоћу КСМЛХттпРекуест АПИ-ја и нове промене су обрађене у корисничком интерфејсу; али корисник није обавештен. То се често дешава са апликацијама на једној страници.

• Бирач датума је неприступачан. У многим случајевима се користе неприступачни бирачи датума. Корисници не могу да се крећу кроз опције календара помоћу тастатуре.

• Коришћење екстензија шта хоће аутоматски решава проблеме са приступачношћу . Користите их пажљиво и проверите резултате. Њихова злоупотреба може створити више проблема него решења.

• ** Додај атрибуту tabindex елемент са индексним бројем већим од 0. ** Сврха коришћења tabindex са индексом већим од 0 углавном је за „исправљање“ навигационе руте. Међутим, размислите о томе да прилично промените ХТМЛ структуру како бисте постигли природну путању навигације. Манипулишите њиме помоћу tabindex То може довести до проблема са одржавањем, као и непредвидљива навигациона рута.

• Лоша хијерархија заглавља. Нажалост, још увек се често види како хијерархија заглавља није правилно изграђена, на пример,

  ,

  и

  . Корисници читача екрана користе наслове за кретање кроз одељке, а неправилна структура је збуњујућа јер је контекст тешко разумети.

• Недостаје подршка са високим контрастом. Постоје људи који свој софтвер користе у режиму високог контраста. Уверите се да је ваш садржај уочљив.

• Користите неприступачно решење ЦАПТЦХА. Нажалост, сви познати ЦАПТЦХА су за мене или неприступачни или су врло тешки за употребу.

• Превише и / или анимација које се не могу паузирати. Аутоматско пуштање видео записа, реклама или карусела са сликама може да вам омете пажњу.

• Велики делови текста. Текст који је сажет у врло велики блок, без размака, зареза или тачака. Врло тешко за читање. Подељено на мање делове, више пасуса и поднаслова помаже у бољој организацији садржаја текста.

• Проблеми са зумирањем. Уверите се да ваш садржај остаје читљив и лаган за навигацију када се увећа до 200%.

• Зависи од боја. Врло често је статус предмета означен само једном бојом, на пример, статус упозорења означен је само жутим метком; ова боја се не доживљава на исти начин за слепе особе.

• Мали циљеви који се могу кликнути / додирнути. Подручја на која се може кликнути / узети често су премала. Повећавање омогућава корисницима да их лакше активирају.

Али како могу побољшати приступ Интернету?

Дефинисање проблема је једно. Поправљање је веома различито и врло често није тако лако како звучи. То је зато што имплементације АПИ-ја за приступ нису сталне и понекад морамо да пронађемо решења или чак прихватимо чињеницу да нешто неће успети када покушамо да решимо проблем.

Што се тиче алата, не постоји ниједан алат који може проверити све могуће комбинације, али као добар почетак ови алати би требали помоћи:

• Услуга потврде бренда В3Ц - Само да будемо сигурни да ХТМЛ садржај садржи грешке. Ако ХТМЛ структура има грешке, онда је излаз непредвидив и не може се правилно обрадити, посебно од стране различитих помоћне технологије .

• хттпс://ввв.в3.орг/ВАИ/ЕР/тоолс/ - Списак мрежних програма или услуга који ће вам помоћи да утврдите да ли веб садржај испуњава смернице за приступачност.

• А мој алат, АСЛинт хттпс://ввв.аслинт.орг/ , помаже вам да пронађете проблеме са приступачношћу.

Увек имајте на уму да нема алата за приступачност може заменити ручни тест јер не могу сви сценарији бити у потпуности аутоматизовани, на пример провера односа контраста јачине на елементима са position: fixed;.

Усредсредите се на проблеме који блокирају употребу ваше апликације, на пример, корисник не може да се креће кроз мени помоћу тастатуре.

Зашто је важно учинити садржај приступачним

Сви желе да шире свој садржај што је шире могуће. Приступачност у великој мери помаже у томе, од досезања веће публике до побољшања корисничког искуства за све ове. Поред тога, приступачност није само оно што би се традиционално могло сматрати особама са инвалидитетом. Било да се ради о појединцу који стари и пролази кроз пратеће физичке промене, некоме ко трчи по сунчаном дану коме је потребно аутоматско подешавање контраста на телефону или родитељу са рукама пуним торби за куповину који жели да пошаље поруку текста на глас ; приступачна технологија је технологија коју сви корисници могу с времена на време да користе.

Као додатна предност, позитиван ефекат је тај што је приступачном садржају који је у потпуности у складу са ВЦАГ 2.0 стандардима претраживачи лакше пузати и разумети и што може имати значајан утицај на рангирање странице. Због тога приступачни дизајн може генерисати додатни промет на веб локацији.

На крају, ево неколико статистика које треба узети у обзир:

• Више милијарду људи широм света доживљавају неку врсту инвалидитета

• Старење становништва . Између 2015. и 2030. године очекује се пораст броја старијих људи, старих 60 и више година, за 56%, са 901 милион на више од 1,4 милијарде.

• Универзални дизајн је кључан. Универзални дизајн односи се на широк спектар идеја и пракси за производњу услуга, производа и окружења која су суштински приступачна и употребљива за људе свих способности.

• Врсте инвалидитета: Постоји пет широких категорија инвалидитета, укључујући визуелне, покретне, говорне, когнитивне и слушне.

Свима су нам потребне висококвалитетне услуге. Доставимо и њих .