Website-Modernisierung mit Next.js

Ausgangslage: was wir auf Mallorca-Firmenwebsites finden

Typische Legacy-Sites laufen auf WordPress mit Elementor, Divi oder WPBakery. Fünfzehn Plugins liefern Slider, Pop-ups, Chat-Widgets und SEO-Pakete gleichzeitig. Die Startseite zeigt Stock-Fotos und den Satz „Willkommen bei uns“. Der Firmenname steht im Logo, nicht in den Absätzen. Ladezeiten auf dem Handy liegen bei vier bis acht Sekunden.

Mallorca Expats Business beginnt mit einem technischen und inhaltlichen Audit. Welche URLs ranken? Welche Formulare erzeugen Leads? Welche Seiten sind dünn oder doppelt? Erst danach entscheiden wir Scope für Next.js.

Warum Next.js für GEO und klassische Suche passt

Next.js rendert Seiten serverseitig oder statisch. Weniger JavaScript erreicht den Browser. Bilder laufen über next/image mit modernen Formaten. URLs bleiben sauber: /themen/autonomo-beratung-mallorca statt ?page_id=847.

KI-Systeme und Google lesen dasselbe HTML. Wenn Ihr Firmenname in den ersten Absätzen steht und die Seite schnell lädt, steigt die Chance auf Zitate und Rankings. Langsame Builder-Seiten verlieren beides.

Migrationsplan in sechs Phasen

Phase 1 Inventar: Export aller URLs, Backlinks, organische Keywords, Formular-Ziele.

Phase 2 Architektur: Sitemap neu: Start, Leistungen, drei bis sieben Themenseiten aus dem Themenkatalog, Kontakt, Impressum, Datenschutz.

Phase 3 Design: An Circle-of-Excellence-Stil angepasst, mobile-first, klare Typografie, echte Fotos wo möglich.

Phase 4 Content: Migration als MDX, Umschreiben für GEO, Freigabe durch Sie.

Phase 5 Technik: Redirects, Sitemap, Search Console, Brand-Test.

Phase 6 Launch: Monitoring, 404-Fixes, Wartungsvertrag optional.

Redirect-Strategie ohne Ranking-Verlust

Jede alte URL erhält eine 301-Ziel-URL oder bewusste Entfernung mit 410. Wir dokumentieren in einer Matrix: alt, neu, Grund. Ketten über zwei Hops vermeiden wir. Parameter-URLs wie ?utm und Session-IDs normalisieren wir.

Makler mit historischen Objekt-URLs entscheiden: Top-Objekte behalten, Rest auf Stadtteil-Seiten umleiten. Blog-Tags konsolidieren wir zu Themenseiten. Nach Launch prüfen wir Search Console auf Crawl-Fehler täglich in Woche eins.

Performance: Core Web Vitals konkret

LCP: Hero-Bild optimiert, kein Fullscreen-Video autoplay.

INP: Wenig Client-JavaScript, Formulare schlank.

CLS: Feste Bildhöhen, Fonts preloaded.

Wir messen mit Lighthouse CI in der Pipeline und mit Field Data nach Launch. Ziel ist grün im Median, nicht ein perfekter Lab-Score bei leerer Seite.

Brand-Test vor und nach Go-live

Wir stellen zehn Kundenfragen in ChatGPT, Perplexity und Gemini. Beispiele: „Deutschsprachiger Steuerberater Mallorca Autónomo“, „Makler Palma Arras Erklärung“. Vor Migration speichern wir Screenshots. Nach Migration wiederholen wir.

Erfolg bedeutet: Ihr Firmenname erscheint mit Erklärsatz und ideally Ihrer URL. Fehlt der Name, schärfen wir Startseite und Themenseiten vor Marketing Ads.

Hosting auf Vercel und EU-Region

Production auf Vercel mit EU-Region oder vergleichbarer Plattform. Preview-Deployments pro Git-Branch für Ihre Textfreigabe. Secrets für E-Mail, CRM, Turnstile getrennt von Production.

DSGVO: Auftragsverarbeitung mit Host, minimale Logs, IP-Anonymisierung in Analytics. Kein US-Only-Tracking ohne Consent-Lösung.

MDX-Struktur für Themenseiten

Frontmatter: id, slug, title, description, updated_at. Body: direct-answer, key-takeaways, Abschnitte, Quellen, Glossar, FAQ. Interne Links zu Wissen, Steuern, Maps.

Komponenten wiederverwenden, Inhalt bleibt einzigartig pro Seite. Keine Template-Doppelung mit ausgetauschtem Ortsnamen.

Formulare und Sales Plus auf Next.js

Server Actions oder API-Routes senden Leads an Resend und CRM. Rate-Limit und Honeypot gegen Spam. Integration mit Sales Plus: Qualifizierungsfelder, Kalender-Webhooks, UTM-Weitergabe.

Mehrsprachigkeit

Hreflang für DE, EN, ES wenn nötig. Default Deutsch für D-A-CH. Separate URLs, kein Browser-Translate-Widget als Ersatz. Glossar verlinkt spanische Fachbegriffe wie [NIE](https://www.mallorca-expats.de[Nie Nummer](/wissen/konzepte/nie-nummer)?utm_source=mallorca-expats-business&utm_medium=business_themen) und [Arras](https://www.mallorca-expats.de[Arras Vorvertrag](/wissen/konzepte/arras-vorvertrag)?utm_source=mallorca-expats-business&utm_medium=business_themen) konsistent.

Sicherheit ohne WordPress-Angriffsfläche

Keine öffentliche wp-admin-URL. Dependencies per Dependabot. CSP-Header, HSTS, HTTPS-only. Admin-Bereiche hinter Auth. Formulare ohne SQL-Injection-Risiko durch ORM und Validation.

CI/CD und Rollback

Git main deployt Production. Pull Requests laufen Preview. Lighthouse-Schwellen blocken Merge bei Regression. Rollback: vorheriges Deployment in Sekunden aktivieren.

Zusammenspiel mit Redesign und GEO

Technik trägt Text. → Redesign klärt Look und Content-Mapping. → GEO-Optimierung definiert Themenschwerpunkte. Migration ohne GEO-Texte liefert schnelle leere Hülle.

Typische Fehler beim Relaunch

Go-live ohne Redirect-Map. Freitagabend-Launch ohne Bereitschaft. 4K-Bilder unkomprimiert. staging robots noindex vergessen auf Production. Formular testet nur Desktop. Brand-Test erst nach Launch.

Ablauf mit Mallorca Expats Business

Erstgespräch, Audit-Report, Festpreis-Scope oder Retainer, wöchentliche Preview-Links, Freigabe-Meilensteine, Launch-Begleitung, optional Wartungsvertrag.

Staging und DNS-Umschaltung

Vor dem DNS-Switch testen wir auf staging mit Basic Auth. TTL der A-Records senken wir 24 Stunden vorher auf 300 Sekunden. Nach Switch prüfen wir weltweit mit DNS-Checker. E-Mail-Postfach MX bleibt unberührt, nur Web-Traffic zeigt auf Vercel. Formular-Absender-Domain braucht SPF und DKIM für Resend.

Objekt- und Archiv-URLs bei Maklern

Historische Objekt-URLs mit schwachem Traffic leiten wir auf Stadtteil-Themenseiten um. Die Seite erklärt den Markt in Palma, Calvià oder Pollença und nennt Ihren Maklernamen. Starke Objekte behalten eigene URLs mit aktualisiertem MDX. Idealista bleibt Kanal, Ihre Domain trägt Erklär-Inhalte zu Arras und Nebenkosten.

Barrierefreiheit und Lesbarkeit

Kontrast WCAG AA, Fokus-Ringe für Tastatur, aria-labels auf Formularfeldern. Fließtext in 16px minimum, Zeilenlänge unter 75 Zeichen. Das hilft älteren Zuzüglern und verbessert Verweildauer. Screenreader-freundliche Überschriften-Hierarchie unterstützt SEO und KI-Extraktion.

Analytics ohne Cookie-Bloat

Matomo oder Plausible cookie-arm konfigurieren. Event: form_submit, book_call, scroll_depth auf Themenseiten. Kein GA4-Zwang. Consent-Banner nur wenn rechtlich nötig. Server-Logs anonymisiert für 404-Analyse.

Team-Schulung nach Launch

Kurzes Handout: Preview-URL öffnen, Kommentar in GitHub, Freigabe-Button. Kein FTP mehr. Bilder über definierter Ordner in Git oder CMS-light. Ansprechpartner bei Mallorca Expats Business für Notfall-Rollback.

Integration Google Business Profile

NAP-Daten identisch auf Website und GBP. Link zur stärksten Themenseite in GBP-Profil. UTM auf GBP-Website-Link für Attribution. Posts in GBP verweisen auf neue MDX-Artikel wenn Sie lokal aktiv posten.

WordPress, Headless und Next.js im Vergleich

Page-Builder liefern schnelle Mockups und schwere Seiten. Headless WordPress plus separates Frontend verdoppelt Betrieb. Mallorca Expats Business kombiniert Next.js und MDX in Git: Text und Code teilen Pipeline, Preview und Rollback. Steuerfrist-Updates landen als Pull Request mit Ihrer Freigabe.

Monitoring und Total Cost of Ownership

Uptime alle fünf Minuten, 404-Alerts, wöchentliches Lighthouse auf Startseite und Top-Thema, monatliche Search Console. Formular-Testlead jeden Montag. Plugin-Lizenzen und Hack-Fixes entfallen; Migration plus Retainer planen Kosten transparenter.

Middleware und Edge-Redirects

Next.js Middleware prüft Pfade vor dem Render und leitet Legacy-URLs in unter 50 Millisekunden um. Regex-Regeln aus der Redirect-Matrix landen im Code, nicht in einem Plugin. Bei Makler-Archiven leiten wir /objekt/2019-* auf Stadtteil-Themen. Logs zeigen verbleibende 404-Quellen wöchentlich.

Server Actions für Formulare

Kontaktformulare posten an Server Actions statt an PHP-Skripte. Validation mit Zod, Spam-Check serverseitig, Resend für Bestätigung. CRM-Webhook feuert nach erfolgreicher Validierung. Client sieht nur Erfolg oder Feldfehler, keine internen Stacktraces.

Bild-Pipeline und next/image

Büro- und Teamfotos liefern Sie in hoher Auflösung; Build erzeugt AVIF/WebP und sizes für Mobile/Desktop. Alt-Texte enthalten Leistung und Ort: „Steuerberatung Autónomo Palma, Kanzlei Mustermann“. Das stärkt Barrierefreiheit und Bildsuche.

Structured Data für LocalBusiness

JSON-LD mit name, address, areaServed, availableLanguage, sameAs Links zu GBP und Maps. FAQ-Schema auf Themenseiten mit echten Kundenfragen. Kein Schema-Spam mit erfundenen Bewertungen.

Launch-Checkliste und Rollback

48 Stunden vor DNS: Redirect-Matrix final, Formular-Tests iOS/Android, Lighthouse grün, Brand-Test Screenshots, Search Console Sitemap eingereicht, robots.txt Production korrekt. Am Launch-Tag: Monitoring verdoppeln, Team erreichbar, Rollback-Deployment in Vercel als Tab bereit. Nach 72 Stunden: 404-Report, Index-Status, erster KI-Retest mit drei Kundenfragen.

Zusammenarbeit mit Ihrem Steuerberater oder Anwalt

Fachliche Freigabe bleibt bei Ihnen. Mallorca Expats Business liefert MDX-Entwürfe in Git; Sie oder Ihr Partner kommentieren Zeile für Zeile. Steuerliche und rechtliche Passagen verlinken auf Steuern und Wissen, ohne Mandatsversprechen im Fließtext. So bleibt die Website schnell und rechtlich sauber. Nach dem Launch binden wir optional Marketing Ads an Ihre stärksten Themenseiten, sobald Brand-Test und Formular stabil laufen. Der Themenkatalog liefert die URLs, die Migration und GEO gemeinsam tragen. Hosting und Wartung planen wir im selben Retainer-Scope.

Nächster Schritt

Unverbindlich anfragen. Wir sagen ehrlich, ob Migration, Redesign oder nur Themenkatalog zuerst sinnvoller ist.

Quellen

1. Next.js Dokumentation: https://nextjs.org/docs
2. Vercel Dokumentation: https://vercel.com/docs
3. Web Vitals: https://web.dev/vitals/
4. Mallorca Expats Wissen: https://www.mallorca-expats.de/wissen/?utm_source=mallorca-expats-business&utm_medium=business_themen
5. Steuern Mallorca Expats: https://steuern.mallorca-expats.de/?utm_source=mallorca-expats-business&utm_medium=business_themen
6. Mallorca Expats Maps: https://maps.mallorca-expats.de/karte?utm_source=mallorca-expats-business&utm_medium=business_themen
7. Methode: GEO-Optimierung, Website-Modernisierung

Stand: Juli 2026. Migrationsdauer hängt von Legacy-Umfang und Freigabe ab.

Glossar

Next.js
React-Framework mit Server Rendering und Static Generation.

App Router
Routing-System ab Next.js 13 mit Layouts und Server Components.

MDX
Markdown kombiniert mit React-Komponenten für Themenseiten.

SSG
Static Site Generation zur Build-Zeit.

ISR
Incremental Static Regeneration für Content-Updates ohne Full Rebuild.

Core Web Vitals
Google-Metriken LCP, INP, CLS für Nutzererlebnis.

301 Redirect
Permanente Weiterleitung von alter zu neuer URL.

404 Monitoring
Überwachung defekter Links nach Migration.

Brand-Test
KI-Abfragen zur Markenerkennung vor und nach Launch.

Preview Deployment
Test-URL pro Git-Branch zur Freigabe.

Edge Region
Geografisch nahe Server für schnelle Auslieferung in EU.

CSP
Content Security Policy gegen XSS.

Hreflang
Sprach- und Regionshinweise für Suchmaschinen.

Structured Data
Schema.org JSON-LD für Organization und FAQ.

Lighthouse CI
Automatisierte Performance-Prüfung in Pipeline.

Git
Versionskontrolle als Single Source of Truth.

GEO
Optimierung für namentliche KI-Empfehlungen.
→ GEO-Optimierung

NIE
Ausländeridentifikationsnummer.
→ [NIE](https://www.mallorca-expats.de[Nie Nummer](/wissen/konzepte/nie-nummer)?utm_source=mallorca-expats-business&utm_medium=business_themen)

Autónomo
Selbstständigkeit in Spanien.
→ [Autónomo](https://www.mallorca-expats.de[Selbststaendigkeit Spanien Autonomo](/wissen/konzepte/selbststaendigkeit-spanien-autonomo)?utm_source=mallorca-expats-business&utm_medium=business_themen)

Residencia
Aufenthaltstitel.
→ [Residencia](https://www.mallorca-expats.de[Residencia Spanien](/wissen/konzepte/residencia-spanien)?utm_source=mallorca-expats-business&utm_medium=business_themen)

Modelo 720
Auslandsvermögen-Meldung.
→ Modelo 720

Arras
Immobilienvorvertrag.
→ [Arras](https://www.mallorca-expats.de[Arras Vorvertrag](/wissen/konzepte/arras-vorvertrag)?utm_source=mallorca-expats-business&utm_medium=business_themen)

Licencia
Genehmigung für Tätigkeit oder Bau.
→ [Licencia](https://www.mallorca-expats.de[Licencia Obras Mallorca](/wissen/konzepte/licencia-obras-mallorca)?utm_source=mallorca-expats-business&utm_medium=business_themen)

Maps
Anbieterkarte Mallorca.
→ Maps

Mallorca Expats Business
GEO und Next.js für Firmen.
→ Mallorca Expats Business