# Evaluatie

Voor deze opdracht werken we met een **rubrik** en een **boeteblad**.

De **rubrik** beschrijft op welke criteria jullie webshop beoordeeld zal worden, en welk prestatieniveau daarbij hoort. Elk criterium hangt samen met de leerdoelen van het vak. Op die manier weten jullie vooraf duidelijk wat er verwacht wordt en hoe jullie punten tot stand komen.

Het **boeteblad** dient om oneerlijke of te minimale oplossingen tegen te gaan.

We raden je dan ook aan om tijdens je project regelmatig na te kijken of je voldoet aan de verwachtingen aan de hand van deze hulpmiddelen.

### Boeteblad

<table data-full-width="false"><thead><tr><th width="609.3515625">Overtreding</th><th width="100">Strafpunten</th></tr></thead><tbody><tr><td>HTML bevat te weinig inhoud om de structuur/semantiek zinvol te beoordelen.</td><td>-2</td></tr><tr><td>CSS bevat te weinig regels om vormgeving of layout zinvol te beoordelen.</td><td>-2</td></tr><tr><td>JS bevat te weinig code om interactiviteit zinvol te beoordelen</td><td>-2</td></tr><tr><td>Gebruik van inline CSS of inline JS waar externe bestanden gevraagd zijn.</td><td>-1</td></tr><tr><td>Project bevat dode code of ongebruikte bestanden (bv. niet-gelinkte CSS/JS, lege bestanden).</td><td>-1</td></tr><tr><td>Code bevat overduidelijke copy-paste zonder integratie of begrip.</td><td>-2</td></tr></tbody></table>

### Rubrik

<table data-full-width="true"><thead><tr><th align="right">doelstellingen</th><th> 18-20</th><th>14-17</th><th>10-13</th><th>0-9</th></tr></thead><tbody><tr><td align="right"><ol><li><strong>Codekwaliteit &#x26; Standaarden</strong></li></ol></td><td>Code volgt volledig de afgesproken standaarden, naamgevingsregels en is goed gedocumenteerd. Duidelijke, onderhoudbare code.</td><td>Code volgt grotendeels de standaarden. Documentatie is aanwezig maar kan consistenter.</td><td>Code bevat enkele afwijkingen van standaarden en naamgeving. Documentatie is summier.</td><td>Code volgt nauwelijks of geen standaarden. Documentatie ontbreekt grotendeels.</td></tr><tr><td align="right"><ol start="2"><li><strong>HTML Structuur &#x26; Semantiek</strong></li></ol></td><td>HTML is volledig semantisch correct. Tekst- en media-elementen zijn correct gebruikt. Structuur ondersteunt inhoud en toegankelijkheid optimaal.</td><td>HTML is grotendeels semantisch correct. Tekst- en media-elementen zijn correct gebruikt, maar enkele optimalisaties ontbreken.</td><td>HTML-structuur bevat enkele fouten in semantiek of in gebruik van tekst-/media-elementen.</td><td>HTML is grotendeels niet-semantisch of onsamenhangend. Tekst en media worden vaak foutief of niet gebruikt.</td></tr><tr><td align="right"><ol start="3"><li><strong>CSS &#x26; Vormgeving</strong></li></ol></td><td>CSS is overzichtelijk gestructureerd. Layout en stijlregels zijn correct, toegankelijk en sluiten aan bij best practices.</td><td>CSS is gestructureerd en grotendeels correct. Layout en stijlregels werken, maar optimalisaties ontbreken.</td><td>CSS werkt maar bevat enkele fouten in structuur of consistentie. Stijlregels zijn soms inefficiënt of foutief toegepast.</td><td>CSS is onoverzichtelijk, vaak foutief of ontbreekt.</td></tr><tr><td align="right"><ol start="4"><li><strong>Mobile First &#x26; Responsiviteit</strong></li></ol></td><td>Website is volledig responsive volgens het Mobile First principe. Optimalisaties voor alle schermgroottes zijn voorzien en werken foutloos.</td><td>Website is grotendeels responsive en Mobile First ontwikkeld. Enkele optimalisaties voor schermgroottes ontbreken of zijn foutief.</td><td>Website is beperkt responsive. Mobile First principe wordt onvoldoende toegepast of enkel gedeeltelijk.</td><td>Website is niet responsive en Mobile First is genegeerd.</td></tr><tr><td align="right"><ol start="5"><li><strong>Interactiviteit (JS)</strong></li></ol></td><td>Functioneel programmeren, controlestructuren, arrays en objecten worden correct gebruikt. DOM-manipulatie en events zijn efficiënt en foutloos toegepast.</td><td>Functioneel programmeren en controlestructuren zijn correct toegepast. DOM-manipulatie en events werken, maar missen efficiëntie.</td><td>Basisinteractiviteit is aanwezig, maar code bevat enkele fouten of inefficiënties.</td><td>Interactiviteit is minimaal, grotendeels foutief of ontbreekt volledig.</td></tr><tr><td align="right"><ol start="6"><li><strong>Asynchrone technieken &#x26; Data</strong></li></ol></td><td>Data wordt correct opgehaald met asynchrone code en geïntegreerd in de webshop. Loading states en foutafhandeling zijn voorzien.</td><td>Data wordt correct opgehaald en geïntegreerd. Foutafhandeling of efficiëntie kan verbeterd worden.</td><td>Data wordt opgehaald, maar integratie bevat enkele fouten of is slechts beperkt bruikbaar.</td><td>Geen of foutief gebruik van asynchrone technieken of externe data.</td></tr><tr><td align="right"><ol start="7"><li><strong>Libraries</strong></li></ol></td><td>Bibliotheken worden correct en efficiënt gebruikt. Bestandsformaten zijn correct en projectstructuur is geschikt voor webserver.</td><td>Bibliotheken worden correct gebruikt, maar niet altijd efficiënt. Projectstructuur bevat kleine onvolkomenheden.</td><td> Bibliotheken zijn verkeerd of inefficiënt toegepast, maar tonen nog steeds resultaat. Projectstructuur is rommelig.</td><td>Geen of foutief gebruik van bibliotheken of projectstructuur.</td></tr><tr><td align="right"><ol start="8"><li><strong>Projectwerk &#x26; features</strong></li></ol></td><td>Volledig, interactief webshopproject met alle gevraagde functionaliteit. Extra features en eigen inbreng tonen zelfstandige ontwikkeling.</td><td>Volledig webshopproject met alle gevraagde functionaliteit. Extra features zijn beperkt.</td><td>Webshopproject bevat alle kernfunctionaliteit maar mist volledigheid of samenhang.</td><td>Webshopproject is incompleet, bevat te veel fouten of ontbreekt volledig.</td></tr></tbody></table>
