Wat is er eigenlijk vernieuwend aan (X)HTML5?

HTML5 wordt de nieuwe standaard voor het maken van websites, of webapplicaties.

Wat is er eigenlijk vernieuwend aan (x)HTML5?

De structuur
In HTML5 worden er een aantal nieuwe elementen geïntroduceerd, voor de website structuur, zoals bijvoorbeeld:

header
footer
section
article

Eigenlijk allemaal standaard onderdelen van websites, maar die je nu vaak nog defineerd met bijvoorbeeld div id="header"
Opzich natuurlijk niet heel schokkend, maar voor de structuur van een websites is dit wel duidelijker dan zelf gekozen elementen, dat zegt bijvoorbeeld zoekmachines niet zoveel. En een tekst browser, of klein mobiel scherm ook niet.

Het enige is dat bijvoorbeeld Internet Explorer, zelfs versie 9, hier geen native ondersteuning voor heeft. Dit is dan weer op te lossen met bijvoorbeeld een Javascript library zoals Modernizr .

Multimedia direct in HTML5; audio en video

Wat vernieuwend is aan HTML5, is de mogelijkheid om zonder Flash of Javascript video en audio toe te voegen. Met de tags:

audio
video

Niet echt heel moeilijk, er zit wel een addertje onder het gras, niet alle browsers ondersteunen dezelfde video en audio formaten. Dus je moet nog steeds controleren welk merk browser video of audio opvraagt en hier de response op aanpassen. Of je doet het op de manier die hier wordt gebruikt;

http://html5demos.com/video

Ze embedden hier twee video's een Ogg Theora en MP4 (H264), dat gaat goed, zolang een browser maar een van de twee codecs ondersteund, anders heb je geen filmpje.

Animaties met canvas
Met HTML5 is het ook mogelijk om animaties te maken, dat doe je op een canvas element, met behulp van Javascript, sommige browser (Google Chrome) werken zelf met een 3D canvas, dan kun je 3D animaties maken, met behulp van Javascript.

Javascript
Javascript krijgt in HTML5 ook een upgrade, waarvan een van de belangrijkste misschien wel de web-workers gaat worden, multi-threading in Javascript, je hoeft niet meer te wachten op het ophalen van alle data, maar je kunt bijvoobeeld je animatie al starten.

Bronnen

Browser ondersteunig voor HTML5
http://html5readiness.com/

Modernizer HTML5 Javascript Library
http://www.modernizr.com/

HTML5 Tags
http://www.w3schools.com/html5/html5_reference.asp

HTML5 Presentatie van alle features, in HTML5
http://apirocks.com/html5/html5.html

WHATWG
http://www.whatwg.org/

Van printmedia naar webmedia

Hoe maak ik van printmedia ook goede webmedia? De eerste stap is een nieuwe benadering door ‘papieren’ vormgevers en DTP-ers. Voor het web gelden eigen regels en valkuilen. De cursus Printmedia naar Web van Competence Factory leert je in drie dagen hoe de knop moet worden omgezet.

Wat is er eigenlijk vernieuwend aan (X)HTML5?

Van printmedia naar webmedia

Firefox 4 beschikbaar

HTML Animatie voor Tablets

Eerste lustrum voor Twitter

Leergang iPhone/Smartphone Developer

Woede over ‘tendentieus cookierapport’

Inbrekers gepakt na Facebook-bericht

jQuery en jQTouch

iOS webapps gediscrimineerd

HTML5 en CSS3

Innovatiekrediet voor IQNOMY

Meet de laadtijd van een website

Internet Projectmanagement voor Opdrachtgevers

De kijker beslist!

Internet Projectmanagement voor Sitebouwers

Social media en online marketing: de nieuwste ontwikkelingen

Trainingen WordPress Beheer & Redactie

Tekstschrijven voor Internet

Ontwerp een goede website-toolbar

CS5 Update Dreamweaver

Google AdWords: acht nieuwe mogelijkheden

Zelf een Android-applicatie maken

CS5 update voor web toepassingen

Nieuwe versie Drupal 7 gebruiksvriendelijker

Adobe InDesign; ePub maken

Online content onderhouden

Dropdown

XML, Publiceren op Internet

HTML5-video verdubbelt aandeel in vijf maanden

Adobe maakt HTML5-widget

HTML5 prima in te zetten

Webdesign met beperkte middelen

Database beveiliging

Programmeer quizen (2)

Internet Quizen

50 beste meest gebruikte Photoshop hotkeys

Adobe ICC profielen

De slag van 2.0 naar 3.0!