TL;DR: Lovable publikuje aplikacje React w modelu CSR — szybkie, estetyczne i bez pre-renderingu w dużej mierze niewidoczne dla Google. Ta checklista obejmuje sitemap.xml, robots.txt, metadane i poprawkę renderowania, dzięki której to wszystko zaczyna działać tak, jak powinno.
Lovable publikuje aplikacje React jako CSR. Są szybkie, wyglądają świetnie i bez dodatkowej konfiguracji mają poważny problem z widocznością w Google. Oto lista poprawek, od których warto zacząć.
W ciągu ostatnich sześciu miesięcy audytowałem cztery strony zbudowane w Lovable i każda miała dokładnie te same trzy problemy: brak sitemap.xml, robots.txt blokujący zasoby JavaScript oraz identyczny tag title na każdej trasie. Strony wyglądały świetnie. Kod był czysty. SEO praktycznie nie istniało.
To nie jest wyłącznie problem Lovable — to problem CSR. Lovable tworzy aplikacje w React + Vite i publikuje je jako aplikacje jednostronicowe renderowane po stronie klienta. Twoja przeglądarka najpierw ładuje małą powłokę HTML, a potem JavaScript renderuje „strony” jako stany aplikacji. Google potrafi indeksować strony CSR, ale robi to dwuetapowo: najpierw pobiera początkowy HTML, a później wraca, żeby wyrenderować JavaScript i odczytać pełną treść. To opóźnienie tworzy przewidywalne pułapki SEO, których zwykle nie widzisz na platformach opartych na podejściu „HTML-first”.
Traktuj SEO jak kod: jako coś, co wdrażasz świadomie, weryfikujesz i utrzymujesz. Lovable wprost rekomenduje w dokumentacji podejście „SEO as code”.
Potraktuj to jako warunek publikacji: jeśli wszystko jest gotowe, stronę można publikować. Powiem wprost, co ma największe znaczenie: jeśli nie zrobisz nic więcej, napraw pierwszą sekcję. Problemy z dostępnością dla robotów i indeksowaniem pojawiają się dosłownie na każdej stronie Lovable, jaką widziałem. Rzeczy on-page też są ważne, ale perfekcyjnie zoptymalizowany tag title nie ma żadnej wartości, jeśli Google nie potrafi wyrenderować strony.
sitemap.xml i aktualizuj ją, gdy zmieniają się trasyrobots.txt, który nie blokuje JS, CSS ani /assets/ — i zawiera odnośnik do mapy witrynyrobots.txt/llm.html lub podobną) do mapy witrynyOd tego zaczynam każdy audyt Lovable i od tego ty też powinieneś zacząć. Wiem, że kusi, żeby od razu przeskoczyć do optymalizacji treści albo link buildingu, ale uwierz mi — widziałem ludzi, którzy tygodniami dopieszczali meta description na stronie, której Google nawet nie potrafił wyrenderować. Najpierw napraw fundament. Cała reszta to już polerowanie detali.
Lovable nazywa własną domenę „one of the most important steps” dla SEO, bo konsoliduje autorytet pod stabilnym canonical URL. W praktyce chodzi o prostą rzecz: raz wybierasz format — https://example.com vs https://www.example.com, ze slashem na końcu albo bez — i trzymasz go konsekwentnie w tagach canonical, linkach wewnętrznych, mapie witryny i przekierowaniach. Nie da się tego przecenić: wybierz jeden format i trzymaj się go wszędzie. Dwie z czterech stron, które audytowałem, miały niespójne URL-e — mapa witryny używała www, tagi canonical nie, a linki wewnętrzne były mieszanką obu wersji. Google indeksował trzy wersje każdej strony.
Lovable obsługuje tryb domeny głównej, w którym pozostałe domeny są automatycznie przekierowywane. W przypadku domen dodanych po 29 października 2025 r. pierwsza własna domena staje się domyślną domeną główną.
Mapy witryny są krytyczne dla stron CSR, bo roboty nie zawsze są w stanie łatwo odkrywać trasy SPA wyłącznie przez podążanie za linkami.
Prompt do Lovable:
Create XML sitemap at /sitemap.xml listing all public routes.
Include lastmod dates and priorities: homepage 1.0, main pages 0.8, blog posts 0.6.Zweryfikuj to, otwierając https://example.com/sitemap.xml i sprawdzając, czy wszystkie kluczowe trasy są obecne. Generuj ją ponownie, gdy URL-e się zmieniają — Lovable nie robi tego automatycznie.
(Mała dygresja: jedna z czterech stron, które audytowałem, miała mapę witryny zawierającą tylko stronę główną. Mieli 23 trasy. Google zaindeksował dokładnie jedną stronę. Dwadzieścia minut pracy nad mapą witryny naprawiło problem, który debugowali od miesięcy.)
Lovable ostrzega wprost: nigdy nie blokuj CSS, JavaScript ani /assets/, bo Google potrzebuje tych zasobów, żeby wyrenderować strony CSR.
Create robots.txt at /public/robots.txt that allows all crawlers
and references Sitemap: https://example.com/sitemap.xmlDodaj tagi canonical, aby zapobiec problemom z duplikacją treści wynikającym z różnych wariantów adresów w SPA.
Add canonical tags to all pages pointing to their own URLs.
Use https://example.com format with no trailing slash.Szybka weryfikacja w konsoli: console.log('Canonical:', document.querySelector('link[rel="canonical"]')?.href);
To jest problem, który zaskakuje wszystkich. Budujesz w Lovable pięć ładnych stron, każda ma inną treść, inne nagłówki, inny cel. Otwierasz je w przeglądarce i wszystko wygląda jak należy. Potem sprawdzasz indeks Google i odkrywasz, że każda z tych stron ma ten sam tag title: „My App - Built with Lovable.” Dzieje się tak dlatego, że Lovable wprost wskazuje ograniczenie CSR: metadane nie aktualizują się automatycznie między trasami. W praktyce oznacza to, że każda podstrona może pokazywać ten sam tag title i meta description, jeśli sam tego nie naprawisz. Sprawdzałem jedną stronę Lovable, na której wszystkie 12 podstron miały w indeksie Google identyczny tag title. Właściciel nie miał o tym pojęcia, dopóki mu tego nie pokazałem.
Rozwiązaniem jest react-helmet-async:
Install react-helmet-async and implement per-route SEO metadata:
unique <title>, meta description, canonical, OG tags, and Twitter Card tags for every important route.Zweryfikuj to, przechodząc między trasami i sprawdzając, czy tytuł strony, meta description, canonical i tagi OG rzeczywiście zmieniają się w HTML.
Brand -- One-line value propFeature Name -- Benefit | BrandUse Case for [ICP] -- Outcome | Brand[Primary Keyword]: Specific promise (Year)Szablon: czym to jest + dla kogo jest + dowód + CTA. Trzymaj się zakresu 140-160 znaków.
Jedno H1 na trasę. Używaj H2/H3 do sekcji, a nie do stylowania. Korzystaj z list i tabel dla uporządkowanych informacji. Umieść kluczową propozycję wartości i główne słowo kluczowe w widocznym HTML blisko góry strony — nie chowaj ich za interakcjami ani zakładkami, które wymagają kliknięcia.
Lovable podkreśla, że linki wewnętrzne pomagają użytkownikom i wyszukiwarkom poruszać się po stronie, odkrywać treści, rozumieć relacje tematyczne i rozprowadzać autorytet między podstronami.
Twoja minimalna sensowna architektura:
<a href="">, a nie click handlerów, żeby roboty mogły za nimi podążaćZacznij od schematu typu Organization i WebSite na stronie głównej, schematu typu Article na wpisach blogowych, Product na stronach produktowych i FAQPage na stronach FAQ.
Add JSON-LD structured data:
- Organization schema on the homepage (name, description, URL, logo, social links)
- Article schema on blog posts
- FAQPage schema on /faq
Validate output and keep it consistent with visible page content.To nie jest magiczny przycisk „ranking +20%”, ale pomaga wyszukiwarce lepiej zrozumieć zawartość strony. A przy stronach generowanych jako CSR każda dodatkowa warstwa jasności naprawdę się przydaje.
Większość platform społecznościowych nie wykonuje JavaScript. Bez metadanych OG i Twitter w początkowym HTML dostajesz generyczne albo uszkodzone podglądy linków. Dodaj unikalny OG title, description i obraz dla każdej ważnej trasy. Nie używaj jednego generycznego obrazu dla wszystkich stron, bo wtedy każda podstrona wygląda tak samo — a to szkodzi i CTR-owi, i wiarygodności.
Lovable ma wbudowane narzędzie Speed oparte na Google Lighthouse. Docelowe wyniki: Performance 90+, Accessibility 90+, Best Practices 90+, SEO 100.
Improve performance:
- compress large images, use WebP/AVIF
- add width/height attributes to images
- lazy load non-critical images
- defer non-essential scripts
- preload key assetsNie chodzi tylko o ranking. Szybsza strona zwykle lepiej konwertuje, szczególnie na mobile. To ten rzadki obszar, w którym SEO, UX i biznes ciągną w dokładnie tę samą stronę.
Lovable zawiera sekcję „AI bot access”, która pokazuje, jak zezwalać lub blokować boty takie jak GPTBot, PerplexityBot, Claude-Web i Google-Extended.
To jeszcze nie jest twardo potwierdzone w społeczności SEO, ale Lovable rekomenduje dedykowaną stronę z podsumowaniem, którą systemy AI mogą łatwo przeszukać i cytować. Umieść tam: co robi twój produkt (1-2 zdania), dla kogo jest, kluczowe funkcje (bullet points), podsumowanie cen, najważniejsze informacje o bezpieczeństwie, linki do docs i pricing oraz krótkie FAQ z odpowiedziami nadającymi się do cytowania.
Pisz krótkie, bezpośrednie odpowiedzi FAQ, zaczynające się od głównej odpowiedzi. Unikaj mglistego marketingowego języka. To właśnie takie fragmenty LLM-y najczęściej wyciągają do swoich odpowiedzi.
Używaj Google Search Console jako podstawowego narzędzia monitoringu. Zweryfikuj stronę przez DNS TXT (metoda rekomendowana przez Lovable).
Harmonogram utrzymania:
Brak mapy witryny albo nieaktualna mapa witryny. Szczególnie ważne przy CSR. Musisz ją regenerować i wysyłać ponownie, gdy zmieniają się trasy.
robots.txt blokuje zasoby potrzebne do renderowania. Nigdy nie blokuj CSS/JS ani /assets/. Po zmianach przetestuj wszystko ponownie w URL Inspection.
Brak tagu title i meta description dla każdej trasy. Zainstaluj react-helmet-async i ustaw unikalne metadane dla każdej podstrony.
Brak strategii canonical. Dodaj tagi canonical wskazujące na bieżący adres URL i wybierz jeden preferowany format domeny.
Słabe linkowanie wewnętrzne. Upewnij się, że istnieją linki w nawigacji, stopce i treści. Ważne strony potrzebują wielu linków.
(Jeszcze jedna dygresja: najłatwiejszy sposób na audyt strony Lovable to otworzyć trzy różne trasy i sprawdzić, czy zmienia się tytuł karty w przeglądarce. Jeśli wszędzie widzisz ten sam tag title, masz problem z metadanymi. Zajmuje to 10 sekund.)
Tak. Google potrafi indeksować strony CSR w procesie dwuetapowym. Klucz to poprawne wdrożenie dostępności dla robotów i metadanych dla każdej trasy.
CSR wymaga drugiej fali renderowania, żeby odczytać pełną treść. Platformy SSR i SSG serwują gotowy HTML, który Google może przetworzyć od razu.
Jeśli zależy ci na długoterminowym SEO, to tak. Lovable mocno to rekomenduje, żeby skonsolidować autorytet pod jednym canonical URL.
sitemap.xml (utrzymywana na bieżąco)robots.txt, który nie blokuje zasobówreact-helmet-asyncSEOJuice automatyzuje linkowanie wewnętrzne, zarządzanie meta tagami i danymi uporządkowanymi — zadania, które stają się wąskim gardłem, gdy rośnie twoja biblioteka treści. Śledzi też widoczność na platformach AI i w Google Search Console.
Powiązane materiały:
robots.txtno credit card required
No related articles found.