为什么Twitter Bootstrap使用像素字体大小? [英] Why does Twitter Bootstrap Use Pixels for Font Size?

查看:189
本文介绍了为什么Twitter Bootstrap使用像素字体大小?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

假设Twitter Bootstrap被设计为响应式/设备友好型,为什么不使用相对字体大小? 解决方案

好吧,他们似乎隐藏在浏览器缩放借口后面。真的很伤心看到这样一个使用率很高,影响力大的框架完全忽略了可访问性问题,并且是响应式设计的基础。他们处于重大责任的地位,不幸的是,似乎无意采取相应的行动。
$ b $ [更新]所以今天Mark Otto在我上面引用的线程上回复。可以预见的是,没有提及可访问性和pixel-perfect这个短语的用法:

lockquote
好​​吧,这里有一些背景过去的决定
和向前移动的计划。

像素提供绝对的控制和一贯的渲染每
浏览器。


设计师仍然主要以像素为单位进行思考和操作。

浏览器
现在可以放大整个页面,所以这不是输入
缩放或任何东西的问题。


历史上的嵌套ems是一个痛苦的事情,可能需要额外的数学计算/预期的像素值。

混合单位的测量是丑陋的,我内心的OCD讨厌它。
在行高中使用单位通常是不鼓励的,但是提供即时的
知识。我们可能会尝试在未来将
带走。
在未来,我们可能会使用ems来进行字体大小调整,甚至可能是rems,但是不能用于其他任何东西。对于输入的字体大小等,这也是有争议的。这不是如何建立像素完美的网站。

这有点全面,希望有足够的连贯性。我会试着在这些变化的博客上发表更多的内容,但是我不确定3.0有多接近,以及这些变化是什么。


我建议任何人对此有强烈的感受,并且+1 这个线程



[更新] V3路线图在 V2.3 release blogpost 没有提及添加对ems的支持。
$ b [更新]有关Bootstrap V3的更多信息,请参阅pull request

我们研究了在像素上使用rem单位,但没有发现
的好处,以抵消其使用的影响。 IE8仍然需要像素
后备,这是很多重复的代码行。此外,使用
遍布各处而不是像素会加剧这个问题。
混合rems和像素现在似乎没有任何意义。
但是,我们可以并将继续在将来的版本中对此进行评估。

最近(在其评论中):


我非常怀疑我们会在这个时候发货。改变
的一切 - 超出字体大小 - 是一个巨大的任务,并与
几个好处抵消。将字体大小
的代码行加倍,以任何其他方式支持rems似乎都很乏味。
表示,我们可以在以后的版本中重新访问。现在,我们是
坚持与像素。

由于对大量的Bootstrap特性不满意,其中是缺乏电子支持,我强烈建议寻找苏西,如果你只是想网格,或 Zurb基金会4 为整个辣酱玉米饼馅。不要让Bootstrap受欢迎影响你的判断力。任何人都可以用Bootstrap来构建一些东西,这正是它的问题 - 它是为那些Web用户体验最小的人设计的。只是因为世界上有很多麦当劳,并不意味着它是一个健康的地方吃。 这是一个愚蠢的事情要说。自从我写这篇文章以来,我已经使用了BS3,并且大大提高了它的游戏速度。我不应该做出这样的一次性评论,但是我仍然相信它在使用像素进行字体大小方面做出了一个糟糕的决定。除了可访问性问题,ems还有其他方面的用处。



[更新]看起来像rems 将在V4中受到支持此处):



对于接下来的那些,当我们放弃对IE8的支持时,我们可以从v4中的像素变成REM

[Update Feb'17] Bootstrap 4仍然在Alpha中,但显示使用rems in它的印刷术文档,但显示使用在其版面设计文档中使用。


Given that Twitter Bootstrap is designed to be responsive / device-friendly, why doesn't it use relative font sizes?

解决方案

Well it seems that they are hiding behind the browser zoom excuse. Really sad to see such a heavily used and influential framework completely ignore accessibility issues and a fundamental cornerstone of responsive design. They are in a position of great responsibility and unfortunately seem to have no intention of acting accordingly.

[Update] So today Mark Otto replied on the thread I referenced above. Predictably there is no mention of accessibility and use of the phrase 'pixel-perfect':

Okay, so here's a bit of a background on the decisions of yesteryear and plans for moving forward.

Pixels provide absolute control and consistent rendering across every browser.

Designers still mostly think and operate in pixels.

Browsers scale up entire pages these days, so it's not an issue with type scaling or anything.

Nesting ems historically has been a pain and can require extra math for figure computed/intended pixel values.

Mixing units of measurements is ugly and my inner OCD hates it. Using units on line-height is generally discouraged, but provides immediate knowledge of what the computed value is. We'll probably try to steer away from this in the future. In the future, we'll likely use ems for type sizing, perhaps rems even, but not for anything else. This is also debatable on font sizes for inputs and the like. It's just not how folks build pixel perfect sites.

That's a bit all over and hopefully coherent enough. I'll try to blog about these changes as they come up more, but I'm unsure how close 3.0 is and what that will all entail yet.

I would suggest anyone with strong feelings about this go and +1 this thread.

[Update] V3 roadmap oulined in V2.3 release blogpost makes no mention of adding support for ems.

[Update] Lots more information about Bootstrap V3 available in the pull request here including the following from Mark Otto:

We explored the use of rem units over pixels, but found little benefit to offset the implications of their use. IE8 would still need a pixel fallback, and that's a lot of duplicate lines of code. Moreover, using rems everywhere instead of pixels would exacerbate that problem. Mixing rems and pixels doesn't seem to make sense either right now. However, we can and will continue to evaluate this in future releases.

Then more recently (in its comments):

I highly doubt we'll be shipping with rems at this point. Changing everything—beyond font-sizes—is a huge task and one that comes with few benefits to offset that. Double the lines of code for font-sizes aside, supporting rems in any other way seems tedious at best. That said, we can always revisit in a future release. For now, we're sticking with pixels.

Having grown dissatisfied with a large number of Bootstrap's features, not least of which is it's lack of em-support, I strongly suggest looking at Susy if you just want grids, or Zurb Foundation 4 for the whole enchilada. Don't let Bootstrap's popularity cloud your judgement. Anyone can build something with Bootstrap, which is exactly its problem - it's designed for people with minimal web-experience. Just because there are lots of McDonalds' in the world doesn't mean it's a healthy place to eat.

[Edit] OK. This was a silly thing to say. Since I wrote this, I've used BS3 and it has upped its game considerably. I shouldn't have made such a throwaway comment, but I still believe that it has made a bad decision in using pixels for font-sizing. As well as accessibility issues, ems are useful in other ways.

[Update] Looks like rems will be supported in V4 (Mdo quoted from here):

For those following along, we'll be able to change from pixels to REMs in v4 when we drop IE8 support. Can't do much until then.

[Update Feb '17] Bootstrap 4 is still in Alpha, but shows use of rems in its Typography docs, but doesn't show use of rems in its layout docs.

这篇关于为什么Twitter Bootstrap使用像素字体大小?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆