HWUD04-sj2122-01-Webdev-introductie

1 / 37
next
Slide 1: Slide
Communication & multimedia designHBOStudiejaar 2

This lesson contains 37 slides, with interactive quizzes and text slides.

Items in this lesson

Slide 1 - Slide

Slide 2 - Slide

Waar denk je aan bij Web Development

Slide 3 - Mind map

Slide 4 - Slide

Slide 5 - Slide

Slide 6 - Slide

Slide 7 - Slide

Slide 8 - Slide

Slide 9 - Slide

Slide 10 - Slide

Slide 11 - Slide

Slide 12 - Slide

Slide 13 - Slide

Waaruit bestaat een website?

HTML is een programmeertaal, maar wel een beperkte, omdat het vooral bedoeld is voor het opmaken van tekst en webpagina's. 
HTML-pagina's zijn dus geschreven in HTML en bestaan dus uit programma-code waarmee je onder andere tekst en afbeeldingen op de juiste plek op de pagina kunt plaatsen.
A
Programma code
B
Bouwstenen
C
Programmeertaal
D
Afbeeldingen en tekst

Slide 14 - Quiz

Dit is het logo van de Code-Editor Visual Studio. Dit kun je dus gebruiken om een website te bouwen. Het is niet het logo van een programmeertaal.
wat zijn de 3 belangrijkste programmeertalen die gebruikt worden bij Web Development?
Javascript wordt gebruikt om interactie en dynamiek aan je website toe te voegen. Het is een programmeertaal waar je heel veel mee kan en het is tegenwoordig essentieel voor de werking van de meeste websites. 
Javascript wordt in de browser uitgevoerd.
Ook PHP is een veelgebruikte programmeertaal voor Webdevelopment, maar het is essentieel. PHP wordt op de Server uitgevoerd. Alleen het resultaat wordt naar de browser gestuurd.
HTML is een programmeertaal die fundamenteel is voor het maken van webpagina's. Hiermee voeg je zowel zichtbare als onzichtbare inhoud toe aan een website. 
Python is een veelgebruikte programmeertaal voor zowel web development als hele andere applicaties. Python wordt op de server uitgevoerd, net als PHP. Je zou het goed kunnen laten samenwerken met Javascript. 
Ook CSS is een programmeertaal die fundamenteel is voor het maken van webpagina's. Hiermee voeg je stijl toe. Je verandert kleurtjes en lettertypes, alsof je een website een ander jasje of een andere skin aantrekt. 
Microsoft Word is een Word-processor, of tekst-editor. Het is niet geschikt om programmacode mee te schrijven.
SQL is een taal waarmee je databases kunt bevragen. Veel websites bewaren hun inhoud in databases, dus het wordt wel veel gebruikt bij het maken van websites, maar eenvoudige websites hebben geen database nodig. Het is dus niet één van de 3 talen die we hier bedoelen.
Plaats de cirkels over 3 logo's

Slide 15 - Drag question

HTML gebruik je om een website structuur en inhoud te geven en een beetje opmaak. 

Met opmaak bedoelen we dat je bijvoorbeeld dikgedrukte tekst kunt maken, scheve tekst, of grote en kleine koppen.

Met inhoud bedoelen we dat je tekst, afbeeldingen en andere inhoud aan de pagina kunt toevoegen.

Met Structuur bedoelen we dat er elementen zijn die helpen om de inhoud op de juiste plek op de pagina te plaatsen. Bijvoorbeeld bovenin, of onderin, of links of rechts op de pagina. 
CSS is de taal waarmee je stijl aan een web-pagina kan toevoegen. Kleuren, lettertypes, marges en nog veel meer kun je definiëren via de CSS. CSS is als een skin. Je kunt dezelfde pagina met CSS een totaal ander uiterlijk geven.
Javascript is de taal die interactie en dynamiek aan websites toevoegt. 
Javascript zorgt ervoor dat een formulier verstuurd wordt, informatie verwerkt, je wachtwoord gecontroleerd, je winkelwagen gevuld, je betaling slaagt etc. Zonder Javascript zouden websites als boeken zijn - je zou ze kunnen lezen, maar verder niks.

Slide 16 - Slide

Met welke taal geef je een website structuur en inhoud?
A
HTML
B
CSS
C
Javascript
D
Python

Slide 17 - Quiz

Met welke taal verander je het uiterlijk van een site (net als een skin)
A
HTML
B
CSS
C
Javascript
D
Python

Slide 18 - Quiz

Met welke taal zorg je dat er een bedankt-bericht verschijnt als je een formulier vestuurt?
A
HTML
B
CSS
C
Javascript
D
Python

Slide 19 - Quiz

Verbind de afbeeldingen met de programmeertalen waarmee je ze associeert
Dit moet een RC-auto voorstellen die daadwerkelijk kan rijden.

Slide 20 - Drag question

Wat betekent de afkorting HTML?
A
Hyper Text Makeup Language
B
Hyper Text Markup Language
C
Hyper Tech Markup Language
D
Hyper Tag Markup Language

Slide 21 - Quiz

HTML-documenten schrijf je in een tekst-editor. Welk programma is een tekst-editor?
A
Notepad
B
Photoshop
C
Indesign
D
Word

Slide 22 - Quiz


een IDE kan veel meer dan een tekst-editor. Het biedt een geïntegreerde omgeving waarin een programmeur zijn apps kan ontwikkelen

Waar staat IDE voor?
A
Independent Development Environment
B
Integrated Development Environment
C
Independent Drawing & Editing
D
Integrated Development & Editing

Slide 23 - Quiz

wat is waar?
mijndocument.html
A
.html is de extensie
B
.html is het bestandstype
C
.html is de intentie
D
.html is het bestandsformaat

Slide 24 - Quiz

Wat is waar over de extensie?
De extensie vertelt de Operating-System (OS) welke software gebruikt moet worden om het bestand correct weer te geven.
De extensie vertelt ons om welk type bestand het gaat.
Waar
Waar

Slide 25 - Slide

Met welke extensie sla je HTML-documenten op?
A
.js
B
.css
C
.html
D
.asp

Slide 26 - Quiz

Met welke extensie sla je css-documenten op?
A
.js
B
.css
C
.html
D
.asp

Slide 27 - Quiz

Met welke extensie sla je javascript-documenten op?
A
.js
B
.css
C
.html
D
.asp

Slide 28 - Quiz

Vul de volgende bestandsnamen aan zodat de documenten worden opgeslagen als HTML-documenten:

index
pagina

Slide 29 - Open question


URLs verwijzen eigenlijk naar een map of bestand op een server. Als naar een map verwezen wordt, wordt automatisch index.html geopend. 

Wat is de bestandsnaam van de meeste HOME-pages?
A
home.html
B
index.html
C
anyname.html (dat wisselt)
D
myurl.html (de home-pagina is vernoemd naar de URL)

Slide 30 - Quiz



Moet je HTML, CSS en javascript in apparte documenten opslaan?
A
Nee
B
Ja

Slide 31 - Quiz

HTML, CSS en Javascript
zijn nauw aan elkaar verwant - ze kunnen samen, vervlochten, in een HTML-document voorkomen, of in snippets Javascript en CSS. Mettertijd leer je wel te herkennen of een stuk code uit HTML, CSS of Javascript bestaat.

Slide 32 - Slide


Mag je HTML, CSS en javascript in apparte documenten opslaan?
A
Nee
B
Ja

Slide 33 - Quiz

Hoe vond jij deze LessonUP?
😒🙁😐🙂😃

Slide 34 - Poll

Hoe zou je meer willen leren over de onderwerpen die je nog niet goed begrijpt?
A
Klassikale uitleg
B
LessonUps
C
Online Documentatie
D
Uitleg in een Reader

Slide 35 - Quiz

Hoe zouden we deze Lesson-UP nog beter kunnen maken?

Slide 36 - Open question

Zijn er nog andere onderwerpen waar je meer uitleg over wil, of andere manieren waarop je meer over een onderwerp zou willen leren?

Slide 37 - Open question