Gestern haben wir uns an die Arbeit gemacht und eine dunkle Theme-Variante für unser Ari Free-Theme gestaltet. Der dunkle Hintergrund mit heller Schrift eignet sich besonders gut, wenn du viele Fotos auf deinem Blog zeigen möchtest. Um die dunkle Version von Ari zu nutzen, kannst du diese ganz einfach über die Theme Optionsseite auswählen. Und damit auch die Ansicht von Fotos in größerem Format möglich wird, habe ich das Theme auch gleich noch für das jQuery Thickbox-Plugin vorbereitet. Hier die Updates im Überblick.
Weiterlesen
Das 1140px Grid-System: Mit CSS3 Media Queries für mobile Geräte optimiert
Das flexible 1140px Grid des australischen Designers und Entwicklers Andy Taylor ist mit CSS3 Media Queries umgesetzt, und passt sich so auf die unterschiedlichsten Browser-Größen an. Das Grid ist in 12 Spalten unterteilt, und sowohl für große Desktop-Monitore, für Tablet-PCs (z.B. iPad oder Samsung Galaxy Tab) und für kleinere Smartphone-Displays (iPhones, Blackberrys und Android-Phones) optimiert. Da sich das noch recht neu entwickelte Grid-System wirklich spannend anhört, habe ich mir die wichtigsten Fakten und Funktionen des Grids einmal genauer angeschaut.
Weiterlesen
Moderne WordPress-Themes mit Grid-Layout
Layouts, die auf einem Rastersystem (Grid) aufbauen, sind besonders bei Blogs im Magazin-Stil sehr beliebt. Denn auf Grund des Raster-Layouts kann auch viel Inhalt immer noch übersichtlich und anschaulich präsentiert werden. Doch nicht nur für Blog-Magazine, auch für dein Portfolio oder deinen privaten Blog kann ein Theme mit Grid-Layout geeignet sein. Für alle Fans von Rastersystemen habe ich 14 unterschiedliche, moderne WordPress-Themes mit Grids zusammen gestellt.
Weiterlesen
Hilfreiche CSS-Tipps: Die CSS Pseudoklassen-Selektoren :first-child, :last-child und :nth-child
Oft ist es nötig, bestimmte Elemente eines Eltern-Elements (z.B. einer unordered List ul oder eines Div-Elements) eine spezielle CSS-Eigenschaft zu geben. Zum Beispiel kann man so überflüssige Margin-Werte eines letzten Listenelements auf Null setzen, oder jedes zweite Element einer Liste zur besseren Übersicht mit einer anderen Farbe markieren. Um für diese Aufgabe keine extra CSS-Klassen vergeben zu müssen, kannst du stattdessen die praktischen CSS Pseudoklassen-Selektoren :first-child, :last-child und :nth-child nutzen.
Weiterlesen
Design-Inspiration und Tipps für typografisch ansprechendes Webdesign
Der Erfolg eines gelungenen, stimmigen Webdesigns liegt meist in den Details. Ganz besonders wichtig sind dabei die Auswahl der passenden Schriftarten, das Verhältnis der Schriften untereinander und die Aufteilung der typografischen Elemente im Layout. Auch die Gestaltung von Weißraum ist sehr wichtig für ein stimmiges Gesamtdesign. Da die Gestaltung von typografischen Elementen nicht immer ganz einfach ist hilft es, sich möglichst viele Webseiten mit schöner Typografie anzuschauen, um so Erfahrungen zu sammeln und sich für die eigenen Arbeiten inspirieren zu lassen.
Weiterlesen
Die benutzerdefinierte Google-Suchmaschine in WordPress nutzen
Besonders wenn man bereits viele Blog-Artikel zu speziellen Themen geschrieben hat, kann es schwierig werden mit der Standard-Suchfunktion von WordPress auch wirklich die geeignetsten Artikel herauszufiltern. In diesem Fall kann man sich überlegen, die von Google angebotene benutzerdefinierte Suchmaschine auf dem eigenen Blog zu integrieren. Die Artikel-Suche von Google ist natürlich um einiges leistungsfähiger. Ein weiterer Vorteil könnte außerdem sein, dass die Ansicht der Suchergebnisse im »Google-Stil« den Lesern bereits vertraut ist. Die Google-Suchmaschine lässt sich entweder direkt mit einem Code-Schnipsel einbinden oder mit Hilfe eines WordPress-Plugins.
Weiterlesen