Agradecimientos
Sobre el autor

Introducción
A quién va dirigido este libro
Estructura del libro
Cómo usar este libro
Ejemplos del libro

1. Una sola web. Un nuevo enfoque
La diversidad de dispositivos
Llega la revolución de los tamaños
Internet desde móvil
Pensando en el usuario
La pantalla táctil
Las costumbres cambian
Los Smartphones han transformado el comportamiento
del consumidor
Los Smartphones han cambiado el modo de realizar
compras
Los Smartphones y las búsquedas de información
Las indicaciones del W3C
Buenas prácticas móviles
HTML5 y CSS3 también colaboran
HTML5
CSS3
Una sola web
Una nueva mentalidad
Aplicando la tecnología

2. La filosofía del diseño web adaptativo
La situación pide ser adaptativo
No espere ver siempre idéntico
Una sola web que se adapta
El diseño adaptativo se va extendiendo
Las ventajas del diseño adaptativo
Una sola web, un solo HTML
CSS controla el aspecto
SEO: Los resultados mandan
Hay otras posibilidades
Las Aplicaciones móviles
Una web en versión móvil
Detectar el dispositivo
Conclusión

3. HTML5 y CSS3
HTML5, nueva sintaxis
Doctype
No distingue minúsculas de mayúsculas
Declaración del idioma
No es necesario cerrar
El atributo type
Más de un h1
Nuevas etiquetas HTML5
Etiquetas estructurales y semánticas
<header>
<nav>
<section> <article>
<aside>
<footer>
Etiquetas multimedia
<video>
<audio>
La etiqueta source
Etiquetas de formulario
Nuevos campos
Nuevos atributos
Validación del lado del cliente
Más de HTML5
Canvas
SVG
CSS3: Nuevos selectores, nuevas propiedades
border-radius
box-shadow
linear-gradient
Transformaciones
Animaciones

4. Reglas de oro
La etiqueta meta viewport
Sintaxis y propiedades
Estructura de diseño fluido: Todo relativo
El reinado del diseño fijo
Diseños fluidos y elásticos
Diseños adaptativos: Todo relativo
Columnas y porcentajes, en relación al elemento padre
Haciendo cálculos
Las imágenes y elementos multimedia, también en porcentaje
Aplicando porcentajes
Poniendo límites
Un ejemplo
Las media queries
Una sola web en múltiples dispositivos
La sintaxis
Pensando en el usuario

5. Trabajar con medidas relativas
Ancho de la web: 960px
Hay que hacer números. Todo es relativo
Trabajar en porcentajes
Controlando los extremos
Algunos ejemplos
Ejemplo 1: Diseño de ancho fijo
Ejemplo 2: Diseño flexible
Ejemplo 3: Diseño flexible limitado
Ejemplo 4: Diseño de ancho fijo con márgenes
Ejemplo 5: Diseño flexible limitado con márgenes

6. Imágenes y textos
Redimensionando las imágenes
max-width y min-width
Las conexiones móviles: La importancia de las imágenes
Picturefill: Versiones de la imagen
Hay otras opciones
Pantallas y resoluciones. La calidad de la imagen
Los puntos tipográficos
Unidades em
Pantallas pequeñas, textos pequeños
Un ejemplo concreto
Trabajar con @font-face

7. Media Queries
Tomar decisiones
Las dimensiones del navegador
Cuántas media queries
Orientación, resolución y densidad
Sintaxis
Media queries dentro de un documento
Media queries en archivos
Media queries compartidas
Varias condiciones
Tabla de características de las media queries
Probar, probar
Herramientas
Comprobar todas las dimensiones
La navegación en las media queries
Utilizar un select de formulario
Reorganizar el tamaño del menú
Ocultar el menú

8. Diseño adaptativo: Juntando las piezas
La prioridad sigue siendo el contenido
Primero, móvil
Pensando en los extremos
El flujo de trabajo: Ideas claras
Juntando las piezas: Ser o no ser adaptativo
Estructura del documento
Las media queries de Ser o no ser adaptativo
La navegación
Usamos @fontfase
Compatibilidad con los navegadores
La mejora progresiva y la degradación elegante
La mejora progresiva
La degradación elegante

9. Herramientas – Frameworks
El comportamiento de los navegadores
Can I use
La cuota de usuarios de los navegadores
Cómo se ve mi web: Modernizr
Cómo funciona Modernizr
La ayuda del que ya sabe: Los Frameworks
¿Qué es un Framework?
Algunos ejemplos
Responsive Grid System
Skeleton
Bootstrap
Un ejemplo de Bootstrap
Descargando archivos
Estructura de archivos
La retícula de los documentos
Bootstrap es adaptativo
Los estilos de Bootstrap
Los componentes
Las ventajas e inconvenientes

10. Los CMS se suman a la tendencia
Cada proyecto es diferente
La opción de usar un CMS
Los CMS en la actualidad
¿Qué CMS elegir?
Los CMS se hacen adaptativos
WordPress
Fácil de usar
Comunidad de usuarios
Añadiendo funcionalidades: Los plugins
Worpress Adaptativo
Joomla
Joomla trabaja con extensiones
Comunidad en castellano
Joomla es Adaptativo
Drupal
Comparativa

11. El futuro del Diseño Adaptativo ya está aquí
Preprocesadores CSS
Less
Primeros pasos con Less
[...]

Agradecimientos
Sobre el autor

Introducción
A quién va dirigido este libro
Estructura del libro
Cómo usar este libro
Ejemplos del libro

1. Una sola web. Un nuevo enfoque
La diversidad de dispositivos
Llega la revolución de los tamaños
Internet desde móvil
Pensando en el usuario
La pantalla táctil
Las costumbres cambian
Los Smartphones han transformado el comportamiento
del consumidor
Los Smartphones han cambiado el modo de realizar
compras
Los Smartphones y las búsquedas de información
Las indicaciones del W3C
Buenas prácticas móviles
HTML5 y CSS3 también colaboran
HTML5
CSS3
Una sola web
Una nueva mentalidad
Aplicando la tecnología

2. La filosofía del diseño web adaptativo
La situación pide ser adaptativo
No espere ver siempre idéntico
Una sola web que se adapta
El diseño adaptativo se va extendiendo
Las ventajas del diseño adaptativo
Una sola web, un solo HTML
CSS controla el aspecto
SEO: Los resultados mandan
Hay otras posibilidades
Las Aplicaciones móviles
Una web en versión móvil
Detectar el dispositivo
Conclusión

3. HTML5 y CSS3
HTML5, nueva sintaxis
Doctype
No distingue minúsculas de mayúsculas
Declaración del idioma
No es necesario cerrar
El atributo type
Más de un h1
Nuevas etiquetas HTML5
Etiquetas estructurales y semánticas
<header>
<nav>
<section> <article>
<aside>
<footer>
Etiquetas multimedia
<video>
<audio>
La etiqueta source
Etiquetas de formulario
Nuevos campos
Nuevos atributos
Validación del lado del cliente
Más de HTML5
Canvas
SVG
CSS3: Nuevos selectores, nuevas propiedades
border-radius
box-shadow
linear-gradient
Transformaciones
Animaciones

4. Reglas de oro
La etiqueta meta viewport
Sintaxis y propiedades
Estructura de diseño fluido: Todo relativo
El reinado del diseño fijo
Diseños fluidos y elásticos
Diseños adaptativos: Todo relativo
Columnas y porcentajes, en relación al elemento padre
Haciendo cálculos
Las imágenes y elementos multimedia, también en porcentaje
Aplicando porcentajes
Poniendo límites
Un ejemplo
Las media queries
Una sola web en múltiples dispositivos
La sintaxis
Pensando en el usuario

5. Trabajar con medidas relativas
Ancho de la web: 960px
Hay que hacer números. Todo es relativo
Trabajar en porcentajes
Controlando los extremos
Algunos ejemplos
Ejemplo 1: Diseño de ancho fijo
Ejemplo 2: Diseño flexible
Ejemplo 3: Diseño flexible limitado
Ejemplo 4: Diseño de ancho fijo con márgenes
Ejemplo 5: Diseño flexible limitado con márgenes

6. Imágenes y textos
Redimensionando las imágenes
max-width y min-width
Las conexiones móviles: La importancia de las imágenes
Picturefill: Versiones de la imagen
Hay otras opciones
Pantallas y resoluciones. La calidad de la imagen
Los puntos tipográficos
Unidades em
Pantallas pequeñas, textos pequeños
Un ejemplo concreto
Trabajar con @font-face

7. Media Queries
Tomar decisiones
Las dimensiones del navegador
Cuántas media queries
Orientación, resolución y densidad
Sintaxis
Media queries dentro de un documento
Media queries en archivos
Media queries compartidas
Varias condiciones
Tabla de características de las media queries
Probar, probar
Herramientas
Comprobar todas las dimensiones
La navegación en las media queries
Utilizar un select de formulario
Reorganizar el tamaño del menú
Ocultar el menú

8. Diseño adaptativo: Juntando las piezas
La prioridad sigue siendo el contenido
Primero, móvil
Pensando en los extremos
El flujo de trabajo: Ideas claras
Juntando las piezas: Ser o no ser adaptativo
Estructura del documento
Las media queries de Ser o no ser adaptativo
La navegación
Usamos @fontfase
Compatibilidad con los navegadores
La mejora progresiva y la degradación elegante
La mejora progresiva
La degradación elegante

9. Herramientas – Frameworks
El comportamiento de los navegadores
Can I use
La cuota de usuarios de los navegadores
Cómo se ve mi web: Modernizr
Cómo funciona Modernizr
La ayuda del que ya sabe: Los Frameworks
¿Qué es un Framework?
Algunos ejemplos
Responsive Grid System
Skeleton
Bootstrap
Un ejemplo de Bootstrap
Descargando archivos
Estructura de archivos
La retícula de los documentos
Bootstrap es adaptativo
Los estilos de Bootstrap
Los componentes
Las ventajas e inconvenientes

10. Los CMS se suman a la tendencia
Cada proyecto es diferente
La opción de usar un CMS
Los CMS en la actualidad
¿Qué CMS elegir?
Los CMS se hacen adaptativos
WordPress
Fácil de usar
Comunidad de usuarios
Añadiendo funcionalidades: Los plugins
Worpress Adaptativo
Joomla
Joomla trabaja con extensiones
Comunidad en castellano
Joomla es Adaptativo
Drupal
Comparativa

11. El futuro del Diseño Adaptativo ya está aquí
Preprocesadores CSS
Less
Primeros pasos con Less
[...]