LB-Projects – neues Webdesign

1

Wie eventuell nicht auf den ersten Blick ersichtlich ist, nutze ich für LB-Projects derzeit das kostenlose CMS WordPress mit einem fertigen Theme. Allerdings erfüllt dieses Theme nicht alle Anforderungen, die ich an ein solches Stelle, also muss etwas Besseres her. Aus Interesse, möchte ich mich hier an einer Eigenentwicklung versuchen. Ein erstes in Photoshop erstelltes Layout ist unten zu sehen.

Es würde mich sehr freuen, wenn Sie zum geplanten Theme ein kurzes Feedback geben würden. Für Verbesserungsvorschläge und Ergänzungen bin ich natürlich jederzeit offen.

Hinweis: “Rechtsklick” -> “Grafik anzeigen” zeigt das Bild in voller Auflösung an.

[Update 9.04.2012] Mittlerweile habe ich schon erste Erfolge in CSS-Programmierung erzielt und das Design ähnelt langsam aber sicher meinem Entwurf. Auf meinem alten Webspace können Sie die Testseite ansehen.

Am Ende dieses Tages, sieht die Seite folgendermaßen aus. Wenn man die Positionierung der Elemente außen vor lässt, ist das ein zufriedenstellendes Ergebnis.

An dieser Stelle möchte ich kurz etwas über die Realisierung des Themes sagen. Die Testseite entspricht vom Aufbau her und mit einer lauffähigen WordPress-Installation in etwa LB-Projects. Das Theme selbst ist jedoch keine komplette Eigenentwicklung, sondern basiert auf einem bestehenden Theme (in diesem Fall dem Standard-Theme “twentyeleven”). WordPress bietet hier eine interessante Funktion, die sich “Child-Theme” nennt. Diese ermöglicht es dem Anwender nur bestimmte Dateien des Original-Themes zu ändern, ohne die eigentlichen Theme-Dateien zu verändern. Dazu erstellt man im WordPress Theme-Verzeichnis einen neuen Ordner – den Ordner des Child-Themes. Die Minimalaustattung des Child-Themes ist dabei eine CSS-Datei, in deren Header-Kommentar das zugehörige “Parent-Theme” deklariert ist. Wie das genau aussieht, kann hier nachgelesen werden. Alle in dieser Datei vorgenommenen Änderungen überschreiben nun die Original-Datei im Parent-Ordner. Das gilt aber nicht nur für das Stylesheet, sondern auch für alle PHP- und Javasript-Dateien.
Der Vorteil bei dieser Vorgehensweise liegt darin, dass man eine funktionierende Basis hat, auf der man das eigene Theme aufbauen kann. Außerdem kann man auf diese Weise problemlos Aktualisierungen für das Parent-Theme installieren. Hätte man die Änderungen direkt an den Dateien im Parent-Theme Ordner vorgenommen, wären diese durch das Update überschrieben worden, was recht ärgerlich wäre.

[Update 13.04.2012] Inzwischen habe ich das alte Konzept des “Child-Themes” komplett verworfen und mithilfe von Janek (s.THOMAS) [Danke, Janek!] angefangen, ein eigenes Theme  zu schreiben. Der Vorteil liegt darin, dass wir nur die Funktionen implementieren, die wir brauchen. Somit wirkt die Seite weniger überladen und ist individueller angepasst.  Des Weiteren können so auch einige Funktionen hinzugefügt werden, die die Administration direkt im Frontend der Webseite ermöglichen. Als User bekommen Sie davon aber nichts mit, da entsprechende Funktionen nur für den Administrator sichtbar sind (ansonsten sähe das Theme wieder überladen aus). Ich empfehle einfach, einen Blick auf die Testseite zu werfen, um sich einen Eindruck vom neuen Design zu verschaffen.

[Update 17.04.2012] Nach einigen weiteren Tagen Programmierarbeit (Vorgehensweise: Try & Error) muss sich das Theme nicht mehr verstecken. Hinzugefügt wurde ein großes Dropdown-Menü, welches die komplette Navigation der Seite erhält. Zwar gibt es hier und da noch kleinere Fehlfunktionen und im Internetexplorer sieht die Seite noch etwas “gruselig” aus, aber ich denke, nächste Woche kann ich einen ersten Testlauf des Themes auf LB-Projects wagen.

[Update 23.04.2012] In den letzten Tagen sind noch einige neue Funktionen zum Theme, wie eine z.B. eine Tag-Cloud und ein Archiv hinzugekommen. Des Weiteren wurde die Darstellung im Internet Explorer verbessert und während eines Besuchs im Apple Store in Hamburg auch direkt für das iPad/iPhone optimiert. Zu guter Letzt ist noch eine individuelle Stratseite hinzugekommen, die als besonderes Merkmal eine Javascript-basierte Slideshow enthält.

[24.04.2012] Wie unschwer zu erkennen ist, habe ich das neue Theme gestern auf LB-Projects aktiviert. Zwar ist es noch nicht ganz fertig und hier und da gibt es noch kleinere Bugs, doch diese kann ich einfacher lösen, wenn ich direkt mit dem  richtigen Content der Webseite arbeiten kann. Neben einigen technischen Erweiterungen und Verbesserungen stehen noch eine Umsetzung des Dropdown-Menüs mittels Javascript an (die jetzige Lösung mit CCS3 funktioniert im Internet Explorer nicht), sowie einige kleinere grafische Optimierungen.

[29.04.2012] Soeben habe ich eine Dokumentation über das neue Theme geschrieben, in der die Funktionen des Themes anhand des Quellcodes erklärt werden. Anschließend können dort die Theme. Dateien heruntergeladen werden.

[04.05.2012] Eventuell ist dem ein oder anderen beim Surfen auf meiner Seite aufgefallen, dass ich immer noch am Theme arbeite. Die weiteren Optimierungen finden vorwiegend “unter der Haube” statt. So bietet das Theme jetzt eine verbesserte Kommentar-Funktion, detailliertere Artikelinformationen und eine dynamische Sidebar, die direkt im WordPress-Backend verwaltet werden kann. Wenn im Backend keine dynamische Sidebar festgelegt wurde, wird standardmäßig eine statische Sidebar mit den neuesten Artikeln, einer Schlagwort-Wolke sowie der Besucherstatistik angezeigt.

[09.05.2012] Die Entwicklungsphase des Themes ist so gut wie beendet. Zwar wird es hier und da noch einige kleinere Optimierungen geben, aber große Änderungen werden nicht mehr durchgeführt. Mich interessiert Ihre Meinung zum neuen Theme. Sollten Sie Verbesserungsvorschläge haben, würde es mich freuen, wenn Sie mir diese einfach in einem Kommentar zu diesem Artikel mitteilen könnten.

Hinterlasse eine Antwort

Ihre Email-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert.

*

Kommentare umschalten

1 Kommentar zu "LB-Projects – neues Webdesign"

  • [...] Anfänger in Sachen Webprogrammierung nicht zurückschrecken, denn es ist gar nicht so schwer (s.Projektlog des neuen Webdesigns). Programmiert wird ein solches Theme in verschiedenen Programmiersprachen, [...]