SpamLoco

  • Noticias
  • Seguridad
  • Arduino
  • Videos
  • Foro

Crea un diseño responsive de forma sencilla con LayoutIt!

Hace poco estuve probando un servicio online llamado LayoutIt! que permite crear de forma sencilla diseños adaptables (responsive) y fluidos (fluid) con JavaScript, HTML5 y CSS3. Se basa en el framework Bootstrap el cual seguramente algunos de ustedes ya conozcan.

Puede ser muy útil para diseñar una web sin tener grandes conocimientos de programación, simplemente hay que seleccionar una plantilla como base o bien comenzar desde un contenedor en blanco y arrastrar (drag-and-drop) los distintos elementos que formarán el diseño.

servicio layoutit

A medida que vamos creando la estructura podremos ver una vista previa en el navegador y finalmente descargar el código completo incluyendo la estructura de directorios, imágenes, css, less y js.

descarga del frontend creado con layoutit

LayoutIt! no es un constructor de sitios propiamente dicho, sólo genera el frontend o diseño que verán los visitantes de la web… cabe mencionar que el código que se genera es muy limpio y por supuesto se puede seguir editando y adaptando para ser integrado con nuestro backend, es decir todo lo que funciona del lado del servidor como por ejemplo el lenguaje PHP.

El servicio lo descubrí gracias a un artículo de Pablo (@kabytes) y como él lo menciona puede ahorrarnos algunas horas de trabajo sobre todo si no somos muy hábiles con el maquetado web.

Enlaces: layoutit.com | @Layoutit


1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (¿Te ha servido el artículo?)
Comparte en FacebookComparte en Twitter
Publicado por Alejandro Eguía el 20 mayo, 2013 Archivado en: Diseño, Herramientas online


Comentar con Facebook


  1. MisClicks

    Excelente opción y recomendación, podría utilizarse para personas principiantes en el diseño y construcción de sitios web.

    Responder
  2. Luis Rodriguez

    Espera, y disculpa que este tan poco informado, tengo mucho tiempo sin bloguear mucho y ademas no se bien sobre ello pero… ¿Estas plantillas pueden ponersele a un sitio de Blogger? Agradezceria tu pronta respuesta Ale.

    Responder
  3. Pablo

    Excelente herramienta Ale, la voy a probar para algunos dominios que tengo pensado sacar de parking :)

    Gracias!

    Responder
  4. Rocabos

    Hay algo que no entiendo, ¿Cómo se configura después para que las actualizaciones de la versión web salgan en la versión móvil?

    Responder
    • Alejandro Eguía

      Eso creo que se tendría que hacer de forma manual.

      La herramienta crea un diseño adaptable a cualquier pantalla, es decir que la misma versión web se utilizaría para los móviles porque los elementos se ajustan. Es una de las ventajas de usar un diseño adaptable, no tener que crear otra versión del sitio exclusiva para los móviles.

      Responder

Deja un comentario Cancelar respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Buscador

Suscripción al blog

Feed

Recibe los nuevos artículos del blog en tu correo suscribiéndote gratis:

Redes Sociales

facebook twitter spamloco-youtube google-plus-spamloco

Sobre SpamLoco

Este es un blog dedicado al mundo de la tecnología, internet y la seguridad informática. No te confundas con el nombre, sólo es un juego de palabras, no tiene nada que ver como el ''spam'' sino todo lo contrario.

Si necesitas ayuda puedes pasar por el Foro o contactarme.

Subir

Copyright © 2006 - 2018 SpamLoco.net | Términos del sitio | Cambiar opciones de privacidad | RSS | Contacto