Diese Website ist eine moderne, mehrsprachige Webanwendung aus einer Codebasis.
Hier ein Überblick über die wichtigsten technischen Bausteine.
Architektur & Stack
- .NET 10 (neueste .NET-Generation) mit C# 14 – durchgehend auf dem aktuellen Stand, ohne veraltete Abhängigkeiten.
- Blazor Web App – server-seitiges Rendering mit interaktiven Komponenten.
- Enhanced Navigation für schnelle Seitenwechsel ohne vollständigen Reload.
- Eine Codebasis bedient alle Auftritte: die Länder-Domains .ch / .de / .com und die Schweizer Sprach-Subdomains
fr. / it.swisskaraoke.ch.
- Saubere, modulare Architektur mit klarer Trennung von Infrastruktur und Features.
Mehrsprachigkeit
- Neun vollständig übersetzte Sprachen: Deutsch, Englisch, Französisch, Italienisch, Spanisch, Portugiesisch, Albanisch, Thai und Filipino.
- Im Sprachumschalter in 14 regionalen Varianten wählbar – Schweizer Varianten de-CH / fr-CH / it-CH, dazu de-DE, fr-FR, it-IT, en-GB / en-IE / en-US, es-ES, pt-PT, sq-AL, th und fil-PH.
- Fünf indexierte Regionalvarianten mit eigener Adresse & hreflang (de-CH, de-DE, fr-CH, it-CH, en-GB) – über die Länder-Domains .ch / .de / .com plus Schweizer Sprach-Subdomains (
fr. / it.swisskaraoke.ch).
- Die Markendomains .fr und .it leiten per 301 auf die passende Schweizer Sprachvariante – bewusste Konsolidierung der Suchmaschinen-Signale statt Duplicate Content über fast gleiche Seiten.
- Kuratierte Schweizerdeutsch-Ebene auf
.ch: Fliesstexte, Bedienoberfläche und Service-Beschreibungen erscheinen im Dialekt (regionale Nähe), während alles Suchrelevante – Seitentitel, Meta-Beschreibungen, Überschriften und FAQ-Fragen – sowie die Rechtstexte bewusst Hochdeutsch bleiben. Dialekt-Overrides pro Schlüssel; jeder nicht übersetzte Text fällt automatisch auf Hochdeutsch zurück.
- Regionale Inhalte statt Textkopien:
.de spricht seinen eigenen Markt an (Südbaden & Hochrhein statt Schweiz), Preise erscheinen je Domain in Landeswährung (CHF/EUR) mit tagesaktuellem Wechselkurs.
- Automatische Sprachwahl anhand der Domain; manuelle Umschaltung jederzeit möglich.
- resx-basierte Übersetzungsinfrastruktur, vorbereitet für weitere Sprachen und Regionen.
SEO / Google Search
- hreflang für alle Domains inklusive
x-default – saubere internationale Indexierung.
- Korrekte Canonical-Tags (kein Duplicate Content).
- Schema.org-Daten, server-seitig gerendert (eine Quelle der Wahrheit):
- LocalBusiness (Standort, Einzugsgebiet, Preisspanne, Öffnungszeiten).
- FAQPage für Rich Snippets.
- AggregateRating dynamisch aus echten Google-Bewertungen.
- Einzigartige Meta-Titel, -Beschreibungen und Open-Graph-Tags pro Seite und Sprache.
- Pro Domain passende Sitemap und robots.txt.
- Lokales Karaoke-Bars-Verzeichnis (Übersichts-Hub + Stadtseiten) als Top-of-Funnel-Content – geo- und sprachgesteuert auf die Schweizer Märkte (de-CH / fr-CH / it-CH).
Google-Integrationen (einwilligungsbasiert)
- Google Analytics 4 mit Lead-Erfassung der Kontaktformulare.
- Google Maps als datenschutzfreundliche, erst nach Einwilligung geladene Einbettung.
- Google Reviews live über die Places API – Bewertungen fließen in Anzeige und SEO-Daten.
- Jede Google-Komponente lädt ausschließlich nach expliziter Zustimmung.
Datenschutz
- Cookie-Consent (Klaro), DSGVO-/DSG-konform, mit getrennt steuerbaren Diensten.
- Kontextuelles Blockieren eingebetteter Inhalte bis zur Einwilligung.
- Keine externen CDN-Aufrufe: Schriftarten (Barlow) und Icons lokal ausgeliefert – kein IP-Transfer an Dritte (z. B. Google Fonts).
- Spamschutz der Formulare ohne externes Captcha – datenschutzfreundlich.
Interaktive Features & UX
- Live-Preisrechner mit Gäste-Slider.
- Verfügbarkeits-Check mit direkter Anfrage per WhatsApp oder Formular.
- Animiertes Bewertungs-Laufband (mit nativem Swipe auf Mobilgeräten).
- Dark-/Light-Theme – flackerfrei server-seitig vorgerendert.
- Hero-Video mit robustem mobilem Autoplay.
- WhatsApp-Chat-Widget, animierte Kennzahlen, sanfte Scroll-Effekte, Toast-Benachrichtigungen.
- Durchgängig responsiv auf allen Gerätegrößen.
Barrierefreiheit
- Accessible Names auch für per JavaScript injizierte Elemente (z. B. Cookie-Dialog) – korrekte aria-Labels statt leerer Titel.
- Korrekte ARIA-Rollen (z. B.
role="img" mit Label am Sterne-Rating).
- Rücksicht auf
prefers-reduced-motion – Animationen werden reduziert ausgespielt.
- Semantisches HTML, sichtbarer Fokus, dekorative Icons konsequent via
aria-hidden.
- Kontakt- und Schnellanfrage-Formular mit Validierung und Versandbestätigung.
- Spamschutz ohne externes Captcha: Honeypot-Felder + Mindest-Ausfülldauer.
- Erfolgreiche Anfragen werden – bei erteilter Einwilligung – als Lead-Ereignis erfasst.
Sicherheit & Stabilität
- Security-Response-Header auf allen Antworten: durchgesetzte Content-Security-Policy, HSTS (2 Jahre inkl. Subdomains + Preload), Referrer-Policy, Permissions-Policy, X-Content-Type-Options, Cross-Origin-Opener-Policy.
- CSP-Verstoß-Monitoring: eigener Report-Endpunkt (
/api/csp-report → Seq) erfasst Policy-Verletzungen für Diagnose und laufende Härtung.
- Tech-Stack-Verschleierung:
Server- und X-Powered-By-Header werden entfernt – weniger Angriffsfläche.
- Per-IP Rate Limiting (Token Bucket, 429) – statische Assets und Blazor SignalR sind ausgenommen.
- Echte Client-IP hinter dem Edge: Die Besucher-IP wird zentral aus den Front-Door-Headern (
X-Azure-ClientIP, Fallback X-Forwarded-For) statt aus der Proxy-Adresse ermittelt – so greifen Rate-Limiting, Geo-Zuordnung, Request-Logging und Lead-Herkunft pro echtem Besucher statt pro Edge-Knoten.
- Origin-Absicherung hinter Front Door: Die App-Server nehmen ausschliesslich Traffic vom eigenen Front Door an – geprüft über Azure-Service-Tag und die eindeutige
X-Azure-FDID-Kennung. Direktzugriffe am Edge vorbei werden mit 403 blockiert; damit ist die vertrauenswürdige Header-Kette (echte Client-IP, Protokoll) nicht fälschbar und das Rate-Limiting nicht umgehbar.
- HTTP Resilience (Retry + Circuit Breaker) für alle externen HTTP-Clients (Google Places API, IP-Service, E-Mail-Service) via
Microsoft.Extensions.Http.Resilience.
- Fail-Fast DI: Startup-Fehler brechen den Start sichtbar ab statt still zu verschlucken.
- Bootstrap-Logger fängt Exceptions vor dem vollständigen Logger ab – auf Azure im Log Stream sichtbar.
- Kein externes Mapping-Framework: Formular-Daten werden ohne AutoMapper-Abhängigkeit direkt gemappt.
- Automatisierte Tests (Unit-Tests) für SEO-Metadaten, Schema.org, Domain-Sprachzuordnung, Request-Logging, IP-Validierung und Client-IP-Ermittlung hinter Front Door.
- Kontinuierliche Qualitätssicherung: statische Code-Analyse mit ReSharper und SonarQube Cloud (Quality Gates in der CI-Pipeline).
- Gehostet auf Microsoft Azure; jede Domain läuft über eine eigene Azure-DNS-Zone und ein eigenes Azure-Front-Door-Profil – mit verwaltetem, automatisch erneuertem TLS-Zertifikat und globalem Edge-/CDN-Layer (Routing, TLS-Terminierung, DDoS-Schutz an der Edge).
- Weiterleitungen laufen an der Edge, nicht in der Anwendung: Apex auf
www (308) bei den Inhalts-Domains, 301 auf die Schweizer Sprachvariante bei .fr/.it – der Ursprungsserver wird dafür gar nicht erst angefragt.
- Asset-Fingerprinting sowie gebündelte, minifizierte CSS/JS (via esbuild) – kein veraltetes BuildBundlerMinifier.
- Schlanke, lokal ausgelieferte Frontend-Assets: nur eine Icon-Library (Bootstrap Icons) und Schriftarten (Barlow) selbst gehostet – keine externen CDN-Aufrufe (besser für Datenschutz und LCP).
- MapStaticAssets (.NET 9+) mit automatischem Brotli/Gzip und ETag-Caching.
- Caching von Bewertungen und wiederkehrenden Daten (IMemoryCache mit Sliding + Absolute Expiration).
- Lazy-Loading und komprimiertes Hero-Video (MP4 + WebM).
- Core-Web-Vitals-Optimierung: LCP-Bild mit
fetchpriority="high" vorgeladen (nur Startseite), below-fold lazy geladen; feste Bildmaße verhindern Layout-Shift (CLS).
- Strukturiertes Logging (Serilog → Seq) und Telemetrie (Azure Monitor OpenTelemetry Distro) – Microsofts strategische Richtung, kein klassisches App-Insights-SDK.
- Request Logging Middleware erfasst jeden HTTP-Request inkl. Scanner-Probes (Status-Code, Client-IP, User-Agent) – schliesst den Blind-Spot von rein page-basiertem Logging.
- Automatisiertes CI/CD-Deployment über Azure DevOps.
Entwickelt von Subwork.