Учитывая, что Twitter Bootstrap разработан, чтобы быть отзывчивым / удобным для устройств, почему он не использует относительные размеры шрифтов?
Учитывая, что Twitter Bootstrap разработан, чтобы быть отзывчивым / удобным для устройств, почему он не использует относительные размеры шрифтов?
Ответы:
Что ж, похоже, они прячутся за предлогом увеличения масштаба браузера . Действительно грустно видеть, что такая широко используемая и влиятельная структура полностью игнорирует проблемы доступности и является фундаментальным краеугольным камнем адаптивного дизайна. Они несут большую ответственность и, к сожалению, не собираются действовать соответственно.
[Обновление] Итак, сегодня Марк Отто ответил на тему, на которую я ссылался выше. Как и ожидалось, здесь нет упоминания о доступности и использования фразы «безупречный пиксель»:
Хорошо, вот небольшая предыстория прошлогодних решений и планов на будущее.
Пиксели обеспечивают абсолютный контроль и согласованный рендеринг во всех браузерах.
Дизайнеры по-прежнему в основном думают и работают в пикселях.
В наши дни браузеры масштабируют целые страницы, поэтому это не проблема с масштабированием типа или чем-то еще.
Вложение em исторически было проблемой и может потребовать дополнительных математических вычислений для вычисленных / предполагаемых значений пикселей.
Смешивать единицы измерения некрасиво, и мое внутреннее ОКР ненавидит это. Использование единиц измерения в строке высоты обычно не рекомендуется, но дает немедленную информацию о вычисленном значении. Мы, вероятно, постараемся избежать этого в будущем. В будущем мы, скорее всего, будем использовать em для определения размера шрифта, возможно, даже rems, но не для чего-либо еще. Это также спорно на размеры шрифта для входов и тому подобное. Просто не так люди создают сайты с идеальным пикселем.
Это немного закончено и, надеюсь, достаточно связно. Я постараюсь писать в блоге об этих изменениях по мере их появления, но я еще не уверен, насколько близко 3.0 и что все это повлечет за собой.
Я бы посоветовал всем, у кого есть сильные чувства по этому поводу, пойти и +1 к этой теме .
[Обновление] В дорожной карте V3, изложенной в блоге о выпуске V2.3, не упоминается о добавлении поддержки ems.
[Обновление] Дополнительная информация о Bootstrap V3, доступная в запросе на перенос, включая следующую информацию от Марка Отто:
Мы исследовали использование единиц rem вместо пикселей, но не обнаружили особой пользы, компенсирующей последствия их использования. IE8 все равно потребуется резервный пиксель, а это много повторяющихся строк кода. Более того, использование повсюду rems вместо пикселей усугубит эту проблему. Смешивать ремы и пиксели сейчас тоже не имеет смысла. Однако мы можем и продолжим оценивать это в будущих выпусках.
Затем совсем недавно (в его комментариях):
Я очень сомневаюсь, что сейчас мы будем поставлять бэмы. Изменение всего, помимо размеров шрифта, - это огромная задача, которая дает мало преимуществ для ее компенсации. Не считая удвоения строк кода для font-sizes, поддержка rems любым другим способом кажется в лучшем случае утомительной. Тем не менее, мы всегда можем вернуться к нему в будущем выпуске. А пока мы придерживаемся пикселей.
Разочаровавшись в большом количестве функций Bootstrap, не в последнюю очередь из-за отсутствия поддержки em, я настоятельно рекомендую взглянуть на Susy, если вам просто нужны сетки, или на Zurb Foundation 4 для всей enchilada. Не позволяйте популярности Bootstrap омрачить ваше мнение. Любой может создать что-то с помощью Bootstrap, и в этом его проблема - он разработан для людей с минимальным опытом работы в сети. То, что в мире много McDonalds, не означает, что это здоровое место, где можно поесть.
[Редактировать] ОК. Это было глупо. С тех пор, как я написал это, я использовал BS3, и это значительно улучшило его игру. Я не должен был делать такой однозначный комментарий, но я все еще считаю, что он принял плохое решение, используя пиксели для изменения размера шрифта. Помимо проблем с доступностью, em полезны и по другим причинам.
[Update] выглядит как бэр будет поддерживаться в V4 (МДО цитировал здесь ):
Для тех, кто следит за этим, мы сможем перейти с пикселей на REM в версии 4, когда мы откажемся от поддержки IE8. До тех пор ничего не могу сделать.
[Обновление, февраль '17] Bootstrap 4 все еще находится в альфа-версии, но показывает использование rems в своей документации по типографии , но не показывает использование rems в документации по макету .
emдля таких людей требуется, следовательно, «доступность».
Не позволяйте популярности Bootstrap омрачить ваше мнение. Любой может создать что-то с помощью Bootstrap, и в этом его проблема - он разработан для людей с минимальным опытом работы в сети. То, что в мире много McDonalds, не означает, что это здоровое место, где можно поесть.
Вы можете возразить, чтобы это не омрачило ваше суждение. Это прочная основа, и если вы потрудитесь потратить время на то, чтобы использовать ее эффективно, большая часть ваших аргументов падает на нее.
Хотя его часто используют люди с минимальным опытом - и в этом нет ничего плохого - он также используется людьми с большим опытом.
По крайней мере, это бесценный инструмент для создания прототипов. В лучшем случае его можно полностью настроить. Вы можете выбирать, изменять и добавлять - вот почему это называется «фреймворком».
Я эффективно использую его в некоторых своих проектах более двух лет - он настолько прост, насколько вы хотите. Я использовал только структуру форм, только сетки, всю кодовую базу и настроил ее в соответствии со своими потребностями. Во многих отношениях это «улучшило» мою игру, продвинуло меня дальше в препроцессинге, использовании переменных, оттачивая способ структурирования проектов.
Да, есть некоторые проблемы. pxдля размеров шрифта и использования Less - два. Однако, поскольку это полностью открытый исходный код, вы можете легко найти варианты, чтобы исправить оба этих недостатка.
Я исследовал Foundation, и мне понравилось то, что я увидел, но я нахожусь в неудачном положении, поскольку мне приходится поддерживать IE8, как и многие разработчики. Foundation отказалась от поддержки IE8, что сделало его бесполезным. Несмотря на это, я не о том, чтобы закрыть всю структуру, наиболее конкретно то , что это бесплатно использовать и бесплатно , чтобы модифицируют исключительно на основе нескольких вопросов!
Черт возьми, в одном проекте я поднял части Foundation и части Bootstrap и добавил свой собственный код - в этом прелесть открытого исходного кода.
Если вы по-прежнему предпочитаете Bootstrap с поддержкой em и rem, вы можете взглянуть на это - https://github.com/ivayloc/twbs-rem-em нет необходимости производить какие-либо вычисления для преобразования пикселей в единицы rem или em, есть построить в @mixinsтечение этого - @include rem(property, values)- также запасной вариант для рх и эм Convertion вы можете использовать em(value).
Хотя я широко использую Bootstrap, есть несколько областей, где доступность уходит на второй план. Я предполагаю, что с платформой, которая так широко используется, неизбежны компромиссы.
Я полностью понимаю, почему они решили сохранить пиксели для размера шрифта. Проблемы с наследованием em для шрифтов фреймворка - настоящий кошмар.
rems - альтернативный вариант, но поддержка браузером по-прежнему проблематична.
Вы можете создать свой собственный миксин rems и заменить каждую строку less, в которой используется переменная базового размера шрифта.
В этом прелесть бутстрапа - и подобных ему фреймворков - это прочная основа для работы.
Да, я упомянул, что есть элементы для начальной загрузки twitter, которые не так доступны - один небольшой пример, использование display: none вместо использования clip. Я чертовски уверен, что для этого есть веская причина - и опять же, вы можете легко изменить это, если хотите.
Bootstrap не безупречный, но я сомневаюсь, что он когда-либо был задуман как окончательный ответ на все ваши требования. Это основа - «бутстрап» - изучите ее и используйте ее должным образом, добавьте к ней, смешайте все это - по крайней мере, это отличный фреймворк для прототипирования или быстрого создания сайта. Если пойти дальше, есть действительно прочная основа, которую можно применить к любому веб-сайту.