Responsive webdesign is een techniek waarbij je een website dusdanig maakt dat deze zich aanpast aan het scherm waar het op bekeken wordt. Zodoende wordt de website altijd goed getoond voor een bezoeker.
Inhoudsopgave
Hoe werkt responsive webdesign?
Een responsive design is dusdanig gebouwd dat de content van de pagina in flexibele blokken opgebouwd is. Naar aanleiding van bepaalde breakpoints word bepaald hoe groot het blok getoond wordt. Bijvoorbeeld op een dekstop vanaf 981 pixels breedte wordt een bepaald blok maximaal 800 pixels breed.
Zo kan het design er op een desktop er weer anders uitzien als op een smartphone. Vaak zie je op een desktop een sidebar en op de smartphone zie je deze niet meer maar staat de sidebar er onder.
Om dit te realiseren heb HTML en CSS nodig. Met HTML bepaal je wat er op je scherm geplaatst wordt en met CSS hoe het element opgemaakt wordt.
Waarom een responsive website?
De laatste jaren zie je een trend dat er steeds meer mobiel internet verkeer gebruikt wordt. Mensen bekijken een website niet alleen op een desktop maar ook op een tablet en smartphone. Zonder responsive webdesign moet je voor elk apparaat een aparte versie van de website maken. Met repsonsive webdesign los je dit op en kan de gebruiker van de website zijn content op één plaats plaatsen.
De voordelen van responsive webdesign
- Je kan alles vanuit één plaats onderhouden in plaats van een aparte website voor mobiel
- De techniek is vrij eenvoudig, het is niet moeilijk om een responsie website te maken
- Google ziet het als een pluspunt als de website geschikt voor mobiel is
De nadelen van responsive webdesign
- Het testen van een responsive website is lastiger omdat je met veel verschillende formaten rekening moet houden
- Niet alle advertenties werken goed op een responsieve website
- De afbeeldingen van de desktop versie worden geladen waardoor afbeelding onnodig groot zijn voor de mobiele versie