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


Contents

Зашто би ти било стало Приступачност?

Постоји много разлога због којих програмери, дизајнери и њихови послодавци / клијенти треба да обезбеде да је приступачност рани и саставни део процеса веб развоја.

  • На многим територијама, попут САД, ЕУ, Велике Британије, Израела и Јапана, законски је услов да се не дискриминише људи због инвалидитета. У САД прошле године, Поднето је 2.235 нових тужби за веб локацију АДА на савезном суду. То је један на сат.
  • Приступачне странице обично су боље кодиране, робусније и добро се рангирају на претраживачима.
  • Приступачне странице имају тенденцију да буду више употребљив за посетиоце са инвалидитетом, што доводи до већег задовољства и претварања.
  • Неприступачне странице су лоше за пословање. 2019. године УК анкета открили су да је више од 4 милиона људи напустило веб локацију малопродаје због препрека у приступу које су пронашли. Тај изгубљени посао, “фунта за клик”, износио је 17,1 милијарди фунти. То је милијарде. Само у Великој Британији.
  • Лоше је пословање добровољно одвратити потенцијалне купце.

Заједнички стандарди и проблеми

Срећом, В3Ц (тело које производи многе стандарде на које се Веб ослања) има стандард о томе како веб странице учинити доступним. То се зове Смернице за приступачност веб садржаја (ВЦАГ). Постоје три нивоа усаглашености (А, АА, ААА), при чему је „А“ најнижи ниво приступачности. Препоручујем вам да циљате на ниво АА.

Нажалост, ВЦАГ је дугачак, сув и врло технички читљив, па погледајмо шта можете релативно лако направити и остварите највећи прасак за свој долар. Ово није контролна листа свега што требате знати; то је списак најчешћих грешака, а грешке за које особе са инвалидитетом кажу да су њихови главни блокери, са практичним предлозима за решавање проблема. Све спољне везе отварају се на новој картици.

У истраживању Цлицк-Аваи Поунд, испитаницима са инвалидитетом је постављено питање који су им главни блокови који завршавају куповину. Ево горњих баријера (дозвољено је више одговора):

  1. Пренатрпане странице са превише садржаја – 66%
  2. реЦАПТЦХА тестови – 59%
  3. Лоша читљивост (контраст, изглед текста) 56%
  4. Сметање покретних слика и графике – 53%
  5. Лоше информације о везама – 59% (77% за кориснике читача екрана)
  6. 56% попуњавања обрасца

Како побољшати приступачност веб локација

Прво, имајте на уму да ниједан од топ 5 није техничка ствар – они су грешке у дизајну или копирању.

1) Превише садржаја

Укратко: поделите текст на одељке са насловима и листама. Користите једноставан језик.

Познато је да како се број избора повећава, тако се повећава напор потребан за прикупљање информација и доносите добре одлуке. Исто је и са превише садржаја – убрзо постаје неодољиво. Раздвајање садржаја основним стварима је дуготрајан занат; као што је Марк Тваин (наводно) написао: „Нисам имао времена да напишем кратко писмо, па сам уместо тога написао дугачко.“

Недавна књига Писање је дизајн сугерише

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

Тако:

  • Имајте само једну

    на страници.

  • Користите поднаслове либерално; разбија „плочу“ текста за видљиве кориснике, док корисници помоћних технологија попут читача екрана могу да користе пречацни тастер да би прескочили између наслова или добили менталну мапу садржаја из структуре наслова..
  • Не прескачите ниво наслова. На пример, ако користите ан

    , уверите се да је претходио ан

    .

  • Користите табеле са списковима (попут ове!) Обележене правилно у ХТМЛ-у као
      ,

    • . Читачи екрана објавиће „Листа 10 ставки“ (и дозвољава кориснику да прескочи преко њих).

    Користите обичан енглески језик

    Монзо Банк’с Водич „Наш тон гласа“ објашњава важност обичног језика:

    Амерички адвокат Сеан Фламмер је 2010. године покренуо експеримент. Замолио је 800 судија круга да се супротставе или традиционалном „легалесе“ аргументу или оном у ономе што је назвао „обичним енглеским“.

    Судије су преферирале верзију на енглеском језику (66% до 34%) и та предност је била неовисно о њиховој доби или пореклу.

    Биљешке о пламену (ПДФ) обичне енглеске верзије:

    Краће је за готово страницу, па очигледно елиминише непотребне реченице и речи. Реченице у просеку имају 17,8 речи, за разлику од 25,2 речи.

    Закључује:

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

    2) РеЦАПТЦХА

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

    Испитаници су често разговарали о старом РеЦАПТЦХА верзија:

    верзије реЦАПТЦХА са несигурним текстом који морате поново унети

    Борим се са сликама и морам уносити бројеве или слова. У врсти где морам да кликнем које слике имају продавнице или било шта друго, увек ми недостају неке или се збуњујем и трошим енергију коју немам …

    Стил хлапљивих слова реЦАПТЦХА сада је застарио. Много је чешћа појава новије инкарнације која се назива „Но ЦАПТЦХА реЦАПТЦХА“ (позната и као „Нисам робот) због чега корисник мора да потврди потврдни оквир који потврђује да није робот и који користи тајни вуду за оцену корисника. Ако прођу, није потребна даљња интеракција. Међутим, ако не успију, биће приказан нови изазов:

    Дјеломични снимак слике цаптцха који захтијева да корисник кликне на све квадрате који приказују наранџе

    Имајте на уму да тип ЦАПТЦХА који захтева да корисник кликне на све квадрате са (рецимо) уличним знаком није нужно међународни. Како пише Теренце Еден, ЦАПТЦХА не доказују да сте човек – они доказују да сте Американац.

    Најприступачнији облик реЦАПТЦХА је реЦАПТЦХА в3 која не захтева интеракцију корисника, али требате више да се бавите посетама које нису успеле тест:

    То је чисти ЈаваСцрипт АПИ који враћа оцену, омогућава вам да предузмете мере у контексту ваше веб локације: на пример, захтевање додатних фактора за аутентификацију, слање поста у модерирање или ботирање који могу да гребу садржај.

    3) Лоша читљивост

    Укратко: проверите да ли је текст адекватног контраста, читљив и да није оправдан.

    • Обезбедите одговарајући контраст. Један од најчешћих блокатора приступа на вебу је лоша контраста текста и позадине. В3Ц смернице захтевају однос контраста од најмање 4,5: 1, осим за текст великог обима и слике текста великог формата који треба да има контрастни однос од најмање 3: 1 (логотипи и „случајни“ текст су изузети). Постоји много услужних програма који могу да мере омјер контраста за вас; мој лични фаворит је Ада Росе Цаннон одличан контрастни виџет, која је корисна обележивач прегледача која истиче подручја недовољног контраста на вашој страници.
    • Немате наслове капитала. Постоје докази да их је теже читати јер су велика слова једнака висини, тако да не можемо препознати облик уобичајених речи. Поред тога, неки читачи екрана написаће групе великих слова као да су скраћенице (попут ББЦ, ДОЈ, итд.). Ако морате имати све главне наслове, упишите их у нормалном случају у ХТМЛ и трансформишите их у ЦСС трансформација текста: велика слова.
    • Текст поравнајте лево. (За странице на језицима десно-лијево као што су арапски или хебрејски, текст поравнајте десно.) Немојте то оправдавати, јер особама са дислексијом то отежава читање. Тхе Водич за стил Британског удружења за дислексију такође сугерише

      Користите санс сериф фонтове, попут Ариал и Цомиц Санс, јер слова могу изгледати мање гужва. Алтернатива укључује Вердана, Тахома, Центури Готхиц, Требуцхет, Цалибри, Опен Санс.

    4) Збуњујуће слике и графике

    Укратко: дозволите корисницима да зауставе било који покрет; поштују њихове поставке оперативног система; немојте аутоматски репродуковати видео.

    Један испитаник у анкети Цлицк-Аваи Поунд је написао,

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

    Најосновнији ниво ВЦАГ-а захтева „За било какве информације које се крећу, трепере или се крећу, које (1) почињу аутоматски, (2) трају дуже од пет секунди, а (3) су представљене паралелно са осталим садржајем, постоји механизам за корисник може да га заустави, заустави или сакрије, осим ако је кретање, трептање или померање део активности где је то неопходно “.

    Сметање је сметња – посебно за особе са АДХД-ом или другим когнитивним оштећењима. Али кретање и бљескање такође могу узроковати нападаје, тако да ВЦАГ смернице захтевају да садржај не трепери више од 3 пута у било ком периоду од 1 секунде.

    Поштујте корисников избор за анимације

    Сви главни оперативни системи омогућавају кориснику да изрази склоност смањеном кретању на екрану – можда зато што има поремећај вестибуларног спектра који је покренут. Ваша веб локација може открити да ли је корисник то урадио са ЦСС-ом преферира смањено кретање медијски упит.

    Овде дозвољавамо анимирање дугмета само ако корисник није изразио предност:

    @медиа (преферира смањена кретања: без преференци) {
дугме {
/ * `вибрирају} оквири кључева су дефинисани другде * /
анимација: вибрирајте линеарно бесконачно 0,3 с обоје;
}
}

    Ако желите да накнадно прилагодите веб локацију која има много правила за анимацију, следеће може бити заустави све претходно најављене ЦСС анимације:

    @медиа (преферира-смањено кретање: смањи) {
*,
*::пре него што,
*::после {
анимација-трајање: 0,001с! важно;
трајање транзиције: важно је 0,001с;
}
}

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

    5) Лоше информације о везама

    Укратко: учините линкове препознатљивим, с јединственим текстом везе. Упозорите кориснике да ли ће веза отворити нову картицу или датотеку.

    Један од главних узрока лоших веза често је лоше копирање. Већина читача заслона омогућава кориснику да брзо види листу веза на страници (у најчешће кориштеном комерцијалном читачу екрана, ЈАВС, пречица на тастатури је Инс + Ф7; у бесплатни НВДА читач екрана, иста пречица на тастатури приказује листу елемената у којој се налазе линкови страница, наслови и оријентири).

    Међутим, ако на свакој вези постоји текст који пише „Кликните овде“ или „Прочитајте више“, а ништа друго не можете да их разликујете, то је бескорисно. Најлакши начин да се то реши је једноставно писање јединственог текста везе, али ако то није могуће, можете прекорачити текст везе за помоћну технологију користећи јединствени атрибут ариа-лабел на свакој вези.

    Ево доброг примера из Веб страница Јоомла:

    Веб страница Јоомла, која приказује две различите приче, од којих је свака идентична

    Видљиви текст везе је једноставно „прочитајте више“, али Јоомла користи ариа-лабел атрибуте који чине сваки јединствени за помоћну технологију:

    Опширније

Опширније

    Због ариа-лабел текст ће се уместо текста везе користити помоћним технологијама, В3Ц препоручује да се текст кориштен у ариа-етикети започне с текстом кориштеним у оквиру везе, јер „ово ће омогућити доследну комуникацију између корисника“.

    Белешка: Лош савет који и даље видим на старим веб локацијама је додавање објашњеног текста на линкове помоћу наслов атрибут:

    Прочитајте више>

    Не ради то. Тхе наслов није изложен већини читалаца екрана (програмери су га користили кључним речима у сврхе „СЕО“, па су га продавци читача екрана подразумевано онемогућили), а прегледачи представљају атрибуте наслова као „савете“ који су доступни само мишим корисницима.

    Везе би требале изгледати попут веза

    Прегледачи подразумевано подвлаче везе. Најбоље је да то не мењате, али ако изгубите свађу на паркиралишту са дизајнером око тога, текст везе мора имати однос контраста 3: 1 од околног текста који није линк и требало би да добије неки означитељ без боје “Да су они веза када се лебде или фокусирају, на пример:

    а: лебдите, а: фокус {уређење текста: подвлачи;}

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

    „Означивач без боје“ (у нашем случају подвлака) осигурава да ће посетиоци са слабим видом или слепоћом у боји видети промену на лебђању или фокусу. (Читачи екрана аутоматски најављују „Линк“ пре текста везе.)

    Реците људима ако веза отвори нову картицу / страницу

    Посјетитеља може бити збуњујуће ако се активирањем везе отвори нова картица или нови прозор, посебно ако то раде само неки линкови на страници (на примјер, само вањски линкови отварају нову картицу). Ако то морате учинити, требало би да упозорите корисника било у тексту везе, или користећи горњу методу ариа-лабел.

    Реците људима да ли је веза у досије

    Ако је веза до датотеке (на пример, ПДФ или видео), реците кориснику у тексту везе. Не сакривај то унутра ариа-лабел, јер ово може бити корисно за многе видовите кориснике (на пример, неки мобители не могу да отворе .доцк датотеку). Ако се ради о великој датотеци, размислите да упозорите корисника на приближну величину; можда неће желети да преузму велику видео датотеку преко 3Г-а.

    Такође можете да користите преузимање атрибут, због којег прегледач отвара дијалог за преузимање изворне датотеке оперативног система. Ако све то саберемо, код ће изгледати овако:

    Годишњи извештај (ПДФ, 240 МБ)

    6) Још једна грешка у дизајнирању: уклањање прстена за фокусирање

    Укратко: проверите да ли корисник тастатуре увек може видети где су тренутно фокусирани.

    Поменули смо : фокус стилови пре. Они су непроцењиви визуелни показатељ за оне људе који не могу да користе миш из било ког разлога: можда имају РСИ или Паркинсонову или мултипле склерозу. Прегледачи подразумевано приказују прстен за фокус на тренутно фокусираном елементу. Ево везе Почетна на мојој личној веб локацији која је фокусирана на Цхромиум прегледач:

    Снимка екрана Цхромиум-овог заданог фокуса око везе (која је такође слика)

    Међутим, неки сматрају да је то естетски непријатно када користе миш и искључе га помоћу ЦСС-а, чиме место оставља недоступним корисницима тастатуре.

    Унесите нови стандард под називом Фирефок : видљив фокус. Ово ће применити фокусни прстен на елемент ако га је постигла тастатура или уређај који не показује мишем, али корисницима миша ништа не показује. Као што подржава само Фирефок (у време писања), Патрицк Лауке предлаже следећи ЦСС који се лепо игра са свим прегледачима:

    дугме: фокус {/ * неки узбудљиви стилови фокусирања тастера * /}
дугме: фокус: није (: фокус видљив) {
/ * поништите све горе усмерене стилове дугмета
ако дугме има фокус, али прегледач не би нормално
прикажи задате стилове фокусирања * /
}
дугме: видљив фокус {/ * неки чак и * више * узбудљиви стилови фокусирања дугмета * /}

    7) Попуњавање обрасца

    Укратко: дизајнирајте поља образаца која изгледају попут образаца, а свако је повезано са ознаком. Не онемогућавајте аутоматско пуњење.

    С обзиром на виталну важност образаца за веб локације е-трговине, изненађује ме колико неприступачних образаца видим. Често је то зато што стари прегледачи нису много дозволили на начин стилизовања елемената форме, па су их програмери лажирали са другим ХТМЛ елементима. Савремени прегледачи то дозвољавају атрактивни потврдни оквири, радио дугмади, прилагођени одабир компонената и комбобок-а, доступне контроле за аутоматско довршавање и још.

    Аутофилл је ваш пријатељ

    Допуштање прегледачима да аутоматски попуњавају обрасце захтијева да посетиоци ураде мање, тако да је вероватније да испуњавају образац и региструју се / купују ваш производ. Аутоматско попуњавање на претраживачима: дубоко зароњивање је сјајан чланак еБаи-а о овоме (и они би требали знати).

    Такође, аутоматско довршавање је једина тренутно довољна техника за постизање усаглашености са АА Критеријум успеха 1.3.5: Препознати сврху уноса.

    Нека поља образаца изгледају попут поља образаца

    Прегледачи подразумевано приказују поља за унос као поља. У сваком случају, стилизирајте их уз маргине, облоге и обрубе, али задржавајте их као кутије. Многи дизајнери пратили су Гоогле-ов образац дизајна материјала пре 2017. године помоћу једне линије да корисник унесе текст:

    Улаз за стари материјал, са хоризонаталном линијом, а не правоугаоном кутијом

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

    приложена текстуална поља правокутног облика (оквира) имају боље резултате од оних са прилагањем линија … Данас се та нова текстуална поља појављују на Гоогле производима са страница за пријаву на рачуне у Гоогле обрасце.

    Ако размишљате о усвајању цјелокупне Гоогле библиотеке Уређаја за употребу материјала, прочитајте Престаните да користите текстуална поља Материјал Дизајн! аутор Матсуко Фриедланд да види да ли задовољава ваше потребе.

    Означите сва поља обрасца

    Сва поља обрасца (уноси текста, поља за потврду, радио тастери, клизачи итд.) Морају бити означена. Најбољи начин да то урадите је коришћење ХТМЛ-а ; као што каже ВЦАГ, „стандардне ХТМЛ контроле већ испуњавају овај критеријум успеха када се користе у складу са спецификацијом“.

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

    лажно поређење са стварним поређењем ознака

    Ово олакшава фокусирање уноса много лакшим за особе са потешкоћама у управљању моторима – или можда за вас, покушавајући да потврдите малени потврдни оквир на малом екрану на поскочном возу. Такође је од виталног значаја за кориснике читача екрана који ће прелазити кроз поља у образац (подразумевано су само линкови и поља образаца фокусирани табором); када се укључе у поље за унос, читач екрана ће објавити садржај придружене налепнице.

    Код за ово је једноставан. Пољу за унос даје се јединствени ИД, а ознака се с њим повезује помоћу за атрибут:

    Сакривање налепница

    Повремено можда не желите да видите видљиву етикету. Или дизајнер не, и не желите другу свађу на паркиралишту. У сваком случају, ево примера када се на натпису „Сеарцх“ испред уноса осећа прекомерно коришћење.

    Поље за унос, са дугметом означеним са „претрага“

    Поље за унос можемо повезати са текстом „Претрага“, који садржи садржај дугмета за слање помоћу ариа-лабелледби:

    Могли смо искористити ариа-лабел (које смо упознали раније када смо говорили о везама):


    Али увек је боље преферирати видљиви текст на страници јер ће се то превести ако се страница покрене путем алата за превођење, док текст „скривен“ у ХТМЛ атрибутима неће бити. (Хат-тип Адриану Роселли-у за овај савет, из његовог сјајног чланка Мој приоритет метода за означавање контроле.)

    Најчешће грешке на почетним страницама милион

    Погледали смо главне препреке на веб локацијама е-трговине какве пријављују корисници са неким обликом оштећења. Сада погледајмо много шири скуп веб локација – почетних страница за најпопуларнијих 1.000.000 веб локација, аутоматски анализира ВебАИМ у августу 2019. 98% анализираних страница имало је барем једну грешку. Најчешће грешке су

    1. Текст са ниским контрастом (86,1%)
    2. Недостаје алтернативни текст за слике (67,9%)
    3. Празне везе (58,9%)
    4. Ознаке недостајуће форме (53.2%)
    5. Недостаје језик документа (30,5%)

    Горе смо бавили ниским контрастом, везама и улазима у обрасце. Погледајмо сада како можемо избећи остале веома честе грешке.

    8) Обезбедите алтернативе за текст за све слике, видео и аудио

    Укратко: свака информација која се преноси путем слике или видеа мора имати текстуални еквивалент.

    Свако мора имати алтернативни текст („алт тект“) који се може саопштити посетиоцима са оштећењима вида или онима са ниском пропусном ширином / скупим плановима података који су искључили слике у својим прегледачима. Ово укључује слике текста.

    Ево основних правила:

    • Ако је слика чисто декоративна, мора имати празан алт текст: алт = "". (Ионако би чисто декоративне слике вероватно требало да буду у ЦСС-у.)
    • Ако је слика описана у тексту текста, требала би имати празан алт текст (алт = ""), да се избегне понављање. Али будите опрезни ако је то у а
      – види Како схватите? више.
    • Ако је слика једини садржај везе (на пример, на логотип ваше организације може се кликнути да би се прешла на почетну страницу) алтернативни текст треба да описује одредиште везе. На пример, алт = "почетна страница".
    • Не користите фонтове икона; могу бити јако лоши за особе са дислексијом. Ако их користите, претворити их у СВГ.

    Видео и аудио алтернативни текст

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

    9) Додајте одговарајући језик документа

    Укратко: нека помоћна технологија зна језик на којем се налази ваш текст.

    30% почетних страница не објављује језик на којем су написани, што их може учинити збуњујућим за кориснике читача екрана. То је важно зато што се реч „шест“ изговара врло различито ако је рецимо на енглеском или француском језику.

    То је лако решити додавањем атрибута ланг у ХТМЛ елемент:

    „Ен“ говори читачу екрана (или софтверу за превођење) да је ова страница на енглеском. “Ес” је шпански, “фр” је француски, и тако даље. За већину језика језичку ознаку је прилично лако одредити. В3Ц има водич за Избор језичке ознаке.

    Ако страница садржи садржај на језику који није главни главни, додајте атрибут језика елементу који окружује тај садржај. На пример, на страници која је проглашена енглеском:

    Ако желите да ћаскате матадор, на неки цоол кабана
    И упознајмо се сеноритас по резултату, Еспана пор фавор

    10) Помозите посетиоцу да се снађе око вашег садржаја

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

    Када видљиви посетилац дође на вашу страницу, они га могу лако визуелно скенирати како би разумели где је навигација и где почиње главни садржај. Корисник читача екрана то не може. Међутим, ХТМЛ5 нам даје неке нове ознаке за обележавање ових подручја, а помоћне технологије имају пречице које могу прескочити на (или прескочити) оријентире као што су хеадер, фоотер, навигација и слично.

    Ево шестоминутног видеа који сам направио са Леоние Ватсон, веб програмером и корисником читача екрана, о томе како користи свој читач екрана за испитивање ове семантике за навигацију до моје личне странице:

    • Умотајте свој главни садржај, односно ствари које нису заглавље, основна навигација или подножје, у а
      елемент. У скоро свим случајевима, требало би да постоји само један
      по страни. Сви прегледачи (ИЕ9 +) омогућавају вам да га стилски користите, а помоћне технологије знају шта да раде с њим.
    • Омотајте заглавље (логотип марке, каиш, наслов странице) у а
      елемент.
    • Умотајте подножје (правне ствари, контакт подаци, обавештења о ауторским правима итд.) У а
    • Означите своју примарну навигацију користећи
        умотана у елемент. Ово се може угнеждити унутар

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

      У свом истраживање корисника читача екрана, ВебАИМ је открио да 26% корисника читача екрана често или увек користи те оријентире током навигације по страници.

      Поред тога, уметање дискретних делова садржаја унутра

      помаже Аппле-овом ВатцхОС-у да оптимално прикаже садржај. Погледајте мој чланак Практична вредност семантичког ХТМЛ-а за више о томе.

      11) Користите правилно ХТМЛ

      Укратко: разумети семантику и задано понашање ХТМЛ елемената; користите прави елемент за свој садржај.

      Честа тема у овом чланку је употреба исправних ХТМЛ елемената. Користећи ознака има уграђено понашање претраживача које фокусира повезано поље уноса; Користећи

      је пожељније од

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

      Други пример је употреба а