Korte uitleg: HTML5 en CSS3
We zijn alweer 4 jaar verder sinds HTML4 door W3C werd vastgesteld. HTML5 wordt begin 2011 de nieuwe webstandaard, deze zal de functionaliteit van zowel html en xhtml bevatten. Samen met CSS3 en gemakkelijk gebruik van Javascript en XML wordt het wel erg gemakkelijk voor de beginnende web-bouwer!
HTML is een opmaaktaal van het web en daarmee het belangrijkste bouwmateriaal van websites. In 1997 werkt HTML4 vastgelegd en in 2000 kwam (X)HTML 4.01 Strict daar bij. De conclusie werd al snel door web-bouwers getrokken, want XHTML gaat HTML niet vervangen als nieuwe manier om websites te bouwen. Internet ontwikkelde zich steeds meer, tot de dag van vandaag waar we het Web 2.0 van kennen. HTML5 zal als startpunt gezien worden en zal voor de verdere HTML-ontwikkeling staan.
Dames en heren, start uw moderne browsers en begin met HTML5, deze brengt multimedia en interactie zonder plugins naar het web. De nieuwe HTML versie 5 wordt gelezen door de nieuwste versie browsers van Firefox, Internet Explorer (8 en 9), Chrome, Safari en andere browsers. Maar er is momenteel nog niet 1 browser die elke functie van HTML5 volledig kan ondersteunen, Google Chrome en Safari komen het dichtst in de buurt van volledige ondersteuning. Gemiddeld ondersteunen zij de volgende eigenschappen:
HTML5 Support:
- @font-face
- Canvas
- Canvas Text
- HTML5 Audio
- HTML5 Video
- Geolocation API
- Local Storage
- Session Storage
- Window Messaging
- Offline Applications
- Web Workers
- Query Selector
- WebSQL Database
- IndexDB Database*
- Touch Events*
- Drag & Drop
- Hashchange Event
- History Management
- Web Sockets
- SVG
- SVG Clipping Paths
- Inline SVG
- SMIL
- WebGL
De combinatie met CSS3 support:
- border-radius
- opacity
- rgba()
- hsla()
- box-shadow
- text-shadow
- Background Size
- Multiple backgrounds
- border-image
- CSS Animations
- CSS Columns
- CSS Gradients
- CSS Reflections
- CSS 2D Transforms
- CSS 3D Transforms*
- CSS Transitions
- FlexBox
* De schuin gedrukte elementen zijn nog niet te gebruiken in deze browser, support is onderweg!
Tags
HTML5 introduceert nieuwe tags die ervoor zorgen dat er meer structuur in het document komt, zoals <header> om het header gedeelte aan te duiden (en zo ook het <footer> deel), <nav> voor navigatie en <article> om het artikeldeel aan te duiden. Verder komen er ook tags die het mogelijk maken om interactieve content af te spelen zonder gebruik te maken van een Flash-Player-plugin of scripts, zoals de <video>-tag. Door verbetering op het gebied van het Document Object Model worden webpagina’s sneller geladen. HTML5 zorgt er ook voor dat webapplicaties offline beschikbaar kunnen worden, bij het eerste bezoek aan de applicatie download je dan automatisch de benodigde files voor de webapp en dan kun je deze later offline gebruiken. Flash heeft zo zijn nadelen: Het is gevoelig voor crashes en trekt een relatief zware wissel op de browser en computer wat betreft rekenkracht. Bovendien werkt Flash nog altijd niet lekker op mobieltjes. Ook Flash versie 10.1 voor Android smartphones, sinds kort beschikbaar, werkt nogal traag en buggy. Voordat Adobe de problemen heeft gefixt, is het waarschijnlijk al ingehaald door HTML5. HTML5 laat audio- en videocontent in een webpagina integreren met bestandsformaten als Ogg Vorbis, mp3, aac (audio), Ogv Vorbis, mp4 en vp8 (video). Er is geen Flash meer nodig om filmpjes te bekijken op YouTube of Vimeo. HTML5 is een open standaard en eentje met nieuwe functionaliteiten en snellere laadtijden dan alle voorgaande versies. Een ontwikkeling die in volle gang is en zelfs nog wel een klein jaar kan duren, ook de ondersteuning van browsers heeft hier uiteraard mee te maken. Sinds voor kort is W3C eindelijk overtuigd van het feit dat XHTML een verloren zaak is en dat HTML5 de toekomst is. Het grote voordeel zit uiteindelijk in soepelere en snellere browserinteractie, zowel op computers als mobiele apparaten. Ook de web-bouwers en hun klanten hebben hier profijt van, minder code, minder tijd en voor de klant minder kosten! Het aspect dat de web-bouwer profijt heeft, zit hem in de ‘minder tijd’, want dan is er weer tijd over om een andere project aan te pakken!
