Technische Umsetzung klicc.at
Nachdem klicc.at nun bereits seit 1 Monat online ist und in der Zwischenzeit auch mit einem Blog ausgestattet wurde, reiche ich nun den Bericht zur technischen Implementierung nach.
Konzeption
Ziel war es, aus bewusst reduziertem Content mehr zu machen und die Usability in den Vordergrund zu stellen.
Im Grunde besteht die Webseite aus einer Hauptseite mit verschiedenen Sektionen, die über eine Sticky Navigation angesteuert werden können. Darüber hinaus gibt es einen Blog und zwei weitere Informations-Seiten.
Usability
Auch bei internen Projekten sollte die Maintainability nicht außer Acht gelassen werden. Deshalb wurde es von Anbeginn an wie ein Kundenprojekt behandelt, mit dem Ziel, die Seite nach kurzer Einschulung von einem beliebigen Content-Editor bedienen zu lassen.
Content Management System
Als CMS wurde aufgrund der einfachen Handhabung im Backend und unschlagbarer Blogging-Funktionen, WordPress eingesetzt. Das maßgeschneiderte Theme wurde von Grund auf neu entwickelt und setzt weitgehend auf zukunftssichere Technologien wie HTML5 und CSS3.
Das beste Surf-Erlebnis gibt es natürlich mit modernen Browsern, aber ältere Versionen werden dennoch unterstützt.
Mehrsprachigkeit
Da eine weitere Voraussetzung war, die angebotenen Inhalte auch in Englisch anzubieten, musste eine Lösung für das Problem mit mehrsprachigen Seiten gefunden werden.
Es gibt unzählige Plugins, die hier installiert werden könnten aber nachdem es immer besser ist, CMS-Core-Funktionalität einzusetzen, um den Upgrade-Prozess auf neue Versionen zu vereinfachen, wurde nach einer Alternative gesucht und in Form von Multisite („Erstellung eines Seiten-Netzwerks“) gefunden.
Vorteile von Multisite im Vergleich zu Plugin-Lösungen
- Native Lösung, die direkt in WordPress integriert ist
- Einfacher Upgrade-Prozess auf neue WordPress-Versionen
- Unabhängige Instanzen mit getrennten Datenfeldern
- Seiteninhalte können pro Instanz ganz einfach exportiert/importiert werden
- Aus SEO-Sicht ist es vorteilhaft, dass es keinen Duplicate Content gibt, weil jede Seite und jeder Beitrag, egal in welcher Sprache, einen eigenen Permalink erhält
Nachteile
- Seiteneinstellungen müssen teilweise doppelt durchgeführt werden
- Ein Language-Switcher muss entwickelt bzw. ins Theme integriert werden
- Die Migration vom Development-System auf das Live-System ist komplizierter, weil die Daten nach dem Import abgeglichen werden müssen
- Media-Dateien können nur mittels Plugin zwischen den Seiten geteilt werden
Als Hauptsprache wurde Deutsch gewählt und somit wurde zunächst auch die Deutsche Version der Webseite eingerichtet und mit Content befüllt. Nach dem Test wurde die gesamte Hauptseite mittels dem WordPress Exporter exportiert und in die neu angelegte Englische Multisite importiert.
Deutsch: www.klicc.at
Englisch: www.klicc.at/en
Das Übersetzen der Inhalte war danach „a piece of cake“, weil sich die Content-Struktur zwischen den beiden Sprachversionen nur unwesentlich unterscheidet.
Eine kleine Herausforderung war noch die Entwicklung eines Language-Switchers. Nachdem es kein geeignetes Plugin gab, das die Funktionalität zu meiner Zufriedenheit erfüllt hätte, wurde eine eigenentwickelte Lösung direkt in das Theme integriert.
Plugins
Um, wie bereits oben erwähnt, Updates auf neue WordPress-Versionen reibungslos durchführen zu können, wurde auf den Einsatz von Plugins weitestgehend verzichtet.
HiDPI Unterstützung
Alle Bilder und Grafiken wurden für HiDPI- bzw. Retina-Displays und mobile Devices optimiert.
Bootstrap
Der Grid, einige UI-Elemente und mehrere Javascript-Komponenten bauen auf Bootstrap auf.
JQuery
Sämtlicher Javascript-Code wurde mittels JQuery entwickelt.
Optimierung
Moderne Web-Entwicklung bedeutet in der heutigen Zeit auch (Geschwindigkeits-)Optimierungen, um für das mobile Zeitalter, das längst angebrochen ist, gerüstet zu sein. Dank verschiedener Analysetools wie Page Speed oder YSlow konnte die Performance erheblich gesteigert werden.
Außerdem wurde so gut wie möglich auf validen Code und gute Lesbarkeit des Source Codes geachtet.
Das war eine kurze Zusammenfassung zum Entwicklungsprozess von klicc.at. Falls Fragen offen sind, bin ich gerne bereit, diese zu beantworten!