Wykorzystaj pełną moc Metadata API do budowy SEO-friendly aplikacji. TypeScript, JSON-LD, dynamic metadata - wszystko w jednym miejscu.
Next.js 14 Metadata API to rewolucja w zarządzaniu SEO on-page. Zastępuje tradycyjne next/head, oferując TypeScript-first podejście, hierarchiczne dziedziczenie metadata i automatyczną optymalizację tagów. Idealne rozwiązanie dla firm z Lubina chcących zwiększyć widoczność w wyszukiwarkach.
Oferta specjalna dla firm z Dolnego Śląska:
Wszystko czego potrzebujesz do profesjonalnego SEO on-page
Dziedziczenie metadata z layout.tsx
Pełne wsparcie dla typów TS
generateMetadata() dla dynamicznych tras
Automatyczna deduplikacja tagów
Podstawowa implementacja dla stron ze stałą treścią
// app/page.tsx - Statyczne metadata
import { Metadata } from 'next'
export const metadata: Metadata = {
title: 'Zagor Digital - Agencja SEO Lubin',
description: 'Lokalne SEO i tworzenie stron dla firm z Lubina',
keywords: 'SEO Lubin, strony internetowe Lubin, marketing cyfrowy',
authors: [{ name: 'Zagor Digital' }],
creator: 'Zagor Digital',
publisher: 'Zagor Digital',
formatDetection: {
email: false,
address: false,
telephone: false,
},
openGraph: {
title: 'Zagor Digital - Agencja SEO Lubin',
description: 'Lokalne SEO i tworzenie stron dla firm z Lubina',
url: 'https://zagordigital.pl',
siteName: 'Zagor Digital',
images: [
{
url: 'https://zagordigital.pl/og-image.jpg',
width: 1200,
height: 630,
alt: 'Zagor Digital - SEO Lubin',
}
],
locale: 'pl_PL',
type: 'website',
},
twitter: {
card: 'summary_large_image',
title: 'Zagor Digital - Agencja SEO Lubin',
description: 'Lokalne SEO i tworzenie stron dla firm z Lubina',
images: ['https://zagordigital.pl/twitter-image.jpg'],
},
robots: {
index: true,
follow: true,
googleBot: {
index: true,
follow: true,
'max-video-preview': -1,
'max-image-preview': 'large',
'max-snippet': -1,
},
},
verification: {
google: 'google-site-verification-code',
yandex: 'yandex-verification-code',
},
}Automatyczne generowanie tagów hreflang dla wersji językowych:
alternates: {
canonical: '/produkty/',
languages: {
'pl-PL': '/pl/produkty',
'en-US': '/en/products',
'de-DE': '/de/produkte',
},
}Dynamiczne generowanie OG images z Edge Runtime:
// app/og/route.tsx
export const runtime = 'edge'
export async function GET(request: Request) {
return new ImageResponse(
(<div style={{ display: 'flex', height: '100%', width: '100%' }}>
{/* OG Image JSX content */}
</div>)
)
}Automatyczne generowanie sitemap.xml:
// app/sitemap.ts
export default function sitemap() {
return [
{
url: 'https://zagordigital.pl',
lastModified: new Date(),
changeFrequency: 'yearly',
priority: 1,
},
]
}Integracja z Google Search Console API:
verification: {
google: 'google-site-verification',
yandex: 'yandex-verification',
bing: 'msvalidate.01=CODE',
}Wykorzystuj dziedziczenie metadata z layout.tsx. Definiuj wspólne metadata w root layout, a specyficzne nadpisuj w page.tsx:
app/layout.tsx → template: "%s | Zagor Digital"
app/uslugi/page.tsx → title: "Usługi" → wynik: "Usługi | Zagor Digital"Cachuj wywołania API w generateMetadata(). Używaj React cache() lub Next.js Data Cache:
const getCachedPost = cache(async (slug: string) => {
return await fetchPost(slug)
})Implementuj odpowiednie schematy Schema.org:
Testuj strukturalne dane i podgląd rich snippets
Sprawdź Open Graph tags i podgląd na Facebooku
Waliduj Twitter Cards i zobacz podgląd
Tak, Next.js 14 Metadata API całkowicie zastępuje next/head w App Router. Oferuje lepszą wydajność, TypeScript support i automatyczną deduplikację tagów. W Pages Router nadal używamy next/head, ale zalecana jest migracja na App Router.
Migracja wymaga: 1) Przeniesienia projektu na App Router, 2) Konwersji komponentów Head na obiekty metadata, 3) Implementacji generateMetadata() dla dynamicznych stron. Proces zajmuje 2-5 dni dla średniego projektu. Oferujemy pomoc w migracji dla firm z Lubina.
Metadata API optymalizuje render meta tagów, redukując CLS. Streamowanie metadata w RSC poprawia LCP. Właściwe preload hints (generowane automatycznie) mogą znacząco poprawić INP. Widzieliśmy poprawę LCP o 15-20% po migracji.
Wdrożymy Metadata API, strukturalne dane i kompletną optymalizację SEO on-page. Profesjonalna implementacja zwiększająca widoczność w wyszukiwarkach.
Wypełnij formularz, a skontaktujemy się z Tobą w ciągu 24 godzin