Wat is HTML5? Een kort overzicht in simpele taal.
HTML5 is een modewoord in internetland. Maar wat is HTML5 nu echt? Wat is de meerwaarde? In dit artikel leggen we in simpele taal uit wat HTML5 nu al kan betekenen voor uw website.
HTML5 maakt Adobe Flash overbodig
Video’s, online games, maar ook veel websites en online applicaties werden vroeger gebouwd in Adobe Flash. Om deze te bekijken moest de bezoeker een browser plug-in downloaden. Adobe Flash wordt inmiddels op de iPhone en iPad niet meer ondersteund. Daarnaast zijn websites in Adobe Flash moeilijk te begrijpen door zoekmachines als Google. HTML5 is hiervoor de oplossing.
HTML5 bied nieuwe mogelijkheden voor het plaatsen van audio, video en voor het maken van interactieve 3d omgevingen. Deze mogelijkheden worden nog niet ondersteund in oudere browsers, waardoor het op dit moment nog noodzakelijk is om een alternatieve versie aan te bieden in Adobe Flash. Op den duur zullen oude browsers vervangen worden en zal HTML5 beter ondersteund zijn.
HTML5 is ook voor normale websites
In website code wordt op de eerste regel van elke pagina gespecificeerd welke HTML versie gebruikt wordt. Deze regel wordt de ‘doctype’ genoemd. Op basis van deze regel zal de browser de rest van de pagina interpreteren.
HTML 4.01: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>
HTML5: <!DOCTYPE html>
HTML5 is grotendeels een uitbreiding op HTML 4.01. Vrijwel alle html code die in versie 4.01 geldig was, is in html 5 ook geldig.
HTML5 maakt formulieren gebruiksvriendelijker
In html 4.01 was het aantal type formulier velden beperkt. In HTML5 kun je specificeren of er bijvoorbeeld een e-mailadres, een URL, een nummer of een datum verwacht wordt. Voordeel: Mobiele browsers passen het toetsenbord aan op basis van deze informatie. Hier is een voorbeeld van input velden op www.hayona.nl:
In bovenstaand formulier zijn de velden ‘naam’ en ‘organisatie’ standaard tekstvelden. Het veld ‘E-mailadres’ staat gespecificeerd als type=”e-mail”. We nemen nu als voorbeeld de iPhone. Als er in het veld een e-mailadres wordt gevraagd, dan kiest de iPhone het volgende toetsenbord:
Het toetsenbord past zich dus aan aan het type inhoud wat er gevraagd wordt. In het geval van een e-mailadres wordt er een toetsenbord met de ‘@’ en ‘.’ tekens getoond. Stel dat er in het veld een nummer wordt gevraagd, dan kiest de iPhone het volgende toetsenbord:
Als er in het veld een URL wordt gevraagd, dan kiest de iPhone het volgende toetsenbord:
Bovenstaande mogelijkheden worden niet door alle browsers ondersteund. Maar ze leveren ook geen problemen op: Als het type input veld bijvoorbeeld niet herkend wordt, dan valt deze gewoon terug naar een standaard tekstveld. Dit is dus direct al toepasbaar op al uw websites, vooral als u deze wilt optimaliseren voor mobiel.
HTML5 en SEO
Een duidelijke HTML opmaak is belangrijk voor het vindbaar maken van uw website. Kopjes worden opgemaakt door de tags <h1>, <h2>, etc.. De pagina titel door de <title> tag. Opsommingen door <ul> en <li> tags. En ga zo maar door. Deze tags blijven beschikbaar in HTML5.
HTML5 bevat daarnaast veel nieuwe ’tags’ waarmee nog specifieker aangeduid kan worden om wat voor type inhoud het gaat. Een voorbeeld is de <article> tag. Hiermee wordt aangegeven dat dat blokje een bericht bevat. Dit kan bijvoorbeeld worden gebruikt op een overzichtpagina met nieuwsberichten. Deze nieuwe tags hebben op dit moment vanuit zoekmachine optimalisatie oogpunt nog geen meerwaarde.
Als u de broncode van uw website nu al beter te begrijpen wilt maken voor zoekmachines, dan kunt u zich beter richten op het toepassen van microdata (ook wel Rich Snippets). Deze techniek is bedacht door Google in samenwerking met Bing en Yahoo! Met microdata kunt bepaalde inhoud, zoals recenties, adresgegevens en personen begrijpelijk aanbieden aan zoekmachines.
Conclusie
HTML5 is een goed vervolg op HTML 4.01. De meeste oude functies blijven gewoon beschikbaar en er zijn veel bruikbare nieuwe functies toegevoegd. Zo is HTML5 de potentiële opvolger van Adobe Flash en worden formulieren een beetje gebruiksvriendelijker. Veel van de nieuwe functies worden helaas nog niet goed ondersteund door (met name) oude browsers. Ook hebben de nieuwe html tags nog geen meerwaarde voor SEO.
HTML5 kan dus direct in gebruik genomen worden om beschikking te krijgen over een aantal nieuwe functies. Toch zullen HTML5 websites voorlopig grotendeels hetzelfde opgemaakt worden als HTML 4.01.
