Համացանցը տեղեկատվության, ծառայությունների և հնարավորությունների դարպաս է: Այնուամենայնիվ, միլիոնավոր հաշմանդամ մարդիկ բախվում են խոչընդոտների կայքեր մուտք գործելիս՝ վատ դիզայնի և ներառականության բացակայության պատճառով: Մատչելի կայքերի նախագծումը ոչ միայն բարոյական հրամայական է, այլ նաև իրավական և բիզնես անհրաժեշտություն: Ստեղծելով կայքեր, որոնք կարող են օգտագործել բոլորը, դուք դրսևորում եք ներառականություն, հասնում եք ավելի լայն լսարանի և հետևում եք այնպիսի կանոնակարգերի, ինչպիսիք են. ADA (Հաշմանդամություն ունեցող ամերիկացիների մասին օրենք) կամ WCAG (Վեբ բովանդակության մատչելիության ուղեցույցներ).

Այս ուղեցույցը ձեզ կուղեկցի վեբ հասանելիության կարևորության, հիմնական սկզբունքների և գործող ռազմավարությունների՝ բոլորին ծառայող կայքեր ստեղծելու համար՝ անկախ հնարավորություններից:

Ինչու է կարևոր մատչելիությունը

1. Հաշմանդամություն ունեցող անձանց հզորացում

Ավարտվել է Աշխարհում 1 միլիարդ մարդ ապրում է հաշմանդամության որևէ ձևով. Մատչելի կայքերն ապահովում են, որ նրանք կարող են ներգրավվել ձեր բովանդակության, ծառայությունների և ապրանքների հետ, ինչպես մյուսները:

2. Իրավական համապատասխանություն

Մատչելիության չափանիշներին չհամապատասխանելը կարող է հանգեցնել դատական հայցերի և տույժերի: ԱՄՆ-ում վեբ հասանելիության հետ կապված ADA-ի հայցերը աճում են, և WCAG-ի համապատասխանությունը հաճախ նշվում է որպես հասանելիության չափանիշ:

3. Ընդլայնելով ձեր լսարանը

Մատչելի կայքերը կարող են օգտագործվել ավելի լայն լսարանի կողմից, ներառյալ տարեցները, ժամանակավոր հաշմանդամություն ունեցող անձինք և նույնիսկ դժվար միջավայրում գտնվող օգտվողները (օրինակ՝ վատ լուսավորություն կամ աղմկոտ տարածքներ):

4. SEO-ի առավելությունները

Մատչելիության բարելավումները հաճախ համընկնում են SEO-ի լավագույն փորձը, օրինակ՝ պատկերներին այլընտրանքային տեքստ ավելացնելը կամ իմաստային HTML-ով բովանդակության կառուցվածքը:

Մատչելի վեբ դիզայնի հիմնական սկզբունքները

1. ընկալելի

Բովանդակությունը պետք է ներկայացվի այնպես, ինչպես օգտվողները կարող են ընկալել.

• Տեքստային այլընտրանքներ տրամադրեք ոչ տեքստային բովանդակության համար (օրինակ՝ պատկերների համար այլընտրանքային տեքստ):
• Օգտագործեք ենթագրեր և տառադարձումներ մուլտիմեդիայի համար:
• Ապահովեք բավարար հակադրություն տեքստի և ֆոնի գույների միջև:

2. Շահագործելի

Օգտագործողները պետք է կարողանան նավարկելու և փոխազդելու ձեր կայքի հետ՝

• Բոլոր գործառույթները հասանելի դարձրեք ստեղնաշարի նավիգացիայի միջոցով:
• Խուսափեք նոպաներ հրահրող տարրերի նախագծումից, օրինակ՝ շողացող անիմացիաներից:
• Ապահովեք հստակ նավարկություն՝ հետևողական մենյուներով:

3. Հասկանալի է

Բովանդակությունը և օգտագործողի միջերեսը պետք է հեշտ հասկանալի լինեն.

• Օգտագործեք պարզ, պարզ լեզու:
• Տրամադրեք ցուցումներ ձևերը լրացնելու համար:
• Համոզվեք, որ վեբ էջերը կանխատեսելի են վարվում, երբ օգտատերերը շփվում են նրանց հետ:

4. Ամուր

Ձեր կայքը պետք է համատեղելի լինի օժանդակ տեխնոլոգիաների հետ.

• Օգտագործեք մաքուր, իմաստային HTML:
• Պարբերաբար փորձարկեք ձեր կայքը էկրանի ընթերցիչներով և այլ գործիքներով:
• Հետևեք WCAG-ի ուղեցույցներին՝ ապագայում ապահով հասանելիությունը պահպանելու համար:

Մատչելի կայքերի նախագծման լավագույն փորձը

1. Օգտագործեք Semantic HTML

Իմաստային HTML-ը բարելավում է կառուցվածքը և ընթերցանությունը օժանդակ տեխնոլոգիաների համար, ինչպիսիք են էկրանի ընթերցողները: Օգտագործեք պատշաճ պիտակներ, ինչպիսիք են<header> ,<main> ,<section> , և<footer> , հստակ հիերարխիա ստեղծելու համար։

2. Տրամադրել տեքստային այլընտրանքներ

Նկարներին ավելացրեք այլընտրանքային տեքստ, որպեսզի էկրանի ընթերցողները կարողանան նկարագրել դրանք տեսողության խնդիրներ ունեցող օգտատերերին: Գրեք նկարագրական, հակիրճ այլընտրանքային տեքստ, որը փոխանցում է պատկերի նպատակը:

Օրինակ՝

Վատ այլընտրանքային տեքստ. Image123.png

Լավ այլընտրանքային տեքստ. Կինը, ով նոութբուք է օգտագործում սուրճի խանութում.

3. Ապահովել ստեղնաշարի հասանելիությունը

Բոլոր ինտերակտիվ տարրերը, ինչպիսիք են կոճակները, հղումները և ձևի դաշտերը, պետք է օգտագործվեն ստեղնաշարի նավիգացիայի միջոցով: Փորձարկեք ձեր կայքը հետ Ներդիր բանալին՝ ապահովելու տրամաբանական կենտրոնացման կարգը:

4. Ստեղծեք մատչելի ձևեր

Ձևաթղթերը կարևոր են այնպիսի փոխազդեցությունների համար, ինչպիսիք են գրանցվելը կամ գնումներ կատարելը: Համոզվեք, որ դրանք հասանելի են՝

• Հստակորեն պիտակավորելով ձևի բոլոր դաշտերը:
• ARIA (Accessible Rich Internet Applications) դերերի օգտագործում՝ ձևի տարրերը նկարագրելու համար:
• Սխալների հաղորդագրությունների բացահայտ և հստակ ցուցադրում:

5. Օպտիմալացնել գունային հակադրությունը

Ցածր հակադրությունը կարող է տեքստը դարձնել անընթեռնելի տեսողության խանգարումներ ունեցող մարդկանց համար: Հետևեք այս հակադրության հարաբերակցությանը.

• 4.5:1 նորմալ տեքստի համար:
• 3:1 մեծ տեքստի համար:

Օգտագործեք այնպիսի գործիքներ, ինչպիսիք են Կոնտրաստ ստուգիչ ձեր դիզայնը փորձարկելու համար:

6. Ներառեք ենթագրեր և տառադարձումներ

Տեսանյութերի և աուդիո բովանդակության համար տրամադրեք.

• Ենթագրեր խուլ կամ վատ լսող օգտատերերի համար:
• Սղագրություններ օգտվողների համար, ովքեր նախընտրում են տեքստի վրա հիմնված բովանդակություն:

7. Պատասխանատու կայքերի ձևավորում

Համոզվեք, որ ձեր կայքը անխափան աշխատում է տարբեր սարքերի և էկրանի չափսերի վրա: Մատչելիությունը տարածվում է բջջային օգտատերերի վրա, ովքեր հաճախ ապավինում են սենսորային նավիգացիայի կամ էկրանի խոշորացմանը:

8. Նվազագույնի հասցնել ճանաչողական բեռը

Պարզեցրեք ձեր դիզայնը և բովանդակությունը՝ ճանաչողական հաշմանդամություն ունեցող օգտատերերին օգնելու համար.

• Օգտագործեք պարզ նավարկություն:
• Խուսափեք խառնաշփոթ դասավորություններից:
• Տրամադրեք հստակ վերնագրեր և ենթավերնագրեր՝ օգտվողներին բովանդակության միջոցով առաջնորդելու համար:

Մատչելիության փորձարկման գործիքներ

1. ԱԼԻՔ

Վեբ հասանելիության գնահատման անվճար գործիք, որն ընդգծում է խնդիրները և բարելավման առաջարկներ է տալիս:

2. Փարոս

Google-ի ներկառուցված Chrome գործիքն առաջարկում է մատչելիության աուդիտ՝ որպես իր կատարողականի գնահատման մաս:

3. ԿԱՑՆ

Բրաուզերի ընդլայնում, որը ինտեգրվում է զարգացման աշխատանքային հոսքերին՝ հայտնաբերելու մատչելիության խախտումները:

4. NVDA և JAWS

Էկրանի ընթերցիչներ՝ ստուգելու, թե որքան լավ է ձեր կայքը աշխատում տեսողության խնդիրներ ունեցող օգտատերերի համար:

Գործի ուսումնասիրություններ. Մատչելիությունը գործողության մեջ

1. BBC

BBC-ի վեբկայքը առաջնահերթություն է տալիս հասանելիությանը այնպիսի գործառույթներով, ինչպիսիք են հարմարեցված տեքստի չափը, գունային սխեմաները և ստեղնաշարի կայուն նավարկությունը:

2. LinkedIn

LinkedIn-ը թարմացրել է իր հարթակը, որպեսզի համապատասխանի մատչելիության չափանիշներին, այդ թվում՝ բարելավելով գունային հակադրությունը և աջակցելով էկրանի ընթերցողներին:

3. Apple

Apple-ը հետևողականորեն առաջատար է մատչելիությամբ՝ առաջարկելով գործառույթներ, ինչպիսիք են VoiceOver-ը, էկրանի ընթերցողը՝ ինտեգրված իր էկոհամակարգում:

Ընդհանուր սխալներ, որոնցից պետք է խուսափել

1. Օգտագործելով անհասանելի Captchas Տրամադրեք աուդիո կամ պատկերային այլընտրանքներ տեսողական captcha-ների համար:
2. Հենվելով բացառապես տեսողական նշանների վրա Համոզվեք, որ հղումներն ու կոճակները տարբերվում են տեքստի կամ ARIA ատրիբուտների, ոչ միայն գույնի միջոցով:
3. Թեստավորման անտեսում Պարբերաբար փորձարկեք ձեր կայքը իրական օգտատերերի հետ, ովքեր ապավինում են օժանդակ տեխնոլոգիաներին:

Վեբ հասանելիության ապագան

Քանի որ տեխնոլոգիան զարգանում է, վեբ հասանելիությունն ավելի ու ավելի է ինտեգրելու AI-ն, ձայնի ճանաչումը և ընդլայնված իրականությունը՝ ավելի ընդգրկուն փորձառություններ ստեղծելու համար: Առաջ մնալով միտումներից և հավատարիմ մնալով մատչելիության չափանիշներին՝ բիզնեսները կարող են խթանել ներառականությունը՝ միաժամանակ մնալով մրցունակ:

Մատչելիությունը դարձրեք առաջնահերթություն

Մատչելի կայքերի նախագծումը նշանակում է հավասար հնարավորություններ ստեղծել բոլորի համար՝ մուտք գործելու և ձեր բովանդակությունից օգուտ քաղելու համար: Հետևելով լավագույն փորձին և շարունակաբար կատարելագործելով ձեր կայքը՝ դուք ոչ միայն համապատասխանում եք իրավական չափանիշներին, այլև ցուցադրում եք ներառականության և սոցիալական պատասխանատվության ձեր նվիրվածությունը:

Սկսեք ձեր կայքը հասանելի դարձնել հենց այսօր՝ դա ներդրում է ձեր ապրանքանիշի, ձեր օգտատերերի և ապագայի մեջ: