Сандық қолжетімділік

Tilda сайттарындағы блоктардың қолжетімділігіне шолу және оны жақсарту үшін блоктар ішіндегі мүмкіндіктер
Тильда кітапханасындағы блоктардың көпшілігі қазірдің өзінде тұрақты, уақытша және ахуалдық шектеулері бар адамдардың пайдалануы үшін оңтайландырылған. Бұл мақалада сайтыңыздың қолжетімділігін арттыру үшін қандай мүмкіндіктер бар екенін және қандай өрістерді толтыру керектігін айтып береміз.
Веб-сайттың арнайы мүмкіндіктерін жақсартуға арналған қысқа бақылау тізімі
  • Тақырып жолақтары үшін SEO тақырыптарын тексеру
  • Суреттерге арналған альт мәтіндерін қойып, оларды кескіннің мәнін барынша ашуға мүмкіндік береді
  • Мәзір блоктарының үстіңгі деректеме бетінде және сайттың төменгі деректемесінде тұрғанын тексеріңіз
  • Пішіндері бар блоктардың мазмұнын тексеру - барлық өрістерде өріс тақырыптары бар ма және пішіннің сәтті ұсынылуы туралы хабардың көрсетілген-көрсетілмегені
  • Сайт қаріптерінің контрастын тексеріңіз - ұқсас түс фонында қандай да бір мәтіндер бар ма, әлде ол байқалмайды ма
  • Сайт параметрлерінде жоба тілі орнатылғанын тексеру → Қосымша
  • Нөлдік блок элементінің арнайы мүмкіндіктері нұсқауларын тексеру

Экраннан оқу құралын оңтайландыру

Экраннан оқырман - экранда болып жатқан оқиғаларды дыбыстайтын арнайы бағдарлама. Пайдаланушылар не экран оқырмандарды жүктеп, оларды жүйеге орнатады, бірақ кейде лайықты бағдарлама алдын ала орнатылады (MacOS жағдайында).

Tilda блоктары осы бағдарламалармен жұмыс істеу үшін автоматты түрде оңтайландырылады немесе экраннан оқырман дұрыс дыбыстайтындай мазмұнды белгілеу мақсатында барлық параметрлерге ие болады.

H1-H6 тақырыптары

Егер сайт мазмұнының құрылымы анық болса, тақырыптарды H1, H2 және H3 деп белгілеуге болады. Әр түрлі деңгейдегі тақырыптар экран оқу құралына бет құрылымын оқуға, сондай-ақ пернетақтаны пайдаланып мазмұн арасында ауысуға көмектеседі.

H1-H3 тегтерін «Тақырыпқа арналған SEO тег» өрісінде тақырыбы бар кез келген блоктың параметрлеріне орнатуға болады. Басқа блоктарда, мысалы, карталардың ішкі тақырыптарында Н6-ға дейін басқа деңгейлердің тақырыптарын орнатуға болады.
Маңыздысы: бетте тек бір H1 тег болуы керек. Егер иерархия орындалса, басқа деңгейлердегі тегтер кез келген санда болуы мүмкін (мысалы, h3 ішінде h2 айдары жоқ).

Суреттерге арналған альт мәтіні

Суреттерге арналған балама мәтінді экраннан оқу құралы оқиды, сондықтан соқыр адамдар суреттің не туралы екенін түсінетіндей етіп орнату керек. Alt мәтіні, сондай-ақ, баяу интернет сияқты басқа қол жетімділік шектеулері жағдайында көрсетіледі.

Сурет үшін балама мәтінді орнату үшін Мазмұн мәзірін ашып, кері жүктелген суреттің жанындағы көп нүктені басыңыз.
Егер кескін сәндік болса, мысалы, ол беттегі элементтің өңі болса, оның балама мәтінді қажет ететінін қарастырған жөн. Кейбір жағдайларда бұл қажетсіз болуы мүмкін.
«Галереялар» санатынан блоктардағы суреттер үшін альт-тег қосу үшін «Мазмұн» мәзірін ашып, кері жүктелген суреттің жанындағы «Мәтін» сілтемесін басыңыз. Содан кейін SEO өрісіне арналған Image alt өрісінде кескіннің сипаттамасын көрсетіңіз.
Блок мазмұнындағы кескінге арналған Alt мәтінін көрсету
Блок мазмұнындағы кескінге арналған Alt мәтінін көрсету
Ең жақсы қол жетімділік үшін кескіннің мәнін барынша ашатын және қандай да бір себептермен бейнені көре алмайтын келушілерге назар аударатын альт мәтіні көрсетілуі тиіс.
Мысалы, мына суретті түсірейік:

Альт мәтіндерінің жаман мысалдары:
«Ит»
«Подиум»

Жақсы альт мәтіні:
«Кірпіш үйдің ауласындағы шөптесін өрік подиум күшігі»
Кірпіш үйдің ауласындағы шөпте отырған өрік подиум күшігі

Бас киім мен төменгі колонтитул жасау жөніндегі ұсынымдар

Үстіңгі және жертөледегі блоктар экраннан оқырман адамның қазір осындай блокта тұрғанын түсінетіндей етіп автоматты түрде арнайы тәсілмен белгіленеді. Мысалы, үстіңгі деректемеде барлық мәзір элементтерін оқуды өткізіп, беттің негізгі мазмұнына тура өтуге болады.

Жоғарғы және төменгі колонтитулдары бар блоктар дұрыс үстемелеу үшін жеке Үстіңгі және төменгі колонтитул беттерінде болуы тиіс.
Дұрыс баптау үшін осы бейне оқулық немесе Анықтама орталығындағы «Үстіңгі және төменгі колонтитулды тағайындау» оқулықтарын қараңыз.

Формулярларды толтыру бойынша ұсынымдар

«Пішіндер» санатынан блок өрістерінің көпшілігі экраннан оқу құралына қолжетімді, ал жіберу кезіндегі сәттілік немесе қате туралы хабарларды экраннан оқу құралы жариялады.

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

Контраст және қаріп өлшемдері бойынша ұсыныстар

Жеткілікті қаріп контрасты сайт пайдаланушыларына сайттағы мәтінді оңай қабылдауға көмектеседі. Қарама-қарсы ұсыныстар сайтта көру қабілеті бұзылған келушілер болуы мүмкін болғандықтан ғана қажет емес — дұрыс контраст барлығына ыңғайлылық қосады.

Вебте фон мен мәтіндік контрастты анықтау стандарты бар, ол Web Content арнайы мүмкіндіктері жөніндегі нұсқауларға (WCAG) негізделген. Осы стандартқа сәйкес контраст ең жарық және қараңғы түстердің жарықтығының қанша есе ерекшеленетіндігінің мәні ретінде анықталады және осы жарықтықтың қатынасы ретінде жазылады: 3:1, 4.5:1, 10:1. Мәні соншалықты төмен болса, контрасттың ең жоғары мәні 21:1.

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

Мәнді алу және оны төмендегі мәндермен салыстыру үшін фондық контраст және қаріп түсі құралын пайдалануға болады. Ол үшін жай ғана фондық және түстік мәндерді Блоктар немесе Нөлдік блоктан көшіріп, оларды қызметке қосып, контраст мәнін алыңыз.
Қарапайым мәтін үшін мәтін ажыратылатын деп есептелетін ең төменгі контраст мәні 4,5:1 құрайды. 7:1 мәндері мәтіннің контрастты арттырғанын білдіреді (стандартты санаттарда - ААА).

Үлкен мәтін (айдарлар) үшін ең төменгі мән 3:1, 4.5:1-ден бастап мәтін жоғары, яғни көру қабілеті бұзылған адамдардың пайдалануына жарамды деп есептеледі.

Мәтіндік емес элементтер үшін (түймелер, навигациялық элементтер) 3:1 артық контраст коэффициентін сақтау қажет және жеткілікті.
Беттің контрасты мен қол жетімділігін тексеру үшін толқын қызметін де пайдалануға болады. Ол сайт элементтерінің қарама-қарсылығы мен қол жетімділігіне қатысты мүмкін болатын проблемаларды көрнекі түрде көрсетеді. Алайда бұл қызметтің барлық ұсыныстары өзекті және дұрыс бола алмайды, атап айтқанда, барлық элементтер баламалы мәтінді талап ете алмайды.

Сайттың тілін көрсету

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

Сайт блоктары арасында пернетақтамен шарлау

Шектеулердің кейбір түрлері кезінде сайт мазмұны арқылы шарлау үшін пернетақтаны пайдалану ыңғайлырақ. Tilda блоктары пернетақта навигациясына көмектесуге арналған, нақтырақ айтсақ:

  • Пернетақтадан шарлау кезінде қазіргі уақытта қандай элементпен әрекеттесіп жатқанын түсіну үшін түрлі-түсті фокус-рама бар
  • Пернетақтаны пайдаланып олар арқылы шарлауға болатындай мәзірлер, ішкі таңбалар, пішіндер, тақтайшалар, ойыншылар, қойындылар, жүгірткілер бар блоктар автоматты түрде белгіленеді

Нөлдік блок үшін арнайы мүмкіндіктер туралы ойлар

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

Tab пернесін пайдаланып элементтер арқылы жылжытқанда, ол бет орналасуында пайда болатын ретпен пайда болады. Ол үшін элементтерді дұрыс ретпен орналастыруыңызды сұраймыз — қозғалыс қабаттарда көрсетілгеннен кері ретпен, соңғы элементтен бірінші элементке дейін болады.
Бос элементтерді қалдырмаңыз, әсіресе оларда Н1 тегі сияқты семантикалық рөл болса. Элементтердің ішіне сілтемелерді, SEO тегтерін және мәтінді қойыңыз. Сәндік функциясы жоқ суреттер үшін балама мәтінді қойыңыз.

Блоктың қолжетімділігі туралы кесте

20__ жылғы «___» __________
Тильда