Gut ein Jahr nach dem Start von datly war es Zeit für eine ehrliche Bestandsaufnahme: Die App funktionierte, sah aber aus wie das, was sie war, nämlich Bootstrap mit Standardeinstellungen. Seit dieser Woche läuft auf datly.eu das komplette Redesign. Intern heißt es „Fokus“, und der Name ist Programm.
Ein eigenes Design-System statt Bootstrap
Die größte Entscheidung zuerst: Bootstrap und Font Awesome sind raus. An ihre Stelle tritt ein eigenes, schlankes Design-System in einer einzigen CSS-Datei:
- Space Grotesk für Text und Überschriften, JetBrains Mono für Zahlen und Statistiken, beide self-hosted
- Eine ruhige Palette aus Navy und einem kräftigen Blau statt Framework-Grau
- Lucide-Icons als Inline-SVGs statt einer Icon-Font, geladen wird nur, was auf der Seite steht
Der angenehme Nebeneffekt: datly lädt keine einzige externe Ressource mehr. Keine CDN-Fonts, keine Framework-CSS, selbst die Chart-Bibliothek im Admin-Bereich liegt lokal. Das ist gut für den Datenschutz, gut fürs Tempo und erlaubt eine strenge Content-Security-Policy.
Der vereinte Ergebnisblock
Fachlich war das größte Stück der Ergebnisbereich einer Umfrage. In der alten Version waren Abstimmformular, Ergebnistabelle und „Gemeinsame Termine“ drei getrennte Blöcke, die man gedanklich selbst zusammensetzen musste. Jetzt ist alles ein vereinter Block: Die eigene Zeile zum Abstimmen steckt direkt in der Ergebnistabelle, die besten Termine liegen als anklickbare Chips darüber.
Mobil war vorher horizontales Scrollen durch breite Tabellen angesagt. Das neue Gitter blättert stattdessen spaltenweise mit Pfeilen und Seitenanzeige, wie man es von Karussells kennt. Auf einem 375-Pixel-Display ist das der Unterschied zwischen benutzbar und frustrierend.
Unter der Haube: SEO und Sicherheit
Zwei Dinge habe ich im Zuge des Umbaus gleich mit erledigt:
- SEO-Architektur: Die Sprachversionen (
?lang=de/?lang=en) werden jetzt direkt mit HTTP 200 ausgeliefert statt per Redirect, jede Sprachversion ist self-canonical und die hreflang-Verlinkung stimmt. Vorher hat Google die englischen Seiten schlicht nicht sauber gesehen. - Security-Audit: Drei getrennte Prüfungen (Auth und Zugriffskontrolle, Injection und Ausgabe, Konfiguration) ergaben keinen kritischen Befund. Trotzdem gab es Härtungen: strenge CSP, HSTS, längere Vote-Tokens, Path-Traversal-Schutz über Whitelists und saubere Cookie-Flags.
Bemerkenswert unspektakulär war der Go-Live: Das Redesign ist ein reines Frontend-Projekt, das Datenbankschema blieb unangetastet. Alle bestehenden Umfragen, Mitmach-Links und Konten funktionieren unverändert weiter. Alte Version wegbenennen, neue hochladen, Smoke-Test, fertig.
Was ich mitnehme
Ein Framework wie Bootstrap ist ein großartiger Start und irgendwann eine Bremse. Der Wechsel auf ein eigenes System hat sich gelohnt, weil datly klein genug ist, dass eine Person das CSS komplett im Kopf behalten kann. Genau dafür baue ich diese Nebenprojekte ja: Entscheidungen einmal komplett selbst treffen, mit allen Konsequenzen.
Wenn du das neue datly ausprobieren willst: datly.eu, wie immer kostenlos, werbefrei und ohne Registrierungszwang. Rückmeldungen gerne über das Kontaktformular.
