Zum Inhalt springen
← Alle Projekte

Ilka Krämer – Bilderzeit Fotografie

Endlich die Bühne für ihre Bilder.

Webdesign Performance Foto-Branding Online-Präsenz

Die Geschichte

Die Bilder waren da. Die Bühne hat gefehlt.

Ilka Krämer fotografiert seit Jahren das ganze Leben – Hochzeiten, Babybäuche, Familien, Pärchen, dazu Männer-Portraits und Business-Shootings – aus Spenge und Neukirchen-Vluyn, warm, ehrlich, mit einem Auge für Licht, Tiefe und echte Momente. Ihre Service-Linien tragen eigene Brand-Namen (Ja-Sager, Turteltäubchen, Babykugel, Rasselbande …) statt der üblichen Foto-Schubladen. Ihre Bilder waren immer grandios. Nur die Bühne dafür fehlte.

Die alte Website wurde ihren Aufnahmen nicht gerecht. Generisches Standard-Layout, schwere Ladezeit, Cookie-Banner und Tracking-Snippets, die sich zwischen Besucher und Foto stellten. Bilder, die Stimmung tragen, wurden in einem schweren Theme versteckt und hinter einer DSGVO-Wand verschleiert. Was Ilka brauchte, war keine lautere Site – sondern eine, die zurücktritt und ihre Bilder vorlässt.

"Endlich eine Seite, die zwischen den Bildern liest."

– Ilka Krämer, Bilderzeit Fotografie

Wir haben die Seite von Grund auf neu gebaut – diesmal so, dass sie sich nicht in den Vordergrund drängt. Vanilla HTML, CSS und JavaScript – kein React, kein Build, kein Bundle. Dahinter eine eigene Bildpipeline, die 47 Assets in einem Lauf konvertiert: aus 1.1 GB Quellmaterial werden 11 MB im Deploy, ohne dass die Krümel ihres Lichts verloren gehen. Plus eine Cache-Strategie mit Immutable-1-Jahr für Assets und ein eigenes Kontaktformular auf Ilkas Server – kein Formspree, kein Mailchimp, kein Postfach in der US-Cloud.

Leistungen

Was wir umgesetzt haben

01

Bild-Pipeline mit ffmpeg & WebP

47 Assets in einem Lauf – JPG nach WebP, q85, scale max 1920px, Logos lossless. 234 MB JPG werden 4.9 MB WebP, ohne sichtbaren Qualitätsverlust.

02

Vanilla statt Framework

Kein React, kein Build, kein 800-KB-Bundle. HTML5 + CSS3 + ein bisschen Vanilla JS – eine Foto-Site braucht Bilder, keinen Tooling-Stack.

03

Cinematic Detail-Arbeit

Hero-Cross-Fade-Slideshow, Magazin-Editorial, 12-Slot-Galerie mit tall/wide-Modifiern, TextPressure-Footer (ReactBits-Port mit Compressa VF), 3D-Tilt-Gutschein-Card – alles mit prefers-reduced-motion-Fallback.

04

Cache-Strategie ohne Drama

.htaccess mit immutable-1-Jahr für Bilder, CSS, Fonts; no-cache für HTML. User sehen Deploys sofort, Assets bleiben offline. Plus Gzip und Security-Header.

05

Eigenes Kontaktformular

Eigenes Mail-Skript auf Ilkas Server, Honeypot, Reply-To direkt in ihr Postfach. Kein Formspree, kein Drittanbieter, kein Tracking.

06

Foto-Direktion in 20+ Zyklen

MD5-Audit gegen Bild-Doppelungen, Galerie-Slots in Ilkas Markensprache umbenannt (Babykugel, Rasselbande, Pusteblume), object-position pro Portrait-Crop, Vater-hebt-Kind-Foto in die „Kind und Kegel"-Karte.

Ergebnisse

Was wir erreicht haben

−99%

Bandbreite (1.1 GB → 11 MB)

< 1 s

Time to Interactive

0

Tracker, Cookies, Banner

Aus einem Standard-Layout wurde eine Bühne, die zurücktritt und Ilkas Bildern Raum gibt. Schnell genug, dass Brautpaare beim ersten Tap an der Ampel schon die Hero-Galerie sehen. Leise genug, dass weder Banner noch Wartezeit zwischen Besucher und Bild stehen.

Technologien

HTML5 CSS3 Vanilla JavaScript Eigenes Mail-Skript Eigene Bildpipeline WebP TextPressure Compressa VF IntersectionObserver JSON-LD Hostinger rsync · ed25519 SSH Honeypot DSGVO-clean

Das Ergebnis ansehen

Schau Ilkas neue Seite selbst an.