Веб-разработка — доступен для новых проектов

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

Создаю современные, быстрые и адаптивные сайты для бизнеса.

Смотреть проекты Обсудить проект

Веб-разработкаИнтерфейсыСкорость

03 — избранных проекта HTML · CSS · JavaScript Листайте

01 Работы

Избранные работы

Три проекта, которые показывают мой подход к дизайну и разработке.

Автомобили / Детейлинг

Главный экран сайта VELAR DETAIL: тёмная страница детейлинг-студии с крупным заголовком и кнопкой записи

VELAR DETAIL

Премиальный сайт детейлинг-студии с услугами, галереей работ, блоком Before / After и формой записи.

Роль
Дизайн и разработка
Стек
HTML · CSS · JavaScript
Год
2026
Открыть сайт
Блок Before / After на сайте VELAR DETAIL с интерактивным слайдером сравнения фотографий
Before / After — интерактивное сравнение
Мобильная версия сайта VELAR DETAIL на экране смартфона
Мобильная версия

Ресторан / Гостеприимство

SHAFRAN

Современный сайт ресторана с акцентом на атмосферу, меню, фотографии и бронирование.

Роль
Дизайн и разработка
Стек
HTML · CSS · JavaScript
Год
2026
Открыть сайт
Главный экран сайта ресторана SHAFRAN с полноэкранной фотографией и заголовком
Мобильная версия сайта ресторана SHAFRAN на экране смартфона
Раздел меню на сайте SHAFRAN с фотографиями блюд и ценами
Меню с категориями
Галерея интерьера и блюд на сайте ресторана SHAFRAN
Галерея

Архитектура / Бюро

Главный экран сайта ATLAS ARCHITECTS с крупной архитектурной фотографией и заголовком

ATLAS ARCHITECTS

Премиальный сайт архитектурного бюро, разработанный мной с нуля.

Слайдер сравнения на сайте ATLAS ARCHITECTS: слева архитектурный чертёж, справа построенное здание
Чертёж Постройка
Роль
Дизайн и разработка
Стек
HTML · CSS · JavaScript
Языки
RU / EN
Год
2026
Открыть сайт Смотреть код
Сетка проектов на сайте ATLAS ARCHITECTS с крупными архитектурными фотографиями
Редакционная сетка проектов
Мобильная версия сайта ATLAS ARCHITECTS на экране смартфона
Мобильная версия

02 О себе

Делаю сайты,
а не шаблоны.

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

Каждый проект пишу вручную: без конструкторов и тяжёлых шаблонов.

  • 01АдаптивностьОдинаково аккуратно на телефоне, планшете и мониторе.
  • 02СкоростьСжатые изображения, свои шрифты, ни одной лишней библиотеки.
  • 03SEO-готовностьСемантическая разметка, мета-теги и Schema.org с первого дня.
  • 04Современный UIПродуманная типографика и композиция вместо готового шаблона.

Стек

Возможности

  • 01HTML5Семантическая вёрстка
  • 02CSS3Grid · Flexbox · Анимации
  • 03JavaScriptVanilla, без фреймворков
  • 04Адаптивная вёрстка320 → 1440+
  • 05ИнтерфейсыUI и композиция
  • 06GitВерсионирование
  • 07GitHubХостинг и публикация
  • 08SEOMeta · OG · Schema.org
  • 09СкоростьВес, изображения, шрифты
  • 10ДоступностьКлавиатура · контраст · ARIA

03 Процесс

Как я работаю

  1. 01

    Обсуждение

    Понимаю задачу, бизнес и цели проекта.

  2. 02

    Дизайн

    Продумываю структуру, композицию и визуальный стиль.

  3. 03

    Разработка

    Создаю адаптивный сайт и интерактивные элементы.

  4. 04

    Тестирование

    Проверяю мобильную версию, скорость, accessibility и корректность работы.

  5. 05

    Запуск

    Подготавливаю сайт к публикации.

Почему

Сделано для бизнеса.

Современный дизайн

Сайт выглядит актуально и профессионально.

Адаптивность

Корректная работа на компьютере, планшете и телефоне.

Скорость

Чистый код и внимание к скорости загрузки.

04 Контакты

Нужен сайт
для бизнеса?

Расскажите о своей задаче — обсудим, какой сайт подойдёт вашему бизнесу.

Начать проект

Прямой контакт

Отвечаю на звонки, в WhatsApp, на письма и в Telegram.

Отвечаю в течение рабочего дня. Если удобнее в мессенджере — напишите в Telegram или WhatsApp.

Автомобили / Детейлинг — 2026

VELAR DETAIL

Премиальный сайт детейлинг-студии: услуги, цены, галерея работ, блок Before / After и форма записи.

Открыть сайт
Главный экран сайта VELAR DETAIL

01

Проект

Одностраничный сайт детейлинг-студии. Задача — показать уровень услуг и довести посетителя до записи. Тёмная «автомобильная» подача, тёплый золотой акцент, крупная типографика.

02

Задача

Детейлинг продают результатом, а результат трудно объяснить текстом. Нужно было построить страницу так, чтобы посетитель сначала увидел разницу «до / после», а потом дошёл до формы записи.

03

Подход

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

Блок Before / After с интерактивным слайдером на сайте VELAR DETAIL

04

Возможности

  • Интерактивный слайдер Before / After
  • Блок услуг и прозрачный прайс
  • Форма записи с валидацией
  • Мобильное меню и адаптив от 320px
Раздел услуг на сайте VELAR DETAIL с карточками услуг и переходом к прайсу

05

Технологии

  • HTML5
  • CSS3
  • JavaScript
  • CSS Grid
  • Flexbox
  • GitHub Pages

06

Результат

Готовый сайт опубликован на GitHub Pages и доступен по прямой ссылке. Открывается на десктопе и мобильном, все интерактивные элементы работают без сторонних библиотек.

Открыть сайт

Ресторан / Гостеприимство — 2026

SHAFRAN

Современный сайт ресторана с акцентом на атмосферу, меню, фотографии и бронирование.

Открыть сайт
Главный экран сайта ресторана SHAFRAN

01

Проект

Сайт ресторана восточной кухни. Полноэкранная фотография, тёплая тёмная палитра, разделы «О ресторане», «Меню», «Галерея», «Бронирование» и «Контакты».

02

Задача

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

03

Подход

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

Раздел меню на сайте SHAFRAN

04

Возможности

  • Меню с категориями и фотографиями блюд
  • Галерея интерьера и подачи
  • Форма бронирования с валидацией
  • Липкая навигация и мобильное меню

05

Технологии

  • HTML5
  • CSS3
  • JavaScript
  • WebP + srcset
  • Локальные variable-шрифты
  • GitHub Pages

06

Результат

Сайт опубликован на GitHub Pages. Изображения отдаются в WebP в нескольких размерах, шрифты подключены локально подмножествами latin + cyrillic — страница остаётся лёгкой даже при большом количестве фотографий.

Открыть сайт

Архитектура / Бюро — 2026

ATLAS ARCHITECTS

Премиальный сайт архитектурного бюро, разработанный мной с нуля.

Открыть сайт Смотреть код
Главный экран сайта ATLAS ARCHITECTS

01

Проект

Сайт архитектурного бюро — лонгрид с разделами о бюро, проектами, услугами, процессом и командой. Двуязычный интерфейс RU / EN, монохромная палитра, строгая сетка.

02

Задача

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

03

Подход

Редакционная сетка, много воздуха, сдержанная анимация. Центральная идея — слайдер «Чертёж → Постройка»: посетитель сам переводит проект из чертежа в готовое здание.

Слайдер «Чертёж → Постройка» на сайте ATLAS ARCHITECTS

04

Возможности

  • Двуязычный интерфейс RU / EN
  • Слайдер «Чертёж → Постройка»
  • Анимированная статистика
  • FAQ-аккордеон с корректной клавиатурной работой
Полный список технических особенностей
  • Адаптивная вёрстка и мобильная навигация
  • Плавная прокрутка и навигация с клавиатуры
  • Поддержка prefers-reduced-motion
  • Accessibility: aria-атрибуты, состояния фокуса, контраст
  • SEO: мета-теги, Open Graph, Schema.org
  • sitemap.xml и robots.txt
  • Оптимизация изображений под разные экраны

05

Технологии

  • HTML5
  • CSS3
  • JavaScript
  • i18n (RU / EN)
  • Schema.org
  • Open Graph
  • Netlify
  • GitHub

06

Результат

Сайт опубликован, исходный код открыт на GitHub. Самый редакционный и самый технически насыщенный из трёх проектов: двуязычность, интерактивный слайдер и полный набор SEO- и accessibility-настроек.

Открыть сайт Смотреть код