Webrelaunch
Food & Beverages . Digital Experience

Aufgabe

Houdek wollte die technische Basis der eigenen Website verbessern. Mit der Umstellung von Typo3 auf Pimcore sollten unter anderem ein Formularbuilder und Gewinnspielschnittstellen für Salesaktionen eingerichtet werden. Ein weiteres Argument pro Pimcore war die leichtere Contentpflege der Website. Die technische Neugestaltung ging mit einer Neustrukturierung der Navigation und einem Refresh des Erscheinungsbildes einher. Die Aufgaben waren dabei kostenfreundlich verteilt: Houdek lieferte die Inhalte, wir kümmerten uns um das Screendesign, die technische Umsetzung und SEO.

Umsetzung

Qualitätssichere Basis

Für die Umstellung auf Pimcore richteten wir zunächst den Server der zukünftigen Website ein: Systemanforderungen des CMS, Zugang zum FTP-Server, Netzwerkprotokoll SSH, MySQL und Installation der aktuellsten Version von PhP – alle Schritte lagen bei unseren Fullstack-Entwicklern in kompetenten Händen. Darüber hinaus setzten wir eine Deploymentumgebung für die gegenwärtige und zukünftige Entwicklung der neuen Website auf. Damit stand die Qualität der Website langfristig auf einer sicheren Basis. Denn unsere Deploymentumgebung schuf die Voraussetzung dafür, dass jedes zukünftige Update sowie Upgrade eingespielt und getestet werden kann, bevor dieses auf das Livesystem ausgeliefert wird.

Effizienter Designprozess

Nach der Finalisierung SEO-relevanter Keywordsets und der Navigationsstruktur stand das Screendesign der neuen Website im Fokus. Im Zuge der Erstellung des Look and Feel definierten wir Content- und Funktions-Module inkl. Aufbau, Funktionalitäten und Anbindungen, die programmiert werden mussten. Auch das responsive Screendesign legten wir in der Darstellung Desktop, Tablet und Mobile fest. Nach der Freigabe durch Houdek arbeiteten wir das Screendesign exemplarisch für folgende Kategorien aus:

• Startseite
• Navigation, offen und geschlossen
• Produktübersichtseite
• Produktdetailseite
• Rezeptübersichtseite
• Rezeptdetailseite
• Textseite (z. B. Impressum, Datenschutz)
• Spezial-Elemente (Formular, Listen-Ansichten, etc.)
  

So konnten mit nur wenigen Layouts die Programmierung und spätere Befüllung der insgesamt 107-seitigen Website angegangen werden.

Auf modern programmiert

Auf dem Weg zur Modernisierung der Website haben wir in der Programmierung die abgestimmten Designvorgaben und individuellen Kundenwünsche umgesetzt. Die Menüführung der Website realisierten wir als Sticky Navigation – also eine Navigation, die beim Scrollen am oberen Bildschirmrand sichtbar bleibt. Für die Contentmodule Überschriften, Copy, Link-Buttons und Listen wurde der CSS-Style hinterlegt. Die Programmierung der Standardmodule umfasste Header small/large/none, Text, Bild, Text/Bild, Zitat, Teaser. Als Spezialmodule wurden ein Karussell, Akkordeon und eine Link-Liste umgesetzt. Neue Flexibilität auf der Kontaktseite und etwaigen Gewinnspielseiten erhielt Houdek durch unseren Formularbuilder, über den wir per Drag and Drop schnell die gewünschten Formulare, inklusive Captcha, erstellen können. Des Weiteren richteten wir eine API für die Abwicklung von immer wieder stattfindenden Gewinnspielen auf der Houdek-Website ein. Damit wurden die Sammlung von Daten und das Bestimmen von Gewinnern automatisiert und vereinfacht. Zu guter Letzt programmierten wir für die zahlreichen Kabanos-Rezepte und sonstigen Datenobjekte im Backend eine Filter-Logik mit Listenansicht und Paginierung-Detailansicht, damit der richtige Content noch leichter an der richtigen Stelle ausgespielt werden konnte.

Kunde