Jump to content
  • 0

Что значит вверстка под pixelperfect ?


Alexej
 Share

Question

9 answers to this question

Recommended Posts

  • 0

Значит все элементы на странице у вас должны располагаться точно так же как и в макете. С точностью до пикселя.
Если есть отступ на макете в 17 пикселей, он и должен быть 17px, не 15, не 20, а именно 17. Если элемент, по логике, должен стоять по ценртру, а на макете он немного смещен, то и нужно делать его с таким же смещением.

Есть мнение что большинство заказчиков сами не знают что это такое, но слышали что это круто.

Link to comment
Share on other sites

  • 0

В этом перфект пикселе много странностей...
Были несколько проектов где перфект пиксель для них было очень важно...
Так приходилось даже у текстов подгонять letter-spacing, и то сходилось не полностью, т.к. рендер шрифтов в вебе и псд макетах не был одинаков...

Link to comment
Share on other sites

  • 0
44 минуты назад, vladmih сказал:

В этом перфект пикселе много странностей...
Были несколько проектов где перфект пиксель для них было очень важно...
Так приходилось даже у текстов подгонять letter-spacing, и то сходилось не полностью, т.к. рендер шрифтов в вебе и псд макетах не был одинаков...

еще и разные браузеры по разному рендерят их =( 

6 часов назад, AlexZaw сказал:

Значит все элементы на странице у вас должны располагаться точно так же как и в макете. С точностью до пикселя.
Если есть отступ на макете в 17 пикселей, он и должен быть 17px, не 15, не 20, а именно 17. Если элемент, по логике, должен стоять по ценртру, а на макете он немного смещен, то и нужно делать его с таким же смещением.

Есть мнение что большинство заказчиков сами не знают что это такое, но слышали что это круто.

Вот у меня такая ситуация. В ТЗ заказчик написал по БЭМ React + PixelPerfect. И самое главное что бэм как бы должен убирать копи паст но из за PP приходится одинковым блокам разные модификаторы прописывать просто потому что в макете дизайнер у заголовоков и обзацах разный отступ указал, - это нормально вообще так делать ?  

Link to comment
Share on other sites

  • 0
2 часа назад, Alexej сказал:

это нормально вообще так делать

Если разница в отступах не заметна на глаз или не сильно заметно, то пинайте за это дизайнера, если дизайнер левый или нет возможности связаться с ним - попробуйте поговорить с заказчиком и объяснить ему что это увеличивает время верстки, размер кода.
Если разница заметна на глаз то, опять же укажите на это заказчику, возможно он этого не видел. Если же заказчика все устраивает то попробуйте выбить из него побольше денег ссылаясь на то что одинаковые блоки и должны выглядеть одинаково, а pixel perfect подразумевает собой общее расположение блоков, а не небрежность/криворукость дизайнера при дизайне отдельных элементов ? Если заказчик далек от темы веба то такой вариант может прокатить ?

Вообще, на мой взгляд, это не совсем правильно, если конечно это не фишка дизайна которая согласована, а именно небрежность которая не придает дизайну шарма а режет глаз.
Да, и еще,  для Pixel Perfect макет должен быть подготовлен идеально (каждый отступ и размер шрифта логически обоснован)

 

2 часа назад, Alexej сказал:

еще и разные браузеры по разному рендерят их =( 

Вот это тоже стоит объяснить заказчику, если будут расхождения в верстке из-за шрифтов

Edited by AlexZaw
  • Like 1
Link to comment
Share on other sites

  • 0
Цитата

 а pixel perfect подразумевает собой общее расположение блоков, а не небрежность/криворукость дизайнера при дизайне отдельных элементов ? Если заказчик далек оттемы веба то такой вариант может прокатить ?

Мне нравится что вы написали выше. Но не могли бы вы подсказать статейку про PP где все это объясняется уже подробнее. Везде одно и то же в интернете и стоящий материал не находил (возможно плохо искал). 
 

Цитата


Вообще, на мой взгляд, это не совсем правильно, если конечно это не фишка дизайна которая согласована, а именно небрежность которая не придает дизайну шарма а режет глаз.

Нет, никакой изюминки в моем случае в дизайне, просто один и тот же блог а именно как часто бывает в дизайне есть заголовок и наверху заголовка есть полоска + звезда, и это расстояние везде по разному где то 25 где то 27.9px а где то 31px и разумеется макет не соответствует PixelPerfect'у.    

Цитата

Да, и еще,  для Pixel Perfect макет должен быть подготовлен идеально (каждый отступ и размер шрифта логически обоснован)

В моем случает там курица лаппой все сделано. И заказчик как я понял не имеет возможности связаться с дизайнером.  

 

Link to comment
Share on other sites

  • 0
3 минуты назад, Alexej сказал:

где все это объясняется уже подробнее.

Да везде говорится что верстка pixel perfect это максимальное приближение к макету. Если вы хотите найти какие-то стандарты где расписано что это делается вот так, а это вот так, то такого просто не существует. Все руководствуются здравым смыслом и возможностями самих браузеров.

7 минут назад, Alexej сказал:

В моем случает там курица лаппой все сделано. И заказчик как я понял не имеет возможности связаться с дизайнером

Тут либо пробовать объяснить заказчику что это выглядит криво и не симметрично, и такая верстка займет больше времени и будет больше занимать объема, а следовательно медленнее грузится сайт, что скажется на его рейтинге (а это уже весомый аргумент ? ), либо, если заказчик упертый, смириться. Если заказчик человек адекватный он поймет что вся эта кривизна в дизайне не от большого ума дизайнера, а как раз наоборот ?

  • Like 1
Link to comment
Share on other sites

  • 0
1 час назад, AlexZaw сказал:

Да везде говорится что верстка pixel perfect это максимальное приближение к макету. Если вы хотите найти какие-то стандарты где расписано что это делается вот так, а это вот так, то такого просто не существует. Все руководствуются здравым смыслом и возможностями самих браузеров.

Тут либо пробовать объяснить заказчику что это выглядит криво и не симметрично, и такая верстка займет больше времени и будет больше занимать объема, а следовательно медленнее грузится сайт, что скажется на его рейтинге (а это уже весомый аргумент ? ), либо, если заказчик упертый, смириться. Если заказчик человек адекватный он поймет что вся эта кривизна в дизайне не от большого ума дизайнера, а как раз наоборот ?

Спасибо придется образумить заказчика. 

Но вот все равно не совсем понятно- вы правы везде пишут про максимальное соответствие макету но есть же вещи которые нельзя соответствовать  макету - где про эти вещи почитать подробнее я про это имел ввиду. 

Link to comment
Share on other sites

  • 0
5 часов назад, AlexZaw сказал:

Держите ссылочки, это конечно не совсем то что вы просили, но какое то представление даст:

https://habr.com/post/220681/
https://blog.sibirix.ru/2018/04/17/perfect-psd/

Спасибо обязательно почитаю как время будет!

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy