Как наложить PSD макет на свою вёрстку?

Question

[Максим Калинин]

Как проверить расположение элементов, размеры и т.д. своей вёрстки? Чтоб наглядно увидеть несоответствия. Переключать окно браузера со своей вёрсткой и окно с Photoshop'ом неудобно, может есть другие способы?

Comments

[Ernest Fayzullin]

наверняка есть плагин для Chrome. Но это не точно

[Сергей delphinpro]

css.yoksel.ru/adaptive-pixel-perfect
https://www.npmjs.com/package/pixel-glass

[Максим Калинин]

Ernest Fayzullin: пользуюсь Оперой

Answer 1

[Николай Каргин]

Сделайте скриншот всей страницы (плагины легко гуглятся), скопируйте в буфер обмена, вставьте в документ с версткой и подберите прозрачность слоя +-50%.

Answer 2

[Евгений]

perfect pixel вроде называется для хрома плагин

Answer 3

[Sergey]

Можно использовать расширение для браузера PerfectPixel

Comments

[Максим Калинин]

Там нужно макет в виде картинки, как его получить из PSD макета?

[Sergey]

Да, должна быть картинка. В фотошопе Файл - Сохранить как и выбираешь формат jpg или png (если ты об этом), потом загружаешь эту картинку в расширение, центрируешь по горизонтали (кнопка <=>) и всё, можно верстать.