Accessibility in Website Design: A Guide to Analysing a Website for Accessibility and Inclusion #webbforalla
2023 (English)Independent thesis Basic level (university diploma), 10 credits / 15 HE credits
Student thesis
Abstract [en]
In today’s digital world, accessibility and inclusion are the hot key words. The world is realizing the limitations that some people have when accessing digital information, services, and tools due to disabilities. The governing bodies for the web, both on the European and national level are starting to specify requirements regarding how the digital information is produced and published to ensure that all people, independent of any disability, can access the information they require when located on the World Wide Web. To that degree, many existing websites need an overhaul in content and code to comply. But how? This project aims to shed light on where existing websites fail to comply with recommendations and requirements and give indication of the fix needed to change that. It is a step-by-step model presented as an online interactive tool where a reviewer can register and evaluate a website against the Web Content Accessibility Guidelines. The tool has strict controls with prerequisites, exceptions, examples, and suggested tools to aid evaluation. Elements that do not pass are detailed to then inform the web developer of the issues. At any time, an Accessibility Compliance Statement can be created to be published on the site which details the rate of compliance and any deficiencies the website has regarding accessibility. The inspiration for the tool and data for the test controls comes from the Swedish Agency for Digital Government. This tool is built with a MySQL database, a REST API web service and a client application that consumes the data. A literature study of the different frontend JavaScript and backend PHP frameworks was carried out and it was decided that Laravel PHP framework would be the tool for the web service and VUE.js for the client application. TailwindCSS was the chosen styling framework. To deploy the sites, again a review of the existing options was made, and the final choices were Heroku deployment service for the web service and Netlify deployment for the client application. This tool gives web developers a good idea of where an existing website fails in regard to accessibility guidelines and therefore can rectify these failures to have a site that passes with flying colours.
Abstract [sv]
I dagens digitala värld är tillgänglighet och inkludering de heta nyckelorden. Världen inser de begränsningar som vissa människor har när de får tillgång till digital information, tjänster och verktyg på grund av funktionshinder. Den styrande organisationen för webben, både på EU och nationell nivå börjar ställa krav på hur den digitala informationen produceras och publiceras för att säkerställa att alla människor, oberoende av eventuella funktionshinder, kan få tillgång till den information de behöver när den finns på nätet. I den grad behöver många befintliga webbplatser en översyn av innehåll och kod för att följa dem. Men hur? Detta projekt syftar till att belysa var befintliga webbplatser inte följer rekommendationer och krav och ge indikationer på vilken korrigering som behövs för att ändra det. Det är en steg-för-steg-modell som presenteras som ett interaktivt webbverktyg där en granskare kan registrera och utvärdera en webbplats mot WCAG. Verktyget har strikta kontroller med förutsättningar, undantag, exempel och föreslagna verktyg för att underlätta utvärdering. Element som inte går igenom är detaljerade för att sedan informera webbutvecklaren om de problem som ska åtgärdas. När som helst kan en tillgänglighetsredogörelse skapas för att publiceras på webbplatsen som beskriver graden av efterlevnad och eventuella brister som webbplatsen har när det gäller tillgänglighet. Inspirationen till verktyget och data för testkontrollerna kommer från Myndigheten för digital förvaltning. Detta verktyg är byggt med en MySQL-databas, en REST API-webbtjänst och en klientapplikation som förbrukar data. En litteraturstudie av de olika frontend- och backend-ramverken genomfördes och det beslutades att Laravel PHP-ramverket skulle vara verktyget för webbtjänsten och VUE.js för klientapplikationen. Tailwind CSS var det valda stylingramverket. För att distribuera webbplatserna gjordes återigen en översyn av de befintliga alternativen, och de slutliga valen var Heroku publiceringstjänsten för webbtjänsten och Netlify-publiceringstjänsten för klientapplikationen. Det här verktyget ger webbutvecklare en god uppfattning om var en befintlig webbplats misslyckas med hänsyn till riktlinjer för tillgänglighet och kan därför åtgärda dessa misslyckanden för att ha en webbplats som klarar sig med glans.
Place, publisher, year, edition, pages
2023. , p. 47
Keywords [en]
Accessibility and Inclusion, REST API, Laravel, PHP Backend Framework, VUE.js, JavaScript Frontend Framework, CSS Styling Framework, Heroku, Netlify, WCAG 2.1, WCAG 2.2
National Category
Computer Engineering
Identifiers
URN: urn:nbn:se:miun:diva-48434Local ID: DT-V23-G2-019OAI: oai:DiVA.org:miun-48434DiVA, id: diva2:1764040
Subject / course
Computer Engineering DT1
Educational program
Web Development TWEUG 120 higher education credits
Supervisors
Examiners
2023-06-082023-06-082023-06-08Bibliographically approved