Ticker

6/recent/ticker-posts

Ad Code

Responsive Advertisement

Curso de Bootstrap 5 #5. Reduciendo el peso

En la quinta clase del curso de Bootstraps 5 aprendemos a crear una versión reducida de Bootstrap, sólo con lo que vamos a utilizar de este framework.

Ahora que ya sabemos cómo está programado Bootstrap y cómo podríamos modificarlo o transpilarlo, ahora vamos a aprender cómo podemos crear una versión de Bootstrap que ocupe menos espacio.

El tamaño de los ficheros CSS es muy importante, ya que es uno de los puntos que Google utiliza para posicionar mejor o peor una página web, si conseguimos reducir el peso de Bootstrap (que puede ser bastante elevado) conseguiremos ganar unos puntos de cara al posicionamiento.

Este contenido está únicamente disponible para los suscriptores. Puedes identificarte en este enlace o suscribirte a los cursos.

Como hemos podido comprobar, una vez entendemos SASS/SCSS es realmente fácil reducir el peso de nuestro fichero CSS saliente, simplemente tenemos que elegir que clases de Bootstrap no utilizamos.

No obstante, aunque sea sencillo reducir el peso (eliminando los grupos de clases que no necesitamos), nos queda preguntarnos ¿Cómo sabemos qué clases no utilizamos? E incluso nos podríamos llegar a cuestionar ¿Y si eliminamos "los alerts" pero al final lo acabamos utilizando? ¿Qué pasaría

Es por ello que una buena técnica es dejar la versión normal de Bootstrap durante todo el proyecto y una vez lo tengas terminado y antes de subir la web a producción, crear ahí la versión de Bootstrap eliminando todo lo que no hayas utilizado en el proyecto. Eso sí ¡Recuerda comprobar luego que todo va bien!

Ahora que ya sabéis hacerlo, solamente os queda practicar, para así crear vuestra propia versión de Bootstrap. Una forma interesante para mejorar la reprogramación de Bootstrap y crear una versión reducida sería, coger un proyecto que ya tengaís realizado y actualizarlo a Bootstrap 5 (si está en una versión anterior) y crear una nueva versión más reducida.

Como siempre, si tenéis cualquier duda o pregunta, podéis mandarla a través del formulario de soporte de la intranet de suscriptor. ¡Nos vemos en la siguiente lección!

Enregistrer un commentaire

0 Commentaires