Главная / События, кейсы, проекты / 07.08.2026

Экспертная оценка вёрстки: когда сайт уже работает, но его можно сделать заметно лучше

Мы не переделывали сайт. Смотрели на него глазами разработчика, который привык отвечать за качество каждой детали.

Иногда заказчику не нужен новый сайт и не требуется полностью переписывать существующую вёрстку. Ему нужно другое — понять, насколько качественно уже выполнена работа.

В таких случаях к нам обращаются за независимой экспертной оценкой вёрстки.

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

Именно такие детали мы и разбирали.

Что оценивали

Мы смотрели не только на то, «похоже ли на макет». В оценку вошли:

визуальная целостность интерфейса;
типографика;
размеры и межстрочные интервалы;
отступы и расстояния между элементами;
единообразие карточек;
```
gap
```
,
```
padding
```
,
```
border-radius
```
;
вертикальное выравнивание;
работа с изображениями;

композиция и кадрирование фотографий;
элементы формы;
состояния полей;
маска телефона;
сообщения об ошибках;
HTML/CSS-реализация;
мелкие детали типографики — кавычки, тире, неразрывные пробелы и т.д.

На первый взгляд часть этих вещей кажется незначительной.

Но именно из них в конечном итоге складывается ощущение качества сайта.

Например, можно было просто оставить как есть

Карточки работали, но элементы внутри них находились на немного разном уровне. Где-то текст визуально «плавал», где-то отличались внутренние отступы, у похожих блоков были разные радиусы, а расстояния между элементами не образовывали единой системы.

Для отдельного блока это почти незаметно.

Когда таких расхождений на странице десятки, сайт начинает выглядеть менее аккуратно. Поэтому в рекомендациях мы обращаем внимание не на отдельную цифру в CSS, а на системность:

Одинаковые компоненты должны вести себя одинаково.

Если у карточек одинаковая роль — у них должна быть единая логика внутренних отступов, радиусов, расстояний и расположения контента.

Иногда достаточно одной строки CSS

Например, в одном из блоков требовалось всего лишь правильно выровнять содержимое по вертикали:

.features__row {
    align-items: center;
}

Или в соседней карточке прижать текст к нижней границе:

margin-top: auto;

Это несложные технические решения.

Но заметить где именно возникает визуальный дисбаланс и почему — уже вопрос опыта.

Типографика — тоже часть разработки

Отдельно обратили внимание на текст.

Например:

«Ежедневно с 09:00 – 21:00»

лучше привести к нормальной типографической и логической записи:

«Ежедневно с 9:00 до 21:00»

или:

«Ежедневно 9:00–21:00»

То же касается кавычек, дефисов, тире, неразрывных пробелов и других «мелочей».

Это может показаться придиркой.

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

Где уже начинается не вёрстка, а UX

Отдельно посмотрели на формы. Здесь недостаточно просто сделать несколько input и кнопку. Важно, чтобы:

поля имели одинаковую внутреннюю геометрию;
расстояния между ними были согласованы;
поле и кнопка визуально различались;
незаполненное обязательное поле было заметно;

сообщение об ошибке было понятным и аккуратным;
стандартные браузерные сообщения не разрушали внешний вид интерфейса;
телефонная маска помогала пользователю правильно заполнить номер.

То есть проверяется уже не только как сверстано, но и как этим будет пользоваться человек.

И ещё одна важная вещь — не всё нужно добавлять

В некоторых местах мы, наоборот, рекомендовали убрать элементы.

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

После её удаления смысл не потерялся. Наоборот — интерфейс стал легче.

Это один из принципов, которым мы сами стараемся руководствоваться:

Если элемент ничего не добавляет пользователю — возможно, он не нужен.

Не каждый визуальный эффект делает интерфейс лучше.

В итоге

По результатам просмотра мы сформировали список из 25 конкретных рекомендаций — от небольших CSS-корректировок до вопросов типографики, UX и визуальной системы проекта.

При этом задача экспертизы была не найти виноватого и не доказать, что предыдущий разработчик сделал всё неправильно.

Вёрстка была рабочей.

Наша задача была другой:

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

Почему мы вообще этим занимаемся

За годы работы с веб-проектами взгляд на вёрстку постепенно меняется. Сначала ты смотришь:

«Работает? Не ломается? Похоже на макет?»

Потом начинаешь замечать:

«Почему здесь этот отступ отличается?»

А ещё позже уже автоматически видишь:

«Здесь нарушена система. Этот компонент ведёт себя не так, как остальные. Здесь типографика выбивается. Здесь фотографию можно кадрировать иначе. А вот это вообще можно убрать».

Именно этот опыт и становится экспертизой. Поэтому сегодня нас приглашают не только создавать и развивать сайты, но и оценивать уже выполненную веб-разработку.

Т-Дизайн — экспертная оценка веб-вёрстки и интерфейсов

Если сайт уже сделан, но есть сомнения в качестве реализации — необязательно сразу всё переделывать.

Иногда достаточно независимого профессионального взгляда, чтобы понять, что действительно стоит исправить, а что можно оставить как есть.

События, новости

Все услуги