İnkişaf

Saytın əlçatanlığı: kimə və nəyə lazımdır

Əlçatanlıq yalnız əlilliyi olan insanlara lazım deyil. Kontrastı, klaviaturanı, sahələrə imzaları və alternativ mətni — və bunu niyə dərhal nəzərə almağın daha ucuz olduğunu təhlil edirik.

Əlçatanlığı adətən "sosial məsuliyyət" kateqoriyasına təxirə salırlar: faydalıdır, amma gəlirlə bağlı deyil və bizim halımıza aid deyil. Bu, qeyri-dəqiq çərçivədir. Əlçatanlıq tələblərinin böyük hissəsi istənilən ziyarətçinin düşdüyü adi vəziyyətləri təsvir edir və bu tələblərin yerinə yetirilməməsi sizə hər gün müraciətlərə başa gəlir.

Bu, əslində kimə lazımdır

Əlçatanlıq saytdan qeyri-ideal şəraitdə istifadə etməyin mümkün olmasına aiddir. Qeyri-ideal şərait hamıda olur.

  • İnsan parlaq günəşdə telefon ekranını oxuyur. Ağ fonda açıq-boz mətn mövcud olmağı dayandırır.
  • İnsanın siçanı sınıb və ya batareyası bitib və o, səhifədə Tab düyməsi ilə gəzir.
  • İnsan səs-küylü yerdə qulaqlıqsız videoya baxır — və subtitrlərsiz heç nə başa düşmür.
  • İnsan bir əli ilə uşağı tutur və kiçik düymələrə düşmür.
  • İnsan əllidən yuxarıdır və xırda şrifti otuz yaşlı dizaynerdən pis oxuyur.
  • İnsanın interneti yavaşdır, şəkillər yüklənməyib — və məhsullar əvəzinə boş düzbucaqlılar görür.
  • İnsan görmədiyi üçün ekrandan oxuma proqramından istifadə edir.

İlk altı bənd azlıq deyil. Bu, adi auditoriyanın adi günüdür. Və bu vəziyyətlərdə kömək edən həllər sonuncu bəndə lazım olanlarla tamamilə eynidir.

Əlçatanlıq xüsusi istifadəçilər üçün saytın ayrıca versiyası deyil. Bu, proqramçının kabinetindən fərqli şəraitdə yoxlanılmış əsas versiyanın keyfiyyətidir.

Praktikada bu, nə deməkdir

Kontrast

Ən tez-tez rast gəlinən və ən ucuz pozuntu. Ağ üzərində açıq-boz mətn, açıq fonda ağ, altlığı olmayan fotonun üzərində yazı — bunların hamısı otaqda oxunur və çöldə yox olur.

Yoxlanıla bilən meyar var: mətnin və fonun parlaqlıq nisbəti. Əlçatanlıq üzrə beynəlxalq WCAG tövsiyələri adi mətn və iri mətn üçün ayrıca minimal dəyərlər təyin edir. Bu, zövq məsələsi deyil — kontrast alətlə hesablanır və nəticə ya həddi keçir, ya da yox.

Ayrıca yalnız mətni deyil, daxiletmə sahələrinin sərhədlərini, ikonları, düymələrin vəziyyətlərini də yoxlayırlar. Üzərinə gəldikdə yalnız zorla seçilən çalarla fərqlənən düymə yalnız rəng qavrayışı pozulmuş insanlar üçün deyil, əlçatmazdır — o, sadəcə görünmür.

Və əlaqəli qayda: rəng mənanın yeganə daşıyıcısı olmamalıdır. Formadakı səhv yalnız qırmızı çərçivə ilə göstərilibsə, insanların bir hissəsi onu görməyəcək. Yazı da lazımdır.

Klaviatura ilə idarəetmə

Yoxlama bir dəqiqə çəkir: saytınızı açın və onu yalnız Tab və Enter düymələri ilə keçməyə çalışın. Ən tez-tez sınan üç şey.

  1. Fokusun harada olduğu görünmür. Proqramçı aktiv elementin ətrafındakı "çirkin" çərçivəni çıxarıb və onu heç nə ilə əvəz etməyib. Nəticədə insan Tab-a basır və hara düşdüyünü başa düşmür.
  2. Tələlər var. Açılan pəncərə açıldı, ondan klaviatura ilə çıxmaq isə olmur. Və ya fokus vidcetə düşür və geri qayıtmır.
  3. Basmaq olmur. Düymə klik emalçısı olan adi blok kimi hazırlanıb və klaviatura onun üzərinə ümumiyyətlə gəlmir.

Faydalı xırdalıq — hər dəfə bütün menyunu keçməmək üçün səhifənin ən əvvəlində "məzmuna keç" keçidi.

Sahələrə imzalar

İmza daimi və sahə ilə əlaqəli olmalıdır. Tez-tez rast gəlinən səhv — imza əvəzinə sahənin içində ipucu: insan yazmağa başladı, ipucu yox oldu və o, artıq hansı sahədə olduğunu xatırlamır. Bu, xüsusilə uzun formalarda və telefondan doldurarkən ağrılıdır.

Sonra — format. Telefonu müəyyən şəkildə daxil etmək lazımdırsa, bu, göndərişdən sonra səhv kimi çıxmamalı, əvvəlcədən yazılmalıdır. Səhvin özü dəqiq nəyin düz olmadığını və nə etmək lazım olduğunu deməli və yuxarıda ümumi sətir kimi deyil, sahənin yanında yerləşməlidir.

Məcburi sahələr açıq qeyd olunur. Daha yaxşısı — onsuz keçinmək mümkün olanı məcburi etməmək: hər artıq sahə göndərilmiş formaların sayını azaldır.

Alternativ mətn

Şəklin mətn təsviri şəkil məna daşıyanda lazımdır: məhsul fotosu, sxem, ekran görüntüsü, diaqram. Təsvir fayl adını və ya açar sözlər dəstini deyil, mənanı ötürməlidir.

Sırf dekorativ şəkillərə təsvir lazım deyil — onları ekrandan oxuma proqramı buraxsın deyə dekorativ kimi işarələmək düzgündür. Fon naxışlarını səsli təkrarlamaq susmaqdan pisdir.

Ayrıca hal — şəklə tikilmiş mətn. Onu nə böyütmək, nə seçmək, nə tərcümə etmək, nə də axtarışla tapmaq olar. Şəkil şəklində qiymət siyahısı və ya aksiya şərtləri itirilmiş məlumatdır.

Struktur və anlaşılan mətn

Başlıqlar iri qalın mətn deyil, başlıq olmalıdır. Səviyyələr ardıcıl gedir — onlara görə həm oxuma proqramları, həm axtarış sistemləri, həm də səhifəni gözlə skan edən insanlar istiqamət alır.

Keçidlər kontekstdən kənarda anlaşılan olmalıdır. Ardıcıl on "ətraflı" keçidi heç nə demir; "çatdırılma şərtləri" deyir. Eyni qayda səhifəyə diaqonal baxan hər kəsin həyatını asanlaşdırır.

Niyə dərhal nəzərə almaq daha ucuzdur

Fərq iş həcmində deyil, dəqiq nəyi yenidən etmək lazım gəldiyindədir.

Dizayn mərhələsində kontrastlı rəng cütü seçmək — sıfır əlavə xərcdir. Başlanğıcdan sonra bu, palitranın, onunla birlikdə isə köhnə çalarda hazırlanmış bütün maketlərin, bannerlərin və reklam materiallarının yenidən nəzərdən keçirilməsi deməkdir.

Maket mərhələsində düymələr və sahələr üçün düzgün elementlərdən istifadə etmək də sıfır xərcdir, bu, sadəcə düzgün üsuldur. Başlanğıcdan sonra bu, interfeysin yenidən yazılması və bütün ssenarilərin təkrar yoxlanılmasıdır.

Layihələndirmə zamanı formaya imzalar qoymaq — bir dəqiqədir. Artıq analitikası və CRM ilə inteqrasiyası qurulmuş formanı yenidən etmək — reqressiya ilə ayrıca tapşırıqdır.

Buraya əlavə edin ki, əlçatanlıq həllərinin bir hissəsi digər göstəriciləri birbaşa yaxşılaşdırır: düzgün başlıq strukturu axtarışa kömək edir, anlaşılan imzalar və səhv ifadələri doldurulmuş formaların payını artırır, şəkillərdə mətndən imtina məzmunu indeksləşdirilən edir. Bu, xeyriyyəçilik deyil, normal icra keyfiyyətidir — biz ona saytlar üzərində işin hissəsi kimi yanaşırıq.

Birbaşa tələblər də olur: bəzi sahələrdən olan təşkilatlar və dövlət sifarişçiləri ilə işləyənlərin hamısı əlçatanlıq normalarına əməl etməyə borcludur. Belə layihələr üçün sual "lazımdırmı" deyil, "necə təsdiqləmək"dir.

Bu gün nəyi yoxlamaq

  1. Saytı Tab düyməsi ilə keçin: fokus görünürmü, bütün düymələr əlçatandırmı, açılan pəncərələrdən çıxmaq olurmu.
  2. Əsas səhifəni günəşli gündə çöldə telefonda açın.
  3. Əsas rəngləri istənilən kontrast kalkulyatorundan keçirin və WCAG hədləri ilə tutuşdurun.
  4. Forma sahələrinin daimi imzalarının və anlaşılan səhv mesajlarının olub-olmadığını yoxlayın.
  5. Məna daşıyan şəkilləri tapın və onların təsvirinin olduğuna əmin olun.
  6. Yalnız şəkil şəklində mövcud olan vacib məlumatın olub-olmadığını yoxlayın.
  7. Başlıqların səviyyələr üzrə getdiyinə və iri qalın mətnlə əvəz edilmədiyinə baxın.
  8. Brauzerdə səhifənin miqyasını böyüdün və maketin dağılmadığına əmin olun.

İlk dörd bənd real problemlərin böyük hissəsini bağlayır. Yoxlama zamanı necə düzəltmək anlaşılmayan nəsə tapılsa, bizə yazın — konkret halı təhlil edəcəyik.