Sympathie-Werbe-Service: Designhoheit trifft Performance

Sympathie-Werbe-Service oder kurz SWS hatte klare und konkrete Designvorstellungen, die mit einem klassischen Theme-Ansatz nur mit vielen Kompromissen umsetzbar gewesen wären. Ziel war deshalb eine individuell entwickelte Website, die visuell exakt zu den Mockups passt, technisch schlank bleibt und bei Performance sowie Wartbarkeit langfristig überzeugt.

Inhaltsverzeichnis

Lösung

Eingesetzte Technologien

Designumsetzung mit Mockups

Technische Umsetzung mit Astro und Svelte-Inseln

Performance und Hosting

Wartbarkeit und iterative Weiterentwicklung

Ergebnisse

Fazit

Lösung

Für dieses Projekt wurde bewusst eine selbstprogrammierte, statische Website umgesetzt. Der zentrale Grund: maximale Kontrolle über Design, Codequalität und Ladezeiten.

Statt auf eine UI-Library oder ein vorgefertigtes System zu setzen, wurde das Frontend mit Vanilla TailwindCSS aufgebaut. So konnten die konkreten Designwünsche von SWS ohne Umwege, ohne unnötigen Ballast und mit hoher Präzision umgesetzt werden.

Eingesetzte Technologien

• Astro.js als Framework für eine schnelle, statische Auslieferung und hohe Anpassbarkeit
• Vanilla TailwindCSS für pixelgenaue Gestaltung ohne Design-Limits durch Komponentenbibliotheken
• Svelte für gezielte interaktive Inseln innerhalb einer ansonsten statischen Architektur
• BunnyCDN für performante Auslieferung, insbesondere bei größeren Mediendateien

Die Entscheidung für Astro wurde auch aus Wartungs- und Team-Perspektive getroffen: geringer Overhead, klare Strukturen und eine kurze Learning Curve in der Umsetzung, wie wir im Beitrag Statische Websites im Vergleich: SvelteKit, Astro und Hugo detailliert einordnen.

Designumsetzung mit Mockups

Die Umsetzung erfolgte auf Basis detaillierter Mockups mit dem Anspruch, so pixelperfekt wie möglich zu arbeiten. Durch die Kombination aus individueller Entwicklung und Vanilla TailwindCSS konnten Abstände, Typografie, Komponentenverhalten und visuelle Hierarchien exakt nach Vorgabe umgesetzt werden.

Gerade bei kundenindividuellen Markenauftritten zeigt sich hier ein klarer Vorteil gegenüber Standard-Setups: Design wird nicht an das System angepasst, sondern das System exakt auf das Design.

Technische Umsetzung mit Astro und Svelte-Inseln

Die Website ist bewusst statisch gedacht und aufgebaut. Interaktivität wurde nur dort ergänzt, wo sie echten Mehrwert liefert. Dafür kam die Inselarchitektur von Astro in Kombination mit Svelte zum Einsatz.

Dieses Vorgehen sorgt für eine klare Trennung:

• statischer, hochperformanter Grundaufbau für Inhalte und Seitenstruktur
• kleine, gezielte interaktive Inseln für dynamische UI-Elemente

Das Ergebnis ist eine schnelle und robuste Website, die sich zugleich modern und flexibel anfühlt.

Performance und Hosting

Für die Auslieferung wurde BunnyCDN als europäischer Anbieter gewählt. Das verbessert die Ladezeiten im Zielmarkt und hilft besonders bei Seiten mit größeren Bild- und Mediendateien.

In Kombination mit statischer Generierung reduziert dieser Stack Serverlast, minimiert Engpässe und sorgt auch unter Last für eine verlässlich schnelle User Experience, wie sich auch im Leistungsbild Statische Website erstellen lassen widerspiegelt.

Wartbarkeit und iterative Weiterentwicklung

Das Projekt hat im Laufe der Zeit mehrere größere Änderungen durchlaufen. Gerade in solchen Iterationszyklen zahlt sich eine selbstprogrammierte Codebasis mit sauberer Git-Historie aus:

• Änderungen bleiben nachvollziehbar und kontrollierbar
• neue Anforderungen lassen sich ohne Architekturbruch integrieren
• Refactorings und Erweiterungen sind gezielt umsetzbar

Obwohl statische Seiten im Betrieb grundsätzlich weniger wartungsintensiv sind, wird die Website regelmäßig gepflegt. So bleibt die Toolchain aktuell, neue Anforderungen können schnell umgesetzt werden und die Entwicklungsqualität bleibt dauerhaft hoch, ohne die Produktionsumgebung unnötig zu belasten.

Ergebnisse

Die Entscheidung für eine individuell entwickelte, statische Website hat sich in mehreren Bereichen bewährt:

• Designtreue: hohe Übereinstimmung mit den Mockups
• Performance: sehr schnelle Ladezeiten trotz umfangreicher Medieninhalte
• Wartbarkeit: strukturierte Weiterentwicklung über mehrere Projektphasen hinweg
• Zukunftsfähigkeit: moderne, schlanke Architektur mit klaren Erweiterungspfaden

Fazit

Für SWS war die selbstprogrammierte Umsetzung der richtige Weg, weil sie drei zentrale Anforderungen gleichzeitig erfüllt: präzise Designumsetzung, maximale Performance und langfristige Wartbarkeit.

Mit Astro als Basis, Svelte-Inseln für gezielte Interaktivität, Vanilla TailwindCSS für vollständige visuelle Kontrolle und BunnyCDN für schnelle Auslieferung entstand eine statische Website, die nicht nur heute überzeugt, sondern auch für zukünftige Änderungen technisch sauber aufgestellt ist.

Wenn auch Sie Interesse an ganzheitlichen Lösungen anstatt magische Dreiecke haben, kontaktieren Sie uns gerne für eine unverbindliche Beratung!