Как измерять размеры при верстке с PSD шаблона?

Здравствуйте. Я только начинаю изучать front-end, решил попробовать сверстать HTML to PSD и сразу же наткнулся на один неприятный момент, объяснение которого так и не нашел ни на тостере, нигде:

Когда делаю замеры с шаблона и прописываю в CSS эти размеры в пикселях, то верстка получается большой для монитора моего ноута и приходится масштабировать страницу до приемлемых размеров. Это так и должно быть? В видеоуроках и текстовых гайдах прописывают все в пикселях и не парятся, но при этом момент масштабирования никто не затрагивает, может потому что у них мониторы больше и все нормально отображается, но я не уверен в этом. Можно, конечно указывать ширину в процентах, тогда размеры (по ширине) подстраиваются под размеры монитора, высота, конечно тоже подстраивается под размеры монитора и получается полная фигня. Что делать в этом случае?

Ну и главный вопрос: если, например, заказчик попросил сверстать HTML to PSD, не предъявляя требований к резиновой верстке, то можно не париться, брать размеры из шаблона и пиксель в пиксель переносить в CSS? Или не так?
  • Вопрос задан
  • 3561 просмотр
Решения вопроса 1
IonDen
@IonDen Куратор тега CSS
JavaScript developer. IonDen.com
То что верстка получается большой для вашего ноута - это нормально. Многие дизайнеры сейчас рисуют здоровенные макеты рассчитанные на большие экраны.

Да так и есть. Если верстка резиновая или адаптивная, то это отдельно обговаривается и кроме того дизайнер еще и рисует варианты для других разрешений экрана.
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
littleguga
@littleguga
Не стыдно не знать, а стыдно не интересоваться.
1. Я верстаю, используя vh/vw. Вычисляю их исходя из пикселей.(1 vh = 1/100 высоты окна)
Они прекрасно работают в IE9+(именно vh/vw, без vmax/vmin). proof
2. Делайте несколько версий по размерам экрана. Шагами, например.
3. Про заказчика - на мой взгляд - лучше обговорить этот момент и предупредить, что за адаптивную верстку + к цене. Но нормальные заказчики понимают, что есть меньшие размеры экрана и сразу это учитывают. (кидают несколько шаблонов и т.д)
Ответ написан
@kabashowlab
Ну и главный вопрос: если, например, заказчик попросил сверстать HTML to PSD, не предъявляя требований к резиновой верстке, то можно не париться, брать размеры из шаблона и пиксель в пиксель переносить в CSS? Или не так?

Тип верстки лучше сразу уточнять у заказчика, во избежании дальнейшего недопонимания.
Меня часто просят верстать пиксель в пиксель. Пользуюсь для этого pixel perfect. Гемороя больше, но получается прям тютелька в тютельку :)
У нас например работает дизайнер который тоже сразу делает дизайны, под разные разрешения, ну а дальше уже дело техники. Побольше опыта, читайте книжки. Все получится.
Ответ написан
gmax007
@gmax007
Лучше не пикселями делать а процентами, вот зайдет заказчик со своего айфона, посмотрит на сайт и скажет что все плохо. Я допустим делал простой сайт левый сайд бар 25%, середина 50%. правый сайд бар 25%. Аналогично и со всеми другими блоками. А для маленьких экранов убирал сайдбар вниз под контент, а второй вообще убирал
Ответ написан
указывайте размеры в пикселях ТОЛЬКО для конкретных объектов, для всего остального есть %, em и т.п.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы