You are here: Home / Lessenserie: Websites hacken en bouwen

Lessenserie: Websites hacken en bouwen

Les 1: Bouwstenen van het internet, HTML

Samenvatting:
In deze les wordt uitgelegd wat HTML is. Aan de hand van voorbeelden.

Doel:
Leerlingen nemen kennis van de term HTML en weten dat het gebruikt wordt als 1 van de bouwstenen van een website. Leerlingen weten wat een webbrowser is en waarvoor het dient.

Materialen:

Product:
Beantwoorde quiz (zie http://www.w3schools.com/quiztest/quiztest.asp?qtest=HTML).

Doen:
Intro: video van Commoncraft over het www laten zien. Video van Google laten zien. Daarna de verschillende browsers op de computer laten zien. Opera, FireFox, Internet Explorer, Safari, Chrome.
Aan het werk: vertellen wat html is dmv de dia presentatie.

Afsluiting:
Leerlingen online quiz laten maken.
Kort samenvatten waar de les overging. Web browsers en html

Les 2: Werken met de X-Ray-Goggles

Samenvatting:
Leerlingen leren werken met de X-Ray Goggles van de Hackasaurus website.

Doel:
Leerlingen kunnen met de X-Ray Goggles van de Hackasaurus website werken.

Materialen:

  • X-Ray Goggles
  • Help-blad met functies X-Ray Goggles beschreven
  • Webbrowser Opera, FireFox of Safari (X-Ray Goggles werkt niet in Internet Explorer, controleer vooraf of je 1 van deze webbrowsers hebt)
  • Computers/ laptops
  • Internet

Product:
Leerlingen hebben aan het einde van de les van een bestaande website de titel, menu en tekst aangepast met behulp van de X-Ray Goggles

Doen:
Laat via het digitale schoolbord een website zien aan de leerlingen. Start X-Ray Goggles op en verander de titel, menu en tekst van de website. Vertel steeds daarbij hoe je dit doet en wat de leerlingen in beeld hebben.

Laat de leerlingen de webbrowser Opera opstarten. Laat de leerlingen controleren of ze de werkbalk bladwijzer ook zien in hun webbrowser en laat ze anders via het menu van de webbrowser naar Beeld gaan en daarna naar werkbalken. Laat ze werkbalk bladwijzer aanklikken.  Ga nu naar Hackasaurus.org/tools/. Sleep de X-Ray Goggles naar de werkbalk bladwijzer toe. Doe dit ook steeds voor op het digitale schoolbord.

Laat de leerlingen naar een website gaan en laat ze hiervan de titel, menu en tekst aanpassen.

Afsluiting:
Leerlingen presenteren kort de website die ze hebben aangepast.

Les 3: Bouwstenen van het internet, CSS

Samenvatting:
In deze les wordt uitgelegd wat CSS is aan de hand van voorbeelden.

Doel:
Leerlingen nemen kennis van de term CSS en weten dat het gebruikt wordt als 1 van de bouwstenen van een website.

Materialen:

  • digitaal schoolbord of beamer
  • Slides met uitleg wat CSS is
  • Hackbook van hackasaurus
  • quiz met controle vragen over het gehoorde

Product:
Beantwoorde online quiz (zie http://www.w3schools.com/quiztest/quiztest.asp?qtest=HTML)

Doen:
Intro: Herhalen wat HTML is. Vraag de leerlingen of ze kunnen navertellen wat ze de eerste les hebben besproken en gehoord.

Aan het werk: vertellen wat CSS is dmv de dia presentatie. Het hackbook van Hackasaurus klaten zien via het digitale schoolbord en vertellen wat verschillende CSS termen zijn en doen.

Afsluiting:
Leerlingen online quiz laten maken.
Kort samenvatten waar de les overging; CSS.

Les 4: Bouw een website

Samenvatting:
Leerlingen leren werken met html-pad als editor voor het bouwen van een website met code.

Doel:
Leerlingen leren werken met html-pad als editor. Ze nemen kennis van de opbouw van een website en maken een website met een titel en tekst waarin ze iets over zichzelf vertellen.

Materialen:

Product:
Een website met een titel, tekst en een link naar een andere website. De titel heeft grotere letters dan de tekst en heeft een kleur (geen zwart of wit). De tekst heeft een andere lettertype dan de titel.

Doen:
Intro: Kort uitleggen wat html-pad is. Vertellen hoe het werkt.

Afsluiting:
Leerlingen beschrijven kort wat ze hebben gedaan en wat ze er van vonden.

Les 5: Bouw een uitgebreidere website

Samenvatting:
De leerlingen bouwen een uitgebreidere website dan de vorige keer. Dit is hun eindopdracht.

Doel:
Leerlingen laten zien dat ze kennis hebben genomen van de lessenserie websites bouwen. Ze bouwen hun eigen website in htmp-pad. Ze laten verschillende onderdelen van html en css zien.

Materialen:

  • html-pad
  • computers

Product:
Leerlingen bouwen een website met titel, teksten (met 3 verschillende kleuren er in), 2 afbeeldingen, 3 links naar andere websites. De website vullen ze met zelf geschreven tekst. Deze tekst gaat over wat ze hebben geleerd van deze lessenserie en wat ze er van vonden.

Doen:
Korte uitleg van de opdracht, daarna gaan leerlingen zelfstandig aan het werk. Mochten ze vast lopen mogen ze buurman/vrouw om hulp vragen (samenwerken is ook belangrijk).

Afsluiting:
Leerlingen beschrijven kort wat ze hebben geleerd en hoe ze het vonden. Dit gaat in hun portfolio (inclusief link naar de website)

Overige hulpmiddelen