Recuerdo haber cometado en algún Cadius en Granada, de los que hacemos (o hacíamos/íbamos), “esto del Bootstrap se nos está yendo de las manos, al final todas las webs van a ser igual”. Ahora y a raíz del post en el que hablaba sobre los problemas que se podrían encontrar al usar los iconos de Font Awesome sin modificar su uso, creo que ha llegado el momento.
Básicamente el problema reside en que el uso de estos frameworkds implica ir arrastrando muchos elementos que no vamos a necesitar, vamos a perder rendimiento y no estaremos haciendo las buenas prácticas que tanto se recomiendan en cuanto al producto final. Aunque el diseño de la web sea lo más escalable posible, vamos a arrastrar cientos de líneas de código CSS que no vamos a usar nunca.
En el proyecto en el que estoy trabajando durante este mes -y probablemente el que viene- he usado partes del framework Purecss de Yahoo. Pese a ser uno de los más ligeros y simples, lo he destripado. Me he quedado con lo que realmente me iba a ahorrar trabajo y lo que más me gustaba: grid, formularios y botones. Con Font Awesome sigo con el dilema, realmente voy a usar 15 tipos de iconos como máximo, y tal vez incluir el paquete completo es una pérdida de bytes.
Entiendo que mi posición es complicada ya que en la mayoría de los encargos suelo controlar tanto la parte de diseño como la maquetación web. Así que tengo la suerte de no tener que preocuparme ni por el diseñador, ni por el maquetador. No obstante cualquier desarrollador web está acostumbrado a dejar un diseño al pixel responsive y hacer ese mismo trabajo sin estas herramientas es posible y más placentero. Bajo mi complicada perspectiva, el uso de framework completos, como bootstrap, es un problema para el producto -para la web que se va a entregar al cliente– por los siguientes motivos.
1.- Más horas de desarrollo = producto más caro
Parto de la premisa de que el cliente no quiere una web que se parezca a twitter o a su competencia que también usa bootstrap, sino que quiere un producto único y diferenciador. En este contexto, usar bootstrap puede implicar re-definir muchos estilos del CSS. Lo cual implica saber el comportamiento de todos los elementos.
2.- Pérdida de rendimiento
La versión minificada ocupa unos 22 kbs, sin ningún tipo de diseño, pero su peso se puede ampliar hasta los 300kb si vas sumando javascripts y otros elementos para tener un bootstrap de verdad. Si bien se pueden usar las versiones de los cdns, que estarán cacheados en muchos navegardores, el rendimiento irá a la baja, pues hay muchos elementos que interpretar en el DOM de los equipos menos potentes.
3.- Código web más sucio
Por la necesidad de ser un framework versátil, a veces se recurre a tener que usar etiquetas vacias, como ocurre con el set de iconos, líneas divisoras, etc. Al final el código HTML generalmente será más sucio que una maquetación realizada a medida.
4.- Incompatiblidad entre versiones
Entre versión y versión va cambiando la nomenclatura de sus elementos. Algo que realmente no tiene sentido, ya que si el objeto de lanzar nuevas versiones es la inclusión de mejoras o reparar un bug, no podremos cambiar a la ligera, sin re-etiquetar todos los elementos programación, html, css.
5.- Disfruto aprendiendo
Y tal vez mi motivo más importante.
A título personal, prefiero aprender y sentir la sensación de descubrir una técnica a usar una metodología o algo hecho, pese a que las horas extra no se las vaya a facturar a nadie. Aún recuerdo las sensaciones positivas de la primera vez: el primer sprite, el primer menú desplegable, el primer transition, … Pensándolo bien he escogido poder vivir de esto por disfrutar de ese placer. Para hacer de robot, siempre podré cargar cajas en un supermecado en Dartford.
Lectura recomendada con cosas positivas: Boostrap sí, pero no
Reflexión: No comprendo como a día de hoy se pueden ver ofertas de trabajo en los que el perfil sea del tipo desarrollador con bootstrap. A mí los tiempos para desarrollar una maqueta HTML con bootstrap de un diseño complejo (sin que no parezca bootstrap) no me cuadran. ¿Y a vosotros?
Este post ha sido escrito con Calmy Writter
Hola. Gracias por el interesante artículo.
He podido hacer proyectos tanto desde cero como usando frameworks como bootstrap. Pienso que saber hacerlo desde cero te permite aprender muchas cosas y te da confianza para sobrescribir o extender un framework.
Mi experiencia es que un framework como bootstrap permite maquetar mucho más rápido que si optas por partir desde cero. Además contiene un conjunto de buenas prácticas y técnicas que representan muchas más horas de investigación y desarrollo que las que podríamos hacer nosotros solitos.
Así que maquetar rápido con bootstrap y luego optimizar es un camino bastante agradable. El otro camino de hacer desde cero y llegar al nivel técnico de un bootstrap (cubrir todos los huecos, casos y excepciones que cubre) representa muchas pruebas e iteraciones. Puede ser educativo y quizás hasta entretenido, pero no siempre un cliente estará tan contento como tú por todo el tiempo que representa. Además si ya lo has hecho antes, se puede volver tedioso… empezarás a reutilizar cosas de proyectos anteriores… es decir, a usar un framework, tu propio framework.
El problema de los propios frameworks, es que a menos que los liberes, los documentes y formes comunidad, nadie más los conoce. Lo que haces se volverá caro de mantener (uno no es eterno). Opino que es preferible el uso de estándares que facilite que otros se ocupen de mantener luego el proyecto.
Dicen que quienes recién comenzamos tendemos a enamorarnos de nuestro propio código. Es con la experiencia que empezamos a dejar eso atrás y enamorarnos de las soluciones. De lo mejor que podamos hacer con lo que hay a mano.
Hola Rulo muchas gracias por comentar, en parte comparto tu idea de que a la larga uno acaba reutilizandose a sí mismo.
Lo cierto es que bootstrap lo he usando y «lo estoy usando» en dos proyectos grandes, como escribí en otro post sobre las ventajas de usar el framework: https://rubendivall.com/post/97138589167/conclusiones-usando-bootstrap-de-un-maquetador
En general es muy buena base para construir cualquier cosa, y una gran ayuda, pero es cierto que lo mejor sería que todos supiesemos un poco lo que tenemos entre manos para hacer nuestro trabajo lo mejor posible. Sólo tienes que darte un paseo por stackoverflow, por ejemplo, y ver la de consultas que existen que se resumen en que la gente desconoce que es float:left.
Por cierto, tengo la misma percepción que tú, y cada vez le doy más valor a las soluciones, supongo que en estos 9-10 años que llevo en el «mundillo» algo he aprendido, eso sí, sigo siendo crítico en que muchas veces los códigos están perdiendo mucha calidad, semánticamente hablando por muchos microformatos que luego le incorporemos.
Un saludo!
Yo lo ocupo, 1 por que me da agilidad en los desarrollos, 2 todo me queda cuadradito a la primera, 3 adopto un theme y listo, por esos 3 motivos agilizo demasiados mis proyectos ahorrandome un 90% lo del diseño siendo constructivo en otros aspectos. Saludos
Yo también lo uso bastante. El que tenga su origen de Twitter no quiere decir que los proyectos finales se van a parecer a «otro Twitter»… uno tiene el control total para PERSONALIZARLO a la medida, podemos agregar y quitar algunas cosas que no necesitemos. Seguiré con Bootstrap 🙂
le falta mas argumentos solidos al peke
Ya tu sabes todo. Pero mi querido surjanito nadie te dijo que eres un estafador . Aprende a criticar cuando tengas todo a la mano no decir que eres un imbecil.
Bootstrap es para la gente que no se maneja con el CSS y los layouts. Para no-diseñadores vaya… a los programadores que no saben maquetar les viene de perlas.
Pero a mi, que vengo de la otra rama… me ofende a saco cuando dicen que no saber bootstrap me hace menos profesional… vamos no me jodas.
Ahora resulta que hacer webs clonadas unas de otras es ser el más PRO.
No amigos.. el diseño es un arte. Y hacer diseños a medida y complejos, no habrá framework ni robot que los saque adelante.
Genial post!
Hola Nacho, en contra de mis palabras tengo que argumentar que últimamente y en el día a día estoy usando Bootstrap cada vez más, sólo por el tiempo que me ahorra.
Entonces podes borrar el articulo
genial comentario,….
Totalmente de acuerdo con esta publiaciòn y con este comentario
Muy bien dicho Nachito!
y que hay de http://susy.oddbird.net/ alguien lo ha provado? yo encuentro este enfoque un tanto mas organico!
Hola, Rubén.
Fíjate que estoy de acuerdo a medias con lo que posteas. La verdad es que he usado Bootstrap sólo para sistemas que elaboro para los clientes, donde el estilo no les importa demasiado; les importa más la funcionalidad (sea un CMS o un sistema más complejo). ¡Y eso es genial, porque me saca de tener que pensar en el diseño para enfocarme exclusivamente en las funciones que mis clientes ocupan!
Sin embargo, cuando me piden diseñar una página web para el público general, ahí sí me voy a hacerla desde cero y prestándome pocos plugins. Tengo una pésima visión de diseño, eso lo admito; pero hago lo que se puede por ayudarlos a hacer una página que sea original y que los haga sentir cómodos.
Totalmente de acuerdo, yo recién me entero hoy de que hay framework para maquetar… creo que sería ideal solo para crear páginas muy sencillas, pues si tenemos dominio de css no será necesario de utilizar estos framework. Pero creo que es necesario aprenderlo aunque lo básico pues puede haber clientes que quieran que hagan matenimiento a su web creada con este framework. ups
Primer post que leo y no me siento fuera de lugar, tienes mucha razón me siento identificado con lo que dices, tanto aprender css poco a poco para terminar aprendiendo cosas hechas por otros (reglas, etc) en un curso que estuve haciendo la parte responsive nos mostraron el framework bootstrap y no me simpatizó desde el comienzo, lo que me agrada es la parte de la grilla que aún tengo un nivel básico para maquetar responsive, pero de resto no me agrada usar un framework, por lo mismo que dices ¿dónde queda el aprender por si sólos? me cuestione lo mismo, «las webs ahora sera todas iguales» donde queda lo original todo sera a base de algo predeterminado, lei mucho para ver si es recomendable o no usar bootstrap pero la verdad es preferible hechar codigo y sentir la satisfacción de algo hecho por ti, y no aprender clases de otros que al final dará como resultado un sitio parecido a otro por mucho….
deberias usar bootstrap para que tu web no sea tan plana
Totalmente de acuerdo con esta publiaciòn
Pense que era el único que no usaba Bootstrap
Encontré tu artículo googleando «css sin bootstrap» porque lo detesto. Soy desarrollador y envidio (positivamente) a los diseñadores. Hacen algo hermoso que a mí no me sale! Yo te junto 3 colores y te puedo dejar ciego. De todos modos, estoy desarrollando un proyecto web personal de gran envergadura sólo. porque aún no genera ingresos. Del lado del front end tengo que aprenderlo todo, cada día vuelvo a sentir esa sensación que describes en tu artículo. Ayer, por ejemplo, celebré con mucha alegría al ver como un formulario que estaba completamente programado en jQuery y Bootstrap funciona perfecto luego de haberlo transcripto todo a Javascript puro y css. Volvamos a la vieja escuela!
Yo soy de los tuyos, de los que miden rendimiento! En cada respuesta del servidor me fijo en la cantidad de bits y los milisegundos de respuesta. Me agarré tal asco a los frameworks después de haber intentado hacer mi proyecto con Joomla… dios, que mierda! Modificar algo era como desactivar una bomba a chancletasos! En aquel entonces (2008) era un aventurero, venía de ser vendedor de productos bancarios, de zapatos, de trabajar en Mc Donalds, de viajar vendiendo productos industriales pero, siempre mirando de reojo a las computadoras, que disfrutaba en mi tiempo libre. Tenía una ex – seguramente habrá notado que dije «tenia» y «ex» – que me decía que siempre perdía el tiempo sentado en la computadora, mi vieja que me decía «ponete a estudiar», y cosas por el estilo que me hacían sentir que esto no era una profesión, que para decir que eras profesional de sistemas tenias que tener un título de ingeniero. Esto para mí siempre fue una diversión, un juego… y el día de hoy lo sigo sintiendo así. Parece que por fin salí del placard!
Me imagino esta conversación:
-Yo: «-Mamá, Papá… soy desarrollador web!»
-Papá: «Hubiera preferido que me dijeras que sos gay!»
-Yo: «No viejo, gay no, para eso debería despegar el culo de la silla y no es compatible con esta profesión»
Bueno, volviendo (como dicen ustedes, los diseñadores) al pixel… Tengo alguna plantillas y componentes hechos en bootstrap que me fueron gustando y los fui guardando, y hoy quiero pasarlos a puro css, y no encuentro alguna referencia o tabla de equivalencias de clases que me puedan decir como mantengo ese diseño sin esta librería. Alguien sabe de algo por el estilo? También puede ser un gran proyecto a desarrollar si alguien se anima.
Bueno, hice mi descarga a tierra y ahora me siento mucho mejor 😀 Gracias por este espacio y hasta pronto.
Saludos!
Marcos Ramos
PD: (Este es mi primer comentario que hago en un post, me gusta escribir pero, siento que pierdo el tiempo. Parece que me estoy comenzando a sentir parte de un grupo, sera que me estoy reconociendo como «desarrollador»?)
Yo entre, porque estoy implementando un API, y venia un ejemplo, el ejemplo venia con bootstrap, se ve muy profesional, completamente distinto a lo que yo hago, pero dije esto no es lo que quiero, algo plastificado de hule, no quiero, entonces leí este articulo y se me paso
Si eres bueno diseñas y programas con cualquier cosa.
Hoy en día la causa principal es el Trabajo, las empresas privadas que ofrecen trabajo a programadores. Todas las empresas necesitan tener una norma y hablar el mismo lenguaje. Porque cuando despidan a su programador y venga otro, éste tendra que acoplarse sin ningún problema. Por eso todas los sitios usan el mismo estilo, todos usan el mismo framework, todos usan getters y setters. Se esta volviendo en un estandar en la programación. Sin embargo ninguna gran empresa se basa en normas. Por ejemplo Pixar tiene su propio software de modelado 3D, el cual liberaron una parte a la comunidad. El problema viene cuando estos frameworks son descontinuados, ahi recien viene la interrogante y ahora que hacemos?.
«El problema viene cuando estos frameworks son descontinuados, ahi recien viene la interrogante y ahora que hacemos?»
En lo que entiendo quieres decir con esta frase no estoy de acuerdo.
Bueno, la entendería si un framework fuese un software, en sí; pero.. no lo es.
Al final, realmente un framework, ya ves lo que es..
No dejan de ser un puñado de «cosas» que ya se hacen sin ellos.
Las cuales puedes hacer a la perfección igualmente sin su ayuda.
Si quieres usarlos; simplemente debes cambiarlas el nombre.. que ellos dan por defecto; o cambiar la imagen… que ellos dan por defecto… y ya tendrás tu propio framework o librería o proyecto.. mucho más personalizado, ahorrándote un alto porcentaje de tiempo.
Con tus archivos 100% personalizados… Simplemente te ahorran tiempo… a cambio de dedicarles unas horas de estudio.
Al final no deja de ser, un poco lo que seguramente han hecho los primeros maquetadores web, estudiar en «plagio» de otras webs para llegar a dominarlas. . . y quién diga que no, miente o no se dedica a esto, ni tiene alma de ello; porque el actualizarse pasa por estudiar lo que hace el resto, para así; poder implementarlo tú, personalizándolo o dándole tu toque personal.
Siempre hay novedades, que por más que quieras.. tu no conseguirás sacar desde cero; y si por lo que sea las necesitaras… posiblemente sería una locura ponerte a hacerlo.
Por poder se puede hacer, pero….. No tendría sentido.
¿No nos podemos a codear nuestro propio servidor desde cero, a que no..?
¿Ni nuestros propios softwares, a que no…?
Y mucho menos, porque eso es.. ¿más.. personal.. o más «cool».. ?
El tema es que aquí, estas basando tu estudio en algo de lo cual tienes permiso para estudiarlo… y más allá, modificarlo y utilizarlo.
Mientras el código sea liberado, y de libre uso…. No debe porque haber problema.
Se podría decir, que en estos casos «ese descontinuado» sería equivalente a «privatizado»… y la solución sería, dar portazo y dejar la comodidad para desarrollar específicamente todo aquello que vayas necesitando.
Por ahora hay que estar altamente agradecidos, a todos estos proyectos; creo yo.
Tanto las personas que los utilicen, como las que no.
A todo nos beneficia.
A unos les facilita su trabajo «estandarizado» y a los otros; les sube la cache por personalizar más sus webs, si realmente son tan buenos que son capaces de personalizarlas más de lo que el resto de personas sean capaces de personalizar un framework; como para así, venderlas al mercado existente.
¿Qué problema existe entonces?
Todos felices.
PD: los 5 puntos en la entrada, con un poco de atención.. tiene fácil y sencillo arreglo; por no decir que a día de hoy, la propia gente de BS y la comunidad, les han dado solución…
Pues yo uso Bootstrap solo para algunas cosas.La ventaja de usarlo es que cuando vas a descargar los archivos Bootstrap la descarga te permite escoger solo los elementos necesarios a usar no tienes que descargar todo.Los únicos componentes que utilizo son Tabs,Modal y quizás DropDown,pero solo eso.Pienso que no todo debe estar basado en frameworks,si quieres aprender a maquetar.Si lo digo de ese modo es cuando quieras aprender html,css.Ademas el codigo css de Bootstrap es 100% personalizable. Ahí entro yo como un buzo en el mar.jajaja
Hola. Aunque en su momento estudié diseño y programación web, a día de hoy estoy bastante desconectado pero he leído un poco sobre bootstrap y me pareció entender algo así (con mi «palabros» así que disculpas si digo mucha burrada).
Interpreté que puedes crear una web con las distintas partes para cada página y rellenarla con el aspecto que has diseñado previamente.
Luego puedes configurar en la misma web de bootstrap los estilos y bajarte un archivo con los estilos que has definido (sin necesidad de usar los preestablecidos y todos los demás que no te hacen falta, por lo que entiendo que bajas menos líneas de código, pero a saber).
Lo que no sé es si le quieres agregar o transformar lo creado con bootstrap a plantilla de wordpress para poder administrar esa futura web, se hace igual que si se tratara de una web hecha sin framework como con framework. Es decir ¿hay que hacer algo diferente por tratarse de bootstrap?
Estoy retomando el tema porque necesito una web muy sencilla como portfolio y me llamó la atención bootstrap.
Saludos
Hay otra razón para no usar Bootstrap CSS: es una auténtica mierda.
y que utilizas? yo estoy usando PYTHON por que JS si que es una mierda ni siquiera es capaz de conectarse a una base de datos y tiene que valerse de otros lenguajes mientras que PYTHOn es mas potente y ofrece mejores soluciones para el procesamiento y calculo de informacion.
Para eso existe la minificación js, css y html para eliminar todo lo superfluo de tu código, utilizo bootstrap y tengo un tema multifuncional wordpress donde el tiempo de entrega a cliente y a medida es super rápido.
Un amigo que también trabaja de web design, me comentó que los que usan bootstrap son gente floja y vaga, eso me afecto puesto que yo estoy fijandome mucho en Bootstrap y actualmente estoy desarrollando un portafolio personal para usarla en un futuro.
La verdad no creo que bootstrap sea una mierda, y si, es bonito que tu hagas tus diseños con puro HTML y CSS. Pero es increible el Bootstrap logra unos diseños que yo no logro imitar bien!. Pero bueno
El post tiene algo de cierto pero la verdad no es tan cerrada y es que tu mismo eres el ejemplo de lo que ofrece bootstrap, para alguien con poco dominio en diseño grafico se le simplifica bastante.
Aunque para crear un portafolio y crear un mercado usar creaciones propias seria lo mas adecuado ya que tus propias creaciones puedes reutilizarlas y de esa forma tener tu propio estilo y en teoria seria tu propio framework que se adapte a tu forma de pensar y trabajar.
Amén!
Bootstrap es para GAYS PORTUGUESES, HAHAHA