Inicio » Consejos para tu web » Principales diferencias entre bootstrap 3 y 4

Principales diferencias entre bootstrap 3 y 4

08/06/2017
4

Uno de los framework más populares para el desarrollo de páginas web y tiendas virtuales responsive para móviles tiene una nueva versión, Bootstrap 4 Alpha.

Atalantic Soluciones Digitales aposto por dicho framework desde un principio por su gran soporte con html5 y css3, por un sistema de gridas de 12 columnas muy fácil y práctica y por sus Media Queries para 4 tamaños pudiendo de esta manera desarrollar para móviles y tablet de una forma más sencilla.

Pero si estais aquí seguramente ya sabréis las virtudes de bootstrap, con lo que vamos a ir al grano y vamos a explicar las principales diferencias que hemos encontrado.

LAS 5 DIFERENCIAS MÁS IMPORTANTES DEL FRAMEWORK BOOTSTRAP

1- PROCESADOR CSS

La primera diferencia y la más “técnica” es el cambio de procesador de css que tiene bootstrap 4, en esta versión se ha optado exclusivamente por Sass ya que según ellos compila mucho más deprisa.

Los amantes de Less se quedan fuera, en la versión 3 sí que mantenía less y también Sass, pero han decidido y ya sabemos cuál es el ganador.

2- SOPORTE INTERNET EXPLORER 8

Este puede ser el punto en el que mucha gente empiece a pensar en la posibilidad de seguir con bootstrap 3.

Bootstrap 4 no tiene soporte para internet explorer 8.

¿Pero quién sigue utilizando ie 8? Pues en principio muy poca, pero muy poca en el mundo de internet pueden ser muchas personas. Personalmente yo asumiría esa pérdida ya que las personas que aun puedan manejar IE8 lo más probable es que no sean los usuarios a los que dirigirte con tu tienda online o página web.

 

3- MEJORA DE LA GRIDA

Posiblemente no te des cuenta de este detalle ya que la sintaxis html es exactamente igual que en bootstrap 3.Estructura en gridas de pagina web

El cambio es sencillo, se ha pasado de los pixeles a medidas relativas utilizando la unidad “rem” para conseguirlo.Este cambio también influye en la media queries.

4- NO TIENE GLYPHICONS

No sabría decir si es una ventaja o no, pero en nuestro caso no los utilizábamos nunca, con lo que es un peso que te quitas de la css.

5- JAVASCRIPT RESCRITO EN ES6

Los diversos plugin de Bootstrap han pasado a JavasScript ES6 que tiene una sintaxis mucho más clara y simple para la creación de objetos y las herencias.

 

Bootstrap 4 incorpora nuevas clases para dar estilos a los botones, estilos para cabeceras, tablas.

Incluye tarjetas que sustituyen a well, panel y thumbnail. Es un contenedor flexible que tiene opciones de introducir cabecera pie y gran variedad de contenidos.

También incluyen nuevas clases (Utility classes)  que nos ayudaran a controlar los margin y padding de los elementos de nuestra plantilla.

Existe la creencia de que todas las paginas web creadas con bootstrap son iguales, pero el problema es que sus diseñadores no tienen ideas innovadoras.

Con Bootstrap Imagina y Vencerás

Pagina oficial del framework

Summary
Review Date
Reviewed Item
Principales diferencias entre bootstrap 3 y 4
Author Rating
51star1star1star1star1star

Deja un comentario

4 comments

  1. Diana Fernandez

    Acabo de leer tu post, pero me queda una duda. Si quiero migrar mi sitio web con Bootstrap 3 al 4, debo modificar mucho o poco?
    Creo que esas son las diferencias más importantes. Cierto?
    Que tal problemático puede ser esa migración?
    Gracias y felicitaciones por el sitio.

    1. Buenas Diana, lo primero gracias por leernos.
      Referente a la pregunta de la problemática de la migración, voy a ser bastante sincero y te diría que no la hicieras.
      Me explico, bootstrap es un framework, digamos que es una herramienta que facilita el desarrollo de la web, pero no es la web en si, puedes realizar las funcionalidades que se necesiten programando o maquetando “a pelo”, por ello si tu pagina web la realizaste utilizando bootsrap 3 yo sin duda lo mantendría ya que el coste de migrar la versión para el beneficio que podrías lograr es muy elevado.
      Nosotros desde Atalantic seguimos manteniendo las versiones de bootstrap 3 y en los nuevos desarrollos web empezamos a utilizar el 4, pero por el momento no hemos tenido una necesidad real de migrar ya que el 3 sigue siendo una herramienta casi igual de potente y donde no llega el framework por ahora se solventa con programación.
      De todas maneras te dejo un par de enlaces (lo siento son en inglés) para si te atreves y siempre en local o entorno de pruebas puedas empezar a migrar.
      -Convertidor código a bootstrap4->(http://upgrade-bootstrap.bootply.com/)
      -Explicación para realizar el cambio-> https://designmodo.com/migrate-bootstrap-4/

      No se si he sido de mucha ayuda, pero mi mayor consejo es que estudies bien si merece la pena realizar el cambio.
      Un saludo y esperamos verte de nuevo por nuestro blog

  2. Diana Fernandez

    Acabo de leer tu post, pero me queda una duda. Si quiero migrar mi sitio web con Bootstrap 3 al 4, debo modificar mucho o poco?
    Creo que esas son las diferencias más importantes. Cierto?
    Que tal problemático puede ser esa migración?
    Gracias y felicitaciones por el sitio.

    1. Buenas Diana, lo primero gracias por leernos.
      Referente a la pregunta de la problemática de la migración, voy a ser bastante sincero y te diría que no la hicieras.
      Me explico, bootstrap es un framework, digamos que es una herramienta que facilita el desarrollo de la web, pero no es la web en si, puedes realizar las funcionalidades que se necesiten programando o maquetando “a pelo”, por ello si tu pagina web la realizaste utilizando bootsrap 3 yo sin duda lo mantendría ya que el coste de migrar la versión para el beneficio que podrías lograr es muy elevado.
      Nosotros desde Atalantic seguimos manteniendo las versiones de bootstrap 3 y en los nuevos desarrollos web empezamos a utilizar el 4, pero por el momento no hemos tenido una necesidad real de migrar ya que el 3 sigue siendo una herramienta casi igual de potente y donde no llega el framework por ahora se solventa con programación.
      De todas maneras te dejo un par de enlaces (lo siento son en inglés) para si te atreves y siempre en local o entorno de pruebas puedas empezar a migrar.
      -Convertidor código a bootstrap4->(http://upgrade-bootstrap.bootply.com/)
      -Explicación para realizar el cambio-> https://designmodo.com/migrate-bootstrap-4/

      No se si he sido de mucha ayuda, pero mi mayor consejo es que estudies bien si merece la pena realizar el cambio.
      Un saludo y esperamos verte de nuevo por nuestro blog

Sé innegablemente bueno. Ningún esfuerzo en marketing es un sustituto para eso.

Anthony Volodkin de Machine

¿Dudas? WhatsAppeanos
Envíanos tus dudas por WhatsApp