Bootstrap es un framework que permite a los desarrolladores web crear páginas web para todo tipo de dispositivos. Con este fin, el proyecto de código abierto ofrece plantillasde diseño basadas en HTML y CSS, así como extensiones adicionales para JavaScript. Inicialmente, Twitter había planeado Bootstrap como una herramienta interna de la empresa para la homogeneización del diseño. Sin embargo, en 2011, el framework fue publicado en la plataforma de desarrollo colaborativo de software GitHub, donde en un periodo de tiempo muy corto y con decenas de desarrollos ulteriores, se convirtió en uno de sus proyectos más populares.
Con la implementación de plantillas prediseñadas en HTML y CSS, los desarrolladores web no necesitan desarrollar una buena idea para una página web desde cero. Su estructura modular permite integrarlas fácilmente en cualquier documento HTML. Con esto, se eliminan muchas de las tediosas configuraciones CSS, ahorrando una gran cantidad de tiempo y esfuerzo. Esto incluye, entre otros, los siguientes elementos:
Otro aspecto importante es el Bootstrap grid o rejilla, sobre la que se construye el layout de una página web. Este sistema facilita la definición de los márgenes y el posicionamiento de los elementos que constituyen una página web distribuyendo los layouts en 12 columnas. En la organización de los elementos en esta cuadrícula se puede distinguir entre una gran variedad de tamaños de pantalla, ya sea de escritorio, smartphone, tablet o portátil. En cualquier caso, Bootstrap asegura un diseño web responsivo.
Opcionalmente, los plugins de JavaScript basados en el framework jQuery ofrecen la posibilidad de integrar en el proyecto elementos de interfaz de usuario tan útiles como consejos de uso de la herramienta o cuadros de diálogo, así como de extender la funcionalidad de otros elementos ya integrados como, por ejemplo, la función autocompletar para los campos de búsqueda. Para poder utilizar Bootstrap con elementos de JavaScript, solo es necesario incluir la biblioteca jQuery en el documento HTML.
Debido a que Twitter lanzó Bootstrap como un software libre, su descarga y uso no tienen ningún coste. Aquellos desarrolladores web con más experiencia también se benefician del estatus open source de Bootstrap, pues pueden adaptar y modificar el framework de acuerdo a sus necesidades. En la siguiente guía presentamos las medidas necesarias para utilizar plantillas de Bootstrap en JavaScript y CSS.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>¡Hola, esta es mi primera plantilla Bootstrap!</h1>
</body>
</html>La etiqueta meta “viewport” dentro de la sección “head” asegura una correcta visualización en dispositivos móviles.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name=viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/class" href="Bootstrap/css/bootstrap.min.css">
</head>
<body>
<h1>¡Hola, esta es mi primera plantilla Bootstrap!</h1>
<script src="Bootstrap/js/jquery-1.12.0.min.js"></script>
<script src="Bootstrap/js/bootstrap.min.js"></script>
</body>
</html>Aún cuando Bootstrap cuenta con contenidos prediseñados, es necesario tener conocimientos básicos en HTML y CSS para poder configurarlos. Incluso programadores experimentados pueden necesitar algo de tiempo para acomodarse a la interfaz, aunque suele tener su recompensa. Para quienes no tengan el tiempo o los medios, existen bibliotecas de plantillas Bootstrap creadas por otros usuarios y que están disponibles de forma gratuita o de pago para ser descargadas. Quien trabaje con HTML, CSS y JavaScript reconocerá rápidamente las ventajas de trabajar con este framework. Estas son principalmente:
Los anteriores factores, sumados a que Bootstrap es un proyecto de código abierto, lo posicionan como uno de los frameworks más populares para el diseño web.
Le Web Content Accessibility Guidelines (WCAG) del W3C servono come raccomandazioni per i gestori di siti web durante la creazione di progetti online accessibili. A questo scopo le WCAG si basano su 4 principi fondamentali: percezione, usabilità, comprensibilità e robustezza. Questi punti chiave vengono assegnati a 12 linee guida di base per capire come si strutturino al meglio contenuti web...
HTML5 es el nuevo lenguaje de Internet, sin embargo hay desarrolladores web que siguen usando lenguajes de hipertexto anticuados, como HTML 4.01 o XHTML, que precisan de numerosos plugins externos que ponen en peligro tanto la compatibilidad como la seguridad de las páginas web. Al contrario, HTML5 hace posible la directa integración de elementos multimedia e interfaces de programación basadas en...
JSON-LD permite a los programadores integrar metadatos como un script separado del contenido web en el popular formato JSON. Esta separación de lenguaje HTML y marcado semántico asegura una mayor legibilidad del código fuente, así como también hace más cómodo el etiquetado de metadatos para contenidos dinámicos. Todo esto convierte al formato más actual de estructuración de datos en un competidor...
Bootstrap es la solución más popular para la concepción y creación de interfaces de gran alcance. La colección de componentes HTML, CSS y JavaScript que Twitter publicó en 2011 bajo la licencia MIT, goza, sin duda, de una gran comunidad y de numerosas extensiones, interfaces para sistemas de gestión de contenidos y temas prediseñados. No obstante, existen diversas alternativas gratuitas a...
¿Qué novedades trae consigo Bootstrap 5? Con esta nueva versión, se espera facilitar aún más la creación de sitios web: sus desarrolladores prometen tiempos de carga más breves, una mejor experiencia de usuario y un código más práctico. Dejará de ser compatible con jQuery e Internet Explorer, aumentando la flexibilidad de su diseño.
Ofrece un servicio fiable y de alto rendimiento a tus clientes con un pack hosting de IONOS.
Ver packs
