Project PICOBELLO

HTML (Project picobello BV)
1 / 15
volgende
Slide 1: Tekstslide
InformaticaMiddelbare schoolhavoLeerjaar 4

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

time-iconLesduur is: 120 min

Onderdelen in deze les

HTML (Project picobello BV)

Slide 1 - Tekstslide

Deze slide heeft geen instructies

Wat gaan wij vandaag doen
Start Periode 6
- Groepjes maken  (2 leerlingen per groep)
- Wat is een Website
- Uit welke delen bestaat een website
- Wat is Wireframe
- Wat gebruiken wij om een website te bouwen
- Maken van een ontwerp van jouw website in XD



Slide 2 - Tekstslide

Beschrijving van de openingsfoto

Je ziet op de foto een Pingo.
Dit is een ijslens onder de grond. Doordat de ijsmassa water aantrekt groeit de pingo.

Blablabalbla


Groepjes van 2 leerlingen
Groep 1 : Bahar, Farhan
Groep 2: Zakaria, Mohammed Khan
Groep 3: Bellal , Bilal
Groep 4: Walid, Rawan
Groep 5: Delina
Groep 6: Steven
Groep 7: Zane
Groep 8: Ehsan



Slide 3 - Tekstslide

Deze slide heeft geen instructies

Wat is een website?

Slide 4 - Woordweb

Deze slide heeft geen instructies

Wat is een website
 
1. web-site,  een plaats op het web waar jouw webpagina's bevinden. m.a.w. een verzamelpunt waar al jouw webpagina zijn opgeslagen

2. Een website kan dus meerdere webpagina's

3. Een website wordt gehost op een webserver. Een websever is een computer die de taak om de webpagina voor het internet opvraagbaar maakt via het http of https protocol. https is het zelfde als http maar dan over een beveiligde kanaal

4. http en https zijn protocollen over hoe een webpagina over het internet wordt verstuurd en in jouw browser wordt geladen

5. Een browsers is een programma die de webpagina laat zien op jouw pc 


Slide 5 - Tekstslide

Deze slide heeft geen instructies

Wat is een website niet
 
1. Website is geen HTML code. Een webpagina bevat wel HTML code

2. Een website is geen browsers

3. Een website heeft niet altijd het internet nodig



Slide 6 - Tekstslide

Deze slide heeft geen instructies

Voor dat je een declaratie doet in CSS code geef je aan welke deel van HTML jouw CSS declaratie toegepast moet worden. Dit noemen wij de selector.

Wat zegt de css code hier op de 
afbeelding? Alle ..... wordt de 
font-size 1.2em toegepast

Slide 7 - Tekstslide

Deze slide heeft geen instructies

Ik weet wat een website is
ja
nee
deels duidelijk maar ik heb nog vragen

Slide 8 - Poll

Deze slide heeft geen instructies

ik weet wat een http(s)
ja
nee
deels duidelijk maar ik heb nog vragen

Slide 9 - Poll

Deze slide heeft geen instructies

ik weet wat een webserver is
ja
nee
deels duidelijk maar ik heb nog vragen

Slide 10 - Poll

Deze slide heeft geen instructies

ik weet wat een webbrowser is
ja
nee
deels duidelijk maar ik heb nog vragen

Slide 11 - Poll

Deze slide heeft geen instructies

Uit welke delen bestaat een website?
Er bestaat niet een vaste layout.

Er is wel een basislayout 

Header, Navigatie, content, footer


Slide 12 - Tekstslide

Deze slide heeft geen instructies

Wat is Wireframe
Is een schets hoe jouw website eruit komt te zien 

Het stelt jou in staat om jouw indeling van jouw website snel te maken voordat je echt begint met bouwen.




Slide 13 - Tekstslide

Deze slide heeft geen instructies

Wat gebruiken wij om een website te bouwen
XD = ontwerp van website maken
Code editor = om website te coderen
HTML = de taal om de structuur van een webpagina te bouwen
CSS = de taal om stijl van de webpagina aan te passen & deel interactief te maken
JS = de taal om de website  interactief en slim te maken

Slide 14 - Tekstslide

Deze slide heeft geen instructies

Maken van een ontwerp van jouw website in XD
Jullie maken een website voor een loodgieters bedrijf

Eerst op papier een schets maken over de layout van jouw webpagina's
Jouwe website bestaat uit minimaal 4 webpagina's  (Home, Diensten, Over ons en contact )


Deze periode werken wij aan HTML en CSS 
De volgende periode gaan wij de website voorzien van javascript (wij maken de website meer interactief en slim)


Slide 15 - Tekstslide

Deze slide heeft geen instructies