Ergänzungen zur Session „Mobile First & WordPress-Themes“

Während und nach meiner Session gab es eine Reihe von interessanten Fragen und Anregungen, die ich gerne wiedergeben möchte.

Mobile Browser per WordPress-Funktion identifizieren

Seit der Version 3.4 gibt es im WordPress-Core eine Funktion, mit der man abfragen kann, ob ein mobiler Browser anfragt: wp_is_mobile
Bei der Funktion ist eine Liste mit user agents (mobilen Browsern) hinterlegt. Wenn also einer von diesen Browsern anfragt, tritt die Funktion in Aktion:

  • Mobile
  • Android
  • Silk
  • Kindle
  • Blackberry
  • Opera Mini

Man könnte damit eine Abfrage direkt in ein Template einbauen und festlegen, ob ein bestimmter Bereich im mobilen Browser angezeigt werden soll oder nicht. Möchte man beispielsweise den Bereich „Newsletter“ nur auf dem Desktop-Rechner zeigen, sähe das irgendwie so aus:

if ( !wp_is_mobile() ) {
  //display newsletter-stuff
} else {
 //display nothing
}

wp_is_mobile ist eine interessante Funktion und ich bin gespannt, wie es an der Stelle weitergeht. Momentant deckt die Funktion nur einen Faktor in dem komplexen Spiel Browser/Monitorbreite/Bandbreite ab. Man kann damit Browser identifizieren, aber keine Bildschirmbreiten oder andere Kriterien abfragen.
Praktisch ist, dass ein Element, das per Funktion wp_is_mobile „ausgeblendet“ wird, auch nicht geladen wird. Ganz im Gegensatz zur CSS-Anweisung display:none, die zwar ein Element unsichtbar macht, das aber zuvor trotzdem geladen werden muss.

Weiterlesen Ergänzungen zur Session „Mobile First & WordPress-Themes“

WPCamp Berlin 2012: „Mobile First & WordPress-Themes“

Hier wie versprochen die Slides zu meiner Session „Mobile First & WordPress-Themes“ beim WPCamp in Berlin.

Diesen Artikel werde ich in den nächsten Tagen noch etwas ergänzen. Ich werde eine Auswahl an interessanten Links zu Artikeln & Tools zum Thema zusammenstellen (siehe unten) und ich werde auch auf die eine oder andere Frage eingehen, über die wir bei der Session diskutiert haben.

Weiterlesen WPCamp Berlin 2012: „Mobile First & WordPress-Themes“

Einfach weitermachen

DON’T WORRY, DRIVE ON: Fossil Fools & Fracking Lies from MONSTRO on Vimeo.

Der Inhalt des Videos ist eine Animation zum Thema Peak Oil. Das ist die Tatsache, dass uns demnächst das Öl ausgehen wird.

Seit 2005 konnte die Ölproduktion nicht weiter gesteigert werden, die Förderquote begann langsam, aber stetig zu sinken. Die Nachfrage steigt aber immer weiter.
Eine Weile wird sich dieses Ungleichgewicht über immer höhere Preise ausbalancieren, aber schon sehr bald wird das nicht mehr funktionieren. Weiterlesen Einfach weitermachen

Dreispaltiges Layout für Mobile First umsetzen

Bei dreispaltigen Layouts (Hauptspalte + 2 Sidebars links und rechts) läuft man im Responsive Design in ein Problem, wenn man mit einem Grid-System arbeitet. Wenn nämlich alle Elemente mit ‚float:left‘ nach links rutschen, müssen die beiden Sidebars im Template-Code über der Hauptspalte eingetragen werden.

In der Desktop-Ansicht stört das nicht weiter, der Betrachter kriegt von der Reihenfolge der Elemente im Code nichts mit.
Anders sieht das bei der Ansicht für Mobilgeräte aus. Hier sind die Spalten nicht mehr nebeneinander angeordnet, sondern alle Elemente sitzen untereinander. In der mobilen Ansicht tauchen also zuerst die beiden Sidebars auf und erst danach – viel weiter unten – kommt der Hauptinhalt. Und ist damit aus dem Blickfeld verschwunden.

Weiterlesen Dreispaltiges Layout für Mobile First umsetzen

Ferienlektüre

Letzte Woche hatte ich Urlaub. Der Zufall wollte es, dass ich kurz davor einen Stapel Taschenbücher geschenkt bekommen hatte. Allesamt Krimis und Thriller mit einem Spiegel-Bestseller-Aufkleber drauf. Ein paar davon packte ich in meinen Koffer.
Zwischen den üblichen 0815-Thrillern entdeckte ich dann ein kleines Juwel: „Totengleich“ von Tana French.

Die meisten Kriminalromane, die man derzeit in den Buchläden findet, sind nach immer demselben Muster gestrickt: Eine möglichst blutrünstige Gewalttat, ein irgendwie eigentümlicher Ermittler und ein eiskalter, fieser Killer.

Tana French’s Geschichten sind anders. Der Plot entspinnt sich ganz allmählich aus den Beziehungen der handelnden Personen heraus. Die Charaktere sind präzise gezeichnet, ihre Beziehungen untereinander sind komplex und fein verwoben. Gleichzeitig ist die Rahmenhandlung, die die Personen zusammenführt, kraftvoll, spannend und vielschichtig. Man wird förmlich ins Buch hineingezogen.

Weiterlesen Ferienlektüre

Session-Vorschlag WPCamp Berlin 13.10.2012

Nach dem letzten WordCamp in Köln hatte ich mir vorgenommen, beim nächsten Camp selbst eine Session anzubieten. Und weil ich mich mit dem Bereich Theme-Entwicklung noch am besten auskenne, möchte ich etwas dazu erzählen.

Ich arbeite zur Zeit intensiv an einem Framework für Responsive-Design-Projekte. Das Framework basiert auf dem „Mobile First“-Ansatz von Luke Wroblewski. Mit dieser Methode kann man einige Nachteile umgehen, die Responsive Design mit sich bringt.

Alle Session-Vorschläge werden ab sofort auf der Website des WPCamp Berlin den Teilnehmern vorgestellt.

Weiterlesen Session-Vorschlag WPCamp Berlin 13.10.2012

Das digitale Leben vor Betrügern schützen

Gestern machte der Fall von WIRED-Autor Mat Honan Schlagzeilen im Netz. Ein Hacker hatte Mat Honan’s digitale Existenz gekapert und am Ende waren wertvolle Daten auf seinem Laptop auf Nimmerwiedersehen verschwunden.
Aber eigentlich ging es bei diesem Fall gar nicht um ein klassisches Hacking, sondern um einen Trickbetrug, der sich Lücken in den Support-Systemen von Apple und Amazon zu Nutze gemacht hat. 

Der Trick war erschreckend simpel: Der Angreifer startete mit nichts als Mat Honan’s Wohnadresse und seiner Standard-Mailadresse. Informationen, wie man sie in jedem Website-Impressum findet. Mit einem Anruf beim Amazon-Telefonsupport verschaffte sich der Betrüger Zugang zu dem Bereich von Mat Honan’s Amazon-Konto, in dem man die Kredikarteninformationen bearbeiten kann. Dort gab er eine neue (gefälschte) Kreditkartennummer ein. Weiterlesen Das digitale Leben vor Betrügern schützen

Meine ersten Schritte mit LESS

Es ist noch gar nicht lange her, da konnte ich mir nicht vorstellen, mit einem Preprozessor wie LESS zu arbeiten. Aber inzwischen bin ich auf den Geschmack gekommen.

Was LESS ist habe ich in diesem Artikel erklärt. Im Prinzip ist es eine Erweiterung der CSS-Syntax. LESS bietet das, was man sich von der nächsten CSS-Version wünschen würde: Man kann wiederverwendbare Variablen definieren, Styles verschachteln und Vieles mehr.

Der Haken dabei: Die Syntax von LESS muss per Compiler in CSS umgeschrieben werden, denn sonst kann der Browser die Angaben nicht lesen. Das heisst, wer daran gewöhnt ist, Anpassungen und Korrekturen in der CSS-Datei per FTP auf dem Server zu machen, muss sich umorientieren. Denn das funktioniert dann nicht mehr.

Änderungen macht man ausschließlich im less-File, die CSS-Datei ist nur noch eine Art Ausgabeformat, das automatisch erzeugt wird. Die CSS-Datei fasst man gar nicht mehr an.
Weiterlesen Meine ersten Schritte mit LESS

Adieu Subscribe2, willkommen MailChimp!

Noch ist der Umbau nicht ganz fertig, aber allmählich senkt sich der Staub. Zusammen mit der Installation unseres neuen Themes habe ich noch ein paar andere Dinge im Blog verändert. Einiges davon kann man sehen, einiges passiert nur hinter den Kulissen.

Seit einem Jahr hatte ich das PlugIn Subscribe2 im Einsatz. Damit kann man E-Mailadressen sammeln und in festen zeitlichen Abständen eine Zusammenfassung der neuesten Artikel im Blog verschicken. Die Option kommt gut an.

Leider hat Subscribe2 so seine Macken. Um einen wöchentlichen Versenderhythmus hinzukriegen, musste ich noch ein zusätzliches PlugIn installieren, dass den Cron-Job alle 7 Tage steuerte. Vorgesehen waren nur monatliche und vierzehntägige Abstände.
Auch die Übersetzung des PlugIns brachte mich regelmäßig zur Verzweiflung. Bei jedem Update verschwanden die deutschen Sprachdateien und ich musste sie neu hochladen. Was das Fass schließlich zum Überlaufen brachte, war der HTML-Output des Sidebar-Widgets. Der ist so fürchterlich verschachtelt und damit so wenig per CSS ansprechbar, dass ich mein Design damit nicht umsetzen konnte.
Weiterlesen Adieu Subscribe2, willkommen MailChimp!