Docentenhandleiding

Een les websites maken

1. Introductie

21e eeuwse vaardigheden

Op deze docentenhandleiding pagina staan een aantal hoofdstukken/hulpmiddelen bedoeld om docenten te helpen bij het geven van de "Websites maken met JouwWeb" les. Ook als er geen of weinig voorkennis aanwezig is kan een docent, leerlingen, websites leren maken! Het lesmateriaal is ontwikkeld met 21e eeuwse vaardigheden in gedachte. Lees in het 21e eeuwse vaardigheden hoofdstuk hoe deze vaardigheden in de les verweven zijn.

(Mocht het ooit zo zijn dat het schoolnetwerk moeite heeft met de JouwWeb applicatie laat leerlingen dan in tweetallen met 1 computer samenwerken.)

Lesopdracht

De leerlingen gaan tijdens de les instructies op de les pagina doorlopen om bekend te raken met het JouwWeb systeem. Naast de instructies kunnen de leerlingen opdrachten en tips doornemen om op de hoogte te zijn van best-practices bij het maken van websites.

Leerdoelen

Middels de lesopdracht wordt aan de volgende leerdoelen toegewerkt:

Leerdoel I

Na het doorlopen van de JouwWeb instructies (zonder opdrachten en tips) kunnen leerlingen zelfstandig een volwaardige website maken.

tijdsduur: +/- 1 uur

Leerdoel II

Na het doorlopen van de JouwWeb instructies, inclusief opdrachten en tips, hebben de leerlingen een idee van best-practices, bij het ontwikkelen van websites.

tijdsduur: +/- 1 uur 30 min

Hulpmiddelen

Om de leerdoelen te kunnen behalen zijn een aantal hulpmiddelen te vinden op deze docentenhandleiding pagina.

  • Een lesvoorbereiding, hierin staat per les deel beschreven wat de inhoud van de les is.
  • Een presentatie met een aantal voorbeelden om de les op te starten (voorkennis aanwakkeren) en af te sluiten (evalueren).
  • Een tabel met differentiatie mogelijkheden om in te spelen op verschillen tussen leerlingen.
  • Een tabel met mogelijke feedback die gegeven kan worden per hoofdstuk/onderdeel van de lespagina. Dit is bedoeld om de leerlingen te begeleiden bij het maken van websites. De feedback kan tevens gebruikt worden om leerdoel II te toetsen.

Na afloop

Wanneer de les is afgerond kunnen leerlingen in het vervolg ook verslagen, presentaties, portfolio's of (fictieve)ondernemingen digitaal maken in de vorm van websites. Dit kan een waardevolle en leuke afwisseling zijn ten opzichte van de standaard verslagen.

Privacy: wanneer de pagina gepubliceerd wordt staat de website openbaar. Houd er rekening mee dat leerlingen hiermee persoonsgegevens online kunnen zetten.

Website verwijderen: Laat de leerling op "mijn account" klikken en vervolgens op "verwijderen". Op deze pagina kunnen de leerlingen de website(s) verwijderen.

2. Lesvoorbereiding

Lesfasering (60 min) Les inhoud Activiteit leerling Activiteit Docent Hulpmiddelen
Introductie (10 min) Lesopdracht en Leerdoelen duidelijk maken. Voorkennis en nieuwsgierigheid aanwakkeren. (gebruik hiervoor de presentatie). De leerlingen starten de computers (beeldschermen blijven nog even uit). De leerlingen gaan even staan (actieve houding) om te luisteren en mee te denken bij de instructie. Stel een aantal vragen vanuit de presentatie (zie de presentatie notities) om voorkennis te pijlen en nieuwsgierigheid te wekken. Geef aan dat leerlingen de instructies op de les pagina uitvoeren. (+/- min 5 min per hoofdstuk)
  • Presentatie
  • Presentatie scherm
  • Computers of tablets
  • JouwWeb les pagina
Zelfstudie (40 min) Middels de JouwWeb les pagina verkennen de leerlingen het systeem van de website-builder. Via de les pagina werken de leerlingen stapsgewijs naar de leerdoelen door zelfstandig of in tweetallen een website te ontwikkelen. De leerlingen openen de les pagina en doorlopen de instructies. Hierbij kunnen ze ook de opdrachten maken en tips doorlezen. Uiteindelijk publiceren de leerlingen de pagina en delen de URL met de docent. Terwijl de leerlingen bezig zijn kan persoonlijke begeleiding plaatsvinden Afhankelijk van het hoofdstuk waar een leerling mee bezig is kan feedback gegeven worden. Vraag voor de les evaluatie aan de leerlingen om de URL/link door te sturen.
  • Computers of tablets
  • JouwWeb les pagina
  • Feedback (hoofdstuk)
Evaluatie (10 min) Mogelijke opvallende zaken uit de klas worden besproken. Er wordt gecontroleerd in hoeverre de leerdoelen behaald zijn en de hoofdstukken worden kort herhaald. De feedback op pagina 5 kan gebruikt worden om te controleren/ toetsen of de leerdoelen behaald zijn. Een paar (3) websites worden kort gepresenteerd (bij voorkeur door de leerling) en klassikaal besproken. De rest van de leerlingen nemen deel aan de evaluatie door feedback te geven op de gepresenteerde website. Bespreek een paar (3) voorbeelden uit de klas. Controleer met de klas of alle hoofdstukken (van de les pagina) behandeld zijn. Controleer aan de hand van de feedback (op pagina 5) of de website overeenkomt. (Laat de leerlingen feedback geven middels tips/tops.)
  • Presentatie scherm
  • URL van een gepubliceerde website als voorbeeld.
  • Feedback (hoofdstuk)

3. Differentiatie

Inspelen op verschillen tussen leerlingen

Middels de onderstaande differentiatie kan ingespeeld worden op de verschillen tussen leerlingen. De differentiatie is bedoeld om ervoor te zorgen dat de leerlingen die extra ondersteuning nodig hebben in ieder geval het leerdoel behalen maar ook om extra uitdaging te kunnen bieden aan leerlingen die dat nodig hebben.

Differentiatie Les inhoud Activiteit leerling Activiteit Docent Hulpmiddelen
Extra ondersteuning Het is mogelijk om in tweetallen op twee verschillende computers aan dezelfde website te werken. Zo kan in samenwerking de lesstof doorgenomen worden. De leerlingen loggen in op twee computers met hetzelfde account. De leerlingen werken samen aan de instructies waarbij één leerling de instructies beschrijft en de andere leerling deze instructies uitvoert. Af en toe wisselen de leerlingen van taak. Maak een tweetal zodat peer-tutoring kan plaatsvinden. Verdeel taken/ hoofdstukken zodat beide leerlingen oefenen met het systeem.

Tip: Laat de leerlingen regelmatig de pagina verversen (f5) zodat de leerlingen van elkaar weten wat er toegevoegd wordt.

  • Computers of tablets
  • JouwWeb les pagina
Extra uitdaging Onderzoek naar website inspiratie/voorbeelden. Het zo ver mogelijk uitwerken van de website. De leerling gaat opzoek naar website voorbeelden die hem/haar inspireren. Daarnaast kan deze leerling alle pagina’s van tekst, beeld, en vormgeving voorzien. Stimuleer de leerling bepaalde onderdelen uit de inspiratie toe te passen en de website zo volledig mogelijk af te maken door alle pagina’s aan te kleden en in te vullen. Laat de leerling zijn website presenteren.
  • Computers of tablets
  • JouwWeb les pagina
  • Feedback (hoofdstuk)
Extra uitdaging Alle opdrachten en tips voor best-practices, bij het maken van websites, doornemen. De leerling maakt de opdrachten en leest de tips. Benadruk dat de leerling de opdrachten en tips doorneemt en maakt.
  • Computers of tablets
  • JouwWeb les pagina
  • Feedback (hoofdstuk)

4. Feedback

Best-practices

Onderstaande feedback kan gebruikt worden door om per hoofdstuk uit de les/instructie pagina leerlingen aan te sturen en tips te geven. Zo leren ze per website onderdeel best-practices (leerdoel II). Dit is tevens een handige checklist ter evaluatie/toetsing van de les.

naam 1. Beginnen met JouwWeb

Een goede (merk) naam/ titel voldoet vaak aan een aantal van de onderstaande criteria:

  • Eenvoud B.v. Nike, Sprite
  • Duidelijk B.v. Facebook, Burger king
  • Web-vriendelijk De naam is nog niet in gebruik
  • Wees onderscheidend Voorbeelden: Duo penotti, Land Rover

Uitzondering: Bij Persoonsgebonden websites kan de eigen naam volstaan.

inhoud 2. Inhoud aanpassen

Hiërarchie: Is er een logische menu en sub-menu structuur. De belangrijkste aandachtspunten worden benadrukt. Titels en afbeeldingen zijn prominenter aanwezig dan gewone tekst.

Tekst, titels en afbeeldingen: zijn voorzien van duidelijke onderwerpen en naamgeving. (Dit helpt bij het vindbaar maken van de website via zoekmachines).

layout 3. Layout

Is er een duidelijk grid terug te zien in de opmaak van de website.

De elementen zijn evenwichtig verdeeld over de pagina.

Er is gebruik gemaakt van de elementen "witruimte", "kolommen" of "lijnen" om onderdelen op de pagina gelijk te verdelen en ruimte te geven.

design 4. Design

Een veel gebruikte regel voor het toepassen van kleuren is de 60/30/10 regel.

Hierbij is een duidelijke verdeling van drie kleuren te zien.

  • 60%: Dit is de voornaamste kleur. Vaak is dit wit of zwart.
  • 30%: De tweede kleur wordt op 30 procent van de pagina gebruikt.
  • 10%: De laatste 10 procent is de accent kleur om aandacht te grijpen met bijvoorbeeld het menu, een knop of hyperlink.

testen 5. Testen en publiceren

Controleer de pagina op mobiel formaat. Kijk of de afbeeldingen en tekst nog goed zichtbaar zijn.

Controleer of de knoppen en interactie onderdelen groot genoeg zijn.

Is de pagina gepubliceerd? houd er dan rekening mee dat er ook persoonlijke gegevens gepubliceerd kunnen worden.

media 6. Media

Is er een contactpagina met in ieder geval een formulier of kaart aanwezig?

Zijn sociale media gekoppeld ter promotie van de website?

5. 21e eeuwse vaardigheden

21e eeuw

Waardevolle skills

De les pagina is ingericht middels het model voor 21e eeuwse vaardigheden van SLO en Kennisnet. Dit model omschrijft een reeks vaardigheden die leerlingen goed kunnen gebruiken in het dagelijks leven. De volgende beschrijvingen geven aan hoe de 21e eeuwse vaardigheden behandeld (kunnen) worden tijdens de les.

creatief

Creatief denken komt terug bij het bedenken van een passende naam voor de website. Later in de les komt creatief denken terug bij het vormgeven van de website.

Methode: brainstormen, vormgeving.

probleem

Websites presenteren en feedback uitwisselen helpt bij het opsporen, bespreken en verbeteren van problemen.

Methode: Les evaluatie en feedback.

computation

Het opstellen van een flowchart waarbij het verloop tussen verschillende pagina’s en subpagina’s duidelijk wordt.

Methode: schematische weergave van de website structuur tekenen (dit is een van de opdrachten).

informatie

Informatievaardigheden worden opgedaan bij het optimaliseren van de tekst voor zoekmachines.

Methode: Tips en opdrachten uitvoeren op de les pagina.

ictbasis

Het verslepen, toevoegen, bewerken, delen en publiceren van de website zijn allemaal basisvaardigheden die tijdens de les worden toegepast.

Methode: het doorlopen van de directe instructies op de les pagina.

mediawijs

De overweging maken om de pagina wel of niet te publiceren dragen bij aan de mediawijsheid.

Methode: het doorlopen van de directe instructies op de les pagina.

communiceren

Communicatie komt in de les terug door nadruk te leggen op een duidelijke hiërarchie en structuur in de tekst. Tevens worden sociale media kanalen gekoppeld aan de website om de pagina te delen met het persoonlijke netwerk.

Methode: tekst schrijven, website delen via sociale media.

samenwerken

Door middel van peer tutoring of feedback van de docent wordt sociaal constructivistisch gewerkt aan de kennis, vaardigheid en attitude bij het maken van websites.

Methode: Gedurende de les mogen de leerlingen overleggen en feedback geven. De les kan afgesloten worden met een klassikale evaluatie.

sociaal

Mits er samengewerkt wordt of aan het einde van de les feedback gegeven wordt op de website(s) vind een reflectie moment plaats. Het kunnen omgaan en reflecteren op feedback van anderen levert een bijdrage aan de sociale en culturele vaardigheden.

Methode: Website presenteren, tips en tops bespreken.

zelfregulering

De essentie van het leerdoel is om na het doorlopen van de les in het vervolg zelfstandig websites te kunnen ontwikkelen. Het stukje zelfregulering wordt middels de les aangespoord.

Methode: De directe instructies uit de handleiding volgen.

kritisch

Bij het vormgeven kritisch nadenken over de plaatsing van verschillende elementen.

Methode: tips en theorie doornemen bij het design hoofdstuk.