Maatwerk HTML5-webdesign heeft belangrijke voordelen

door ing. Jan Everink

mei 2018

voor het laatst aangepast: maart 2023

Een website bouwen kan tegenwoordig met meerdere technieken. Een bijzonder praktische aanpak is maatwerk HTML5-webdesign. Bij het direct in de webdesign-taal HTML5 coderen kan de ontwikkelaar optimaal gebruik maken van alle beschikbare creatieve mogelijkheden. Met maatwerk HTML5-webdesign kunnen unieke websites worden gebouwd, die voldoen aan hoge eisen wat betreft bezoekerservaring en promotionele effectiviteit.

Doelmatige websitebouw met HTML5

Uiteindelijk wordt elke website gecodeerd in de webdesign-taal HTML, ook de sites die via een indirecte techniek worden ontwikkeld. Indirecte webdesign-systemen, zoals het gebruik van een CMS of een sitebuilder, werden geïntroduceerd omdat er in de HTML-taal in de loop der tijd nogal wat technische onduidelijkheden en complicaties waren geslopen. Daardoor was het direct in HTML creëren van websites tamelijk moeilijk en tijdrovend geworden. Indirecte webdesign-systemen zijn bedoeld om deze technische problemen te omzeilen.

Maar tegenwoordig worden websites weer vaak direct in de HTML-taal ontwikkeld. De technische problemen werden namelijk grotendeels opgelost door de introductie van HTML5, de nieuwste versie van HTML. Veel moeilijkheden bij het direct met de HTML-taal ontwikkelen van websites zijn met de komst van HTML5 verdwenen.

Het ontwikkelen van content-websites is dankzij HTML5 minder een technisch en meer een communicatie-specialisme geworden. Toen veel technische coderingsproblemen dankzij HTML5 waren opgelost kwam het belang van een goede gebruikerservaring meer op de voorgrond. Snelheid, aantrekkelijke vormgeving, makkelijke navigatie en interessante content krijgen bij webdesign steeds meer aandacht. Als wordt gestreefd naar een unieke promotionele website waarmee een bedrijf zich door vormgeving, content en gebruikerservaring kan onderscheiden dan is een maatwerk HTML5-site een goede keuze.

Creatief maatwerk

Ook vóór de introductie van HTML5 waren veel webdesigners nog steeds enthousiast over de creatieve mogelijkheden bij het direct werken in de HTML-codering ofwel de markup. Die mogelijkheden zijn namelijk bijzonder veelzijdig.

Onder meer heeft de ontwerper volledige controle over het kleurgebruik. Dat is belangrijk want doelmatig gebruik van kleur en contrast is een essentieel webdesign-principe, zo wordt toenemend ingezien. Ook zijn er in HTML5 talloze mogelijkheden om een volledig unieke site-opbouw, pagina-layout en typografie te creëren.

Een bijkomend pluspunt is dat om direct met HTML te werken geen speciaal programma nodig is. Een eenvoudige tekst-editor als Windows Kladblok is al voldoende om met de HTML-taal een website te ontwikkelen. Wel kan het coderen worden vergemakkelijkt door toch een speciale HTML-editor te gebruiken.

Responsive design

Verder is het met maatwerk HTML5-design makkelijker dan met indirecte webdesign-tools om RWD (Responsive Web Design) toe te passen. RWD is een techniek om webpagina's zo te ontwerpen dat ze op elk medium goed worden weergegeven. Om met succes RWD te kunnen toepassen moet de ontwikkelaar volledige controle over de markup hebben, hetgeen alleen bij het direct in de HTML-taal coderen volledig het geval is.

Responsive design maakt het mogelijk om pagina's te creëren die niet alleen goed worden weergegeven op een desktop- en een laptopcomputer maar ook op een tablet en een smartphone. Goede weergave op smartphones is extra belangrijk geworden door het mobile-first beleid van Google. Volgens dat principe wordt een pagina door het Google-zoeksysteem gewaardeerd op basis van de mobielvriendelijke versie van die pagina. Hetgeen dus betekent dat pagina's die niet mobielvriendelijk zijn ook op desktopcomputers moeilijk gevonden kunnen worden.

Webpagina's kunnen met RWD zodanig worden ontworpen dat ze zich aanpassen aan elk weergavemedium. Naast het creëren van de daartoe vereiste flexibiliteit in de pagina kunnen ook nog uiteenlopende andere technieken toegepast worden. Onder meer kan worden geregeld dat pagina's ook op de printer goed worden weergegeven. Bijvoorbeeld kan worden gezorgd dat bepaalde onderdelen zoals navigatie-buttons op de afdruk wegblijven. Ook kan worden gespecificeerd dat grote afbeeldingen verkleind worden afgedrukt.

Pagespeed optimization

Met maatwerk HTML5-webdesign kan ook doeltreffend worden gezorgd dat de pagina's snel laden. Als een website met een indirecte methode wordt gebouwd is de gegenereerde code vaak onnodig complex, met als gevolg vertraging voor de sitebezoeker.

Vergeleken met bijvoorbeeld een CMS-website kan een direct in HTML5 ontwikkelde site compacter en systematischer van opbouw zijn. Een CMS (Content Management System) is een veelzijdig systeem dat alle technische voorzieningen voor een diversiteit aan specifieke websites bevat. Door deze veelzijdigheid zijn CMS-sites in het algemeen tamelijk complex, hetgeen onder meer lange laadtijden tot gevolg kan hebben.

Bij het direct in HTML5 coderen kan de webdesigner onnodige complexiteit vermijden en zo snelle laadtijden bevorderen. Ook zijn er bij volledige markup-controle nog uiteenlopende andere mogelijkheden om voor hoge snelheid te zorgen.

Onderzoek wijst erop dat een snelle laadtijd belangrijk is voor de site-ervaring. Als het laden van een webpagina langer dan enkele seconden duurt gaan veel sitebezoekers verder surfen. Ook houdt het Google-zoeksysteem rekening met de laadsnelheid van pagina's. Een snelle laadtijd kan een hogere plaats op de zoekresultaten opleveren.

Makkelijke site-updating

Voor het onderhoud van een direct in HTML5 gebouwde site is, evenals voor het ontwikkelen ervan, geen speciale software vereist. Zowel de gewone content-updating als eventuele aanpassingen en uitbreidingen van de site zijn relatief gemakkelijk te realiseren.

In verband met vlotte content-updating is wel belangrijk dat de markup overzichtelijk en duidelijk is. Ook is het zinvol om de codering waar nodig te voorzien van commentaar-regels. Voor het inbouwen van zulke toelichtingen zijn speciale HTML-codes beschikbaar. Met commentaar-regels kan door de webdesigner duidelijk worden aangegeven waar content geplaatst en aangepast kan worden.

Overzichtelijke markup en verduidelijkende commentaar-regels dragen er ook toe bij dat in de toekomst gemakkelijk eventuele design-wijzigingen en site-uitbreidingen gerealiseerd kunnen worden.

Een overzichtelijk gecodeerde en van toelichtingen voorziene HTML5-website is een goede investering. Dat men als bedrijf niet afhankelijk is van speciale software voor updating en aanpassing geeft zekerheid en bespaart kosten. Nog meer zekerheid kan worden verkregen door zelf de nodige HTML5-kennis in huis te halen. Daartoe kan bijvoorbeeld het door ing. Jan Everink geschreven boek “Basiscursus HTML5 Webdesign” worden gebruikt. Het biedt een complete zelfstudie-cursus voor mensen die in korte tijd de beginselen van webdesign met HTML5 willen leren.