Связаться
Магазин и доработка2024–2026

«Лавка Йонаса» – интернет-магазин доставки продуктов

Магазин на WordPress и WooCommerce: сделал его в 2024–2025 годах, а летом 2026-го доработал вход, оплату и оформление заказа.

Главная страница сайта lavka-jonasa.ru на экране MacBook
Главная страница. Сайт работает: lavka-jonasa.ru

01Задача

Добавить в работающий магазин вход по телефону, онлайн-оплату и данные, которые нужны курьеру, не останавливая продажи.

02Что сделано

  • Вход и регистрация по SMS в окне входа, без пароля
  • Онлайн-оплата через ЮKassa и оплата при получении
  • Страница успешного заказа с состоянием оплаты
  • Квартира, подъезд, этаж, домофон и время доставки в заказе для администратора
  • Личный кабинет покупателя
  • Защита форм и обработчиков, проверки кода перед каждой выкладкой

03Стек

WordPressWooCommercePHPTypeScriptЯндекс КартыDaDataЮKassa

04Октябрь 2026: ускорение магазина на телефоне

Главная на телефоне загружалась почти 6 секунд. Выяснил, что её тормозит, исправил и замерил работающий сайт до и после выкладки 20 октября.

Было

Главная, каталог и карточка товара грузились на телефоне 5–6 секунд и весили 3,5–4,1 МБ. Шрифт заголовков нёс японские иероглифы, около 1 МБ на каждое начертание. WordPress на этом хостинге запускался около 0,7 с на каждую страницу.

Что сделал

  • Урезал шрифты до латиницы и кириллицы: 3,4 → 0,25 МБ
  • Включил кэш готовых страниц для гостей: ответ за 0,07–0,12 с
  • Вдвое сократил запросы к базе: на главной 440 → 186
  • Заменил Swiper, IMask и Fancybox своим кодом: скрипты главной 67 → 14 КБ
  • Ужал логотипы брендов: картинку 1680×982 px показывали в окошке 109×64
  • Корзина и избранное отвечают на нажатие сразу: раньше каждое нажатие ждало сервер около секунды

Стало

Полная загрузка на телефоне: главная 5,89 → 1,16 с, каталог 5,00 → 0,98 с, товар 5,06 → 0,96 с, корзина 4,76 → 1,56 с. Страницы стали легче в 6–12 раз: главная 4,1 → 0,68 МБ, корзина 3,5 → 0,30 МБ. На компьютере главная загружается за 0,66 с вместо 1,90 с.

Как мерил: работающий сайт до и сразу после выкладки 20 октября 2026 года, экран 390 px, мобильный интернет Fast 4G, процессор в 4 раза медленнее компьютера, каждая страница с нуля, без кэша браузера. Один замер на страницу, поэтому разница меньше 10–15 % лежит в пределах погрешности. Корзину не кэширую: в ней личные данные покупателя. Поэтому её ответ сервера почти не изменился (0,82 → 0,90 с), а страница стала легче в 12 раз.

05Экраны на компьютере и телефоне

Снято с работающего сайта lavka-jonasa.ru в октябре 2026 года.

Сайт lavka-jonasa.ru на компьютере, первый экран Сайт lavka-jonasa.ru на компьютере, ниже по странице
Компьютер, 1440 px
Сайт lavka-jonasa.ru на телефоне, первый экран Сайт lavka-jonasa.ru на телефоне, второй экран
Телефон, 390 px

06Дизайн-система сайта

Цвета, шрифты, размеры, скругления и тени взяты из стилей lavka-jonasa.ru: имена токенов – как в коде.

Цвета

  • Фон--gray50#FCFCFCRGB 252 252 252
  • Текст--gray700#3D3D3DRGB 61 61 61
  • Акцент--raspberry500#7A0D53RGB 122 13 83
  • Вторичный--green500#68B06CRGB 104 176 108

Малиновый и лавандовый

  1. raspberry600#68093E
  2. raspberry500#7A0D53
  3. raspberry200#BA81A8
  4. lavender500#C3A6E0
  5. lavender200#E9E1F5
  6. lavender100#F9F6FC

Серые --gray*

  1. gray50#FCFCFC
  2. gray100#F7F8F8
  3. gray200#EAEAEA
  4. gray300#E3E3E3
  5. gray500#6C757D
  6. gray700#3D3D3D
  7. gray900#1F1416

Дополнительные

  1. orange500#FB6B31
  2. orange400#F89A54
  3. yellow500#FFD70A
  4. yellow400#FFE874
  5. green500#68B06C
  6. red500#D90429

Шрифты

Заголовки

M PLUS Rounded 1c

Начертания Regular, Medium, Bold и ExtraBold

  • Regular 400
  • Medium 500
  • Bold 700
  • ExtraBold 800

АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯабвгдеёжзийклмнопрстуфхцчшщъыьэюяABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 «»!?&@%

Текст

Roboto

Начертания Regular, Medium и Bold

  • Regular 400
  • Medium 500
  • Bold 700

АБВГДЕЁЖЗИЙКЛМНОПРСТУФХЦЧШЩЪЫЬЭЮЯабвгдеёжзийклмнопрстуфхцчшщъыьэюяABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 «»!?&@%

  1. .title._xxl28 / 1.5 · 800

    Лавка Йонаса

  2. .title._xl24 / 1.5 · 500

    Лавка Йонаса

  3. .title._lg21 / 1.5 · 500

    Съешь же ещё этих мягких французских булок

  4. .title._md18 / 1.5 · 500

    Съешь же ещё этих мягких французских булок

  5. p16 / 1.5 · 400

    Съешь же ещё этих мягких французских булок

Скругления и тени

  • $border_radius_sm4px
  • $border_radius_md8px
  • $border_radius_lg16px
  • $box_shadow_default0 2px 4px 0 rgba(0, 0, 0, 0.08)
  • $box_shadow_hover0 4px 8px 0 rgba(0, 0, 0, 0.12)
Похожий проект

Получите оценку похожего проекта за 2 рабочих дня

Доработка – от 2 000 ₽ в час, сначала бесплатная проверка сайта. Сопровождение – 15 000 ₽ в месяц.

Рассчитать стоимость
Ещё кейсы

Другие проекты

Все кейсы