¿Por qué Twitter Bootstrap usa píxeles para el tamaño de fuente?

Dado que Twitter Bootstrap está diseñado para ser receptivo / amigable con el dispositivo, ¿por qué no usa tamaños de fuente relativos?

Pues parece que se esconden detrás de la excusa del zoom del navegador . Es realmente triste ver que un marco tan influyente y tan utilizado ignora por completo los problemas de accesibilidad y una piedra angular fundamental del diseño receptivo. Se encuentran en una posición de gran responsabilidad y, lamentablemente, no parecen tener intención de actuar en consecuencia.

[Actualización] Así que hoy Mark Otto respondió en el hilo que mencioné anteriormente. Como era de esperar, no se menciona la accesibilidad y el uso de la frase 'píxeles perfectos':

Bien, aquí hay algunos antecedentes sobre las decisiones de antaño y los planes para seguir adelante.

Los píxeles proporcionan un control absoluto y una representación coherente en todos los navegadores.

Los diseñadores todavía piensan y operan principalmente en píxeles.

Los navegadores escalan páginas enteras en estos días, por lo que no es un problema con el escalado de tipos ni nada.

Anidar ems históricamente ha sido una molestia y puede requerir matemáticas adicionales para los valores de píxeles calculados / previstos de la figura.

Mezclar unidades de medida es feo y mi TOC interior lo odia. El uso de unidades en la altura de la línea generalmente no se recomienda, pero proporciona un conocimiento inmediato de cuál es el valor calculado. Probablemente intentaremos alejarnos de esto en el futuro. En el futuro, probablemente usemos ems para el tamaño de tipografía, quizás incluso rems, pero no para nada más. Esto también es discutible sobre los tamaños de fuente para entradas y similares. No es así como la gente crea sitios perfectos con píxeles.

Eso ha terminado un poco y, con suerte, lo suficientemente coherente. Intentaré escribir en un blog sobre estos cambios a medida que surjan más, pero no estoy seguro de qué tan cerca está 3.0 y qué implicará todo eso todavía.

Sugeriría a cualquiera que tenga sentimientos fuertes sobre esto que haga +1 en este hilo .

[Actualización] La hoja de ruta de la V3 incluida en la publicación de blog de la versión V2.3 no menciona la adición de soporte para ems.

[Actualización] Hay mucha más información sobre Bootstrap V3 disponible en la solicitud de extracción aquí, incluida la siguiente de Mark Otto:

Exploramos el uso de unidades rem sobre píxeles, pero encontramos pocos beneficios para compensar las implicaciones de su uso. IE8 todavía necesitaría una reserva de píxeles, y eso es una gran cantidad de líneas de código duplicadas. Además, usar rems en todas partes en lugar de píxeles agravaría ese problema. Mezclar rems y píxeles tampoco parece tener sentido en este momento. Sin embargo, podemos y continuaremos evaluando esto en futuras versiones.

Luego, más recientemente (en sus comentarios):

Dudo mucho que enviemos con rems en este momento. Cambiar todo, más allá de los tamaños de fuente, es una tarea enorme y tiene pocos beneficios para compensar eso. Dejando de lado el doble de las líneas de código para los tamaños de fuente, admitir rems de cualquier otra manera parece tedioso en el mejor de los casos. Dicho esto, siempre podemos volver a visitarlo en una versión futura. Por ahora, nos quedamos con píxeles.

Habiendo crecido insatisfecho con una gran cantidad de características de Bootstrap, una de las cuales es la falta de compatibilidad con em, le sugiero encarecidamente que mire a Susy si solo desea cuadrículas, o Zurb Foundation 4 para toda la enchilada. No dejes que la popularidad de Bootstrap empañe tu juicio. Cualquiera puede construir algo con Bootstrap, que es exactamente su problema: está diseñado para personas con una experiencia web mínima. El hecho de que haya muchos McDonalds en el mundo no significa que sea un lugar saludable para comer.

[Editar] Aceptar. Fue una tontería decir esto. Desde que escribí esto, he usado BS3 y ha mejorado su juego considerablemente. No debería haber hecho un comentario tan descabellado, pero sigo creyendo que ha tomado una mala decisión al usar píxeles para el tamaño de fuente. Además de los problemas de accesibilidad, los ems son útiles de otras formas.

[Actualización] Parece que rems será compatible con V4 (Mdo se cita desde aquí ):

Para aquellos que sigan adelante, podremos cambiar de píxeles a REM en v4 cuando dejemos de admitir IE8. No puedo hacer mucho hasta entonces.

[Actualización de febrero de 2017] Bootstrap 4 todavía está en Alpha, pero muestra el uso de rems en sus documentos de tipografía , pero no muestra el uso de rems en sus documentos de diseño .

No dejes que la popularidad de Bootstrap empañe tu juicio. Cualquiera puede construir algo con Bootstrap, que es exactamente su problema: está diseñado para personas con una experiencia web mínima. El hecho de que haya muchos McDonalds en el mundo no significa que sea un lugar saludable para comer.

Podrías argumentar para no dejar que eso empañe tu juicio de una manera negativa. Es un marco sólido y si se molesta en invertir tiempo en cómo usarlo de manera efectiva, la mayor parte de su argumento cae en la cabeza.

Si bien a menudo lo usan personas con una experiencia mínima, y ​​no hay nada de malo en eso, también lo usan personas con mucha experiencia.

Al menos, es una herramienta de creación de prototipos invaluable. En el mejor de los casos, es completamente personalizable. Puede seleccionar y elegir, modificar, agregar, razón por la cual se llama "marco".

Lo he estado usando de manera efectiva en algunos de mis proyectos durante más de dos años; es tan simple como usted desea. He usado solo el marco de formulario, solo las cuadrículas, todo el código base y lo he personalizado para satisfacer mis necesidades. De muchas maneras, ha 'mejorado' mi juego, llevándome más al preprocesamiento, usando variables, perfeccionando la forma en que estructura los proyectos.

Sí, hay algunos problemas. pxpara tamaños de fuente y el uso de Less son dos. Sin embargo, debido a que es completamente de código abierto, puede encontrar opciones para remediar ambos fácilmente.

Investigué Foundation y me gustó lo que vi, pero estoy en la desafortunada posición de tener que soportar IE8, como muchos desarrolladores. Foundation ha abandonado el soporte para IE8, por lo que no puedo hacerlo. A pesar de esto, no estoy a punto de despedir a todo un framework, más específicamente, algo que es libre de usar y libre de modificar basa únicamente en unos pocos temas!

Diablos, en un proyecto, levanté partes de Foundation y partes de Bootstrap y agregué mi propio código personalizado: esa es la belleza del código abierto.

Si aún prefiere Bootstrap con soporte em y rem, puede echar un vistazo a esto: https://github.com/ivayloc/twbs-rem-em, no es necesario realizar ningún cálculo para convertir píxeles en unidades rem o em, no hay acumulación en @mixinseste - @include rem(property, values)- también repliegue a px y por em conversión puede utilizar em(value).

Si bien utilizo Bootstrap ampliamente, hay algunas áreas en las que la accesibilidad pasa a un segundo plano. Supongo que hay compensaciones inevitables con una plataforma que se usa tanto.

Entiendo completamente por qué han optado por retener píxeles para el tamaño de fuente. Los problemas de herencia con los em para las fuentes de un framework son una pesadilla total.

rems son una opción alternativa, pero la compatibilidad con el navegador sigue siendo problemática.

Puede crear su propia mezcla de rems y reemplazar cada línea de menos que usa la variable de tamaño de fuente base.

Esa es la belleza de bootstrap, y marcos similares, es una base sólida desde la que trabajar.

Sí, he mencionado que hay elementos para el arranque de Twitter que no son tan accesibles; un pequeño ejemplo, el uso de 'display: none' en lugar de usar clip. Estoy bastante seguro de que hay una razón válida para esto, y nuevamente, puede modificar esto muy fácilmente si lo desea.

Bootstrap no es perfecto, pero dudo que alguna vez se pretendiera que fuera la respuesta final a todos sus requisitos. Es una base, un 'bootstrap', apréndalo y utilícelo correctamente, agréguelo, mezcle todo; al menos, es un marco increíble para crear prototipos o para crear un sitio rápido. Yendo más allá, hay una base realmente sólida que se puede aplicar a cualquier sitio web.

Creo que se debe al primer enfoque del escritorio. Twitter Bootstrap es un enfoque amigable con la capacidad de respuesta, pero de "degradación elegante".