Чеклист проверки вёрстки дизайнером

Сделаны все страницы и модули. Сверьтесь с макетами или ТЗ, что сделаны все нужные страницы, экраны, модули, всплывашки, формы. Не забудьте краевые ситуации, вроде экрана ошибки 404 и 500.

Сделаны все состояния. У элементов интерфейса бывают состояния: стили при наведении, дисейбл, ошибки в форме, состояние загрузки и подгрузки содержимого.

Проверьте состояния: погладьте курсором кнопки и ссылки, введите невалидные данные в форму и попробуйте отправить её с медленного интернета. Обратите внимание на согласованность состояний и их переходов: иногда по недосмотру скорость и плавность переходов и анимаций может отличаться в разных местах интерфейса.

Страницы, модули и состояния соответствуют макетам для разных размеров экрана. Часто дизайнеры рисуют макеты для «эталонных», самых распространённых размеров экрана: смартфона, планшета, ноутбука и компьютера. Проверьте, что на этих размерах всё соответствует макетам.

Страницы, модули и состояния не ломаются на нестандартных размерах экранов. Подвигайте ширину окна браузера, поверните смартфон набок, откройте сайт на огромном мониторе. Модули не должны обрезаться, налезать друг на друга, создавать нежелательную горизонтальную прокрутку страницы. Все ключевые функции и сценарии сайта должны быть доступны на любом размере экрана.

Сайт корректно выглядит и работает на разных устройствах. Проверьте страницы и сценарии на разных устройствах: чем больше, тем лучше. Программа минимум: свежий айфон, пятилетний айфон, не‑айфон, айпад, небольшой ноутбук, обычный офисный монитор.

Текстовое содержимое сайта свёрстано текстом, а не картинкой. Текст на картинке может быть не распознан и не проиндексирован поисковыми роботами, может не попасть в выдачу ИИ, не распознаться программами чтения с экрана и прочими парсерами. Картинки с текстом допускаются как иллюстрации, логотипы, декоративные элементы или осознанный и очень грубый флекс.

Вычищена вся «рыба» и тестовый контент. Лорем ипсум, левый текст, картинки‑заглушки, тестовые комментарии — ничего из этого не должно попасть в релиз, чтобы не опозориться перед клиентами или не влететь за нарушение авторских прав. Чем ближе наполнение к реальному, тем лучше. Попросите разработчика показать и проверьте тексты всех уведомлений и сообщений об ошибках, включая те, которые, по мнению разработчика, пользователь не увидит при нормальной работе сайта.

По возможности проверьте исходный код страниц и консоль Яваскрипта: иногда разработчики забывают там конфиденциальные данные, логины и пароли, оставляют неуместные шутки, комментарии, остатки старых версий кода и прочие нежелательные или небезопасные штуки.

Контактная информация актуальна. Проверьте правильность телефонов, мейлов, ссылок на соцсети, адресов, точек на карте, реквизитов юрлица в контактах и прочих контактных данных.