Uitlegparty: HTML5

Userpica

Ladies and gentlemen, start your browsers. HTML5 brengt multimedia en interactie zonder plugins naar het web.

HTML is de opmaaktaal van het web en daarmee het belangrijkste bouwmateriaal van websites. De nieuwe versie 5 van de taal wordt gelezen door de nieuwste versies van Firefox, Internet Explorer, Chrome, Safari en andere browers. Websites kunnen er vanaf nu dus nieuwe toepassingen mee presenteren. HTML5 wordt uiteindelijk de belangrijkste webstandaard. Voordeel is dat het een open standaard is en eentje met nieuwe functionaliteiten en snellere laadtijden.

De nieuwe versie van HTML biedt een betere integratie van JavaScripts, de programmeercodes die worden gebruikt voor interactieve elementen binnen dezelfde webpagina. Dat maakt nog meer geavanceerde en multimediale toepassingen mogelijk direct in de browser zonder dat je daarvoor extra plug-ins moet installeren. Momenteel gebeuren veel van de zaken die HTML5 kan nog met extra code zoals Adobe's Flash, via een plug-in die de grote meerderheid van de gebruikers heeft draaien.

Maar Flash heeft 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.

Dat is dan ook een van de redenen dat Apple - al in erg vroeg stadium - besloot Flash in zijn mobiele besturingssysteem iOS links te laten liggen. Dat heeft de afgelopen jaren tot gevolg gehad dat veel interactieve en multimedia-elementen binnen webpagina's op de iPhone, iPod Touch en iPad niet werkten. Dat geldt bijvoorbeeld voor de Flash-playlists van Tonies Tunes en veel ingevoegde filmpjes bij artikelen. 

HTML5 laat audio- en videocontent in een webpagina integreren met bestandsformaten als Ogg Vorbis, mp3, aac (audio), Ogv Vorbis, mp4 en vp8 (video). Grote videosites hebben al de stap gemaakt naar HTML5-spelers voor filmpjes. Daardoor is er geen Flash meer nodig om filmpjes te bekijken op YouTube of Vimeo. De komst van de iPad heeft die overgang versneld. Maar HTML5-ondersteuning staat nog in de kinderschoenen. De meeste webspelletjes of filmpjes werken er nog niet mee. 

Belangrijk onderdeel van HTML5 zijn de zogeheten semantische tags. Die slaan op de inhoud en niet alleen op de opmaak. Ook is het makkelijk de locatie van de gebruiker te bepalen, elementen op de site te laten bewerken door de bezoekers en gebruikersgegevens op te slaan.

 

Schietspel a la Quake.

Alle grote internetspelers gaan HTML5 ondersteunen in hun browsers. De nieuwste edities van Chrome en Safari doen dat al. Google biedt als extraatje ook nog een aantal showcases met experimentele toepassingen op de special site HTML5 Rocks. Ook Apple biedt een dergelijke showroom. Apple toont sinds vrijdag ook bioscoopagenda met automatische locatiebepaling via HTML5.

Een mooi voorbeeld is The Wilderness Downtown waar Google in samenwerking met de Canadese indierockband Arcade Fire laat zien wat HTML5 kan. Op de site beleef je een videoclip waarbij HTML5 de audio afspeelt op het juiste moment en de 3D-rendering van de vogels voor zijn rekening neemt. De schaduwen van de vogels vallen over Google Maps en de site plaatst ook bomen in Street View. Het is mogelijk boomtakken te tekenen en je naam te schrijven.

Ook Mozilla (van Firefox) en Microsoft werken hard aan invoering van HTML5 in hun browsers. Maar TechCrunch merkte op dat er weer storende verschillen zitten in de manier waarop browsers bepaalde codes vertalen in wat er op het scherm wordt getoond. Dat doet denken aan de situatie van enkele jaren geleden waarbij er enorme verschillen zaten tussen de manier waarop sites eruit zagen in IE6 en Firefox. HTML5 zorgt wat dat betreft voorlopig voor een déjà-vu van meldingen over dat je de verkeerde browser gebruikt. The Wilderness Downtown meldt dat de site is ontworpen voor Chrome.

 

Zoals met elke nieuwe standaard duurt het een paar jaar voordat alles definitief vaststaat. In de tussentijd krijgen gebruikers soms iets wel of juist niet te zien op basis van hun browserversie. Voor het publiek is dat vervelend. Aan de andere kant kan het er ook voor zorgen dat eindgebruikers, en met name bedrijven, massaler en sneller overstappen op nieuwe browers. Daar is uiteindelijke de ontwikkeling van het hele web bij gebaat. 

Het grote voordeel zit uiteindelijk in soepelere en snellere browserinteractie, zowel op computers als mobiele apparaten. Hoe sneller je er niks van merkt dat iets HTML5 gebruikt, des te beter. 

 

Tijdschrift Sports Illustrated in HTML 5

Tot slot: zelf proberen kan met bijna vijftig demo's, van een strandbal stuiteren tot tekenen. En natuurlijk: Tetris.


rened, 4 jaren geleden
afbeelding van rened

Dit is een schoolvoorbeeld van een goed artikel. Tonie weet duidelijk van wanten. Wat de prestaties betreft, zie je toch dat de browserbouwers daar nog flink aan moeten sleutelen. Dat maakt het argument tegen Flash nogal zwak. De grote kracht zit hem natuurlijk in de open standaard en dat je in een simpele editor als de kladblok een kleine html5-app kunt maken is natuurlijk geweldig.

Bezoeker, 4 jaren geleden
afbeelding van Bezoeker

Je vergeet bijkans even te vermelden dat de HTML 5 'standaard' nog wel een aantal jaar op zich kan laten wachten. Laat staan dat er een standaard voor videoformaten bestaat.
Bovendien is Javascript niet veel verbeterd sinds versie 1.5 en ondersteund geen (echte) object georienteerde opzet, iets dat in Actionscipt (voor Flash) wel kan.

Maar afgezien daarvan, komen er een hoop nieuwe mogelijkheden met HTML 5.

Tonie van Ringelestijn, 4 jaren geleden
afbeelding van Tonie van Ringelestijn
Ehm, ik schrijf in de een-na-laatste aline: "Zoals met elke nieuwe standaard duurt het een paar jaar voordat alles definitief vaststaat. In de tussentijd..."
Atheistus, 4 jaren geleden
afbeelding van Atheistus

Het is de twee na laatste en het is alinea i.p.v. aline.

iPhone BRIGHT.app gebruiker, 4 jaren geleden
afbeelding van iPhone BRIGHT.app gebruiker

Ondersteund? In de tegenwoordige tijd?

iPhone BRIGHT.app gebruiker, 4 jaren geleden
afbeelding van iPhone BRIGHT.app gebruiker

Wat een bagger demo's. Niets werkt goed en het ziet er niet uit. Ik had veel verwacht van html5 maar wist niet dat het gewoon embeded JavaScript was. JavaScript, dat bestaat al jaren en is niets bijzonders. Gisteren nog online een overhemd samengesteld in een online flash module. Werkt perfect, ik snap niet waarom we terug moeten in de tijd omdat de hardware fabrikanten dat willen!? Onzin, html5 gaat ons nergens brengen, just an opinion...

Rachid K, 4 jaren geleden
afbeelding van Rachid K

Ten eerste is er helemaal niets 'nieuws' wat HTML5 biedt ten opzichte van Flash en is het voor de gebruiker aanzienlijk makkelijker om een plug-in te downloaden dan een complete nieuwe browser. Flash heeft webcam ondersteuning, fullscreen video, 3D graphics, minder processorverbruik (jawel, echt waar), superieure animatiemogelijkheden en ga zo maar door en kan door 98% van alle webgebruikers gezien worden, HTML5 geen van dat, alles wat daarmee kan kan ± 10 jaar met Flash, en de gebruiker zal dat hele 'open standaard' een worst wezen, als het maar werkt.

HTML5 content? Een ongeregeld zooitje. De ene browser ondersteunt de ene video'standaard' en de andere weer de andere. Ga eens wat websites bekijken via browserlab.adobe.com en je kan niet anders dan beamen dat HTML 5 geenszins iets is waar alle laatste versies van browsers het eens over zijn. Maar bekijk je een rijke multimediale website gemaakt met Flash, dan ziet die website er op alle browsers hetzelfde uit. En dat al meer dan 10 jaar.

En dan nog eens een illusie de wereld uithelpen: ga eens 'the wilderness downtown' op een iPhone 3g bekijken... Gaat niet. Het is niet zo dat rijke HTML5 content soepel draait op een iPhone of iPad. Het komt er feitelijk op neer dat apparaten als de iPhone en de iPad gewoon niet genoeg processorkracht hebben om rijke multimedia in de browser af te spelen, of die nou gemaakt is met HTML 5 of Flash, dat maakt niets uit. Apples weigering voor Flash heeft niets met de performance van Flash te maken (ik moet zeggen dat die juist uitstekend is op de nieuwere android mobiles), maar met het feit dat ze liever mensen hun spellen via de app-store willen verkopen dan dat mensen gratis spellen in de browser spelen...

O, en nog een leuke link ter overweging: www.flashlab.com

Luccyboy, 4 jaren geleden
afbeelding van Luccyboy

Hoezo insommige reacties dat er geen verschil is tussen flash en html5 op processorgebied?
Dezelfde YouTube 720P video op mijn i5 iMac OS X 10.6 alle updates geïnstalleerd in safari en Firefox:
Flash 10% CPU
HTML5 1% CPU

Ik merkte niet direct verschil door de i5 quad core processor, maar op netbooks en andere "slechtere/mindere" merk je het wel.

En die comment dat html5 niet goed werkt op je iPhone3G misschien omdat die 2 jaar oud is en snelheidsproblemen heeft met 4.0.x ?

supernaturel, 4 jaren geleden
afbeelding van supernaturel

En probeer dat nu eens op een windows pc....
Er zijn 2 verschillende dingen. Mac (apple) kan niet goed omgaan met flash. Maar windows systemen wel.
Dus is het flash dat problemen veroorzaak of is apple OS niet flash ready...
;) Het word wel allemaal leuk gebracht. Maar er zit wel heel wat meer achter.
Probeer maar een animatie te programmeren in html5. Dat is pas een werk!
Flash is qua dat al jaren verder.

Bezoeker, 4 jaren geleden
afbeelding van Bezoeker

Het is natuurlijk zo dat als een plugin niet goed werkt het OS daar verantwoordelijk voor is :/

Heel logisch ja...

Sjaan, 4 jaren geleden
afbeelding van Sjaan

Is dat wel flash 10.1? Als de h264 decoder over je gpu loopt heb je nauwelijks load. Dat kan pas vanaf 10.1

dimi, 4 jaren geleden
afbeelding van dimi

Jammer dat er tussen de partijen nog een flinke strijd woedt. Die h268 standaard bijvoorbeeld was meen ik van Apple en die wil hem graag beschikbaar stellen maar dan wel tegen licentiekosten. En zo hebben ze allemaal hun streaming standaard binnen de video tag. Dat schiet niet op natuurlijk!
Goed artikel trouwens.

Torlaper, 4 jaren geleden
afbeelding van Torlaper

Als Steve Jobs zo'n voorstander is van een open standaard dan is het misschien wel een goed idee om dan andere partijen toegang te verschaffen tot alle Applecontent?
Nee natuurlijk doet hij dat niet!
Zelf een narcist ten top :-))

iSukkel, 4 jaren geleden
afbeelding van iSukkel

Tja, dan maar liever een kakafonie aan incompatibele browsers maar met 1 plugin waardoor alles eruiziet zoals t bedoelt is dan zg 'standaard' die geen standaard is want idd Explorer doet het dan net even anders dan Firefox etc. Moet je toch weer opvangen op je site.

iSukkel, 4 jaren geleden
afbeelding van iSukkel

Hallo, bent u daar?

HB, 4 jaren geleden
afbeelding van HB

Het probleem met Flash wordt toch weer door de Apple users aangedikt. Hoeveel designers die ik in mijn dagelijkse werk tegenkom anti Flash zijn geworden omdat het zogenaamd niet compatible zou zijn. Ja niet compatible met die megalomane waanideeën van Steve Jobs. De iPhone dus...
Ik blijf voorstander van Flash gebruik, juist vanwege de cross-browser compatibiliteit. Ik ben niet tegen HTML5, maar het gaat het leven van de designer/ontwikkelaar/gebruiker er echt niet makkelijker op maken.

phy, 4 jaren geleden
afbeelding van phy

Wat een comments weer zeg. Het is voor veel mensen onduidelijk hoe het nou zit. HTML5 is geen heilige graal. Het is gewoon een update van HTML4. een die hard nodig is, ja. Maar houd a.u.b. op met het met flash te vergelijken. Ja, flash bestaat door de tekortkomingen van html4, en ja, html5 is geinspireerd op flash, maar dat betekent niet dat het beter is / een vervanger is. Ik kijk uit naar HTML5, ik gebruik het zelfs al. Waarom? Om de beleving op websites te verbeteren. En daar gaat het uiteindelijk toch om?

iPhone BRIGHT.app gebruiker, 4 jaren geleden
iPhone BRIGHT.app gebruiker, 4 jaren geleden
afbeelding van iPhone BRIGHT.app gebruiker

Dankjewel voor het informatieve artikel!

p1800, 4 jaren geleden
afbeelding van p1800

Goed artikel, goeie demo's, helaas zal blijken dat op het moment dat wereld HTML5 heeft omarmt er alweer iets niets op de rol staat, HTML6....ik hoop dat standaarden nu bij de start al eens nadenken over de toekomstige ondersteuning en mogelijkheden van bijvoorbeeld krachtiger hardware etc.
HTML5 of de opvolger zou ook wel eens het alternatief van de TV kunnen worden, wanner schuiven die werelden nu eens ineen of gaan meer gebruikmaken van elkaars kracht..

Yakim van Zuijlen (Blogger/Designer), 4 jaren geleden
afbeelding van Yakim van Zuijlen (Blogger/Designer)

Wie heeft deze site bekeken: http://chromeexperiments.com allemaal html5 technologie en werkt het beste met de webkit zoals in Apple Safari en Google Chrome (De site is van medewerkers van het Chromium project van Google) Ik vind dat html5 beter is dan flash.

tralala, 4 jaren geleden
afbeelding van tralala

Toch grappig de waarschuwing op The Wilderness Downtown : This film is processor intensive.
Please shut down other programs and close unnecessary browser tabs. Doing this will enhance your viewing experience. Thanks.

Daar gaat volgens mij het argument dat flash ook het nodige vergt :)

san jay, 4 jaren geleden
afbeelding van san jay

hoef verder niet toe te voegen hoe waardeloos dit stukje geschreven onzin is, toch? Het is appels met peren vergelijken.


NB: Om te kunnen reageren dien je aangemeld en ingelogd te zijn op de Bright Bunch, het gratis lidmaatschap van Bright. Je bekijkt dan de site bovendien advertentie-vrij.

The Bright Bunch
inloggen aanmelden

Wie is nu Hier?

Er zijn momenteel 4 Bright Bunch leden en 120 bezoekers online.

   

   

Gebouwd en onderhouden door joep-i.nl