1. Загальна інформація
• Назва проєкту: Оптимізація швидкості та мобільної версії сайту VIDI Marine
• Посилання на сайт: https://vidi-marine.com/ua/
• Основні завдання:
• Оптимізація швидкості завантаження сторінок.
• Впровадження AMP (Accelerated Mobile Pages) для мобільної версії.
• Покращення SEO, структурованих даних та внутрішньої перелінковки.
• Оптимізація зображень для зменшення часу завантаження.
• Валідація сайту відповідно до Google Core Web Vitals.
2. Оптимізація швидкості завантаження сайту
Аналіз проблем:
• Велика кількість зовнішніх JS-скриптів сповільнює завантаження.
• Некешовані ресурси та великі зображення.
• Відсутність затриманого завантаження (lazy loading) для зображень та відео.
Рішення:
• Видалити або відкласти завантаження необов’язкових JS-скриптів (asynchronous / defer loading).
• Впровадити lazy loading для всіх зображень та відео.
• Використовувати кешування статичних ресурсів через .htaccess або відповідний плагін (якщо сайт на CMS).
• Оптимізувати CSS, об’єднавши кілька файлів у один (мінімізація через CSS Minify).
• Використовувати CDN (Cloudflare, BunnyCDN) для швидшого завантаження контенту.
• Впровадити стиснення зображень у формат WebP.
✅ Очікуваний результат: Підвищення оцінки Google PageSpeed Insights до 85+.
3. Впровадження AMP (Accelerated Mobile Pages)
Аналіз проблем:
• Сайт не використовує AMP, що уповільнює завантаження на мобільних пристроях.
• Поточний код містить заборонені скрипти, несумісні з AMP.
Рішення:
• Створити AMP-версію для головних сторінок (головна, категорії товарів, картки товарів, блог).
• Використати AMP-компоненти:
• <amp-img> – для зображень.
• <amp-video> – для відеоконтенту.
• <amp-carousel> – для слайдерів.
• <amp-sidebar> – для мобільного меню.
• Оптимізувати стилі (inline CSS, не більше 75 KB).
• Використовувати AMP-форму для зворотного зв’язку.
• Валідувати AMP-версію через AMP Validator.
✅ Очікуваний результат: Сторінки AMP повністю проходять перевірку Google та швидше завантажуються на мобільних пристроях.
4. Покращення SEO та структурованих даних
Аналіз проблем:
• Відсутня структурована розмітка schema.org для товарів.
• Мета-теги не оптимізовані (довжина заголовків/описів перевищує рекомендовані межі).
• Відсутня логічна внутрішня перелінковка.
Рішення:
• Додати структуровану розмітку schema.org для товарів, категорій та статей блогу.
• Оптимізувати meta title та description на всіх сторінках.
• Впровадити хлібні крихти (breadcrumbs) для покращення навігації.
• Додати відкриті графи (Open Graph, Twitter Cards) для коректного відображення в соцмережах.
• Внутрішня перелінковка:
• Додати блок “Схожі товари” на сторінках товарів.
• Додати блок “Читайте також” у блозі.
✅ Очікуваний результат: Покращення SEO-рейтингу та зростання органічного трафіку.
5. Оптимізація зображень
Аналіз проблем:
• Важкі PNG/JPG зображення без стиснення.
• Відсутня адаптація під мобільні пристрої.
Рішення:
• Конвертувати всі зображення у формат WebP.
• Використовувати responsive images (srcset) для адаптивного завантаження.
• Оптимізувати великі зображення через TinyPNG або автоматичні компресори.
✅ Очікуваний результат: Менше навантаження на сервер, швидше завантаження сторінок.
6. Впровадження Google Core Web Vitals
Аналіз проблем:
• Поганий LCP (Largest Contentful Paint) – довге завантаження основного контенту.
• Високий CLS (Cumulative Layout Shift) – зміщення елементів на сторінці.
Рішення:
• Зменшити розмір шрифтів та стилів, використовуючи font-display: swap.
• Відкласти завантаження непотрібних ресурсів (async та defer для скриптів).
• Додати фіксовані розміри для всіх зображень, банерів та відео, щоб уникнути зміщення контенту.
• Використовувати preload для найважливіших ресурсів (шрифти, логотипи).
✅ Очікуваний результат: Покращення LCP, FID, CLS для відповідності Google Core Web Vitals.
7. Тестування та перевірка
• Валідація AMP через AMP Validator.
• Перевірка швидкості сайту через Google PageSpeed Insights.
• Тестування Core Web Vitals у Google Search Console.
• Перевірка SEO через Ahrefs / Screaming Frog.
8. Терміни виконання
• Аудит сайту: 2-3 дні.
• Оптимізація швидкості: 7-10 днів.
• Впровадження AMP: 10-14 днів.
• SEO-оптимізація: 5-7 днів.
• Фінальне тестування та виправлення багів: 3-5 днів.
• Загальний термін виконання: 20-30 днів.
9. Вимоги до виконавця
• Досвід роботи з AMP та оптимізацією швидкості сайтів.
• Розуміння SEO та Core Web Vitals.
• Вміння працювати з CDN та кешуванням.
• Досвід з структурованими даними schema.org.
Очікуваний результат після впровадження всіх змін
✅ Оцінка Google PageSpeed Insights: 85+.
✅ Швидкість завантаження: менше 2 секунд.
✅ Покращення SEO та видимості в Google.
✅ Відсутність AMP-помилок.
