Верстка дизайна сайта по макету
Превращаем макет в рабочие страницы: пиксель в пиксель, корректно на телефонах и без потери скорости загрузки.
Хороший макет ещё не гарантирует хорошего сайта. Между картинкой в Figma и работающей страницей лежит вёрстка, и именно на ней чаще всего теряется качество: на десктопе всё аккуратно, а на телефоне блоки наезжают друг на друга, кнопки не нажимаются пальцем, текст уходит за край экрана.
Вторая типичная потеря — скорость. Макет свёрстан буквально, изображения вставлены в исходном размере, шрифтов подключено пять начертаний, скриптов подключено больше, чем нужно. Красивая страница грузится четыре секунды, и половина посетителей с мобильного интернета её не дожидается.
Качественная вёрстка — это соответствие макету на всех размерах экрана, корректная работа в разных браузерах, разумные размеры изображений, доступность с клавиатуры и для скринридеров, семантичная разметка, которую понимает поисковик. Всё это не видно на скриншоте, но определяет, будет сайт работать или только выглядеть.
Мы верстаем по макету с проверкой на реальных разрешениях — от узких телефонов до широких мониторов, — оптимизируем изображения и шрифты и подключаем вёрстку к нужной CMS. Результат проверяем замерами скорости и корректности, а не на глаз.