«Воволга» — ресторан в селе Свердлово Конаковского округа Тверской области, на стрелке волжской косы. Французская кухня на русской основе, камерный зал на четырнадцать столов, летняя терраса, собственный причал, набережная и храм за окном.
Своего сайта у ресторана нет. Всё, что может узнать гость, — карточка в Яндекс.Картах и чужие обзоры в соцсетях. Для загородного ресторана, куда едут полтора часа из Москвы, это критично: решение о поездке принимают заранее и по картинкам.
Планка была поставлена так: сайт, какого нет ни у одного ресторана в округе. Это исключало типовой шаблон «о нас — меню — контакты».
Отдельная сложность была в материале. Из одиннадцати доступных фотографий семь вертикальные, а горизонтальные — мелкие. Широкоформатного героя строить не на чем, и вся композиция должна была вырасти из вертикалей.
Ещё одно условие — техническое: страницу отправляют ссылкой и файлом в мессенджере, где встроенный просмотрщик не выполняет скриптов. Значит, сайт должен работать вообще без JavaScript.
Расписание превращено в главный графический блок. Обычно часы работы — самая скучная строка на сайте ресторана. Здесь из них сделан фирменный элемент: две дорожки дня в одном масштабе, будни и выходные, с общим окном завтрака. Обе размечены по одной шкале в пятнадцать часов, час равен 6,67% ширины. Разница видна глазом за секунду, читать ничего не нужно.
Четыре цифры вместо абзаца о преимуществах. Четырнадцать столов, девять утра по выходным, сорок метров понтона, ноль ограничений для гостей с животными. Все четыре взяты из карточки заведения, ни одна не придумана.
Композиция от вертикалей. Раз горизонтальных кадров нет — макет строится сплитами, портретными карточками и высокими колонками. Тёмный фон отпал сразу: кремово-золотой интерьер на тёмном теряет и цвет, и объём. Сайт светлый, а фирменный синий работает как цвет текста вместо чёрного.
Палитра снята с самого заведения. Синий — с флага и вывески, зелёный — с мшистой кровли, кремовый — со скатертей, кирпичный — с фасада, золото — с бронзовых люстр. Ни одного придуманного цвета.
Знак не перерисован. Монограмма «В» с двумя волнами трассирована в вектор с фотографии заведения и стоит в шапке инлайновым SVG.
Ноль скриптов. Вопросы раскрываются нативным details, меню — якорные ссылки, дорожки дня — проценты в CSS. Тегов script в файле нет вообще.
Только проверенные факты. Дата освящения храма, звонница на тринадцать колоколов, главный колокол в семь тонн — сверены с сайтом Тверской епархии. Цен, среднего чека, депозитов, имён шефа и управляющей компании на сайте нет намеренно: подтверждения им не нашлось.
Типографика вынесена в сборку. Неразрывные пробелы после предлогов, между числом и единицей и перед тире, плюс склейка двух последних слов абзаца. Переносы проверяются автоматически: скрипт меряет последнюю строку каждого абзаца и печатает всё, что короче 22% ширины блока.
Одностраничный сайт на двенадцать секций, собранный в один автономный HTML на 1,55 МБ: десять фотографий и пять начертаний вшиты внутрь, ноль обращений к внешним сервисам. Адаптив доведён до 412 px.
Живая версия: dariaseehof.ru/vovolga
Честно о статусе: это демо-макет, сделанный по моей инициативе и отправленный заведению как предложение, а не сданный заказ. Внедрения нет — значит, не будет и цифр по броням, посещаемости или выручке. Любые такие цифры в подобном кейсе были бы выдуманы.
Что проверяемо: 12 секций, 10 фотографий и 5 начертаний в одном файле, 0 тегов script, 0 внешних запросов, нижняя граница адаптива 412 px, фирменный блок расписания на чистом CSS.
Что кейс показывает: я собираю сайт от фактуры и от материала, а не от шаблона — если фотографии вертикальные, макет строится под вертикали; если данные не подтверждаются, они не попадают на страницу. Дизайн и продакшн-код сделаны одним человеком.