Baza wiedzy
Techniczne SEO: trzy obszary, które warto poprawić w pierwszej kolejności
Trzy obszary technicznego SEO, które często są pomijane: dane strukturalne, szybkość strony (Core Web Vitals) i obrazy. Z przykładami kodu.
W tym wpisie skupiam się na trzech elementach technicznego SEO, które bardzo często są pomijane: danych strukturalnych, szybkości strony i obrazach. To konkretne prace, które możesz wykonać sam lub z programistą, a które poprawiają widoczność strony w Google.
Dane strukturalne (schema.org)
Dane strukturalne to fragment kodu, który opisuje treść strony w sposób zrozumiały dla wyszukiwarek. Dzięki nim Google wie, że dana podstrona to produkt z ceną, recenzja albo sklep z adresem. W zamian może pokazać stronę w wynikach w bogatszej formie, np. z oceną lub ceną, co zwykle zwiększa liczbę kliknięć.
Dane strukturalne dodaje się najczęściej w formacie JSON-LD, w kodzie strony. Poprawność sprawdzisz w dwóch darmowych narzędziach:
- Test wyników z elementami rozszerzonymi od Google, który pokazuje, czy strona kwalifikuje się do rozszerzonych wyników,
- Schema Markup Validator, który sprawdza poprawność samego kodu.
Przykłady dla sklepu rowerowego
Produkt. Opisuje cechy roweru: markę, model, cenę i dostępność.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Product",
"name": "Rower górski XYZ",
"image": "https://example.com/images/bike.jpg",
"brand": { "@type": "Brand", "name": "XYZ Bikes" },
"description": "Rower górski XYZ to doskonały wybór dla miłośników jazdy w terenie.",
"sku": "XYZ123",
"offers": {
"@type": "Offer",
"priceCurrency": "PLN",
"price": "1999.99",
"availability": "https://schema.org/InStock"
}
}
</script>
Recenzja produktu. Jeśli na stronie są opinie klientów o rowerach, możesz je oznaczyć.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Review",
"itemReviewed": { "@type": "Product", "name": "Rower górski XYZ" },
"author": { "@type": "Person", "name": "Jan Kowalski" },
"datePublished": "2026-03-14",
"reviewRating": { "@type": "Rating", "ratingValue": "4.5", "bestRating": "5" },
"reviewBody": "Rower jest świetny. Doskonała jakość i wygodna jazda."
}
</script>
Uwaga: Google nie pokazuje gwiazdek z opinii, które firma publikuje sama o sobie (np. oceny firmy na jej własnej stronie). Oznaczaj opinie o produktach, a nie o własnej firmie.
Sklep stacjonarny. Jeśli sklep ma lokal, oznacz jego adres i telefon.
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "Store",
"name": "Sklep Rowerowy XYZ",
"address": {
"@type": "PostalAddress",
"streetAddress": "ul. Rowerowa 123",
"addressLocality": "Warszawa",
"postalCode": "00-000",
"addressCountry": "PL"
},
"telephone": "+48 123 456 789",
"url": "https://example.com"
}
</script>
Dane w znaczniku muszą być zgodne z treścią widoczną na stronie. Oznaczenia opisujące coś, czego użytkownik nie widzi, Google może zignorować, a w skrajnych przypadkach nałożyć działanie ręczne.
Szybkość strony i Core Web Vitals
Szybkość wpływa na doświadczenie użytkownika i jest jednym z sygnałów, które Google bierze pod uwagę. Google mierzy ją trzema wskaźnikami Core Web Vitals:
| Wskaźnik | Co mierzy | Dobry wynik |
|---|---|---|
| LCP (Largest Contentful Paint) | Jak szybko ładuje się największy element ekranu | do 2,5 s |
| INP (Interaction to Next Paint) | Jak szybko strona reaguje na kliknięcia i dotyk | do 200 ms |
| CLS (Cumulative Layout Shift) | Czy elementy przesuwają się podczas ładowania | do 0,1 |
INP zastąpił w marcu 2024 roku wcześniejszy wskaźnik FID.
Zacznij od pomiaru w PageSpeed Insights. Narzędzie pokazuje dane od prawdziwych użytkowników (jeśli strona ma wystarczający ruch) i konkretne wskazówki, co poprawić. Dane dla całej strony znajdziesz też w Google Search Console, w raporcie „Podstawowe wskaźniki internetowe”.
Kompresja i format obrazów
Obrazy to najczęstsza przyczyna wolnego ładowania. Co możesz zrobić:
- Używaj nowoczesnych formatów: WebP albo AVIF zamiast dużych plików JPEG i PNG.
- Dopasuj rozmiar: nie wgrywaj zdjęcia o szerokości 4000 px, jeśli wyświetla się w 800 px.
- Kompresuj: szukaj równowagi między rozmiarem a jakością. Zbyt mocna kompresja psuje wygląd zdjęć.
- Podawaj wymiary (szerokość i wysokość) w kodzie, żeby układ strony nie przesuwał się podczas ładowania.
- Ładuj leniwie obrazy poniżej pierwszego ekranu (atrybut
loading="lazy"), ale nie główne zdjęcie na górze strony.
Narzędzia do kompresji:
- Squoosh (squoosh.app): darmowe narzędzie w przeglądarce, z podglądem jakości przed i po.
- TinyPNG (tinypng.com): przeciągasz plik, a narzędzie samo zmniejsza jego rozmiar.
- ImageOptim: darmowy program dla macOS.
- Adobe Photoshop: przy eksporcie do JPEG lub WebP ustawiasz jakość i od razu widzisz rozmiar pliku.
Kod CSS i JavaScript
- Usuń nieużywany kod i wtyczki, które ładują własne skrypty na każdej podstronie.
- Minifikuj pliki CSS i JavaScript.
- Skrypty, które nie są potrzebne od razu, ładuj z opóźnieniem (
deferlubasync).
Opisy obrazów (atrybut alt)
Atrybut alt to tekstowy opis obrazu. Czytają go programy dla osób niewidomych, a wyszukiwarka dzięki niemu rozumie, co przedstawia zdjęcie.
Dobry opis jest konkretny i opisuje to, co faktycznie widać, np. „Czerwony rower górski XYZ na leśnej ścieżce”. Słowo kluczowe możesz w nim użyć, jeśli naturalnie pasuje, ale nie wypisuj listy fraz. Obrazy czysto dekoracyjne powinny mieć pusty atrybut alt="".
Podsumowanie
Dane strukturalne, szybkość i obrazy to fundamenty technicznego SEO. Poprawki w tych trzech obszarach często dają szybki efekt, bo usuwają bariery, przez które Google gorzej ocenia stronę.
Jeśli chcesz, żebym sprawdził Twoją stronę, zacznij od audytu SEO. Wdrożenie poprawek opisuję na stronie Optymalizacja SEO.
