lOMoARcPSD|11700591
Samenvatting
Internetstandaarden (Hogeschool van Amsterdam)
, lOMoARcPSD|11700591
Inleiding
1. HTML
HTML wordt gebruikt om webpaginas mee te maken. Zo kan een browser weten wat een
kop is een hoofdstuk, lijsten links, afbeeldingen, formulieren enoverige dingen
2. CSS
CSS kan je onderverdelen onder 2 eigen schappen, dat zijn presentatie enlay-out.
1. Presentatie : hoe je zaken bepaalt als de lettertype die je wilt gebruiken ende
tekstgrootte, hoe je de achtergrondkleur van pagina’s ( of delen van een pagina) instelt
en
hoe je achtergrondafbeeldingen toevoegt.
2. Lay-out : hoe je bepaalt waar de verschillende elementen op het scherm
terechtkomen.
3. Browsers : Mensen bezoeken websites met webbrowsers. ( Chrome, Firefox, Safari )
4. Webserver: Webservers zijn speciale computers die continue met het internet
verbonden zijn engeoptimaliseerd zijn op webpagina’s naar de bezoeker te sturen.
5. Schermlezers: Schermlezers zijn programma’s die de inhoud van een computerscherm
aan
een gebruiker voorlezen, vaak voor mensen met een visuele handicap.
6. Hoe het web werkt? : Wanneer je een website bezoekt, kan de webserver die de
site host zich overal in de wereld bevinden. Om de locatie van de webserver te vinden,
zal je browser eest verbinding maken met een Domain Name System Server (DNS)
1. Wanneer je een verbinding met het web maakt, dan doe je dat via een Internet
Service Provider. Om een site te bezoeken typ je een domeinnaam of webadres in je
browser in. Bijv nu.nl
2. Je computer legt contact met enzogenaamde netwerk van servers het zogenaamde
DNS. Dat zijn net telefoonboeken; ze vertellen het IP-adres dat bij de domeinnaam
hoort. Een IP- adres bestaat uit 4 getallen, gescheiden door een punt ( 192.168.0.1
bv). Elk aparaat verbonden met het internet heeft een uniek IP, als het ware een
telefoonnummer van die computer.
3. Met het unieke nummer dat de DNS-server aan je computer geeft kan je de
browser verbinding maken met de webserver die de website die je wilt bezoeken host.
Een webserver is een computer die altijd met het web verbonden is enspeciaal voor
het verzenden van
wegpagina’s is ingesteld.
4. De webserver stuurt vervolgens de pagina waar je om gevraagd hebt naar de
webbrowser terug.
, lOMoARcPSD|11700591
Hoofdstuk 1 - STRUCTUUR
De HTML-code is opgebouwd uit tekens binnen spekhaken:
- deze worden HTML-elementen genoemd. Elementen zijn meestal samengesteld 2 tags ( <h1>
…
</h1> bijv). In de afsluitende tag staat een schuine streep. Elk HTML element vertelt de browser
iets over de informatie die tussen de openings- ensluitingstag staat.
In HTML wordt de structuur van de pagina’s met elementen beschreven.
<p> : openingstag </p> : sluitingstag
Attributen bieden extra informatie over de inhoud van een element. Ze staan in de openingstag van
een element enzijn opgebouwd uit 2 delen: een naam eneen waarde, gescheiden door een: =
teken.
<head> : dit bevat informatie over de pagina. Binnen het element zie je meestal het element <title>
<body>: alles binnen dit element wordt in het hoofdvenster van de browser getoond
<title>: de inhoud van het element wordt bovenin de browser getoond, boven de plaats waar je normaliter de
URL van de pagina die je wilt bezoeken intypt, of op het tabblad voor die pagina.
Contentmanagementsysteem, bloggingplatform of e-commerce-applicaties maken vaak geen
gebruik van (zelf gecodeerde ) HTML maar sjablonen. Dit is omdat het makkelijk is bij te houden
voor mensen die geen verstand hebben van HTML maar toch de content van hun website up to
date willen houden enkunnen bijwerken.
, lOMoARcPSD|11700591
Hoofdstuk 2 - TEKST
Structurele mark-up: de elementen die je kunt gebruiken om koppen enalinea’s te beschrijven.
Semantische mark-up: geven extra informatie, zoals de plaats waar nadruk in de zin wordt
gelegd, dat iets wat je hebt geschreven een citaat is ( enwie het gezegd heeft), de betekenis
van een afkorting enga zo maar door.
<h1> wordt gebruikt voor hoofdkoppen
<h2> wordt gebruikt voor tussenkoppen
<h3> t/m <h6>. De precieze formaat waarin welke browser de koppen toont varieert. ( je kan de
grootte van de tekst, kleur enhet gebruikte lettertype bepalen met CSS)
<p>: om een alinea te maken begin je met openingstag <p> ensluit je af met de tag </p>.
Standaard
geeft een browser elke alinea op een nieuwe regel weer met wat ruimte tussen de alinea’s.
<b>…</b>: door woorden tussen deze tags te zetten worden ze dik gedrukt, dit is alleen voor
het uiterlijk enheeft verder geen extra betekenis
<i>…</i>: door woorden tussen deze tags te zetten worden ze schuingedrukt, dit is voor woorden
die visueel anders gepresenteerd moeten worden zoals technische termen, namen van
schepen, vreemde woorden, gedachten, of andere termen die normaal schuingedrukt worden
weergegeven
<sup>…</sup>: het element wordt gebruikt voor tekens die in superscript moeten worden gezet zoals
rangtelwoorden of wiskundige expressies als machtsverheffen zoals x2.
<sub>…</sub>: het element wordt gebruikt voor tekens die in subscript moeten worden gezet.
Het wordt vaak gebruikt bij voetnoten enchemische formules zoals H2O.
<br />: wordt gebruikt voor maken van witregel (niet gebruiken)
<hr />: wil je een duidelijke overgang aangeven, zoals een nieuw onderwerp in een boek of een
nieuw bedrijf in een toneelstuk, dan kun je met behulp van deze tag een horizontale lijn
aanbrengen.
SEMANTISCHE MARK-UP
Er zijn een aantal tekstelementen die niet bedoeld zijn op de structuur van webpagina’s te
beinvloeden, maar om extra informatie aan de pagina te voegen. Deze staan bekend als
semantische mark-up
Browsers tonen de inhoud van deze elementen vaak op een andere manier. Zo wordt de inhoud
van het element <em> cursief geplaatst eneen <blockqoute> verschijnt gewoonlijk ingesprongen.
Maar je moet ze niet gebruiken voor het veranderen van de manier waarop de tekst wordt
weergegeven. Hun doel is om de inhoud van je webpagina’s nauwkeuriger te beschrijven.
De reden voor het gebruik van deze elementen is dat andere programma’s, zoals
schermlezers of zoekmachines, gebruik kunnen maken van deze extra informatie. Zo kan de
stem van een schermlezer de woorden binnen het element <em> nadrukkelijk uitspreken, of een
zoekmachine kan weten at je pagina een citaat bevat als je het element <blockqoute>
gebruikt.
Belang ennadruk
<em> : hier geef je mee aan op welke woorden nadruk moet worden gelegd. ( geeft nadruk
aan die op subtiele wijze de betekenis van een zin veranderd)
<strong>: hiermee geef je aan dat de inhoud ervan erg belangrijk is. De woorden zouden met
een sterke nadruk uitgesproken moeten worden. (bijv. <strong> Pas op: </strong>)
Samenvatting
Internetstandaarden (Hogeschool van Amsterdam)
, lOMoARcPSD|11700591
Inleiding
1. HTML
HTML wordt gebruikt om webpaginas mee te maken. Zo kan een browser weten wat een
kop is een hoofdstuk, lijsten links, afbeeldingen, formulieren enoverige dingen
2. CSS
CSS kan je onderverdelen onder 2 eigen schappen, dat zijn presentatie enlay-out.
1. Presentatie : hoe je zaken bepaalt als de lettertype die je wilt gebruiken ende
tekstgrootte, hoe je de achtergrondkleur van pagina’s ( of delen van een pagina) instelt
en
hoe je achtergrondafbeeldingen toevoegt.
2. Lay-out : hoe je bepaalt waar de verschillende elementen op het scherm
terechtkomen.
3. Browsers : Mensen bezoeken websites met webbrowsers. ( Chrome, Firefox, Safari )
4. Webserver: Webservers zijn speciale computers die continue met het internet
verbonden zijn engeoptimaliseerd zijn op webpagina’s naar de bezoeker te sturen.
5. Schermlezers: Schermlezers zijn programma’s die de inhoud van een computerscherm
aan
een gebruiker voorlezen, vaak voor mensen met een visuele handicap.
6. Hoe het web werkt? : Wanneer je een website bezoekt, kan de webserver die de
site host zich overal in de wereld bevinden. Om de locatie van de webserver te vinden,
zal je browser eest verbinding maken met een Domain Name System Server (DNS)
1. Wanneer je een verbinding met het web maakt, dan doe je dat via een Internet
Service Provider. Om een site te bezoeken typ je een domeinnaam of webadres in je
browser in. Bijv nu.nl
2. Je computer legt contact met enzogenaamde netwerk van servers het zogenaamde
DNS. Dat zijn net telefoonboeken; ze vertellen het IP-adres dat bij de domeinnaam
hoort. Een IP- adres bestaat uit 4 getallen, gescheiden door een punt ( 192.168.0.1
bv). Elk aparaat verbonden met het internet heeft een uniek IP, als het ware een
telefoonnummer van die computer.
3. Met het unieke nummer dat de DNS-server aan je computer geeft kan je de
browser verbinding maken met de webserver die de website die je wilt bezoeken host.
Een webserver is een computer die altijd met het web verbonden is enspeciaal voor
het verzenden van
wegpagina’s is ingesteld.
4. De webserver stuurt vervolgens de pagina waar je om gevraagd hebt naar de
webbrowser terug.
, lOMoARcPSD|11700591
Hoofdstuk 1 - STRUCTUUR
De HTML-code is opgebouwd uit tekens binnen spekhaken:
- deze worden HTML-elementen genoemd. Elementen zijn meestal samengesteld 2 tags ( <h1>
…
</h1> bijv). In de afsluitende tag staat een schuine streep. Elk HTML element vertelt de browser
iets over de informatie die tussen de openings- ensluitingstag staat.
In HTML wordt de structuur van de pagina’s met elementen beschreven.
<p> : openingstag </p> : sluitingstag
Attributen bieden extra informatie over de inhoud van een element. Ze staan in de openingstag van
een element enzijn opgebouwd uit 2 delen: een naam eneen waarde, gescheiden door een: =
teken.
<head> : dit bevat informatie over de pagina. Binnen het element zie je meestal het element <title>
<body>: alles binnen dit element wordt in het hoofdvenster van de browser getoond
<title>: de inhoud van het element wordt bovenin de browser getoond, boven de plaats waar je normaliter de
URL van de pagina die je wilt bezoeken intypt, of op het tabblad voor die pagina.
Contentmanagementsysteem, bloggingplatform of e-commerce-applicaties maken vaak geen
gebruik van (zelf gecodeerde ) HTML maar sjablonen. Dit is omdat het makkelijk is bij te houden
voor mensen die geen verstand hebben van HTML maar toch de content van hun website up to
date willen houden enkunnen bijwerken.
, lOMoARcPSD|11700591
Hoofdstuk 2 - TEKST
Structurele mark-up: de elementen die je kunt gebruiken om koppen enalinea’s te beschrijven.
Semantische mark-up: geven extra informatie, zoals de plaats waar nadruk in de zin wordt
gelegd, dat iets wat je hebt geschreven een citaat is ( enwie het gezegd heeft), de betekenis
van een afkorting enga zo maar door.
<h1> wordt gebruikt voor hoofdkoppen
<h2> wordt gebruikt voor tussenkoppen
<h3> t/m <h6>. De precieze formaat waarin welke browser de koppen toont varieert. ( je kan de
grootte van de tekst, kleur enhet gebruikte lettertype bepalen met CSS)
<p>: om een alinea te maken begin je met openingstag <p> ensluit je af met de tag </p>.
Standaard
geeft een browser elke alinea op een nieuwe regel weer met wat ruimte tussen de alinea’s.
<b>…</b>: door woorden tussen deze tags te zetten worden ze dik gedrukt, dit is alleen voor
het uiterlijk enheeft verder geen extra betekenis
<i>…</i>: door woorden tussen deze tags te zetten worden ze schuingedrukt, dit is voor woorden
die visueel anders gepresenteerd moeten worden zoals technische termen, namen van
schepen, vreemde woorden, gedachten, of andere termen die normaal schuingedrukt worden
weergegeven
<sup>…</sup>: het element wordt gebruikt voor tekens die in superscript moeten worden gezet zoals
rangtelwoorden of wiskundige expressies als machtsverheffen zoals x2.
<sub>…</sub>: het element wordt gebruikt voor tekens die in subscript moeten worden gezet.
Het wordt vaak gebruikt bij voetnoten enchemische formules zoals H2O.
<br />: wordt gebruikt voor maken van witregel (niet gebruiken)
<hr />: wil je een duidelijke overgang aangeven, zoals een nieuw onderwerp in een boek of een
nieuw bedrijf in een toneelstuk, dan kun je met behulp van deze tag een horizontale lijn
aanbrengen.
SEMANTISCHE MARK-UP
Er zijn een aantal tekstelementen die niet bedoeld zijn op de structuur van webpagina’s te
beinvloeden, maar om extra informatie aan de pagina te voegen. Deze staan bekend als
semantische mark-up
Browsers tonen de inhoud van deze elementen vaak op een andere manier. Zo wordt de inhoud
van het element <em> cursief geplaatst eneen <blockqoute> verschijnt gewoonlijk ingesprongen.
Maar je moet ze niet gebruiken voor het veranderen van de manier waarop de tekst wordt
weergegeven. Hun doel is om de inhoud van je webpagina’s nauwkeuriger te beschrijven.
De reden voor het gebruik van deze elementen is dat andere programma’s, zoals
schermlezers of zoekmachines, gebruik kunnen maken van deze extra informatie. Zo kan de
stem van een schermlezer de woorden binnen het element <em> nadrukkelijk uitspreken, of een
zoekmachine kan weten at je pagina een citaat bevat als je het element <blockqoute>
gebruikt.
Belang ennadruk
<em> : hier geef je mee aan op welke woorden nadruk moet worden gelegd. ( geeft nadruk
aan die op subtiele wijze de betekenis van een zin veranderd)
<strong>: hiermee geef je aan dat de inhoud ervan erg belangrijk is. De woorden zouden met
een sterke nadruk uitgesproken moeten worden. (bijv. <strong> Pas op: </strong>)
