Inleiding

Geschiedenis: evolutie van HTML en CSS
HTML5: overzicht van huidige problemen
Voorbeelden van HTML 5- en CSS3-toepassingen
Overzicht van ontwikkeltools zoals Visual Studio

HTML5

Een pagina structureren in HTML5:
Semantische tags: header, article, aside...
Een opmaakcontainer maken
Nieuwe attributen gebruikt door zoekmachines

Praktische workshop: Architectuur van een pagina in HTML5

Media beheren in HTML 5

Audio- en videotags
De Canvas-tag: gebruik van de Canvas API.
Interactieve afbeeldingen met SVG

Hands-on workshop: interactieve afbeeldingen maken

CSS 3

Toepassing van stijlen op HTML 5 zone eigenschappen
Selectoren: Tag en attribuut verwijzingen, overerving, voorvoegsels, !important, object architectuur, pseudo-klassen en pseudo-elementen.
Uiterlijk: Grootte, randen, contouren, achtergrond, achtergrondafbeelding, verlopen, schaduwen, clipping,
transparantie, dimensionering, marges...
Positioneringskwesties, de verschillende positioneringsmodi, weergave, verbergen
Kolomopmaak. Zwevend, uitsluitingen.

Praktische workshop: Een pagina met persartikelen maken

Stijlen toepassen op HTML 5-teksteigenschappen

Formaat, kleur, slagschaduw...
Lettertype-integratie: @font-face
Uitlijning, tekstindentatie, rechtvaardiging, woordafbreking.

Praktische workshop: Opmaak van een artikel

Overgangen en transfomaties in CSS3

Objecten transformeren in 2D en 3D
Objecten animeren met CSS-overgangen
De interface aanpassen aan de gebruikte media

Praktische workshop: de webpagina animeren

Responsief webontwerp

Presentatie van Responsive Web Design: doelstellingen, alternatieven...
Het flexibele model
Media queries
Lay-out met behulp van regio's, groepering en nesting
Vaste en vloeiende rasters
Beeldcompressie, sprites, Data URI
API Network Information JavaScript for Responsive

Praktische workshop: de webpagina aanpassen aan meerdere formaten (tablets, smartphones...)

De belangrijkste API's van HTML 5

Opslag-API's: LocalStorage, SessionStorage, IndexedDB
Geolocatie
Offline webtoepassing

Slagen voor de certificering (indien opgenomen in de financiering)