• Een pagina waarin je progressive disclosure binnen je feature uitlegt
• Een pagina waarin je progressive enhancement binnen je feature uitlegt

Progressive disclosure

Het voorkomen van een overvloed aan content en opties aan gebruikers. Het wordt vooral gebruikt bij formulieren op een website. Wanneer een gebruiker een tekst veld invult of een checkbox aanklikt bijvoorbeeld kan het zijn dat er dan meer opties te voorschijn komen (nog meer checkboxes of tekst velden). Door dat te doen heeft de gebruiker niet het idee dat hij overspoeld wordt met opties en snapt hij ook waar het over gaat. Want als een gebruiker zo maar een hele waslijst aan opties voorgeschoteld krijgt ziet hij door de bomen het bos niet meer en zit er geen logica achter. Door middel van progressive disclosure wordt de gebruiker in kleine stapjes door een proces geleid door steeds kleine beetjes content/informatie voor geschoteld te blijven.

Progressive enhancement

Het bevorderen van de gebruikservaring met behulp van css en js. De app moet namelijk ook nog kunnen werken op een kindle e-reader bij wijze van spreken waar geen opties voor css en js zijn. Alle functies moeten toegankelijk zijn met alleen HTML.

Toepassing

Ik gebruik progressive disclosure in mijn zoek functie en in mijn filter functie op de resultaten pagina. Ik gebruik progressive enchancement op punten waar transities of partial states nodig zijn.

Code principes

HTML

1. Goede indentatie
2. Juist geneste tags
3. Zinnige namen voor classes/id's met camelCase nummerTwee of verzendKnop.

van smashingmagazine.com

CSS

1. Gebruik shorthand bijvoorbeeld margin: 1rem 2rem; i.p.v. margin-right: 0.5rem; margin-bottom: 1rem;
2. DRY dont repeat yourself
3. Niet te veel "Overriding chains" gebruiken dus niet opnieuw properties toekennen hoe gedetaileerder je styling wordt.

van smashingmagazine.com & dev.to

JS

1. Zinnige namen gebruiken voor variabelen en functies
2. Laat functies één ding doen zodat je ze kan hergebruiken
3. Gebruik const voor variabelen die niet veranderen es6 notatie