Контрольные точки для сеток?

Question

[kiberlain]

Прочёл очередную статью с броским названием "На 100% правильный способ делать контрольные точки в CSS". В ней автор выложил свой список брекпойнтов

@mixin for-phone-only {
  @media (max-width: 599px) { @content; }
}
@mixin for-tablet-portrait-up {
  @media (min-width: 600px) { @content; }
}
@mixin for-tablet-landscape-up {
  @media (min-width: 900px) { @content; }
}
@mixin for-desktop-up {
  @media (min-width: 1200px) { @content; }
}
@mixin for-big-desktop-up {
  @media (min-width: 1800px) { @content; }
}

он провёл исследование и результат выложил в виде такой вот картинки



я в очередной раз подумал - а почему во многих фреймворках эти списки так кардинально отличаются от тех же что в бутстрапе например? Неужели не могу какой-то единый стандарт выработать?

Answer 1

[xmoonlight]

Я бы по сеткам отталкивался от необходимости реструктуризации интерфейса на заданной площади, а не от каких-то там стандартов или рекомендаций: всё зависит от конкретного проекта.

Comments

[kiberlain]

то есть вы сетку или список контрольных точек выбираете исходя из тз проекта? А что если в тз сказано "Штобы сматрелася нармальна на всех устройствах"?

[GreatRash]

kiberlain: Вы привели пример хренового ТЗ.

[Ankhena]

kiberlain: Точки ставлю в местах "слома" интерфейса, а не по устройствам. Так получает точно на всех размерах хорошо.
Да, сложнее. Да, точек больше. Да, голова должна работать.

[kiberlain]

Ankhena W: то есть вручную пишите все медиа запросы и сетку почти не используете, верно?

[Ankhena]

kiberlain: верно

[xmoonlight]

kiberlain: банальный пример: у меня меню - колесо вращения по центру, а контент - в углах описанного квадрата вокруг этого колеса.
Сетка говорите?!) Ну-Ну)))

Answer 2

[zooks]

30em, 48em, 64em