Какую технологию при верстке лучше использовать?

Question

[aivenreach]

Всем доброго времени суток. Какую технологию лучше использовать при адаптивной верстке? Mobile first или верстать сначала для десктопов?

Самому мне не очень понятна технология mobile first. Я так понимаю верстать страницу сначала нужно под низкие разрешения, а потом с помощью медиа запросов добавлять стили для более высоких разрешений.

Я правильно понимаю? Почему бы сразу не верстать под десктоп, а потом добавить медиа запросы для низких разрешений? Так ведь быстрее получится.

Answer 1

[Ivan Kuznetsov]

Если есть макет под все разрешения, включая мобильное, то можно Mobile-first. Иначе будет очень сложно. А смысл в том, чтобы на мобильных телефонах, на которых не будет работать media query - сайт отображался нормально и все это было быстрее

Comments

[aivenreach]

Хорошо, тогда если макет только под десктоп, а задача сделать адаптивную верстку, верстать нужно сразу под десктоп, а потом через медиа запросы корректировать верстку под моб девайсы?

[Ivan Kuznetsov]

Ну я делаю так, просто берете самые популярные разрешения и через медиа квери подстраиваете

[Сергей Протько]

meam: зачем подстраивать под разрешения конкретные? Взять минимум и ресайзить страницу пока не будет некрасиво - поправить что бы было красиво - ресайзим дальше. В хром дев тулз есть например эмуляция экранов разных с разной плотностью пикселов и т.д. - там удобненько можно это дело тестить.

Answer 2

[Alexander Mischuk]

Люк Вроблевски написал отличную книгу "Сначала мобильные". Рекомендую к прочтению.
Как Вы могли знать уже, то один из существенных минусов адаптивной разработки это большой избыточный код, который негативно влияет на отображение страниц в мобильных устройствах из-за медленного(что чаще всего и бывает) инет-соединения.
Верстка от мобильных устройств подразумевает то, что вы верстаете от минимальной ширине к максимальной, тем самым отсекая часть не нужного кода. Верстая же от десктопа Вы используете max-width и в таком случае планшеты и мобильные получают лишний неиспользуемый код.
Только это всё теория и как сказал meam верстать сначала для мобильных может быть очень сложно, если нет готовых макетов и дизайн изначально подразумевает основную версию - десктопную. В таком случае нужно начинать верстать от десткопа, используя по максимуму резины, чтобы свести к минимуму медиа-запросы.
Подводя итоги: Если проект нацелен, в основном, на мобильные устройства, то 100% нужно верстать mobile first.

Answer 3

[Елизавета Борисова]

Учесть, что важнее для продукта. Если продукт mobile-first, то стоит проработать эту версию лучше (в первую очередь)

Answer 4

[Сергей]

Советую прочитать очень хорошую статью в тему «Кроссплатформенный интерфейс и интерфейс под платформу»