Sprint 3: All human
Datum: 14/10/24
Wat heb je vandaag gedaan en geleerd?
Vandaag heb ik geleerd dat er regels zijn voor websites die ervoor zorgen dat accessibility-tools goed kunnen functioneren. Ik heb ook geleerd wat een Lighthouse-test is en hoe ik deze kan uitvoeren.
De Lighthouse-test kan niet alles testen, daarom zijn handmatige testen ook nodig. Ik heb de A11y-test gebruikt om te controleren of mijn website toegankelijk is.
Schrijf op wat je nog moet doen voor WCAG van woensdag
Voor de WCAG van woensdag moet ik nog de handmatige testen uitvoeren en mijn bevindingen opschrijven.
Sprint 3: All human
Datum: 16/10/24
Wat heb je vandaag gedaan en geleerd?
Vandaag heb ik een WCAG-audit gepresenteerd voor de Koffiesalon, het café waar ik werk. Daarnaast heb ik een user experience-workshop gedaan en gewerkt aan mijn "I Love Web"-project, waarin ik een nieuwe HTML-structuur heb opgezet voor betere toegankelijkheid.
Drie dingen die ik heb geleerd:
hoe een website toegankelijker gemaakt kan worden door goede HTML met juiste labels, alt-attributen en een heldere heading-structuur.
Screen readers moeilijk kunnen navigeren zonder ARIA-attributen.
En hoe ik Polypane kan gebruiken voor het testen van toegankelijkheid.
Beschrijf alle 6 onderwerpen uit de workshop en noteer welke je toe kan passen in je opdracht
Links:
een anchor tag kan je gebruiken om veel te doen: verwijzen naar een andere site, een id op dezelfde pagina, of om iets te laten downloaden. een anchor tag biedt meer functies aan dan een button
Afbeeldingen:
img heeft een passende alt attribute nodig, omdat het dan een stuk tekst laat zien als het niet ingeladen wordt. En zodat een screen reader kan aangeven wat voor soort foto daar staat.
Labels voor invoervelden:
als er een label om een input veld is, dan kan de gebruiker makkelijk op de input veld klikken. de gebruiker kan op de tekst van de input veld klikken en beland in de input veld, of tikt de checkbox aan. als er geen label was dan zou de gebruiker precies moeten klikken op het kleine input veld.
Informatie en accordeons:
accordeons kunnen informatie bevatten die alleen te zien is als er op iets geklikt word. bijvoorbeeld 'meer info' als hierop geklikt wordt komt er een stuk tekst eronder met uitleg.
Pop-ups:
een pop up is iets dat op de website tevoor schijn komt. dit kan gebruikt worden voor inloggen, een formulier invullen of als advertenties.
Headings:
heading worden gebruikt om de pagina een structuur te geven, net als een inleiding van een boek. h1 is je tietel h2 een onderdeel van de h1 h3 gaat dieper op h2 in h2 een ander onderdeel van h1
Ik kan links, afbeeldingen en headings toepassen in de website van de opdrachtgever
Sprint 3: All human
Datum: 18/10/24
Wat heb je vandaag gedaan en geleerd?
Ik heb samen met Amber code reviews geschreven voor de projecten van Robin, Colin, Fatima en Iris. Hier zijn de links naar de reviews:
Robin Colin Fatima Iris
Daarnaast heb ik feedback gevraagd op mijn design bij de twee mentoren.
Mijn designs waren duidelijk en er waren weinig verbeterpunten nodig.
Neem de uitbreiding van de checklist code-review toegankelijkheid over in je learning log en leg kort uit hoe je deze getest hebt.
Het contrast tussen achtergrond en tekst: ik had witte tekst op een lichtblauwe achtergrond, wat er voor mij duidelijk uitzag. Met een contrast checker heb ik gezien dat het contrast te laag is.
Sommige HTML elementen hebben verplicht een bepaalde child element nodig, zoals:
Section en article moeten een h element bevatten, ul en ol hebben li elementen nodig.
Kijken of de focus duidelijk is.
Door de tabben door mijn website heb ik gekeken of het duidelijk is waarop de tab nu gefocust is.
Sprint 3: All human
Datum: 21/10/24
Wat heb je vandaag geleerd?
Niet iedereen ziet hetzelfde, als frontender moet je rekening houden daarmee.
Ik heb vandaag uitgevonden wat keyframes zijn in CSS.
Ik zocht naar een manier om animaties uit te voeren op mijn articles. Met keyframes kan ik de article eerst uit beeld plaatsen, en daarna in beeld brengen met een transform.
Keyframes in mijn code
Sprint 3: All human
Datum: 23/10/24
3 dingen die je vandaag hebt gedaan
Ik heb mijn laptop zonder muis of trackpad gebruikt en keyboard shortcuts opgezocht. Daarnaast heb ik een sprint review voorbereid voor morgen met de opdrachtgever.
Ik heb uitgezocht wat de JavaScript Intersection Observer is en hoe deze werkt, voor mijn I Love Web.
Intersection observer in mijn code
Beschrijf 2 verbeteringen die je in je readme hebt gemaakt
Ik heb een QR-code toegevoegd, zodat de website makkelijker op een telefoon bekeken kan worden. Ik heb ook uitgelegd hoe de website werkt, zodat gebruikers beter begrijpen wat het al kan doen.
Schrijf 1 ding die je anders gaat aanpakken tijdens de komende sprint
Op 1 issue concentreren, niks ernaast doen. Ik heb vaker gehad waar ik een nieuw probleem tegen kwam terwijl ik al bezig was met een issue. Dan probeer ik het nieuw probleem eerst op te lossen, daarna ga ik verder met de vorige issue. Als ik daarna een commit push, en de issue eraan link, is er veel veranderd dat niet met die issue te maken had. Ik zal komende sprint nieuwe issues maken i.p.v het gelijk op te lossen.