Heropbouw CSS maartenvandekamp.nl

De afgelopen twee weken ben ik bezig geweest om de CSS van de website maartenvandekamp.nl opnieuw op te bouwen. De manier waarop de website nu opgebouwd is, wordt ook wel Mobile First genoemd.

Mobile First

Mobile First betekent dat de website eerst wordt opgebouwd voor kleine schermen, zoals smartphones en tablets, en daarna aangepast wordt voor weergave op grotere schermen.

De achterliggende gedachte is dat een computer meer rekenkracht heeft dan een smartphone. De website wordt zo ‘licht’ mogelijk ontworpen zodat een smartphone deze snel kan weergeven. De website wordt ‘zwaarder’ – meer grafische opties en dergelijke – naarmate het scherm groter wordt. De rekenkracht van een computer is beter in staat om dit te berekenen.

De ‘ouderwetse manier’:

Afbeelding van computerscherm, tablet en smartphone
Website weergave past zich aan van groot naar klein
(Bron: link)

En de Mobile First manier:

Afbeelding van smartphone, tablet en computer scherm
Website wordt gebouwd voor smartphones, en past zich aan naar de grootte van het scherm.

(Bron: link)

Als basis heb ik het nieuwe thema van WordPress 4.1 gebruikt: Twenty Fifteen. Dit thema is volledig ‘responsive’ en past zich aan op het scherm waarop het wordt weergegeven. Een perfecte referentie om de CSS van de website opnieuw te schrijven!

De CSS is niet kleiner geworden, maar wel een stuk eenvoudiger te beheren. Daardoor kan ik sneller wijzigingen aanbrengen in de opmaak van de website!