Optymalizacja techniczna strony internetowej wpływa na jej widoczność w wynikach organicznych oraz na wygodę użytkowników. Sprawna strona szybko się wczytuje, działa poprawnie na telefonie i komputerze, a robotom wyszukiwarek ułatwia przeszukiwanie zawartości. Poniżej opisujemy siedem obszarów technicznych wraz z progami i narzędziami do kontroli.
Czas renderowania i odpowiedzi serwera
Dobry czas odpowiedzi serwera (TTFB) to 0,8 s lub mniej, a największy element treści (LCP) powinien pojawić się do 2,5 s od wczytania. Web.dev przytacza dane BBC o utracie dodatkowych 10% użytkowników na każdą kolejną sekundę oczekiwania. Skrócisz ten czas, zmniejszając pliki graficzne, włączając Brotli lub gzip dla CSS i JavaScript oraz korzystając z cache przeglądarki. Pomagają też atrybuty defer i async dla skryptów i usunięcie blokujących zasobów z sekcji <head>. Monitoruj podstawowe wskaźniki internetowe, a obok LCP także INP (mniej niż 200 milisekund) i CLS (poniżej 0,1), mierzone na 75. percentylu wizyt.
Kompresja i format obrazów
Najlepiej zapisywać obrazy w nowoczesnych formatach WebP lub AVIF, które zajmują mniej przy zachowaniu jakości, a wyszukiwarka Google obsługuje je wśród 7 typów plików (także BMP, GIF, JPEG, PNG i SVG). Każda grafika powinna mieć atrybut alt z jasnym opisem, bo pomaga on osobom korzystającym z czytników ekranu, a Google używa go razem z algorytmami rozpoznawania treści ilustracji. Ustawienie loading="lazy" w tagach <img> odracza pobieranie plików z dalszej części strony do momentu przewijania. Web.dev ostrzega jednak, żeby nie stosować go przy zdjęciach widocznych od razu po wejściu, zwłaszcza przy obrazie LCP.
Elastyczny układ na ekranach różnej wielkości
Elastyczny układ jest standardem, bo do indeksowania i rankingu Google używa mobilnej wersji zawartości. Google zaleca taki wzorzec jako najłatwiejszy w obsłudze: ten sam kod HTML pod jednym adresem, z wyglądem dopasowanym do rozmiaru ekranu. Treść na telefonie powinna być taka sama jak na komputerze. Testuj na prawdziwych urządzeniach lub w narzędziach deweloperskich przeglądarki, sprawdzając, czy tekst pozostaje czytelny bez powiększania. Web.dev zaleca przyciski o rozmiarze około 48 pikseli i odstęp rzędu 8, a jednostki em, rem oraz zapytania @media w CSS pomagają reagować na zmianę orientacji i rozdzielczości.
Walidacja i semantyka kodu HTML
Walidacja kodu HTML wychwytuje błędy, które mogą utrudnić Google odczytanie metadanych, choć wyszukiwarka stara się rozpoznać także nieprawidłowy zapis. Najgroźniejszy przypadek dotyczy sekcji <head>: dozwolonych jest w niej 8 elementów (title, meta, link, script, style, base, noscript, template), a po napotkaniu innego, na przykład iframe albo img, Google pomija wszystko, co stoi dalej. Regularna kontrola kodu HTML za pomocą narzędzi HTML Checker pozwala znaleźć też niezamknięte tagi i duplikujące się identyfikatory. Elementy semantyczne <header>, <nav>, <main>, <article>, <aside>, <footer> porządkują strukturę dokumentu i ułatwiają pracę czytnikom ekranu, a Google zaznacza, że rzadko polega na znaczeniach ukrytych w specyfikacji HTML.
Plik Sitemap w formacie XML
Plik Sitemap w formacie XML podaje wyszukiwarce listę URL przeznaczonych do pobrania, a jeden dokument może mieć najwyżej 50 MB po rozpakowaniu i 50 tys. adresów. Większy zbiór dzielisz na kilka map i łączysz zbiorczym spisem, co przydaje się przy rozbudowanych projektach z tysiącami podstron. Google odczytuje wartość lastmod, jeśli jest spójna i zweryfikowana, a pola priority i changefreq ignoruje. Strona do 500 podstron z dobrym linkowaniem może w ogóle nie potrzebować takiego dokumentu. Osobne mapy dla artykułów, produktów i multimediów prześlij przez raport map w sekcji Indeksowanie w Google Search Console i sprawdzaj tam błędy pobierania.
Mikrodane i znaczniki Schema.org
Dane strukturalne pozwalają wyszukiwarkom rozpoznać rodzaj treści, na przykład recenzję, wydarzenie, przepis kulinarny albo ofertę produktu. Google obsługuje 3 formaty (JSON-LD, mikrodane i RDFa), a zaleca JSON-LD jako najprostszy we wdrożeniu. Poprawne znaczniki mogą dać wynik z elementami rozszerzonymi (rich snippets), czyli oceny gwiazdkowe, ceny albo zdjęcia na liście Google. Dokumentacja podaje przykłady: Rotten Tomatoes po oznaczeniu 100 tys. podstron odnotował wzrost współczynnika klikalności o 25%, a według pomiarów Nestlé strony z takim wyglądem miały go wyższy o 82%. Dopasuj typ (Article, Product, LocalBusiness) do charakteru adresu i sprawdzaj kod Testem wyników z elementami rozszerzonymi oraz Walidatorem znaczników schema.org.
Certyfikat SSL i szyfrowanie HTTPS
Certyfikat SSL jest potrzebny każdej stronie, bo protokół HTTPS chroni dane przesyłane w formularzach, logowaniach i płatnościach. Adresy bez niego Chrome oznacza jako "Niezabezpieczona", co zniechęca odwiedzających. Ponadto szyfrowane połączenie stanowi czynnik rankingowy w Google: firma ogłosiła to w 2014 roku, podając wtedy, że sygnał dotyczy mniej niż 1% zapytań. Wdrożenie wymaga przekierowań stałych 301 lub 308 ze starych adresów HTTP oraz aktualizacji linków wewnętrznych. Unikasz w ten sposób treści mieszanej, czyli obrazów, filmów, arkuszy stylów i skryptów wczytywanych przez niezabezpieczone połączenie.
