Кейс: Розробка корпоративного сайту-візитки на чистому PHP для KVV Group (kvv-group.com)

Про проєкт

kvv-group.com — це офіційне цифрове представництво великого промислово-інвестиційного холдингу KVV Group, ключові напрямки діяльності якого охоплюють заготівлю та переробку металобрухту, будівництво, логістику та міжнародну металургію. Холдинг веде діяльність як в Україні, так і на європейському ринку.

Замість використання важких стандартних CMS, які перевантажують сервер та створюють сотні зайвих запитів, проєкт було реалізовано як легкий «самописний» сайт на чистому PHP.

Сайт складається з кількох лаконічних інформаційних сторінок зі стандартними контентними блоками. Головна перевага такого підходу – абсолютна чистота коду, блискавична швидкість роботи «з коробки» та можливість реалізувати нестандартні інтерактивні елементи без підключення сторонніх плагінів чи бібліотек.

Завдання, які стояли перед SebWeo:

1. Розробка архітектури на чистому PHP: Створення простого, надійного та швидкого каркаса сайту без прив’язки до великих систем керування (CMS).
2. Інтерактивна мапа представництв: Реалізація кастомної мапи України з клікабельними містами в розділі «Представництва» для зручної навігації філіалами.
3. Кастомна інтеграція Google Maps: Налаштування та оптимізація карти на сторінці «Контакти» без уповільнення загального рендерингу сторінки.
4. Максимальна оптимізація швидкості: Збереження природної легкості чистого PHP, вихід на рекордні показники в Google PageSpeed Insights.

Що було зроблено:

1. Чиста архітектура на PHP. Ми відмовилися від сторонніх движків та розгорнули сайт на чистому PHP. Сторінки збираються з модульних блоків на стороні сервера. Це забезпечило нульове навантаження на базу даних та миттєву генерацію HTML-коду. Сайт важить лічені кілобайти і віддається користувачеві без жодних затримок (ідеальний показник TTFB — Time to First Byte).
2. Інтерактивна мапа України («Представництва»). Головна фішка розділу — кастомна векторна мапа України. Ми реалізували її за допомогою легкого інтерактивного SVG-формату. Кожне місто є клікабельним елементом:

• При кліку користувач миттєво отримує інформацію про конкретне регіональне представництво, з можливістю прокласти маршрут.
• Оскільки це чистий вектор та мінімалістичний нативний JavaScript (Vanilla JS, ES6), мапа важить мінімум, ідеально масштабується на мобільних пристроях і не створює зсувів макета (повна стабільність CLS).

3. Оптимізація сторінки «Контакти» та Google Maps. Звичайне підключення Google Maps через стандартний iframe сильно «б’є» по швидкості завантаження сторінки через купу сторонніх скриптів Google. Ми реалізували ліниве завантаження карти: важкі скрипти Google Maps ініціалізуються та підтягуються лише тоді, коли сторінка повністю завантажилась, або коли користувач починає взаємодіяти з блоком контактів.

Інтеграції та технологічний стек:

• Бекенд: Чистий PHP — швидка серверна збірка сторінок.
• Фронтенд: Адаптивний HTML5 / CSS3 (Flexbox/Grid), SVG для графічних елементів та інтерактивної карти.
• Скрипти: Чистий, легкий Vanilla JavaScript (часткова відмова від jQuery та важких UI-бібліотек).
• API: Оптимізована інтеграція Google Maps API.

Результат

Для KVV Group було створено максимально легкий, швидкий та надійний сайт-візитку. Це високопродуктивний міжнародний вебпортал, який ідеально виконує іміджеву функцію холдингу. Завдяки розробці на чистому PHP та відмові від важких JS-фреймворків, сайт отримав максимальні 100 балів у тестах Google PageSpeed Insights. Інтерактивна мапа України та оптимізована карта Google Maps забезпечили користувачам зручний UX, зберігши технічну бездоганність та високу швидкість завантаження на будь-яких пристроях. Що повністю відповідає преміальному статусу великого бізнесу.