EniunEniunEniunEniun
  • Inicio
  • Servicios
    • Desarrollo Web
    • Diseño Web
    • Marketing Digital
    • Social Media
    • Experiencia de usuario
  • Nosotros
  • Diseño de Interfaces Web
  • Contacto
  • Blog
Contenido adicional
  • Metodología Scrum

Frameworks de diseño web responsive

frameworks de diseno web

Los frameworks de diseño ofrecen un esqueleto basado en columnas que facilita mucho la tarea de construir una web que se adapte a cualquier dispositivo. Además, ofrecen una serie de clases CSS y funciones de JavaScript que se pueden utilizar directamente y que nos ahorran tiempo a la hora de crear código.

Frameworks de diseño web

Hoy en día existe en el mercado una amplia variedad de frameworks de diseño web responsive que nos ayudan a implementar nuestras interfaces gráficas. Algunos de los frameworks más utilizados son los siguientes.

  • Bootstrap (http://getbootstrap.com/): Este framework, desarrollado por Twitter, es uno de los más populares actualmente. Bootstrap ha sido creado para ofrecer la mejor experiencia de usuario tanto en versión escritorio, como en tabletas y smartphones. Utiliza un grid responsive de 12 columnas y trae integrado decenas de complementos, plugins de JavaScript, tipografías, controladores de formularios, etc. Además, utiliza el preprocesador de CSS Less.
  • Materialize CSS (https://materializecss.com/): Es un framework inspirado en Material Design de Google, lo que permite dar un aspecto muy similar a lo que podemos ver en Android o en las páginas creadas por Google. No es tan completo como Bootstrap pero visualmente es muy atractivo y está muy orientado al diseño web responsive.
  • Zurb Foundation (http://foundation.zurb.com/): Junto con Bootstrap es uno de los frameworks más avanzados que existen en la actualidad. Ha sido desarrollado con Sass, un potente preprocesador de CSS que hace de Foundation un framework personalizable.
  • Skeleton (http://getskeleton.com/): Ofrece un grid responsive basado en una resolución de 960px que se ajusta al tamaño de los dispositivos móviles. Tiene poco peso e incluye una colección de archivos CSS y JS para facilitarnos el diseño de nuestra web.
  • HTML5 Boilerplate (https://html5boilerplate.com/): Tal y como los anteriores, ofrece un set de utilidades para construir nuestra web responsive de forma rápida y sencilla, con la ventaja de ser uno de los frameworks que menos ocupan.

En esta unidad, nos centraremos en Bootstrap por ser uno de los más utilizados. ¡Veamos cómo se instala y cómo funciona esta librería!

Compartir

UD7. Plantillas y frameworks de diseño

  • 1. Frameworks de diseño web
  • 2. Cómo descargar e instalar Bootstrap
  • 3. Sistema de columnas y contenedores Bootstrap
  • 4. Texto, tipografía y colores en Bootstrap
  • 5. Tablas en Bootstrap
  • 6. Imágenes en Bootstrap
  • 7. Botones en Bootstrap
  • 8. Componentes de Bootstrap
  • 9. Plantillas y temas gratis para Bootstrap
  • 10. Referencias y recursos

Unidades

  • UD1. Planificación de interfaces gráficas
  • UD2. HTML
  • UD3. CSS básico
  • UD4. CSS avanzado
  • UD5. Imágenes, licencias y software de gestión
  • UD6. Sonido, vídeo y animaciones
  • UD7. Plantillas y frameworks de desarrollo
  • UD8. Integración de contenido interactivo
  • UD9. Diseño de webs accesibles
  • UD10. Usabilidad web
  • Metodología Scrum

ENLACES

  • Nosotros
  • Contacto
  • Mapa del sitio
  • Blog

CodePen

codepen

CURSOS

  • Diseño de Interfaces Web

REDES SOCIALES

NUESTRA MISIÓN

Queremos que consigas tus objetivos y que tu proyecto llegue a todo el mundo de la manera más óptima. Tu éxito es nuestro deseo y pondremos en práctica toda nuestra experiencia para que lo consigas.

Únete y recibe gratis contenido exclusivo



    © 2020 Eniun Diseño Web y Marketing Digital
    Política de privacidad y cookies
    • Metodología Scrum
    Contenido adicional
    • Metodología Scrum
    • Metodología Scrum
    Utilizamos cookies de terceros para personalizar el contenido, los anuncios y con motivos de análisis del tráfico. La navegación por la web implica la aceptación de nuestra Política de Cookies.Estoy de acuerdo