особая техника создания структуры HTML-кода, которая позволяет сверстанному HTML-шаблону максимально точно совпадать с оригинальным макетом пиксель в пиксель. При наложении HTML-шаблона на макет PSD должно произойти полное совпадение графических элементов, изображений и текста.
Как проверить верстку Pixel Perfect
Если вы ищете подрядчика, лучше на стадии техзадания уточнить требование работать Pixel Perfect. Проверить результат такой работы несложно.
Для этого скачайте специальный плагин для вашего браузера:
- Pixel Perfect для Firefox;
- Pixel Perfect под Google Chrome;
- WellDoneCode — кроссбраузерный.
Алгоритм работы примерно одинаков для всех плагинов:
- Сохраните оригинальный PSD-макет в формате .png. Это можно сделать через Photoshop или прямо в Figma.
- Откройте сверстанный HTML-шаблон в браузере.
- С помощью плагина наложите на него второй слой — свой макет в .png.
- Посмотрите и зафиксируйте разницу.
Далее вы сможете исправить ошибки или поставить такую задачу верстальщику.
Много полезного
в нашем блоге
МЫ собрали для вас самые полезные сервисы, которые упростят работу с сайтом и помогут сделать его удобнее для пользователей.
- 300
- 1 мин
Любое учреждение культуры предоставляет услуги. Значит, оно должно давать пользователям возможность выразить свое мнение о заведении. Это может быть баннер или ссылка, ведущие на сайт системы оценки качества услуг.
- 121
- 5 мин
Что скрывается за понятием “Ведение контекстной рекламы”, так как часто сталкиваюсь с непониманием, из чего складываются трудоемкость этой услуги, что в нее входит и зачем она нужна.
- 149
- 10 мин
При расчете стоимости на наши профильные продукты, где опыт и компетенция нашей команды позволяет получить результат быстро и с первого раза, мы применяем ставку часа специалиста в 3000 рублей.
- 210
- 4 мин
Как сформировать УТП, если у вас похожий продукт с конкурентами: те же технологии, то же оборудование, те же цены и сроки доставки?
- 81
- 5 мин
В статье подробно рассматриваются основные типы файлов обмена, такие как, import.xml, offers.xml, orders.xml, prices.xml, rests.xml, их назначение и содержание
- 130
- 7 мин