В общем, сверстал заказчику макет (не адаптивная, а обычная вёрстка), PixelPerfect пройден, всё идеально, но! Он говорит, что нужно оптимизировать изображения под все Retina дисплеи (ну, я так понял, под формат 2х2 пикселей). Всё это круто, но как это сделать? Потому что раннее с ними никогда не работал. Есть только изображения в макете, половина SVG, половина PNG-JPEG, что с ними делать,как их оптимизировать под Retina? Использую препроцессор LESS.
А вот с обычными картинками нужно.
1. Представьте себе квадрат 100х100 пикселей
2. В обычной ситуации вы вставите в него картинку 100х100 пикселей и все прекрасно
3. Но! На ретина экранах эта картинка будет выглядеть ужасно размыто и пикселизовано.
4. Чтобы этого избежать - вам нужно вставить в этот квадрат картинку 200х200 пикселей, но ширину и высоту задать по прежнему 100 пикселей (или если это фон, сделать background-size: cover;)
5. Примерно так в кратце это выглядит.
Средний
