Verkkosivuston käytettävyyden ja saavutettavuuden arviointi

Abstract

Tämän opinnäytetyön tarkoituksena oli arvioida toimeksiantajan, Eräjärven Työväen Näyttämö ry:n, verkkosivuston käyttäjäystävällisyyttä käytettävyyden ja saavutettavuuden näkökulmista. Tavoitteena oli tuottaa asiantuntija-arvio verkkosivuston nykytilasta sekä esittää kehitysehdotuksia sivuston parantamiseksi.

Verkkosivusto toimii tärkeänä markkinointikanavana ja sen tulisi olla helposti löydyttävä ja tarjota käyttäjilleen tietoa miellyttävällä tavalla. Tutkimustyön tuloksista hyötyvät toimeksiantajan lisäksi yhteistyökumppanit, asiakkaat sekä muut vastaavien sivujen suunnittelijat ja toteuttajat.

Käytettävyyden tietoperusta rakentuu standardista (ISO 9241-11), verkkolähteistä, kirjallisuudesta ja julkaisuista, jotka perustuvat tieteelliseen tutkimukseen. Saavutettavuuden tietoperustana olivat W3C:n määrittelemä standardi WCAG 2.1, siihen viittaavat lait ja standardit (mm. EN 301 549). Tietoa on koostettu W3C:n, Traficomin sekä Kehitysvammaliitto ry:n sekä muiden julkisten toimijoiden julkaisuista ja verkkosivuilta.

Käytettävyyden tutkimusmenetelmänä käytettiin asiantuntija-arviointia Nielsenin heuristiikkaa hyödyntäen. Saavutettavuutta tutkittiin manuaalisesti ja automaattisesti testaten eri verkkopalveluilla. Automaattisten testien vertailun perusteella valittiin IBM Equal Accessibility Checker ja Google Lighthouse, joita täydennettiin WebAIM:n WAVE-työkalulla.

Tutkimuksen tuotoksina syntyivät verkkosivuston käytettävyys-saavutettavuusarvioinnit. Käytettävyys todettiin pääosin hyväksi, ja vakavia ongelmia havaittiin vain kolme. Saavutettavuustestauksessa suurimmat puutteet liittyivät havaittavuuteen ja hallittavuuteen, erityisesti kuvien alt-tekstien, kontrastien ja elementtien määrittelyiden osalta. Automaattisten testien saavutettavuustasot olivat 86 (IBM) ja 90 (Lighthouse).

Kehitysehdotuksista keskeisimmät liittyvät yhden sivun linkkien toimintaan, alt-tekstien lisäämiseen, palautelomakkeen ja elementtien määrittelyyn sekä värien ja fonttien kontrastien parantamiseen saavutettavuusvaatimusten mukaisiksi.

The purpose of this Bachelor thesis was to evaluate the user-friendliness of Eräjärven Työväen Teatteri association’s websites by examining its usability and accessibility. The object was to provide an expert evaluation of the website’s current situation and present development suggestions to improve the website.

The website serves as a particularly important marketing channel, and it should be easily found and provide information to its users in a user-friendly manner. The research results will be useful for the target association, its partners and customers, and other designers and implementers of similar websites.

The theoretical framework for the usability is based on the ISO 9241-11 standard and academic literature. The framework for accessibility is based on the WCAG 2.1 standard (Web Content Accessibility Guidelines) defined by the W3C (World Wide Web Consortium) and related legist and standards, e.g. EN 301 549. Information is compiled from W3C, Finnish Transport and Communications Agency and The Finnish Association on Intellectual and Developmental Disabilities among other public sector actors’ online publications.

The usability evaluation was conducted as an expert review using Nielsen’s heuristics. Accessibility was evaluated both manually and automatically using online tools. Based on a performed comparison of these tools, IBM Equal Accessibility Checker and Google Lighthouse were selected for reporting and WebAIM’s WAVE as a complementary tool.

The output of the study was an analysis of the website’s usability and accessibility. The results indicate that usability is on an adequate level, and only three serious issues were identified. In accessibility research most of the shortcomings were found in perceivability and operability, particularly in the graphic’s alt texts, contrast levels, and element definitions. The scores of the automated tests were 86 (IBM) and 90 (Lighthouse).

Development suggestions include improving at few internal links, adding the missing alt texts and properly defining form fields and other elements as well as adjusting colours and fonts according to the accessibility requirements.