Selecteer een pagina

Wat is responsive Design?

In responsive design zal een website het uiterlijk wijzigen op basis van de zicht in de browser. Gewoonlijk gebruiken ontwikkelaars de breedte van de browser als de variabele die de grootte van de dynamisch veranderende elementen op de pagina bepaalt. Een responsieve website is volledig vloeiend en past zich aan en reageert op het zicht in de browser, ongeacht de grootte van het browservenster (of scherm). Dat komt omdat het op percentage gebaseerde CSS gebruikt om de stijl te wijzigen op basis van de grote van het apparaat. De pagina-elementen worden altijd aangepast aan een opgegeven verhouding, zodat de pagina er altijd goed uitziet. De voordelen van deze aanpak zijn ontelbaar. Het belangrijkste voordeel is dat de code niet hoeft te veranderen voor mobiel, tablet of desktop.

Wat is adaptive Design?

Net als responsive websites zal een adaptive website de lay-out van de pagina aanpassen, afhankelijk van de breedte van de browser, maar op een andere manier. Adaptive design bestaat ​​uit meerdere uitvoeringen van hetzelfde ontwerp (één voor elke grootte) zoals gekozen door de designer. Elke versie van het ontwerp is toegewezen aan specifieke breedten, “ankerpunten” genoemd. “Ankerpunten” vertellen de browser precies wanneer naar de volgende lay-out moet worden gesprongen. In het algemeen zou een ontwerper een andere lay-out ontwerpen voor elk van de zes meest voorkomen breedten : 320, 480, 760, 960, 1200 en 1600 px. In plaats van percentages te gebruiken, gebruikt een adaptive design exact één statische lay-out per elk ankerpunt en past het zich aan de schermgrootte aan zodra dat ankerpunt is gedetecteerd. Adaptive ontwerp is complex, omdat designers actief dezelfde pagina moeten ontwerpen, zes (of meer) verschillende keren. Bedenk hoeveel verschillende lay-outs nodig kunnen zijn voor een site die uit meerdere pagina’s bestaat.