Niko Karasek: persönliche Website für einen Fernsehreporter
Persönliche Website für Niko Karasek, Fernsehreporter, Russland-Experte und Keynote-Speaker aus Hamburg. Von Konzept über UX/UI bis zur Umsetzung: Showreel-Startseite, Archiv aus 18 Reportagen, interaktive Dreh-Landkarte, Hell-/Dunkel-Modus, 4 Sprachen, Barrierefreiheit nach WCAG, SEO und rechtssichere Seiten nach deutschem Recht. Schnell und sauber auf jedem Gerät.
Zur Website: nikokarasek.comAuf einen Blick
Durchgängig im grünen Bereich
mance
ibility
Practices
mance
ibility
Practices
Durchgängig im grünen Bereich, Barrierefreiheit, Best Practices und SEO nahe 100 auf Mobile wie Desktop. Und das bei einer datenintensiven Seite mit Video, interaktiver Landkarte und 4 Sprachen.
Umsetzung
- Struktur, die zugleich als Werkschau für Redaktionen und als Speaker-Visitenkarte funktioniert
- Redaktioneller, „fernsehnaher" Markenauftritt statt Baukasten-Template
- Konsistente visuelle Sprache über alle Seiten: Start, Filme, Karte, Recht
- Reportagen aus Dutzenden Ländern nach echter Geografie verortet
- Klick auf einen Punkt öffnet den Film direkt auf der Karte
- Leichtgewichtig als Canvas-Globus (kein WebGL), rotiert automatisch
- Alle Filme öffnen in Lightbox/Embed, kein Absprung zu YouTube
- Datenschutzfreundlich über youtube-nocookie
- Archiv nach Aktualität sortiert, mit Vorschaubildern
- Hell-/Dunkel-Modus und 4 Sprachen, Auswahl wird gemerkt
- Ohne Flackern angewandt (vor dem Rendern)
- vCard, Schema.org, Open Graph, sitemap & robots
Schnell und zugänglich
- Animierte Assets durch statische Bilder ersetzt: 1,3 MB → 29 KB
- Preloader von ~1,6 s auf ~0,65 s halbiert
- Layout-Shifts minimiert (CLS 0,011), Bilder vorab dimensioniert
- Sichtbarer Fokus, Tastaturbedienung, ARIA, Focus-Trap
- prefers-reduced-motion in allen Animationen respektiert
- Impressum (§5 DDG, §18 MStV) & Datenschutz (DSGVO)
Eingesetzte Technik
Von der Linksammlung zur eigenen Marke
Aus einer Sammlung von YouTube-Links wurde eine eigenständige redaktionelle Website: Showreel, Archiv, Dreh-Landkarte, 4 Sprachen, zwei Themes, Barrierefreiheit und eine rechtssichere Basis für Deutschland. Spürbar schnell auf dem Handy, PageSpeed durchgängig grün. Konzept, Design und Umsetzung aus einer Hand.