WEEK 5 - INFORMATIE TECHNOLOGIE

week 5 les 1

1 / 34

Slide 1: Tekstslide

InformaticaMiddelbare schoolhavoLeerjaar 4

In deze les zitten 34 slides, met interactieve quizzen en tekstslides.

Lesduur is: 90 min

Onderdelen in deze les

week 5 les 1

Slide 1 - Tekstslide

Deze slide heeft geen instructies

STARTKLAAR!

Tellie in zakkie

Slide 2 - Tekstslide

Startklaar zitten.

Deze periode

- HTML & CSS

- Database & SQL Qeury

Slide 3 - Tekstslide

Deze slide heeft geen instructies

Deze periode

Jullie gaan een formulier met HTML & CSS maken waarbij het ingevulde formulier opgeslagen wordt in een database

Slide 4 - Tekstslide

Deze slide heeft geen instructies

Voorkennis activeren

Slide 5 - Tekstslide

Deze slide heeft geen instructies

Wat is de juiste tag voor een inputveld?

<input> tag

<text> tag

<forminput> tag

<textbox> tag

Slide 6 - Quizvraag

Deze slide heeft geen instructies

Hoe maak je een formulier in HTML?

Gebruik de <table> tag in HTML

Gebruik de <div> tag in HTML

Gebruik de <form> tag in HTML

Gebruik de <span> tag in HTML

Slide 7 - Quizvraag

Deze slide heeft geen instructies

Wat doet de HTML tag

Slide 8 - Tekstslide

Deze slide heeft geen instructies

CSS

Ik wil dat de input velden een breedte hebben van 300px en een hoogte van 30px, ook wil ik de lettergroote van 15px.

input{

//vul de bijbehorende attributen met hun waardes in

}

Slide 9 - Tekstslide

Deze slide heeft geen instructies

vul jouw css code

Slide 10 - Open vraag

Deze slide heeft geen instructies

LEERDOELEN

De leerling is in staat zijn werk van de vorige keer verder op te pakken en verder te werken

Slide 11 - Tekstslide

Deze slide heeft geen instructies

Samenvatting

Klasikaal invullen met leerlingen

Slide 12 - Tekstslide

Deze slide heeft geen instructies

Ik weet nu hoe ik een formulier in HTML kan maken

Deels

Nee

Slide 13 - Poll

Deze slide heeft geen instructies

week 5 les 2

Slide 14 - Tekstslide

Deze slide heeft geen instructies

STARTKLAAR!

Tellie in zakkie

Slide 15 - Tekstslide

Startklaar zitten.

Voorkennis activeren

Slide 16 - Tekstslide

Deze slide heeft geen instructies

Wat is een voorbeeld van een HTML-tag?

function()

<--div-->

if-else statement

<p>

Slide 17 - Quizvraag

Deze slide heeft geen instructies

Wat is de functie van HTML?

Programmeren van apps

Aanmaken van databases

Opmaak van afbeeldingen

Structureren van webpagina's

Slide 18 - Quizvraag

Deze slide heeft geen instructies

LEERDOELEN

De leerling snapt uit welke delen een HTML-element bestaat en kan dit toepassen
De leerling is in staat om zelfstandig een formulier te maken met HTML
De leerling is in staat om het uiterlijk van zijn formulier met CSS mooier te maken

Slide 19 - Tekstslide

Deze slide heeft geen instructies

Basisstructuur HTML

Slide 20 - Tekstslide

Deze slide heeft geen instructies

HTML element

HTML element

Een HTML tag kan attributen noemen.

dit zijn eigenschappen die de HTML tag kan beinvloeden

Slide 21 - Tekstslide

Deze slide heeft geen instructies

Ik weet nu waar een HTML element uit bestaat

Deels

Nee

Slide 22 - Poll

Deze slide heeft geen instructies

Maak van de tag <h1> een compleet HTML element. Content is Inschrijven

Slide 23 - Open vraag

Deze slide heeft geen instructies

CSS

Om de website mooier te maken

Slide 24 - Tekstslide

Deze slide heeft geen instructies

HTML zonder CSS

Dit is alleen HTML code

Dit is HTML met CSS

Slide 25 - Tekstslide

Deze slide heeft geen instructies

Hoe werkt CSS

Om de website mooier te maken

Slide 26 - Tekstslide

Deze slide heeft geen instructies

Hoe werkt CSS

Slide 27 - Tekstslide

Deze slide heeft geen instructies

Hoe werkt CSS

Om de website mooier te maken

Demo

Slide 28 - Tekstslide

Deze slide heeft geen instructies

Slide 29 - Tekstslide

Deze slide heeft geen instructies

Probeer het zelf

Open het formulier wat je aan het maken bent Gebruik daarvoor de online code editor

Het formulier bestaat uit de volgende velden:

Voornaam, Achternaam, geboorte datum, straat, huisnummer, postcode, plaats

Checkbox voor voorwaarden

zorg ervoor dat je een CSS bestand maakt en dit link in jouw HTML bestand en zorg ervoor dat:

Alle input velden dezelfde lengte en hoogte hebben

Dat tussen alle inputvelden horizontaal een ruimte is van 15px

Dat de lettergrote 15px is van alle inputvulden

https://vscode.dev/

Slide 30 - Tekstslide

Deze slide heeft geen instructies

Ik weet nu hoe ik een css bestand kan linken aan html bestand

Deels

Nee

Slide 31 - Poll

Deze slide heeft geen instructies

Ik weet nu hoe ik de inputvelden van mijn html kan aanpassen door gebruik van CSS

Deels

Nee

Slide 32 - Poll

Deze slide heeft geen instructies

Ik wil de kleur van mijn letters veranderen naar rood, schrijf de css code die hierbij hoort

Slide 33 - Open vraag

Deze slide heeft geen instructies

Samenvatting

Klassikaal

Opdrachten niet vergeten in te leveren!

De PO staat ook in teams.

Slide 34 - Tekstslide

Deze slide heeft geen instructies

WEEK 5 - INFORMATIE TECHNOLOGIE

Onderdelen in deze les

Slide 1 - Tekstslide

Slide 2 - Tekstslide

Slide 3 - Tekstslide

Slide 4 - Tekstslide

Slide 5 - Tekstslide

Slide 6 - Quizvraag

Slide 7 - Quizvraag

Slide 8 - Tekstslide

Slide 9 - Tekstslide

Slide 10 - Open vraag

Slide 11 - Tekstslide

Slide 12 - Tekstslide

Slide 13 - Poll

Slide 14 - Tekstslide

Slide 15 - Tekstslide

Slide 16 - Tekstslide

Slide 17 - Quizvraag

Slide 18 - Quizvraag

Slide 19 - Tekstslide

Slide 20 - Tekstslide

Slide 21 - Tekstslide

Slide 22 - Poll

Slide 23 - Open vraag

Slide 24 - Tekstslide

Slide 25 - Tekstslide

Slide 26 - Tekstslide

Slide 27 - Tekstslide

Slide 28 - Tekstslide

Slide 29 - Tekstslide

Slide 30 - Tekstslide

Slide 31 - Poll

Slide 32 - Poll

Slide 33 - Open vraag

Slide 34 - Tekstslide

Meer lessen zoals deze

WEEK 4 - INFORMATIE TECHNOLOGIE

WEEK 3 - INFORMATIE TECHNOLOGIE

WEEK 3 - INFORMATICA

WEEK 4 - INFORMATICA

WEEK 1 - INFORMATIE TECHNOLOGIE

WEEK 3 - INFORMATICA

WEEK 5 - INFORMATICA

H6: Create: Van formulier naar database