Como crear una web con diseño responsive con WordPress

En estos momentos en que casi todo el mundo utiliza smartphones, tablets, smart tv etc, disponer de una web responsive casi se antoja una obligación.

Diseño responsive se denomina a aquella web que esta diseñada para adaptarse a todo tipo de pantallas, resoluciones y dispositivo, es decir, es como tener tu web y el app de tu web a la vez, para que se pueda navegar como cualquier otro tipo de App, con un dedo, hacer compras, visualizar catálogos, galerías, enviar un email a través de la web, llamar por telefono al hacer clic en el número, etc, se me ocurren cientos de motivos por lo que nuestra web necesita ser responsive o disponer de algún plugin que convierta nuestra web compatible con dispositivos móviles.

Diseñar una web responsive exige tener conocimientos de CSS y HTML5, javascript, php pero tampoco es fundamental para poder conseguir nuestro objetivo. Podemos optar por varios caminos, ponernos manos a la obra con nuestros propios conocimientos, comprar una web responsive en themeforest por poco mas de 20 euros y adaptarla según nuestras necesidades y si no queremos gastarnos un duro y además no tenemos idea de diseño responsive podemos utilizar el theme por defecto de WordPress Twenty Twelve que es totalmente responsive y podemos crear una web tan elegante como esta Laboratório WordPress .

Seguiremos Tres sencillos pasos :

El primer paso es descargarnos Twenty Twelve y activarlo. En estos momentos nuestra web ya es responsive y ahora debemos crear nuestra página de inicio y configurar las opciones del theme para seleccionar nuestra página de inicio.

El Segundo paso será poner en nuestra página de inicio un Slide responsive, podemos utilizar SliderShock que es gratuito u otro mas potente y profesional (de pago) como Slider Revolution. Nuestro slide se adaptará a cada pantalla y será tactil.

Para crear columnas como las de la web de ejemplo puedes utilizar plugins como Grid Columns o Genesis Multiple Column Content Classes, son plugins gratuitos y se transforman responsive con el theme.

Recursos:

Descarga e instala Twenty Twelve

Plugin Slider Shock

Plugin Slider Revolution

Plugin Grid Columns

Plugin Genesis Multiple Columm