Adaptive / Responsive design

door , admin/moderator@jakobhelmer.nl

Een webontwerp moet als gevolg van het mobiele internet tegenwoordig geschikt zijn voor verschillende apparaten en schermgroottes. Een ontwerp dat zich aanpast aan de verschillende apparaten en schermgroottes word gerealiseerd met adaptive en/of responsive design.

Het verschil tussen responsive en adaptive

Simpel gezegd, responsive is vloeibaar en adaptive is statisch.

Responsive design past zich aan met behulp van CSS3 media queries aan veschillende schermformaten. Met het gebruik van deze CSS3 module, word een flexibel raster gemaakt waar tekst en afbeeldingen kunnen krimpen zodat deze passen in de afmetingen van het scherm.

Adaptief design maakt gebruik van een reeks van statische lay-outs op basis van breekpunten, bijvoorbeeld 320 pixels voor mobiele telefoons, 760 voor tabletten en 960 voor desktop browsers. Adaptive design detecteerd het apparaat en roept de juiste afmeting van de layout op.

Responsive en adaptive design zijn dus eigenlijk niets meer dan verschillende manieren om de website layout te veranderen als het scherm kleiner word.