Markdown is een simpele manier om HTML te schrijven.
Markdown cheat cheet: Hulp bij het schrijven van Markdown.
Nb. De standaardstructuur en de spartaanse opmaak van de README.md zijn helemaal prima. Het gaat om de inhoud van je procesverslag. Besteedt de tijd voor pracht en praal aan je website.
Nb. Door open toe te voegen aan een details element kun je deze standaard open zetten. Fijn om dat steeds voor de relevante stuk(ken) te doen.
uitwerken voor kick-off werkgroep
Homepage
hier de naam van de pagina
uitwerken na test in 2e werkgroep
Lijst met je bevindingen die in de test naar voren kwamen:
Smallscreen:
-
De h1 wordt afgekapt bij woorden, waardoor de leesbaarheid minder wordt.
-
De buttons worden aan de onderkant van de pagina geplaatst, waardoor er meer overzicht is voor de
-
Er is een hamburgermenu aanwezig bij smallscreen.
-
Tekst heeft een goede lijnafstand van elkaar, waardoor de leesbaarheid beter wordt.
-
Er is een 'Terug naar boven' knop, waardoor de gebruiker automatisch weer naar de bovenkant van de pagina scrollt.
Screenreader:
-
Wanneer je op de zoekknop staat, wordt er gezegd dat de gebruiker zich op een knop, groep bevindt - wat voor verwarring kan zorgen bij de gebruiken.
-
Als je op de 'volgende' knop klikt van de uitgelichte modellen - zegt de screenreader niet hoe het volgende model heet. Hij geeft alleen aan op welke links er geklikt kan worden, zoals 'configureren' en 'ontdekken'
-
De screenreader geeft bij de afbeeldingen met tekst erin een duidelijke omschrijving van het onderwerp.
uitwerken na afloop 3e werkgroep
uitwerken voor 1e voortgang
hier dit ging goed & dit was lastig (neem ook screenshots op van delen van je website en code)
samen met je groepje opstellen
| student 1 | student 2 | student 3 | student 4 |
|---|---|---|---|
| dit bespreken | en dit | en ik dit | en dan ik dat |
| en dat ook nog | dit als er tijd is | nog een punt | dit wil ik zeker |
| ... | ... | ... | ... |
hier na afloop snel de uitkomsten van de meeting vastleggen
- punt 1
- punt 2
- nog een punt
- ...
uitwerken voor 2e voortgang
hier dit ging goed & dit was lastig (neem ook screenshots op van delen van je website en code)
samen met je groepje opstellen
| student 1 | student 2 | student 3 | student 4 |
|---|---|---|---|
| dit bespreken | en dit | en ik dit | en dan ik dat |
| en dat ook nog | dit als er tijd is | nog een punt | dit wil ik zeker |
| ... | ... | ... | ... |
hier na afloop snel de uitkomsten van de meeting vastleggen
- Minimaal Responsive maken (hoeft niet per se voor telefoon)
- Skip links gebruiken
- Prefered reduced motion
- Feedback knop: moet alleen pop up kunnen laten zien
- Nog 4 extra animaties
- ...
uitwerken na test in 9e werkgroep
Lijst met je bevindingen die in de test naar voren kwamen (geef ook aan wat er verbeterd is):
- De links in de navigatie hebben een duidelijke beschrijving
- Er is een actievoorstel, waardoor de gebruiker de link daadwerkelijk kan bezoeken.
- De volgorde van de pagina klopt
- De svg's van de zoek en account functie worden niet via de tab-knop meegepakt. De gebruiker moet in plaats daarvan met de pijltjes op het toesenbord er naar navigeren.
- De feedback knop wordt ook niet meegenomen, terwijl daar wel een aria-label aan is gelinkt.
- De switch naar dark/lightmode knop wordt benoemd door de screenreader, maar er wordt niet aangegeven op welke huidige modus hij staat.
uitwerken voor 3e voortgang
hier dit ging goed & dit was lastig (neem ook screenshots op van delen van je website en code)
samen met je groepje opstellen
| student 1 | student 2 | student 3 | student 4 |
|---|---|---|---|
| dit bespreken | en dit | en ik dit | en dan ik dat |
| en dat ook nog | dit als er tijd is | nog een punt | dit wil ik zeker |
| ... | ... | ... | ... |
hier na afloop snel de uitkomsten van de meeting vastleggen
- punt 1
- punt 2
- nog een punt
- ...
uitwerken voor eindgesprek
De scrollanimatie vind is goed gelukt. Ik heb na wat filmpjes op YouTube te hebben gekeken en feedback van medestudenten te vragen veel geleerd over deze animatie, bijvoorbeeld: Dat er een threshold is waar de gebruiker overheen moet, voordat de animatie wordt getoond.
De courasel van de garage: Op de Audi website staat een courasel van een garage met daarin auto's waar je door kon scrollen. Het is mij echter niet gelukt om hetzelfde effect te krijgen op de site.
continu bijhouden terwijl je werkt
Nb. Wees specifiek ('css-tricks' als bron is bijv. niet specifiek genoeg). Nb. ChatGpT en andere AI horen er ook bij. Nb. Vermeld de bronnen ook in je code.