En este artículo no solo vamos a ver las características más interesantes de los themes desarrollados con HTML5, con un diseño web adaptativo (responsive) para la construcción de nuestro sitio con Wordpress. También tendremos la oportunidad de aprender y profundizar en los códigos de estas plantillas, lo que permite aprender algo de las últimas técnicas de diseño web adaptativo en HTML5. Al igual que este bonito código, cada uno de estos themes han sido construidos utilizando algunas de las tendencias más conocidas del diseño actual, lo que quiere decir que no van a tener problemas para verse desde cualquier pantalla como móviles o tablets. Si quieres ver Sliders gratuitos «responsive» para tu blog de Wordpress puedes visitar este enlace.
¡Nuevo!. Si necesitas plantillas de Wordpress configuradas para descargar e instalar sin hacer nada más visita el siguiente enlace, donde encontrarás 30 themes gratis para Wordpress listos para utilizar. Si por el contrario tienes nivel avanzado de Wordpress sigue leyendo.
Los themes son los siguientes:
Strongly Typed
Strongly Typed es una plantilla con un diseño web adaptativo minimalista, tiene un estilo semi-retro (inspirado en los manuales de instrucciones antiguas) y como se puede adivinar por su nombre tiene un fuerte énfasis en la tipografía. Es totalmente adaptativo realizado con HTML5 y CSS3, e incluye un estilo para todos los elementos básicos de la página.
Codester es una plantilla portfolio adaptativa construida sobre el framework de Bootstrap. Trae todos complementos y plugins de Bootstrap por lo que es interactivo y fácil de personalizar, es actualizable y lo suficientemente flexible como para llevarlo a todos los niveles.
Brushed es una plantilla HTML responsive basada en el framework Bootstrap de Twitter. Se ha optimizado para las pantallas de alta densidad de píxeles como el iPhone, iPad, iPod Touch y el MacBook Pro Retina.
Escape Velocity es una plantilla desarrollada con HTML5 responsive y gratis, diseñada en un estilo plano.
Parallelism
Parallelism es un theme adaptativo para la creación de sitios web al estilo galería. La plantilla se encarga de colocar las miniaturas en bonitas filas y de forma uniforme. También ajusta el número de filas al tamaño del terminal.
Dopetrope
Dopetrope es un theme portfolio adaptativo que responde con un estilo plano y minimalista.
Miniport Template
Miniport Template es una plantilla responsive completamente gratis al estilo portfolio de una sola página.
Legend es un theme multiuso de una sola página responsive realizado con el framework Bootstrap. Trae todos los complementos y plugins para personalizarlo de forma sencilla.
Obscura
Liquid Gem
Liquid Gem es una plantilla limpia con un diseño adaptativo. También incluye un carrusel de imágenes, un formulario de contacto en PHP totalmente funcional y una página de ejemplo.
Serendipity
Serendipity es una plantilla de blog de una sola columna gratis y adaptativo.
Varna es una plantilla de portafolio personal responsvie rico en funciones. Es gratuita y ha sido diseñada en un estilo plano y minimalista.
Striped
Striped dispone de diseño simple y completamente adaptativo. El estilo de casi todos los elementos básicos de la página (blockquotes, tablas, listas, etc) se pueden colocar a la izquierda o a la derecha con un simple cambio en los estilos, está perfectamente realizado con HTML5 y CSS3 para disponer de una personalización más rápida y sencilla.
MNML
MNML es un punto de partida para proyectos HTML5-SASS responsive con un enfoque en la facilidad de lectura móvil.
Agency
Agency es una plantilla limpia con diseño adaptable en HTML5 para portfolios de negocios realizado con Bootstrap de Twitter.
Fashion
Century es una plantilla HTML5 responsive con portfolio y reproductor de audio.
Responsive Wedding es un theme construido con HTML5 con diseño adaptativo que utiliza jQuery para un fluido diseño de una sola página cuando hacemos scroll.
Mori es una plantilla de color oscuro para blogs, gratuita realizada con HTML5 con un diseño responsive y minimalista.
P.D. Para los observadores decir que son 19 plantillas pero he redondeado como el Euro
Como hacer que los mapas de Google tengan un diseño responsive
Como crear un Tema de WordPress desde una plantilla HTML
3 razones por las que el diseño web responsive es la mejor opción para una estrategia SEO móvil
Que es un Framework para WordPress y que ventajas tiene
Como crear dos columnas responsive en Contact Form 7
Gran aporte ….
Excelente gracias, todo tipo de aporte es una gran fuente.
intenté instalar una plantilla en mi wordpress ya que tu articulo dice que son para wordpress y me sale el siguiente mensaje
No se ha podido descomprimir el paquete. El tema no tiene la hoja de estilo
style.css.Hola Alejandro ¿De que plantilla se trata?
slaudos pedro. la plantilla es Miniport Template al descargarla veo que es una plantilla mas bien para montar a dreamweaver y no al CMS WordPress….
Una colencción realmente interesante. Me ha encantado el minimalismo de Mori y Miniport. No es fácil encontrar plantillas y themes con diseño adaptable para WordPress tan particulares que se escapen de la maquetación habitual de este tipo de trabajos.
Efectivamente, en el post has metido las plantillas de html5up, que no son para Wordpress, sino para utilizarlas con un editor HTML al estilo tradicional.
Gracias Antonio por la aclaración. Pero si sabes programar, es decir, tienes al menos conocimientos básicos de PHP, se puede adaptar la plantilla de HTML a WordPress.
hay algun tutorial para pasar Miniport Template para poderla instalar en wordpress? gracias
Hola de nuevo Alejandro. Todas estas plantillas son gratuitas, pero necesitan algunos cambios para poder pasarlas a Wordpress. Que mejor manera de aprender como funciona Wordpress que tocando y trasteando el código. Te paso este tutorial muy completo que te explica como hacerlo http://www.cristalab.com/tutoriales/template-de-wordpress-pasar-html5-a-wordpress-c104118l/. Espero te sirva de ayuda
Hola Pedro,
pues sí, yo también soy de las confusas que no ha caído en la cuenta de que hay que adaptar las plantillas. He pegado un vistazo a tu tutorial de adaptación HTML- Worpres, igual lo intento y todo, porque veo que está bastante organizado! Gracias por la aportación
¡De nada Sara! Espero que alguna te pueda ayudar para tu proyecto
hola!
no soy capaz de cargar la plantilla PARALLELISM en mi blog de blogger…
;(
me puedes ayudar?? no sé qué archivo debo subir,,, no hay ninguno .mxl
graciasssssss
Hola Alba. No son plantillas para instalar en Blogger. Son para hacer una web con un editor HTML o para adaptarlas a Wordpress si tienes los conocimientos necesarios
jo…
qué pena…
mil gracias Pedro!
besinesss
Hola, la verdad es que algo no me funciona en el proceso de subir el tema via ftp, falta hoja de estilo. Que tengo que hacer? Gracias
Disculpa, me falto decirte que es para WP y el tema en cuestion es Brushed. Gracias de nuevo
Hola Guillermo, para poder usar estos temes hay que adaptarlos primero a Wordpress. No se pueden instalar con el procedimiento normal
Buenas
¿Cómo hago para descargar las plantillas de n33?
Pues me direcciona a una página para descargar y nada.
Hola! Quería comentar que el template Legend no tiene el formulario de contacto de php. ¿Alguno/a lo desarrolló? Porque en la web oficial tampoco está, por lo cual no es del todo funcional.
Hola Ana, échale un ojo a estos themes https://reinspirit.com/30-themes-wordpress-responsive-gratis/ . Estos ya vienen listos para instalar y activar. Los que ves en este artículo hace falta conocimientos más avanzados para adaptarlos y utilizarlos.
Buenas tardes, estas plantillas están muy bién, existentes muchas en internet, pero estas me gustan bastante. Recientemente realizé mi blog con una plantilla de wordpress al igual que mi portfolio, ambas con responsive desing.
Os espero a tod@s para comentar lo que mas os interese!!
Saludos
Hola, muy buen aporte. La calidad de las plantillas son buenas aunque no acostumbro mucho a usarlas, los invito a pasar por mi pagina de Diseño Web, les agradeceria mucho que se den una vuelta y vean. es http://www.compusystem.com.ar
Hola Martin. Sinceramente tu sitio web tiene un estilo desfasado de a principios de los 90, y no posee ningún tipo de contenido dinámico como un blog para atraer visitas, ni botones para compartir en las redes sociales. Te aconsejo hacer un rediseño de tu sitio para adaptarte a las nuevas tendencias. Saludos
muchas gracias
Buenas tardes, si ya tengo creado parte de la pagina web mediante código de programación, se puede trasladar a worpress?
Si tienes los conocimentos necesarios claro que puedes