¿Qué es Bootstrap?

bootstrap
Compartir:

Bootstrap se ha convertido en una herramienta esencial para los desarrolladores.

¿Qué es Bootstrap y cómo ayuda a los desarrolladores web?

Esta herramienta de desarrollo de aplicaciones web fue creada por dos ex empleados de Twitter, Mark Otto y Jacob Thornton.

El sitio web oficial de Bootstrap lo describe como: “El HTML, CSS y JS Framework más popular para desarrollar en la web proyectos responsive y mobile-first”.

Es una colección gigante de bits de código escritos en HTML, CSS y JavaScript útiles y reutilizables. También es un Framework de desarrollo de interfaz de usuario (front-end) que permite a los desarrolladores y diseñadores crear rápidamente sitios web responsive. Bootstrap ahorra escribir mucho código CSS, lo que otorga más tiempo para diseñar las páginas web. Actualmente está alojado en GitHub y se puede descargar fácilmente desde getbootstrap.com de forma gratuita.

¿Por qué Bootstrap es la primera opción para los desarrolladores?

Cuadrícula responsive

No perderás tiempo programando tu propia cuadrícula. Bootstrap viene con su propio sistema de cuadrícula predefinido, por lo que puedes ir directamente a llenar sus contenedores con contenido. La definición de puntos de ruptura personalizados para cada columna es muy fácil con sus rupturas extra pequeñas, pequeñas, medianas, grandes y extra grandes. También puedes simplemente ceñirte al valor predeterminado ya que puede que cumpla con las necesidades de tu sitio.

Imágenes responsive

Bootstrap viene con su propio código para cambiar automáticamente el tamaño de las imágenes en función del tamaño de la pantalla. Simplemente hay que agregar la clase “.img-responsive” a tus imágenes y las reglas de CSS predefinidas se encargarán del resto. Incluso puedes cambiar la forma de las imágenes con la adición de clases como “img-circle” e “img-rounded”, y todo sin ir hacia atrás entre el código y tu software de diseño.

Componentes

Bootstrap viene con una gran cantidad de componentes que puedes incorporar fácilmente a tu página web:

  • Barras de navegación
  • Listas deplegables
  • Barras de progreso
  • Miniaturas…

No sólo es fácil agregar elementos de diseño llamativos a tu página web, sino que también podrás estar tranquilo sabiendo que cada uno de ellos se verá genial sin importar el tamaño de la pantalla o el dispositivo utilizado.

JavaScript

También permite a los desarrolladores aprovechar más de una docena de plugins JQuery personalizados. JQuery te brinda aún más espacio para jugar con la interactividad, ofreciendo soluciones fáciles para ventanas emergentes, transiciones, carruseles de imágenes, actualizar automáticamente tu barra de navegación mientras te desplazas por una página, etc.

Documentación

Cada pieza de código se describe y explica con detalles explícitos en su sitio web. Las explicaciones también incluyen ejemplos de código para la implementación básica, simplificando el proceso incluso para los principiantes más principiantes. Todo lo que necesitas hacer es elegir un componente, copiar y pegar el código en tu página, y modificar desde allí.

Personalización

Una de las principales críticas cuando se trata de frameworks como Bootstrap es el tamaño: el peso que tiene puede ralentizar tu aplicación en la primera carga. La versión actual del archivo CSS de Bootstrap, por ejemplo, tiene un enorme 119 KB. Esto puede no parecer especialmente grande en comparación con los archivos de imagen y vídeo, pero para un archivo CSS, ¡119 KB es enorme! Sin embargo, lo que Bootstrap te permite hacer para combatir esto es personalizar qué funcionalidad deseas incluir en tu descarga. Simplemente yendo a su página de personalización y descarga, puedes marcar las características que no necesitarás para tu aplicación, reduciendo el peso del archivo y ahorrando a los usuarios tiempo de carga adicional.

Comunidad

Al igual que con otros proyectos de código abierto, Bootstrap tiene una gran comunidad de diseñadores y desarrolladores detrás. Estar alojado en GitHub facilita a los desarrolladores modificar y contribuir a la base del código. También facilita que las personas colaboren, presten su asesoramiento e interactúen con sus compañeros y con otros usuarios.

Plantillas externas

A medida que crecía la popularidad de Bootstrap, la gente comenzó a crear plantillas basadas en Bootstrap para acelerar aún más el proceso de desarrollo web. Hay muchos sitios web dedicados a compartir y comprar plantillas personalizadas basadas en Bootstrap, aquí te dejamos 3 de ellos:

¿Por qué no deberías usar Bootstrap?

A estas alturas, probablemente estés pensando que usarlo es una obviedad. Sin embargo, Bootstrap también tiene sus desventajas. Algunas quejas comunes que pueden escucharse son:

La sintaxis de Bootstrap es confusa

Antes de familiarizarse con Bootstrap, parte de su sintaxis puede resultar confusa. Cuando se usa el sistema de cuadrículas, por ejemplo, para hacer una columna que ocupe un tercio de la pantalla, debes agregar la clase “.col-md-4”.

¿De dónde viene este 4? El 4 cuatro podría llevarte a pensar que la columna ocuparía un cuarto de la pantalla, no un tercio. Aunque esta sintaxis tiene sentido (Bootstrap usa un sistema de 12 columnas, y 4 es un tercio de 12), puede ser poco intuitivo para los nuevos en el proceso.

Los archivos son demasiado grandes

Los archivos Bootstrap pueden ser un poco “grandes”, lo que puede conducir a un aumento en los tiempos de carga para los sitios web, especialmente en redes más lentas. Los principiantes pueden tener dificultades para identificar y solucionar este problema; sin embargo, la antes mencionada herramienta de personalización en el sitio web de Bootstrap puede ayudarte a eliminar cualquier código innecesario para las funciones que nunca usarás. Solo selecciona las partes que necesitas y deja el resto. (Esta tarea se hace más fácil cuanto más sepas sobre el código)

Me mantiene alejado del aprendizaje del código

Siempre existe el riesgo de que, al usar Bootstrap, entres en una rutina de simplemente reciclar el código existente sin realmente entenderlo. Sin embargo, si dedicas tiempo para entender lo que estás haciendo, puedes usarlo como una forma de acelerar tu aprendizaje, en lugar de obstaculizarlo.

Bootstrap es una poderosa herramienta que permite a los desarrolladores ponerse en marcha rápidamente y sin complicaciones. Facilita la integración de muchas funciones excelentes que enriquecen la interacción del usuario con la web sin tener que codificarlas desde cero. Bootstrap es inmensamente popular y se ha utilizado para crear algunos sitios web geniales (MongoDB, NASA, FIFA…).

 

Si necesitas mejorar tu sitio web o tienes en mente iniciar un proyecto, contacta con nosotros y te ayudaremos.

Contáctanos

 

Fuente: Career Foundry

 

Compartir:

Deja un comentario

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

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.plugin cookies

ACEPTAR
Aviso de cookies