„Uděláme vám to na Next.js, to je dneska pro SEO nejlepší." Jestli si objednáváte nový web u vývojářského studia, tuhle větu nejspíš uslyšíte taky — Next.js je momentálně nejrozšířenější způsob, jak stavět weby v Reactu. Pravdivá je z ní půlka. Next.js opravdu odstraňuje technické překážky, kvůli kterým Google JavaScriptové weby čte špatně nebo pozdě. Tím ale jeho zásluhy končí: pozice dělá obsah, odkazy a to, jestli web odpovídá na skutečné dotazy lidí. S tím žádný framework nepomůže. Píšu z první ruky, můj vlastní web na Next.js běží. Tenhle text je pro majitele firmy, kterému vývojář web na Next.js staví nebo už postavil: ať víte, co framework vyřešil sám a co si nechat ukázat, než zaplatíte fakturu.
Proč se Next.js a SEO vůbec spojuje
Problém, který Next.js řeší, vzniká u webů psaných v čistém Reactu. Server u nich pošle prohlížeči skoro prázdné HTML a obsah doplní až JavaScript spuštěný v prohlížeči. Návštěvník počká vteřinu. Google klidně o dost déle: stránky u něj na vykreslení JavaScriptu čekají ve frontě a jeho dokumentace přiznává, že obvykle jde o vteřiny, ale může to trvat i déle. U webu, kterému na vyhledávání záleží, je to zbytečné riziko navíc — podrobněji v článku o crawlování a indexaci.
Next.js to obrací: stránku vykreslí na serveru, takže Google i návštěvník dostanou hotové HTML s textem hned v první odpovědi. Podle typu obsahu se stránky buď předgenerují dopředu (typicky blog a firemní prezentace), nebo se skládají při každém požadavku (e-shop s měnícími se cenami a dostupností), případně něco mezi tím. Rozdílům mezi režimy vykreslování se do hloubky věnuju v článku SSR, SSG, CSR a ISR pro majitele; pro tenhle text stačí vědět, že Next.js umí všechny a vývojář volí režim pro každou část webu zvlášť.
Co Next.js vyřeší za vás
Kromě vykreslování má Next.js zabudované věci, které se jinde lepí z pluginů nebo ručně. Všechno níž jsem ověřovala v aktuální dokumentaci (Next.js 16, červenec 2026):
- Metadata. Title, description i canonical adresa se definují přímo u každé stránky přes Metadata API. Na výmluvu „na to bychom potřebovali plugin" tu není prostor.
- Sitemapa a robots.txt. Obyčejné soubory v projektu (sitemap.ts, robots.txt), které web generuje sám z vlastního obsahu. Žádná externí služba, žádné ruční aktualizace.
- Obrázky. Komponenta next/image automaticky převádí obrázky do úsporných formátů, servíruje velikost podle displeje a drží pro obrázek místo v layoutu, takže stránka při načítání neposkakuje. Na Core Web Vitals je to znát.
- Přesměrování. Píšou se do konfigurace webu. Jedna zvláštnost: Next.js místo klasického kódu 301 používá 308. Pro SEO je to rovnocenné trvalé přesměrování, tak ať vás číslo v auditu nevyděsí.
Všimněte si, co ten seznam spojuje: jsou to samé odstraněné překážky. Nic z toho nezvedne pozice webu, který nemá co říct. Framework připraví hřiště, hrát musíte sami.
Čtete už třetí návod a pořád nevíte, čím začít? Začněte auditem. Projdu váš web ručně a do 48 hodin dostanete konkrétní priority — žádnou třicetistránkovou zprávu, kterou nikdo nečte. Zdarma.
Kde se to kazí i na Next.js
Nejčastější zádrhel jsou klientské komponenty. Ne všechno se totiž vykresluje na serveru: interaktivní části (filtry, kalkulačky, obsah dotahovaný „za běhu" z API) může vývojář nechat vykreslit až v prohlížeči. Taková část stránky je na tom pak úplně stejně jako čistý React: ve zdrojovém HTML není. Framework to nijak nezakazuje a žádná kontrolka nezabliká. Klidně tak vznikne web na Next.js, kde je v HTML hlavička, patička — a celý ceník nebo výpis produktů se načítá klientsky.
Druhé časté selhání je prozaičtější: metadata sice jdou nastavit u každé stránky, ale někdo to musí udělat. Web s jedním title pro všechny stránky potkáte i na Next.js.
Naštěstí existuje kontrola, kterou zvládnete bez vývojáře: otevřete svoji stránku, stiskněte Ctrl+U (zobrazí zdrojový kód) a přes Ctrl+F v něm zkuste najít větu z textu stránky. Když tam je, Google ji dostal hned. Když ne, váš obsah čeká ve frontě na vykreslení — přesně ten stav, kterému se mělo pořízením Next.js předejít. Totéž ukáže Search Console: Kontrola adresy URL umí zobrazit stránku tak, jak ji vidí Googlebot.
Co chtít po vývojáři: checklist k předání webu
Tohle je jádro článku. Nemusíte ničemu z toho rozumět do hloubky, stačí si odpovědi nechat ukázat:
- Obsah je ve zdrojovém HTML. Test Ctrl+U výše, na hlavních typech stránek (úvod, služba/produkt, článek).
- Každá stránka má vlastní title a description. Ne jeden globální pro celý web. Proč na tom záleží, popisuju u meta title a description.
- Canonical adresy jsou nastavené. Hlavně pokud na stejný obsah vede víc adres (parametry, filtry).
- Web generuje sitemapu a robots.txt sám. A sitemapa je odeslaná v Search Console.
- Strukturovaná data tam, kde dávají smysl. U produktů, článků, firemních údajů — víc v článku o schema markupu.
- Neexistující stránka vrací kód 404. U JavaScriptových webů se stává, že „stránka nenalezena" vrací kód 200 a Google pak indexuje prázdné stránky.
- Přesměrování jsou trvalá (308) a vedou rovnou na cíl. Žádné řetězy přes tři adresy.
- Obrázky jedou přes next/image a mají alt texty. Komponenta je v projektu zadarmo, tak ať se používá.
Poctivá poznámka: nic z toho není nadstandard, za který by se mělo připlácet. Je to řemeslný základ, který má web na Next.js mít v ceně.
Kdy je Next.js zbytečný luxus
Next.js dává smysl, když web opravdu potřebuje React: složitější aplikace, konfigurátory, e-shop na míru, napojení na vlastní systémy. Pro běžný firemní web s blogem je to ale často dražší cesta ke stejnému výsledku. Web na míru znamená vývojáře i na budoucí úpravy — a firemní web, kde majitel nemůže sám změnit text na stránce, časem zamrzne. Řeší se to napojením na redakční systém (jak to funguje a co to dělá se SEO, popisuju u headless CMS), jen počítejte, že to je další vrstva projektu, ne zaškrtávací políčko.
WordPress s dobrou šablonou dosáhne u prezentačního webu stejných pozic za zlomek ceny a texty si upravíte sami. Říkám to jako člověk, kterému Next.js na vlastním webu vyhovuje: rychlost a čisté HTML dostávám zadarmo, ale každou strukturální změnu dělá vývoj, ne já v administraci. Ta výměna se vyplatí jen některým webům.
Časté otázky
Je web na Next.js pro SEO lepší než na WordPressu?
Není, pokud jsou oba udělané pořádně. Google nedává body za technologii; hodnotí, co z webu dostane. Dobře postavený WordPress i dobře postavený Next.js mu dají totéž: rychlé stránky s obsahem v HTML. Rozdíl je v procesu: WordPress zvládnete editovat sami, web na Next.js obvykle upravuje vývojář.
Stačí statické generování (SSG) pro dobré SEO?
Pro obsah, který se nemění každou chvíli, je to dokonce nejlepší varianta: Google dostane hotové HTML okamžitě a server se nezadýchá. Hlídejte jediné: aby se web po změně obsahu opravdu přegeneroval. Zastaralá cena nebo dostupnost ve výsledcích vyhledávání umí napáchat víc škody než pomalejší server.
Máme web na čistém Reactu. Musíme kvůli SEO přejít na Next.js?
Nemusíte to lámat přes koleno. Nejdřív změřte skutečný stav: pokud se stránky indexují a v Search Console nevidíte problém, přechod nespěchá. Pokud Google část obsahu nevidí, dá se to u Reactu řešit i dodatečným předrenderováním — možnosti rozebírám v článku o JavaScript SEO. Přechod na Next.js má největší logiku ve chvíli, kdy web stejně čeká redesign.
Radši byste se věnovali podnikání než SEO? Přesně od toho jsem tady já.
Víte, co váš web posílá Googlu?
U webů na frameworku bývá záludné, že zvenku vypadají bezchybně: design sedí, všechno kliká, a přitom klidně půlka obsahu existuje jen v prohlížeči. Checklist z tohohle článku si projdete sami za večer. Místa, kam se bez nástrojů nedostanete (co přesně je ve zdrojovém HTML, jak vypadají přesměrování, co reálně doputovalo do indexu), umím zkontrolovat v rámci auditu — a výsledek píšu tak, aby se z něj dala vývojáři rovnou zadat práce, bez překládání ze SEO řeči.
Zdroje k faktům v článku:
- Tři fáze zpracování JavaScriptu (crawling, rendering, indexace) a fronta na vykreslování „pár vteřin, ale může to trvat déle" (ověřeno 16. 7. 2026): developers.google.com/search/docs/crawling-indexing/javascript/javascript-seo-basics
- Metadata API včetně canonical, vestavěná sitemap.ts a robots.txt, komponenta next/image — dokumentace Next.js 16.2 (ověřeno 16. 7. 2026): nextjs.org/docs
- Přesměrování v Next.js: permanent: true = kód 308 (ověřeno 16. 7. 2026): nextjs.org/docs/app/api-reference/config/next-config-js/redirects
