Eine Gärtnerei-Website mit klarem Fokus: lokale Kundschaft binden — und Gutscheine zum Lieblingsgeschenk machen.
Lokale Kundschaft, die Angebote, Sortiment und die Geschichte hinter der Gärtnerei entdecken will.
Der Gutschein-Generator macht aus Suchenden Käufer — personalisiert, mit Motiv und Wunschbetrag.
Grüne Events und Workshops für alle, die selbst Hand anlegen und dazulernen wollen.
Die Lovestory-Seite erzählt die Marke — Nähe und Vertrauen für die Kundschaft von morgen.
Alles handgebaut — ohne Framework, ohne Stockfotos.
Live-Vorschau, wählbare Motive, Schnellbeträge und Personalisierung mit Namen & Widmung.
Herzstück der SeiteFehlende Eingaben werden markiert und sanft geschüttelt (Shake-Feedback) statt kalter Fehlermeldungen.
UX-DetailVier große, illustrierte Kacheln führen zu Lovestory, Angeboten, Gutscheinen und Events.
Home-ErlebnisDie Geschichte aus Leidenschaft — Markenbildung durch Erzählung statt Produktliste.
StorytellingAngebotsübersicht der Gärtnerei mit durchgängiger Illustrations-Sprache.
SortimentJede Grafik handgezeichnet als Vektor — null Bild-Downloads, gestochen scharf auf jedem Display.
0 Fotos · 0 KB BilderFarbskalen, Radien, Schatten und Übergänge als saubere Variablen — wartbar wie ein Design-System.
style.cssNutzereingaben im Gutschein werden per escapeHtml() entschärft, bevor sie gerendert werden.
script.jsRollen, aria-labels und aria-hidden auf Dekoration — die Basis für Barrierefreiheit steht.
SemantikGeprüft wurde der echte Code: index.html, style.css, script.js. Karte anklicken für Details — was fertig ist, und was fehlt.
Ein wunderschöner, liebevoll gebauter Prototyp mit einem Verkaufsargument, das viele große Websites nicht haben (der Gutschein-Generator). Aber: Desktop-only (feste 1366px-Breite), keine Rechtstexte (Impressum/Datenschutz — Pflicht in DE) und die Bestellung ist bisher nur simuliert. Der Weg zur echten Website ist klar — und kürzer, als es aussieht.
Fünf Seiten stehen: Home mit Kachel-Navigation, Lovestory, Angebote, Gutschein-Generator und Events — mit eigener Illustrations-Sprache, drei abgestimmten Schriften und sauberem Token-CSS.
Motivwahl, Live-Vorschau, Beträge, Personalisierung, Validierung mit Shake-Feedback und Bestätigungs-Modal — inklusive XSS-Schutz.
Viewport steht auf festen 1366px — auf dem Handy ist die Seite unbenutzbar, dabei kommt dort die Mehrheit der Besucher an. Dazu fehlen Impressum & Datenschutzerklärung (in Deutschland Pflicht) und die Google Fonts sollten DSGVO-konform lokal gehostet werden.
Meta-Description, OG-Tags, Favicon und eigene URLs pro Seite (aktuell wechseln die Seiten nur per JavaScript — Google sieht eine einzige Seite). Ein Nachmittag Arbeit, große Wirkung.
Die Bestellung ist bisher simuliert. Es fehlen: PDF-Erzeugung des Gutscheins, E-Mail-Versand und Bezahlung (z. B. PayPal/Stripe) — dann wird aus dem Generator ein echter Umsatzkanal.
Fokus-Management beim Seitenwechsel, echte Fotos der Gärtnerei als Ergänzung zu den Illustrationen, und Aufteilung der 836-Zeilen-HTML in wartbare Teile.