Здравствуйте. Я только начинаю изучать front-end, решил попробовать сверстать HTML to PSD и сразу же наткнулся на один неприятный момент, объяснение которого так и не нашел ни на тостере, нигде:
Когда делаю замеры с шаблона и прописываю в CSS эти размеры в пикселях, то верстка получается большой для монитора моего ноута и приходится масштабировать страницу до приемлемых размеров. Это так и должно быть? В видеоуроках и текстовых гайдах прописывают все в пикселях и не парятся, но при этом момент масштабирования никто не затрагивает, может потому что у них мониторы больше и все нормально отображается, но я не уверен в этом. Можно, конечно указывать ширину в процентах, тогда размеры (по ширине) подстраиваются под размеры монитора, высота, конечно тоже подстраивается под размеры монитора и получается полная фигня. Что делать в этом случае?
Ну и главный вопрос: если, например, заказчик попросил сверстать HTML to PSD, не предъявляя требований к резиновой верстке, то можно не париться, брать размеры из шаблона и пиксель в пиксель переносить в CSS? Или не так?
То что верстка получается большой для вашего ноута - это нормально. Многие дизайнеры сейчас рисуют здоровенные макеты рассчитанные на большие экраны.
Да так и есть. Если верстка резиновая или адаптивная, то это отдельно обговаривается и кроме того дизайнер еще и рисует варианты для других разрешений экрана.
Николай Петюх: не нужно обманывать людей. Половина юзеров давно сидит на планшетах где как раз и присутствуют ретина дисплеи во всей своей красе. С выходом Win 10 и приходом нормального масштабирования на винду многие винбуки так же потянутся в эту область, как это сделали макбуки.
К тому же не нужно путать размер макета с его заточкой под ретину. Абсолютно разные вещи.
Денис Инешин: буквально пару месяцев назад вертал макет такого горе-дизайнера. На мой вопрос, чем пользователи недорогих ноутбуков заслужили счастье иметь горизонтальный скролл на этом замечательном сайте, был ответ: "не думал,что у кого-то еще такие древние мониторы". Пришлось дать ему вот эту ссылку: www.liveinternet.ru/stat/ru/resolutions.html
1. Я верстаю, используя vh/vw. Вычисляю их исходя из пикселей.(1 vh = 1/100 высоты окна)
Они прекрасно работают в IE9+(именно vh/vw, без vmax/vmin). proof
2. Делайте несколько версий по размерам экрана. Шагами, например.
3. Про заказчика - на мой взгляд - лучше обговорить этот момент и предупредить, что за адаптивную верстку + к цене. Но нормальные заказчики понимают, что есть меньшие размеры экрана и сразу это учитывают. (кидают несколько шаблонов и т.д)
Ну и главный вопрос: если, например, заказчик попросил сверстать HTML to PSD, не предъявляя требований к резиновой верстке, то можно не париться, брать размеры из шаблона и пиксель в пиксель переносить в CSS? Или не так?
Тип верстки лучше сразу уточнять у заказчика, во избежании дальнейшего недопонимания.
Меня часто просят верстать пиксель в пиксель. Пользуюсь для этого pixel perfect. Гемороя больше, но получается прям тютелька в тютельку :)
У нас например работает дизайнер который тоже сразу делает дизайны, под разные разрешения, ну а дальше уже дело техники. Побольше опыта, читайте книжки. Все получится.
А можно подробней, пожалуйста. Допустим есть макет с шириной 1920px, в нем кнопки, паддинги, шрифты. Что из этого нужно задавать относительно, а что фиксировано? Например я задаю ширину в 100%, и на моем мониторе 1440px, он растягивается, но если я задам кнопке размер, скажем в 400px, то она займёт треть экрана, а на макете то все нормально у неё.
Простой
