Categorías
Diseño web

7 consejos para hacer un buen diseño responsivo

responsive-design2

Genbeta Dev nos da 7 consejos para hacer un buen diseño responsivo (responsive web design). A saber:

  1. Empieza con una plantilla. No hay que descubrir la pólvora cuando ya está descubierta. Podemos probar con Skeleton, Omega y Amazium.
  2. Trabaja con layouts basados en grids fluidos. Nada de pixeles. Todo porcentajes y relaciones.
  3. Imágenes flexibles o adaptativas. Hay que tener reglas de CSS bien definidas y un buen número de presets para los tamaños.
  4. JQuery es tu amigo. Utiliza los plugins, prueba, experimenta.
  5. No te olvides del viewport de Apple. Lo que domina el mercado son los iPhones y los iPads.
  6. Fondos escalables. Fundamental para dar una sensación de responsive design bien hecho.
  7. Inspírate y prueba. Hay miles de ejemplos, anímate a «copiarte» y adaptarlos a tus necesidades.

Vía: Genbeta dev

Categorías
Diseño web

Website para móviles versus Website responsivo. Análisis web de los candidatos a la presidencia de EEUU

Web de Romney y Obama

Smashing Magazine ha publicado un excelente análisis sobre las web para móviles de los candidatos a la presidencia de los EEUU, Barack Obama y Mitt Romney.

La web de Romney tiene un sitio exclusivo para los que se conectan con móviles y la de Obama es una web responsiva (responsive web design), adaptable a las distintas pantallas. Según el análisis el 28% de los adultos en EEUU entran a la web vía sus dispositivos móviles en primer lugar.

El análisis se realiza desde 4 variables: Acceso, Interacción, Performance y «Enhance» como aprovechamiento de la funcionalidad propia de los móviles.

Enlace: Separate Mobile Website Vs. Responsive Website

Categorías
Diseño web

3 imágenes para entender el futuro y el presente de la web

Veo en Brad Frost Web un interesante artículo sobre cómo enfrentar el presente de la web en términos de diseño y si vale la pena diseñar pensando en usar una misma plantilla adaptable a todo. ¿Es el responsive web design la solución? ¿O una parte de ella?

Lo que más me impactó fue el uso de 3 imágenes para entender lo que está pasando ahora y lo que ocurrirá en un futuro no muy lejano sobre lo que es la web y lo que se tendrá en cuenta en términos de diseño y contenido.

Esta no es la web

Esta es la web

Esta será la web

Enlace: Responsive Web: Missing the Point

Categorías
Diseño web

20 temas responsivos para WordPress

Si todo esto del diseño responsivo (responsive web design) te parece muy complicado, simplemente bájate uno de estos 20 temas para wordpress. Son gratuitos.

Enlace: 20 free responsive wordpress themes

Categorías
Diseño web

50 ejemplos y buenas prácticas de diseño responsivo

Design Modo ha publicado 50 ejemplos de webs con diseño responsivo (responsive web design). Abajo pongo las que más me gustaron.

The Boston Globe

Think Vitamin

Forefathers Group

Illy Issimo

Ryan O’Rourke

Ver todos los ejemplos: Responsive Web Design: 50 examples and best practices