AMP-optymalizacja strony VIDI Marine

1. Ogólne informacje

• Nazwa projektu: Optymalizacja prędkości i wersji mobilnej strony VIDI Marine

• Link do strony: https://vidi-marine.com/ua/

• Główne zadania:

• Optymalizacja prędkości ładowania stron.

• Wdrożenie AMP (Accelerated Mobile Pages) dla wersji mobilnej.

• Poprawa SEO, danych strukturalnych i wewnętrznego linkowania.

• Optymalizacja obrazów w celu zmniejszenia czasu ładowania.

• Walidacja strony zgodnie z Google Core Web Vitals.

2. Optymalizacja prędkości ładowania strony

Analiza problemów:

• Duża liczba zewnętrznych skryptów JS spowalnia ładowanie.

• Niecache'owane zasoby i duże obrazy.

• Brak opóźnionego ładowania (lazy loading) dla obrazów i wideo.

Rozwiązania:

• Usunąć lub opóźnić ładowanie nieobowiązkowych skryptów JS (asynchronous / defer loading).

• Wdrożyć lazy loading dla wszystkich obrazów i wideo.

• Używać cache'owania statycznych zasobów przez .htaccess lub odpowiednią wtyczkę (jeśli strona jest na CMS).

• Optymalizować CSS, łącząc kilka plików w jeden (minimalizacja przez CSS Minify).

• Używać CDN (Cloudflare, BunnyCDN) dla szybszego ładowania treści.

• Wdrożyć kompresję obrazów w formacie WebP.

✅ Oczekiwany rezultat: Zwiększenie oceny Google PageSpeed Insights do 85+.

3. Wdrożenie AMP (Accelerated Mobile Pages)

Analiza problemów:

• Strona nie używa AMP, co spowalnia ładowanie na urządzeniach mobilnych.

• Aktualny kod zawiera zabronione skrypty, niekompatybilne z AMP.

Rozwiązania:

• Stworzyć wersję AMP dla głównych stron (strona główna, kategorie produktów, karty produktów, blog).

• Użyć komponentów AMP:

• <amp-img> – dla obrazów.

• <amp-video> – dla treści wideo.

• <amp-carousel> – dla sliderów.

• <amp-sidebar> – dla mobilnego menu.

• Optymalizować style (inline CSS, nie więcej niż 75 KB).

• Używać formularza AMP do kontaktu.

• Walidować wersję AMP przez AMP Validator.

✅ Oczekiwany rezultat: Strony AMP w pełni przechodzą weryfikację Google i szybciej ładują się na urządzeniach mobilnych.

4. Poprawa SEO i danych strukturalnych

Analiza problemów:

• Brak strukturalnego oznaczenia schema.org dla produktów.

• Meta tagi nie są zoptymalizowane (długość tytułów/opisów przekracza zalecane limity).

• Brak logicznego wewnętrznego linkowania.

Rozwiązania:

• Dodać strukturalne oznaczenie schema.org dla produktów, kategorii i artykułów blogowych.

• Optymalizować meta title i description na wszystkich stronach.

• Wdrożyć okruszki chleba (breadcrumbs) dla poprawy nawigacji.

• Dodać otwarte grafy (Open Graph, Twitter Cards) dla poprawnego wyświetlania w mediach społecznościowych.

• Wewnętrzne linkowanie:

• Dodać blok „Podobne produkty” na stronach produktów.

• Dodać blok „Przeczytaj także” w blogu.

✅ Oczekiwany rezultat: Poprawa rankingu SEO i wzrost organicznego ruchu.

5. Optymalizacja obrazów

Analiza problemów:

• Ciężkie obrazy PNG/JPG bez kompresji.

• Brak adaptacji do urządzeń mobilnych.

Rozwiązania:

• Konwertować wszystkie obrazy do formatu WebP.

• Używać responsive images (srcset) dla adaptacyjnego ładowania.

• Optymalizować duże obrazy przez TinyPNG lub automatyczne kompresory.

✅ Oczekiwany rezultat: Mniejsze obciążenie serwera, szybsze ładowanie stron.

6. Wdrożenie Google Core Web Vitals

Analiza problemów:

• Zły LCP (Largest Contentful Paint) – długie ładowanie głównej treści.

• Wysoki CLS (Cumulative Layout Shift) – przesunięcie elementów na stronie.

Rozwiązania:

• Zmniejszyć rozmiar czcionek i stylów, używając font-display: swap.

• Opóźnić ładowanie niepotrzebnych zasobów (async i defer dla skryptów).

• Dodać stałe rozmiary dla wszystkich obrazów, banerów i wideo, aby uniknąć przesunięcia treści.

• Używać preload dla najważniejszych zasobów (czcionki, logo).

✅ Oczekiwany rezultat: Poprawa LCP, FID, CLS w celu zgodności z Google Core Web Vitals.

7. Testowanie i weryfikacja

• Walidacja AMP przez AMP Validator.

• Sprawdzenie prędkości strony przez Google PageSpeed Insights.

• Testowanie Core Web Vitals w Google Search Console.

• Sprawdzenie SEO przez Ahrefs / Screaming Frog.

8. Terminy realizacji

• Audyt strony: 2-3 dni.

• Optymalizacja prędkości: 7-10 dni.

• Wdrożenie AMP: 10-14 dni.

• Optymalizacja SEO: 5-7 dni.

• Ostateczne testowanie i poprawki błędów: 3-5 dni.

• Całkowity czas realizacji: 20-30 dni.

9. Wymagania wobec wykonawcy

• Doświadczenie w pracy z AMP i optymalizacją prędkości stron.

• Zrozumienie SEO i Core Web Vitals.

• Umiejętność pracy z CDN i cache'owaniem.

• Doświadczenie z danymi strukturalnymi schema.org.

Oczekiwany rezultat po wdrożeniu wszystkich zmian

✅ Ocena Google PageSpeed Insights: 85+.

✅ Prędkość ładowania: mniej niż 2 sekundy.

✅ Poprawa SEO i widoczności w Google.

✅ Brak błędów AMP.