Adaptive HTML5 + CSS3 Page design

En este post voy a explicar un modo muy sencillo de hacer el diseño de una página adaptativo.

Un diseño adaptativo es aquel en el que la distribución y los elementos que aparecen en la página cambian dependiendo del tamaño de la pantalla de visualización.

Hoy en día esto es imprescindible debido a la gran variedad de dispositivos capaces de acceder a una página web: PCs, Móviles, Tablets, Televisiones, etc.

El objetivo es que la página web tenga 3 diseños:

  • Dispositivos con pantalla grande, más de 980px
  • Dispositivos con pantalla pequeña, entre 480px y 980px
  • Dispositivos con pantalla mini, menos de 480px

Continue reading