Estetinis patrauklumas ar prieinamumas: internetinių svetainių dizaino dilema

Estetika ar prieinamumas

Norėdami pradėti, apibrėžkime, ką turime omenyje sakydami svetainės estetika ir prieinamumas. Svetainės estetika reiškia dizainą, vizualinius svetainės aspektus, įskaitant turinio išdėstymą, spalvų pasirinkimą, šriftų stilius, paveikslėlių, animacijų ir naudotojo sąsajos elementų, įtraukimą.

Kita vertus, prieinamumas reiškia, kaip lengvai vartotojai gali pasiekti svetainę ir ja naudotis, nepaisant laikinų ar nuolatinių, fizinių ar pažintinių negalių. Tai apima tokius aspektus, kaip šrifto dydis, spalvų kontrastas, alternatyvus vaizdų tekstas, naršymo struktūra ir kt.

Iš pirmo žvilgsnio gali atrodyti, kad svetainės estetika ir prieinamumas prieštarauja vienas kitam. Juk vizualiai stulbinančiai svetainei gali prireikti tam tikrų dizaino pasirinkimų, dėl kurių kai kuriems vartotojams ji tampa mažiau prieinama. Pavyzdžiui, svetainė, kurioje naudojama daug vaizdų ir animacijos, gali būti vizualiai įspūdinga, tačiau jos įkėlimas taip pat gali užtrukti ilgiau, todėl lėtą interneto ryšį turintiems vartotojams sunku svetainę pasiekti. Panašiai svetainė, kurioje baltame fone naudojami maži, šviesūs šriftai, gali atrodyti patraukliai, tačiau regos negalią turintiems vartotojams gali būti sunku arba neįmanoma perskaityti taip pateiktą informaciją.

Pusiausvyros radimas

Svarbu pažymėti, kad svetainės estetika ir prieinamumas nebūtinai yra vienas kitą paneigiantys.

Tiesą sakant, gerai sukurta svetainė gali būti ir vizualiai patraukli, ir prieinama.

Pavyzdžiui, svetainė, kurioje naudojamos didelio kontrasto spalvos, dideli šriftai ir aiškūs naršymo elementai, gali būti tiek vizualiai stulbinanti, tiek vartotojams su negalia lengvai pasiekiama ir naudojama.

Taigi, ką ši įtampa tarp svetainės estetikos ir prieinamumo mums sako apie dizaino prigimtį? Iš esmės dizainas yra problemų sprendimas.

Dizainerio darbas yra rasti geriausią įmanomą konkrečios problemos sprendimą, nesvarbu, ar ta problema yra kaip sukurti vizualiai stulbinančią svetainę, ar kaip padaryti, kad svetainė būtų prieinama visiems vartotojams.

Tai reiškia, kad dizaineriai turi būti pasirengę kompromisams, kad rastų geriausią įmanomą sprendimą.

Svetainės dizaino atveju tai reiškia, kad dizaineriai turi būti pasirengę paaukoti kai kuriuos estetinius elementus, kad svetaines padarytų labiau prieinamas.

Tačiau tai nereiškia, kad prieinamumas turi būti įgyvendinamas estetikos sąskaita. Atvirkščiai, tai reiškia, kad dizaineriai turi būti kūrybingi ir novatoriški, ieškodami būdų, kaip padaryti kuriamas svetaines ir vizualiai stulbinančias, ir visiems prieinamas.

Populiarios patrauklaus, bet neprieinamo dizaino tendencijos

Siekis sukurti vizualiai stulbinančią svetainę kartais gali lemti dizaino pasirinkimus, dėl kurių kai kuriems vartotojams sunku arba neįmanoma pasiekti svetainės. Žemiau aptariame keletą blogiausių gražaus, bet neprieinamo dizaino praktikų.

1. Mažo kontrasto spalvų schemos

Mažo kontrasto tekstas gali labai paveikti naudotojo patirtį, ypač regos negalią turintiems vartotojams. Kai teksto ir fono spalvų kontrastas yra nepakankamas, silpnaregiams ar daltonistams tekstą gali būti sunku arba neįmanoma perskaityti. Tai gali sukelti nusivylimą ir trukdyti vartotojui pasiekti informaciją svetainėje.

Be to, mažas kontrastas taip pat gali turėti įtakos naudotojams, turintiems normalų regėjimą, bet esant prastam apšvietimui arba naudojant prastos kokybės ekranus. Tekstas gali atrodyti neryškus arba sunkiai skaitomas, todėl akys pavargsta. Dėl to naudotojai gali išeiti iš svetainės arba ieškoti alternatyvių informacijos šaltinių, o tai galiausiai turės įtakos svetainės įtraukimo ir naudotojų išlaikymo metrikai.

Kontrasto tikrinimo įrankiai

Tokie įrankiai kaip WebAIM Contrast Checker gali būti naudingas būdas užtikrinti, kad jūsų svetainės spalvų schema yra prieinama visiems vartotojams. Šis įrankis leidžia įvesti svetainės spalvas ir įvertinti kontrastą tarp jų, remiantis Saityno turinio prieinamumo gairių (WCAG) standartais. Naudodami kontrasto tikrintuvą galite lengvai nustatyti sritis, kuriose spalvų kontrastas yra per mažas, ir atlikti reikiamus pakeitimus, kad pagerintumėte prieinamumą. Tai gali apimti priekinio plano (angl. foreground) ir fono spalvų reguliavimą arba skirtingų spalvų schemų pasirinkimą.

2. Nereikalingas judesys

Animacijų / judėjimo dizainas gali būti vizualiai patrauklus, tačiau kai kuriuos vartotojus, ypač tuos, kurie turi pažinimo ar vestibuliarinių sutrikimų, gali blaškyti ir priblokšti (neigiama prasme). Dizaineriai turėtų atsižvelgti į judesių tipą ir kiekį, ir užtikrinti, kad tai netrukdytų naudotojo galimybei pasiekti turinį.

Tai apima ir įvairius užvedimo (angl. hover) efektus. Nors užvedimo efektai gali suteikti svetainei interaktyvumo ir "gilumo", jie taip pat gali sujaukti vartotojų, turinčių judrumo problemų, patirtį. Užvedus pelės žymeklį, naudotojams gali būti sunku naršyti svetainėje, ypač jei jie naudoja jutiklinio ekrano įrenginį.

Štai keli saugaus, rizikingo ir reikalavimų neatitinkančio judesio efektų pavyzdžiai:

1. Saugaus judesio efektai: tai tie efektai, kurie nekelia didelės rizikos įvairių gebėjimų ir poreikių turintiems naudotojams. Saugaus judesio efektų pavyzdžiai gali būti subtilios animacijos, padedančios nukreipti naudotojo žvilgsnį į svarbų turinį, arba paprasti perėjimai tarp puslapių, padedantys naudotojams sekti savo vietą svetainėje.
2. Rizikingas judesio efektai: tai tokie efektai, kurie gali kelti pavojų naudotojams, turintiems tam tikrą negalią, pvz., turintiems vestibuliarinių sutrikimų arba epilepsija. Rizikingų judesių efektų pavyzdžiai gali būti animacijos, kurios juda per greitai arba turi blyksčio efektą, nes kai kuriems naudotojams tai gali sukelti pykinimą ar galvos svaigimą.
3. Reikalavimų neatitinkančio judesio efektai: tai tokie efektai, kurie pažeidžia pritaikymo neįgaliesiems gaires. Juos naudojant, tam tikriems naudotojams tampa sunku arba neįmanoma pasiekti svetainės. Reikalavimų neatitinkančių judesio efektų pavyzdžiai gali būti animacijos, kurių vartotojas negali pristabdyti ar sustabdyti arba kurios suaktyvinamos automatiškai be vartotojo žinios / įvesties.

Siekdami sukurti prieinamus judesio efektus, dizaineriai turėtų teikti pirmenybę naudotojo valdymui ir savarankiškumui. Vengti animacijų ar perėjimų, kurie kai kuriuos vartotojus gali blaškyti. Svarbu išbandyti pasirinktus judesio efektus su įvairiais naudotojais, įskaitant žmones su negalia, kad įsitikintumėte, jog jie yra saugūs ir atitinka pritaikymo neįgaliesiems gaires. Be to, dizaineriai gali peržiūrėti išteklius, pvz., WCAG gaires arba prieinamumo testavimo įrankius, kad padėtų nustatyti galimas prieinamumo problemas ir užtikrinti, kad jų projektai būtų prieinami visiems vartotojams.

3. Automatinis garso ar vaizdo įrašo atkūrimas

Nors garsas ir vaizdo įrašai gali būti patrauklūs ir vizualiai įspūdingi, jie taip pat gali būti neįtikėtinai trikdantys ir varginantys vartotojus, ypač tuos, kurie turi jutimo apdorojimo sunkumų. Naudotojams gali būti sunku valdyti arba sustabdyti garso ar vaizdo įrašą, o tai gali sukelti painiavą ir nusivylimą. Jau nekalbant apie vartotojų, kurie dirba ramioje, tylioje aplinkoje, pavyzdžiui, bibliotekose ar biuruose, išblaškymą.

Be to, automatinis garso ar vaizdo įrašų atkūrimas gali trukdyti naudoti pagalbines technologijas, pvz., ekrano skaitytuvus, kuriais regos negalią turintys vartotojai gali pasikliauti naršydami svetainėje. Dėl to šiems vartotojams gali būti sunku arba neįmanoma pasiekti jiems reikalingo turinio, o tai dar labiau trukdo efektyviai naudotis svetaine.

Apskritai, automatinis garso ar vaizdo įrašų atkūrimas gali sukurti didelę prieinamumo kliūtį, sukeldamas nusivylimą ir sunkumų įvairių gebėjimų ir poreikių turintiems vartotojams. Dizaineriai turėtų teikti pirmenybę vartotojo kontrolei ir savarankiškumui bei vengti automatinio garso ar vaizdo turinio paleidimo, užtikrinant, kad visi vartotojai galėtų pasiekti jiems reikalingą turinį be trukdžių.

4. Per didelis dekoratyvinių elementų naudojimas

Per didelis dekoratyvinių elementų naudojimas gali būti pagrindinė prieinamumo problema, nes dėl to naudotojams gali būti sunku atskirti svarbų turinį nuo vien dekoratyvinių elementų. Tai gali būti ypač problemiška regėjimo negalią turintiems naudotojams, kurie naršydami svetainėje pasikliauja ekrano skaitytuvais ar kitomis pagalbinėmis technologijomis.

Pagrindinė dekoratyvinių elementų problema yra ta, kad jie gali užgriozdinti svetainę ir vartotojams sunkiau rasti tai, ko jie ieško. Pavyzdžiui, jei svetainėje naudojama daug dekoratyvinių piktogramų ar vaizdų, naudotojams gali būti sunku atskirti tuos elementus inuo svarbesnio turinio, pvz., naršymo nuorodų ar antraščių.

Vienas iš būdų išspręsti šią problemą – ribotai naudoti dekoratyvinius elementus ir užtikrinti, kad jie būtų aiškiai pažymėti. Tai galima padaryti prie vaizdų pridedant „alt“ atributą, kuris apibūdina vaizdą tekste naudotojams, kurie jo nemato. Be to, dizaineriai gali naudoti spalvą, dydį ar padėtį, kad atskirtų dekoratyvinius elementus nuo svarbaus turinio.

Kitas sprendimas – supaprastinti bendrą svetainės dizainą ir teikti pirmenybę vartotojų poreikiams, o ne estetinėms nuostatoms. Sutelkdami dėmesį į vartotojo patirtį ir užtikrindami, kad svetainėje būtų lengva naršyti ir suprasti, dizaineriai gali sukurti visiems vartotojams prieinamesnę ir įtraukesnę patirtį.

5. Formos: vietos žymekliai vietoj etikečių

Vietos žymeklių (angl. placeholders) naudojimas vietoj etikečių formose yra įprasta šiuolaikinio interneto dizaino tendencija. Laikoma, kad vietos žymekliai gali sutaupyti vietos ir padaryti formą švaresnę bei estetiškesnę. Tačiau ši dizaino praktika gali kelti problemų dėl prieinamumo.

Vietos žymekliai nepakeičia etikečių, nes jie išnyksta, kai vartotojas pradeda pildyti formą. Tai gali sukelti problemų naudotojams, kurie naršydami internete naudojasi ekrano skaitytuvais ar kitomis pagalbinėmis technologijomis. Be etikečių jie gali nežinoti, kokios informacijos tikimasi kiekviename lauke, o tai gali sukelti painiavą ir klaidų.

Be to, vietos žymekliai dažnai pateikiami šviesesne ir mažiau matoma spalva nei etiketės. Silpnaregiams arba daltonistams gali būti sunku jas matyti ir skaityti, o tai dar labiau trukdo suprasti formos laukų paskirtį.

Kad formos būtų prieinamesnės, dizaineriai turėtų naudoti etiketes (angl. labels) ir vietos žymeklius (jei reikia). Šalia arba virš kiekvieno formos lauko turėtų būti pateikiamos etiketės su aiškiu ir aprašomu tekstu, paaiškinančiu, kokios informacijos reikia. Vietos žymekliai gali būti naudojami siekiant suteikti naudotojams papildomą kontekstą arba nurodymus, tačiau jie neturėtų būti vienintelė priemonė formų laukams identifikuoti.

Apibendrinant galima teigti, kad vietos žymekliai gali būti naudingi teikiant naudotojams papildomų nurodymų, bet jie neturėtų būti naudojami kaip etikečių pakaitalas. Etikečių ir vietos žymekliai naudojimas gali padėti užtikrinti, kad formos yra prieinamos visiems naudotojams, nepaisant jų gebėjimų ar pagalbinių technologijų naudojimo.

6. Neintuityvūs navigacijos elementai

Sudėtingi naršymo elementai, tokie kaip paslėpti meniu ar nestandartinės piktogramos, gali suklaidinti vartotojus ir apsunkinti jiems reikalingos informacijos paiešką. Tai gali būti ypač problematiška vartotojams, turintiems pažinimo sutrikimų arba vyresnio amžiaus vartotojams, kurie gali būti ne taip gerai susipažinę su šiuolaikinėmis interneto dizaino subtilybėmis.

Pakalbėkime apie „burger meniu“ – įprastą dizaino modelį, kuris apima naršymo parinkčių slėpimą už trijų eilučių piktogramos ekrano kampe. Burger meniu naudojimas gali būti patogus būdas sutraukti daug navigacijos į mažesnę erdvę, tačiau jį reikia naudoti atsargiai. Kai kuriais atvejais gali net nebūtina naudoti burger meniu.

Pavyzdžiui, jei svetainėje yra tik keli pagrindiniai puslapiai, gali būti intuityviau, kad tie puslapiai būtų pateikti pagrindinėje naršymo juostoje, o ne slėpti juos už burger meniu. Panašiai, jei svetainė yra skirta konkrečiai auditorijai, kuri galbūt nėra susipažinusi su burger meniu sąvoka, gali būti geriau naudoti tradicinę naršymo juostą.

Be to, svarbu atsižvelgti į svetainės ir jos naudotojų kontekstą. Jei svetainė yra skirta mobiliųjų įrenginių naudotojams, kurie yra įpratę matyti burger meniu, gali būti prasminga jį naudoti.

Galiausiai sprendimas, naudoti burger meniu ar ne, turėtų būti pagrįstas svetainės vartotojų poreikiais ir lūkesčiais, o ne tiesiog sekti tendencija ar naudoti tai kaip numatytąją parinktį.

7. Blogai suformatuotas tekstas ir mažas arba nereguliuojamas šrifto dydis

Blogai suformatuotą tekstą, pvz., toje pačioje pastraipoje naudojant kelis šriftus, dydžius ir spalvas, regos negalią turintiems vartotojams gali būti sunku perskaityti. Dizaineriai turėtų siekti paprastos, aiškios tipografijos, kurią būtų lengva perskaityti visiems vartotojams.

Kalbant apie šrifto teksto dydį, tinklalapius su mažu arba nereguliuojamu šrifto dydžiu gali būti sunku skaityti regos negalią turintiems vartotojams. Dizaineriai turėtų užtikrinti, kad šrifto dydis būtų pakankamai didelis, kad jį lengvai perskaitytų visi vartotojai, ir suteikti vartotojams galimybę prireikus koreguoti šrifto dydį.

8. Vaizdų naudojimas vietoj teksto

Vaizdų naudojimas vietoj teksto gali būti pagrindinė prieinamumo problema. Kai dizaineriai naudoja vaizdus svarbiai informacijai perduoti, pvz., mygtukams ar reklamjuostėms, tai gali sukurti kliūtį naudotojams, kurie naudojasi pagalbinėmis technologijomis, pvz., ekrano skaitytuvais, arba tiems, kurie turi regėjimo sutrikimų. Ekrano skaitytuvai negali nuskaityti vaizdų, o turintys regėjimo negalią vaizdų gali aiškiai nematyti.

Nors yra keletas išimčių, pvz., logotipai ir ženkleliai, svarbu naudoti tekstą, o ne vaizdus, kai tik įmanoma. Pavyzdžiui, vietoj paveikslėlio mygtukui „Pateikti“, geriau naudoti žodį „Pateikti“ teksto forma. Taip užtikrinama, kad visi vartotojai, nepaisant jų galimybių, galės pasiekti ir suprasti informaciją.

Jei yra konkreti priežastis, kodėl vaizdas turi būti naudojamas, dizaineriai prie vaizdo gali pridėti alternatyvų tekstą, dar vadinamą alt tekstu arba žyma. Alt tekste pateikiamas vaizdo aprašymas ir jo paskirtis pagalbinėms technologijoms. Tai leidžia ekrano skaitytuvams garsiai perskaityti aprašą regos negalią turintiems naudotojams, todėl informacija jiems tampa prieinama.

Verta paminėti, kad pastaraisiais metais buvo atsisakyta mygtukų ir kitų funkcinių elementų vaizdų, iš dalies dėl didėjančio supratimo apie prieinamumo problemas. Daugelis dizainerių dabar teikia pirmenybę mygtukų teksto naudojimui, taip pat užtikrina, kad tekstas būtų pakankamai didelis ir kontrastingas. Ši tendencija neabejotinai teikia vilčių ir yra žingsnis teisinga linkme kuriant įtraukesnį ir prieinamesnį interneto dizainą.

Išvada

Galiausiai įtampa tarp interneto estetikos ir prieinamumo primena, kad dizainas nėra vien tik gražių dalykų kūrimas. Tai yra problemų sprendimas ir geriausio įmanomo sprendimo tam iššūkiui radimas.

Kaip dizaineriai, turime būti pasirengę pirmiausia atsižvelgti į savo vartotojų poreikius, įgyvendinti kompromisus, o svarbiausia – būti atviri naujovėms. Šis metodas leidžia mums sukurti žiniatinklio aplinką, kuri būtų ne tik įspūdinga, bet ir svetinga bei prieinama visiems.