Hamburger Webentwickler für TYPO3, OXID und mehr...

Ich bin seit vielen Jahren in der Webentwicklung tätig und programmiere Internetseiten, Webanwendungen und Onlineshops.  Dies geschieht in Kooperation mit Designern und anderen Webworkern sowie auch als externer Mitarbeiter von Agenturen und natürlich auch direkt mit meinen Kunden. Ich bin im Raum Hamburg tätig - betreue aber auch Kunden in ganz Deutschland.

Meine aktuellen Schwerpunkte liegen in der TYPO3 und OXID eSales-Entwicklung. Hier setze ich individuelle Designvorlagen um, erweitere den Funktionsumfang und programmiere maßgeschneiderte Extensions. Für kleinere Projekte kommen aber auch Wordpress und Joomla zum Einsatz.

Ein weiterer Schwerpunkt ist die Frontend-Entwicklung unter Berücksichtigung der aktuellen Standards, wie Responsives Webdesign, Interaktivitäten und Animationen unter Einsatz von Javascript/jQuery. 

Aktuelle Referenzen

  • Online-Shop mit Konfigurator

    MEISTER Schmuck

    OXID Enterprise, mehrsprachiges Multi-Domainsystem mit TYPO3 7.6-Verbindung über TOXID. Individuelles Bootstrap-Template und 3D-Ring-Konfigurator.

    Schnittstelle zu Web-GL-Player und zum CSV-Export mit Produktdaten.
  • Vegan Cycling Team

    Tour für Tiere

    Bootstrap-Onepager mit TYPO3 7.6
  • Wedding - Fashion - Style

    Hochzeit.de

    Weiterentwicklung des Hochzeits- und Modeportals in TYPO3 (2014-2015)

    Programmierung einer Ajax-gesteuerten Branchenbuch-Aktionsbox mit der Google Maps API 3.

    Mit jQuery-UI-Elementen zur Umkreissuche, extern angebundenem Dienstleister zur Standortbestimmung und Merkzettel-Funktion.
  • Fortbildungskurse

    CBW-Weiterbildung

    Relaunch in TYPO3 6.2 unter Einsatz von Fluid & Extbase (2014)

    Relaunch der bestehenden Seite mit Kursbrowser mit Ajax-Suchfunktionen inkl. Buchungssystem, News-Bereich und diverser Backend-Module.
    Optimierung des Datenmodells und der zur Verfügung stehenden Adminstrationswerkzeuge.

    Aufgrund der Kursdaten in der Datenbank werden in Echtzeit PDF-Flyer für die Darstellung im Web generiert, parallel auch in einer hochauflösenden Print-Variante für die Produktion des hauseigenen Kurs-Kataloges.
  • OXID Webshop - Responsive

    Ber-Bek Kochbekleidung und Zubehör

    OXID eShop (2014)

    Programmierung eines (Teil-)Responsiven Shop-Templates für den Kochbekleidungs-Hersteller, unter Einsatz von TOXID, der CMS-Erweiterung für ein parallel laufendes Wordpress-System für statische Inhalte.


  • Webanwendung

    Mind Unlimited

    Umsetzung in TYPO3 (2011-2013)

    Individuelle Programmierung des Ferienkursportals mit Listen- und Kartenansicht, umfangreichiem Buchungssystem, Versand von Bestellbestätigung und Rechnung, automatisierte Versicherung von Teilnehmern.
    • Mahnwesen mit mehreren Mahnstufen und Inkassoweiterleitung
    • Automatische Generierung von Kursunterlagen für Kursleiter
    • Büchershop 
    • Feedback-System
  • OXID 4.3 - Shop

    Farbenhaus Metzler

    Farbenhaus-Onlineshop - in OXID eShop 4.3 (2011)

    Programmierung Template: Für die Administration der Startseitenbilder und Slider-Grafiken wurden mehrere Extensions programmiert.

    Individualisierung aller Shop-Seiten inkl. des Checkout-Prozesses.

    Einbindung mehrerer Payment-Schnittstellen.

    Anbindung an OXID eFire.
  • Sympathischer Friseurladen in Hamburg

    Haircraft

    Design und Programmierung (2013)

    Internetauftritt im Joomla CMS.

    Das Design "Gold auf Strass-Tapete" entstand in Zusammenarbeit mit dem Fotografen Andreas Wussow.

    Optimierung für Suchmaschinen und Ergänzung um Facebook-Open-Graph-Tags.
  • Edler OXID eShop

    Das Herrenhaus

    Auf Grundlage der OXID eShop CE-Edition 4.3 entstand dieser individuelle Online-Shop.

    Hierfür wurde das gesamte Template einschließlich des Warenkorb-Prozesses umgestaltet.

    Für eine benutzerfreundliche Verwaltung der Bilder und Grafik-Elemente wurde der Adminbereich um mehrere Module erweitert.

    Listen- und Detailansicht wurden individuell angepasst.
Smartphone, Tablet, Desktop - einmal für alle

Responsive Webdesign - das anpassungsfähige Layout



Durch den ständigen Zuwachs mobiler Endgeräte entstehen neue Anforderungen für Webseiten-Betreiber. Denn in der Regel sind Internetseiten, die für den Desktop optimiert wurden auf den kleinen Displays nicht wirklich benutzerfreundlich. Google hat bereits 2012 eine interessante Studie veröffentlicht, nach der der Anteil der Webseitenaufrufe durch Smartphones und Tablets auch in der Zukunft noch weiter zunehmen wird. Desweiteren konnte nachgewiesen werden, dass mobile Nutzer, die nach lokalen Informationen suchen, bezüglich ihrer Suchergebnisse auch in höherem Maße aktiv werden. Es kann also sehr lohnenswert sein, eine optimale Darstellung ihrer Inhalte auf den verschiedenen Ausgabegeräten zu verwirklichen.
Responsive Webdesign - das anpassungsfähige Layout
Mit Responsive Webdesign können sie über ein einziges Template eine optimale Darstellung ihrer Inhalte auf verschiedenen Ausgabegeräten bewirken.

Hier sehen Sie meine aktuelle Startseite auf 3 unterschiedlichen Geräten


(c) 2014 - Axel Seemann-Kahne 
Hierzu bieten sich derzeit verschiedene Möglichkeiten an, diese Anforderungen umzusetzen. Grundlegend ist hier die zunächst die Frage, ob Sie in erster Linie wiederkehrende Stamm-Besucher haben, oder ob sie darauf bauen, von mobilen Nutzern in Suchergebnissen gefunden zu werden. Folgende Möglichkeiten bieten sich an:

  • das Bereitstellen von nativen Apps / HTML5-Apps, die über die Appstores der verschiedenen Plattformen (Windows Phone, Android, IOS, ...) installiert werden können. Nachteile sind hier jedoch der hohe Kostenaufwand für die Entwicklung auf den unterschiedlichen Systemen und die Hürde für Ihre Besucher, eine solche App zuerst einmal installieren zu müssen. Haben sie aber bereits einen wiederkehrenden Kundenstamm, dient eine mobile App natürlich sehr gut zur Kundenbindung.

  • das Bereitstellen einer mobilen Webseiten-Version: Per Browserweiche können bestimmte Geräte erkannt und zu einer mobilen Version umgeleitet werden. Dies bedeutet jedoch, dass Sie hier mehrere System pflegen müssen: Einmal hinsichtlich redaktionellen Inhalts und Bildmaterials. Und sollten Sie ihr Angebot und ihre Template einmal erweitern, müssen Sie in der Regel auf 2 Plattformen parallel weiterentwickeln. Weiterer Nachteil: Auflösungen und Formate von mobilen Geräten sind derart heterogen, dass eine weitere Version ihres Internet-Angebots auch nur ein Kompromiss darstellt. Wenn Ihre Kunden jedoch über den mobilen Zugang nur bestimmte ausgewählte Inhalte sehen sollen, ist eine mobile Webseiten-Version möglicherweise die richtige Wahl.

  • Responsives Webdesign: Anstatt eines festen Layouts besteht Ihre Webseite hier aus einem flüssigen Raster, welches sich entsprechend der Browserfenstergrößen anpasst. Das bedeutet, dass sich ein Template sowohl an ein Full-HD-Display am Desktop, an eine geringere Auflösung am Tablet sowie an ein kleines Smartphone-Display anpassen kann. Zwar ist die Entwicklung eines Responsiven Templates ebenfalls etwas aufwändiger, jedoch können sie dabei an ein System für alle Plattformen und Endgeräte aufbauen und weiterentwickeln.

Aus technischer Sicht bedeutet Responsive Webdesign ein Umdenken von festen Größen zu prozentualen Größenangaben von Layoutelementen und Schriften. Es orientiert sich auch nicht an den verschiedenen Geräten, sondern an den darzustellenden Inhalten. Erst wenn Inhalte nicht mehr optimal dargestellt werden können, kommen hier noch - neben den fließenden Rasterlayouts die Möglichkeiten des Adaptive Webdesigns hinzu. 

Media Queries und Breakpoints

Dies bedeutet, dass hier durch den Einsatz sogenannter Media Queries bei dem Erreichen bestimmter Größen - sogenannter Breakpoints - auf eine andere Darstellung umgeschaltet werden kann: Wird ein Bild zu klein, kann es ausgeblendet oder durch ein alternatives Format ersetzt werden - oder es kann beispielsweise die Navigation für die Bedienung auf einem kleinen Smartphone-Touchscreen durch größere Finger-taugliche Buttons optimiert werden.

Adaptive vs. Responsive

Es ist natürlich auch möglich, rein auf Adaptive Webdesign zu setzen und auf flüssige Layouts zu verzichten. Hier würde man dann feste Pixelwerte als Breakpoints setzen, die zum Beispiel auf folgenden Größen-Annahmen beruhen:
  • Smartphones: 320px bis 480px
  • Tablets: 768px bis 1024px
  • Desktop: 1024px und höher 
Zwar verspricht diese Vorgehensweise eine bessere Kontrolle über die jeweiligen Layouts und Bildergrößen. Allerdings wird sich in der Praxis zeigen, dass es viele Geräte gibt, die von diesen Normen abweichen und deren Display-Größen somit nicht optimal genutzt werden können.

Fazit

Responsive Webdesign ist eine Abkehr von absoluten Layouts und sollte auch nicht auf die Optimierung von 2 oder 3 Geräten begrenzt werden, womit man lediglich von einem starren Gerät ins andere blickt. Vielmehr sollte man sich mit der Vielfalt an Betrachtungsmöglichkeiten auseinandersetzen und anerkennen, dass man sich hier für alle auf dem Markt befindlichen - und auch zukünftigen - Geräte wappnen kann.

Mobile Webseiten-Versionen sind eventuell sinnvoll, wenn nur bestimmte Bereiche des Internetauftritts für den mobilen Zugang bereitgestellt werden sollen.

Für größere Projekte mit einer großen Anzahl von Nutzern ist der größere Aufwand für die Erstellung von Apps für verschiedene Plattformen zu rechtfertigen.


Zurück zur Übersicht