Inleiding
Element: alles vanaf opening tag tot closing tag
Tag: opening en closing tag (bv. <p> </p>)
Attribuut: extra info over element (bv. class=”editor-note”)
Attributen
class: element classiferen
data-*: laat toe om eigen HTML attributen te maken
href: refereren naar extern bestand
hidden: booleans attribuut
id: element uniek maken in een pagina
lang: taal van een webpagina
Secties
<article>: zelfstandig stuk inhoud, onafhankelijk te hergebruiken
<section>: onderdeel van pagina
<nav>: voor navigatie
<aside>: ‘zijdelingse’ informatie
<header>: kopgedeelte
<footer>: footer gedeelte
Koppen
<h1> tot <h6> waarbij 1 belangrijkste (titel) is
Alineatekst
<p>: nieuwe alinea beginnen
<br>: volgende regel beginnen
Andere elementen
<wbr>: afbreken van woorden
<em>: beklemtonen (emphasis)
<strong>: belangrijke nadruk leggen
<small>: aanvullende info
<cite>: markeren van naam van auteur of werk
<q>: korte citaten in quote
<abbr> afkorting (abbreviation)
<dfn>: markeert eerste keer dat definite voorkomt
<code>: markeren van programma code
<span>: container element zonder betekenis voor inhoud op regel niveau en waarop
attributen kunnen worden toegepast
<pre>: behouden van tabs en witruimte in code (pre-formatted)
<samp>: computer uitvoet
<kbd>: gebruikersinvoer (keyboard)
<s>: informatie die niet meer klopt (supress)
<sub>: subscript
<sup>: superscript
, <mark>: markeer tekst
<ins>: geeft aan dat inhoud is toegevoegd
<del>: geeft aan dat inhoud is verwijderd
Inhoud groeperen
<address>: markeert contact informatie
<main>: markeer belangrijkste inhoud van document. Header, footer en navigate ≠ main
<blockquote>: langere citaten uit andere bron waarbij bron en <cite> worden vermeld
<div>: groepeert inhoud zodat het makkelijk te benaderen is voor opmaak
<hr>: thematisch overgang tussen alinea’s aangeven
Lijsten:
<ol>: ordered list
<ul>: unordered list
<li>: markeert item in de lijst
<dl>: markeert lijst die bestaat uit paren
o <dt>: de naam
o <dd>: de waarde
Illustraties/bijschrijften:
<figure>: groepeert illustratie met zijn bijschrift
<figcaption>: bijschrijft in figure
Koppelingen
Link naar bestand in zelfde map: <a href=”registel.html”>Register</a>
Bestand in map lager: map/bestand
Bestand in map hoger: ../bestand
Link naar andere website: <a href=http://www.w3.org>World Wide Web</a>
Link naar email adres: <a href=mailto:?subject=reactie>Mail
webmaster </a>
Link naar telefoonnummer: <a href=”tel :+32486026817”>Bel de webmaster</a>
Ander tabblad:
Target attibuut (link opent in nieuw tabblad): <a href=”contact.html”
target=”_blank”>Contact</a>
PDF:
Lezen in browser: <a href=”./pdf/H05.pdf” >pdf van hoofdstuk 5</a>
Bestand downloaden:
<a href=”./pdf/H05.pdf” download=”hoofdstuk 5”>pdf van hoofdstuk 5</a>
Bladzijder maken:
Ankerpunt in pagina waar met hyperlink naartoe kan worden gesprongen:
Element: alles vanaf opening tag tot closing tag
Tag: opening en closing tag (bv. <p> </p>)
Attribuut: extra info over element (bv. class=”editor-note”)
Attributen
class: element classiferen
data-*: laat toe om eigen HTML attributen te maken
href: refereren naar extern bestand
hidden: booleans attribuut
id: element uniek maken in een pagina
lang: taal van een webpagina
Secties
<article>: zelfstandig stuk inhoud, onafhankelijk te hergebruiken
<section>: onderdeel van pagina
<nav>: voor navigatie
<aside>: ‘zijdelingse’ informatie
<header>: kopgedeelte
<footer>: footer gedeelte
Koppen
<h1> tot <h6> waarbij 1 belangrijkste (titel) is
Alineatekst
<p>: nieuwe alinea beginnen
<br>: volgende regel beginnen
Andere elementen
<wbr>: afbreken van woorden
<em>: beklemtonen (emphasis)
<strong>: belangrijke nadruk leggen
<small>: aanvullende info
<cite>: markeren van naam van auteur of werk
<q>: korte citaten in quote
<abbr> afkorting (abbreviation)
<dfn>: markeert eerste keer dat definite voorkomt
<code>: markeren van programma code
<span>: container element zonder betekenis voor inhoud op regel niveau en waarop
attributen kunnen worden toegepast
<pre>: behouden van tabs en witruimte in code (pre-formatted)
<samp>: computer uitvoet
<kbd>: gebruikersinvoer (keyboard)
<s>: informatie die niet meer klopt (supress)
<sub>: subscript
<sup>: superscript
, <mark>: markeer tekst
<ins>: geeft aan dat inhoud is toegevoegd
<del>: geeft aan dat inhoud is verwijderd
Inhoud groeperen
<address>: markeert contact informatie
<main>: markeer belangrijkste inhoud van document. Header, footer en navigate ≠ main
<blockquote>: langere citaten uit andere bron waarbij bron en <cite> worden vermeld
<div>: groepeert inhoud zodat het makkelijk te benaderen is voor opmaak
<hr>: thematisch overgang tussen alinea’s aangeven
Lijsten:
<ol>: ordered list
<ul>: unordered list
<li>: markeert item in de lijst
<dl>: markeert lijst die bestaat uit paren
o <dt>: de naam
o <dd>: de waarde
Illustraties/bijschrijften:
<figure>: groepeert illustratie met zijn bijschrift
<figcaption>: bijschrijft in figure
Koppelingen
Link naar bestand in zelfde map: <a href=”registel.html”>Register</a>
Bestand in map lager: map/bestand
Bestand in map hoger: ../bestand
Link naar andere website: <a href=http://www.w3.org>World Wide Web</a>
Link naar email adres: <a href=mailto:?subject=reactie>Mail
webmaster </a>
Link naar telefoonnummer: <a href=”tel :+32486026817”>Bel de webmaster</a>
Ander tabblad:
Target attibuut (link opent in nieuw tabblad): <a href=”contact.html”
target=”_blank”>Contact</a>
PDF:
Lezen in browser: <a href=”./pdf/H05.pdf” >pdf van hoofdstuk 5</a>
Bestand downloaden:
<a href=”./pdf/H05.pdf” download=”hoofdstuk 5”>pdf van hoofdstuk 5</a>
Bladzijder maken:
Ankerpunt in pagina waar met hyperlink naartoe kan worden gesprongen: