logo cdmon

Bootstrap, un framework para diseñar tu web

En el post de hoy hablaremos sobre Bootstrap, el famoso framework creado por Twitter para desarrollar webs. En las siguientes líneas vamos a ver qué es y cómo funciona:

Bootstrap es un framework que incluye varias herramientas de software libre para el diseño y desarrollo web.

Cosas que nos encantan de Bootstrap

Bootstrap no deja de ser un framework desarrollado con LESS/SASS/CSS3 y JavaScript, por lo que ya trae elementos predefinidos en cuanto a estilos y funcionalidades, por ejemplo, tablas, formularios, botones, tipografías, menús y un largo etc. que podemos encontrar con sus respectivos códigos en su web.
  1. Bootstrap es compatible con las últimas versiones de los principales navegadores. No deberás preocuparte de qué sistema operativo estás ejecutando actualmente. Puedes usar un Mac o un PC.
  2. Es compatible con el diseño reponsive. El sitio web tendrá la capacidad de ser visto en cualquier dispositivo y que sea compatible en múltiples plataformas web.
  3.  Ahorra tiempo! Al tener tantos elementos ya predefinidos e incluidos, nos ahorramos el tener que recurrir a otros plugins o frameworks externos y sobrecargar nuestra web de archivos. Bootstrap es ideal para developers porque éstos no suelen tener demasiado tiempo para escribir código, no obstante también es muy útil para usuarios que tienen muy poca experiencia.
  4. Personalizable. Bootstrap te permitirá maquetar la web a tu gusto. Podrás elegir y seleccionar lo que deseas y deshacerte de lo que no quieras o necesites. En pocas palabras, que se ajuste a tus necesidades web.

Grid system: ¿qué es?

Sin duda una de las características más importantes y útiles para desarrollar webs adaptadas a todos los dispositivos, ya que trae un sistema de cuadrilla o de rejillas donde se pueden adaptar todos los elementos al ancho de 12 columnas que varían su tamaño dependiendo del dispositivo donde se visualice la web.

Lo único que se tiene que hacer para conseguir esto, es poner una serie de clases CSS en nuestros elementos HTML que ya vienen predefinidas en las hojas de estilos que nos descargamos, donde se define que ancho va a tener el elemento dependiendo el dispositivo. En la web de Bootstrap podemos encontrar una tabla con las medidas estándar que nos da este framework:

bootstrap_Example

Cómo empezar a usarlo

Para empezar a usar Bootstrap debemos descargarnos sus archivos desde su web (http://getbootstrap.com/) e incluir los archivos en nuestra web.

También podemos cargar los archivos de Bootstrap desde la CDN del propio framework con los siguientes enlaces:
 <linkrel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
 <linkrel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
Bootstrap es algo que ya estás utilizando para tu front-end de desarrollo? ¿Algún consejo o truco que te gustaría compartir? Si es así, puedes dejarnos un  comentario. Ánimate y lánzate a probarlo!

Fuente: zumodemarketing.com
 

Comments

No comments made yet. Be the first to submit a comment
Guest
Tuesday, 20 November 2018

This website uses its own and third party cookies. We believe that if you continue browsing, you are accepting their use. Get more information | Close