Kayzen Web
Сайт агентства — его первая рекомендация: его проверяют строже, чем сайты клиентов.
- Год
- 2026
- Разработка
- непрерывное улучшение
- Стек
- React · Vite · Tailwind · TypeScript · Vercel
- Стратегия
- Дизайн-система
- Разработка
- SEO
- Доступность
- Тексты
- доступность в Lighthouse
- 100/100
- SEO в Lighthouse
- 100/100
- маршрутов, пререндеренных при сборке
- 79
- задокументированных проектов, у каждого — свой кейс
- 37
Какую задачу нужно было решить.
Контекст
kayzen-lyon.com — витрина агентства: 79 пререндеренных маршрутов, в том числе 21 страница услуг, 4 географические страницы, публичная сетка тарифов, журнал изменений, страница технического стека и открытая дизайн-система.
Ограничение
Веб-студию оценивают по её собственному сайту раньше, чем по проектам. Любой недочёт — средняя оценка производительности, недостаточный контраст, невалидные структурированные данные — становится аргументом против неё. Поэтому сайт должен был выдерживать техническую проверку требовательного клиента.
Решение
Мы сделали публичным то, что агентства обычно скрывают: тарифы, стек, дизайн-систему и журнал изменений с перечнем исправлений самого сайта. Прозрачность служит двум целям — она успокаивает клиента и обязывает нас держать планку.
Показатели на момент сдачи.
Оценки Lighthouse для сайта в рабочей среде. Мы публикуем их как есть: если какая-то оценка низкая, её причина и план исправления описаны ниже, а не замалчиваются.
Каждое решение — и его причина.
Задокументированная публичная дизайн-система
Цветовые токены, плавная типографская шкала, четыре уровня теней, единый вертикальный ритм. Страница /design-system показывает их. Видимая система — система, которая не расползается.
Весь контраст измерен
Каждая пара цветов рассчитана. Рамки полей достигают 3:1, кольцо фокуса отвязано от цвета действия, чтобы оставаться видимым на цветной кнопке, а градиентный текст заменён сплошными заливками.
Только анимации появления
Никаких бесконечных циклов, кроме индикатора загрузки: постоянная нагрузка на GPU, батарея и вестибулярный дискомфорт. Системная настройка уменьшения движения соблюдается строго.
Палитра проекта
Тёмно-синий
#1F3B61
Заголовки, структура
Терракота
#B7481F
Действие — 5,3:1 на белом
Белый
#FFFFFF
Поверхность страницы
Холодный серый
#F8FAFC
Чередующиеся разделы
Типографическая система
Заголовки
Outfit 800
Основной текст
Plus Jakarta Sans 400
Два вариативных семейства на собственном сервере, с font-display: optional — никаких сдвигов вёрстки при загрузке.
Что внутри.
- React
- Vite
- Tailwind
- TypeScript
- Vercel
Все маршруты пререндерятся при сборке
SPA отдаёт один и тот же HTML по всем URL: постраничные метаданные невидимы для любого робота, который не выполняет JavaScript. Скрипт пререндеринга обходит каждый маршрут и записывает полный HTML-файл — заголовок, описание, канонический URL, Open Graph, JSON-LD.
Сборка не проходит при дефекте
Сборка завершается ошибкой, если у маршрута нет метаданных, если страница 404 теряет noindex, если изображение превышает 1440 px, если CSP устарела или если пометка «заполнить» попадает в итоговый HTML. Предохранители надёжнее бдительности.
Разбиение по маршрутам
Каждая страница — отдельный чанк, включая главную. Странице с правовой информацией незачем скачивать библиотеку анимации главной страницы.
Как сайт становится находимым.
Одна точка входа на одно намерение
17 страниц услуг и 4 географические страницы, каждая нацелена на отдельный запрос. Ни одна не является вариацией ключевых слов другой: это разный контент.
Согласованные структурированные данные
Organization, LocalBusiness, ProfessionalService, WebSite, WebPage и BreadcrumbList, связанные через @id. Противоречивые дубликаты удалены — две конкурирующие цепочки «хлебных крошек» на одном URL лучше, чем ни одной, но ненамного.
Никаких самоприсвоенных оценок
aggregateRating удалён: оценки, которые компания ставит себе сама, запрещены правилами Google и грозят ручными санкциями. Мы предпочитаем потерять звёздочку, а не домен.
Удобно для всех.
С июня 2025 года Европейский акт о доступности (European Accessibility Act) требует цифровой доступности для значительной части онлайн-сервисов. Мы закладываем её на этапе проектирования, а не исправляем задним числом.
100/100 в Lighthouse — и ручной аудит
Ссылка для пропуска навигации, фокус, перемещаемый и объявляемый при каждой смене маршрута, сенсорные цели по 44 px, режим повышенной контрастности, режим OLED и шрифт для людей с дислексией — в отдельной панели.
Что было сдано.
- Главная
- 17 страниц услуг
- 4 географические страницы
- Портфолио и 37 кейсов
- Тарифы, субсидии, квиз, запись на встречу
- Стек, дизайн-система, журнал изменений
- Юридические страницы
Ход проекта.
Дизайн-система
Токены, контрасты, типографская шкала, тени.
Контент
17 услуг, 4 зоны, публичные тарифы.
Техническое SEO
Пререндеринг, структурированные данные, sitemap, предохранители сборки.
Непрерывное улучшение
Последовательные аудиты, зафиксированные в публичном журнале изменений.
О чём нас часто спрашивают.
Другие проекты
Соответствие GDPR & SaaSKonsent by Kayzen
Разработчик баннеров, который сам же их проверяет, — судья в собственном деле: независимость и была продуктом.
Наступательная кибербезопасность & SaaSSentinel by Kayzen
Продавать продукт безопасности инженерам: каждое утверждение должно было быть доказуемым.
Данные & МетеосервисMétéo Climat France
358 индексируемых страниц, анимированная карта на 72 срока — и ни одной строчки фреймворка.
Тот же уровень требований — для вашего сайта.
Бесплатный аудит вашего текущего сайта, смета в течение 24 часов и письменное обоснование — такое же, как то, что вы только что прочитали. Оплата в три этапа без переплаты; местные программы поддержки проверяются до подписания.