• Shortcuts : 'n' next unread feed - 'p' previous unread feed • Styles : 1 2
aA :  -   + pdf Infos Unsubscribe

» Publishers, Monetize your RSS feeds with FeedShow:  More infos  (Show/Hide Ads)


Date: Monday, 21 Jul 2014 06:30
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Friday, 18 Jul 2014 10:08

Kurz nach der Veröffentlichung des gestrigen Artikels über die markierte Headline gingen Reaktionen über Twitter, später auch in den Kommentaren des Beitrags ein. Darin wurden andere Lösungsvorschläge gemacht. Ich habe diese im Folgenden dokumentiert und jedem Vorschlag einen eigenen Codepen spendiert.

Der Sinn der gestrigen Übung war nicht, eine ideale Lösung vorzuschlagen. Dafür müsste ich auch Vorschläge für Mediaqueries machen. Doch dieses Detail kann jeder individuell im eigenen Projekt relativ simpel umsetzen. Ich wollte eine bessere Lösung zeigen, die nicht darauf baut, dass eine Überschrift sinnloserweise in drei Überschriften getrennt wird.

Ich finde die Ansätze interessant. Aber nicht jeder hatte offenbar die Limitierungen seines Ansatzes im Blick. Ich habe den Eindruck, es ging im Wesentlichen darum, die BR-Elemente wegzubekommen.

Mein Vorschlag

Durch die Nutzung der BR-Elemente kann ich den Zeilenumbruch direkt steuern. Es ist ein Element, das Redakteuere instinktiv verstehen und viel mehr lieben, als wir mögen. Aber die zusätzliche Formatierung mit SPAN-Elementen macht die Umsetzung in einem CMS durch Redakteure schwieriger.

See the Pen marked headline – example 1 by Jens Grochtdreis (@jensgro) on CodePen.

Die ausgelassene Version

Ich hatte bewußt eine Version mit Floats ausgelassen. Denn wenn die Agentur schon ein solches HTML-Chaos anrichtet, wie groß ist dann die Chance, dass Floating und Clearing verstanden wurden?

Wichtig ist bei dieser Lösung, dass die nachfolgenden SPAN-Elemente immer den vorherigen Float clearen. So wird ein Umbruch erzeugt, der dem BR gleich kommt. Wichtig ist zudem, die Überschrift ihre floatenden Kinder umfassen zu lassen. Das habe ich hier mit overflow:hidden gelöst. Ich hätte auch den Clearfix nehmen können.

See the Pen marked headline – example 2 by Jens Grochtdreis (@jensgro) on CodePen.

Vorschlag von Dennis Frank

Dieses Beispiel funktioniert nur, weil Dennis die Breite des umgebenden Containers – in seinem Beispiel BODY – beschränkt hat. Also muss für den Realitätscheck ein Wrapper-Container drum, der eine Breite vorgibt, damit die Worte an den richtigen Stellen umbrechen.

See the Pen marked headline – example 3 by Jens Grochtdreis (@jensgro) on CodePen.

Vorschlag von Marc Hinse

Diese Version ist wegen der doppelt verschachtelten SPAN-Elemente besser in einem CMS umsetzbar. Sie kommen einfach ins Template. Allerdings ist die Lösung von einem umgebenden Container abhängig, dem eine Breite gegeben wird. Diese Breite steuert dann den Umbruch. Das Ergebnis ist also zufällig das gleiche wie bei meinem Vorschlag. Es ist aber nicht individuell kontrollierbar. Zudem hängt die Überschrift links aussen und lässt sich dort auch nur schwer wegbewegen. Das CSS ist nicht einfach konfigurierbar und muss in seiner Mechanik unbedingt dokumentiert werden.

See the Pen marked headline – example 4 by Jens Grochtdreis (@jensgro) on CodePen.

Lösung von Tom Arnold

Auch diese Lösung kommt nur mit einem umfassenden Container aus. Ursprünglich stand noch eine Breite von 50% im CSS. Dabei ist aber das Endergebnis bei kleineren Breiten sehr schlecht, weil keine Mindestbreite erwähnt wird. Immerhin muss diese Lösung nicht mit Positionierungsproblemen, wie die von Marc leben. Von meiner Lösung unterscheidet sie sich nur durch die fehlenden BR-Elemente. Allerdings kommt sie auch weniger solide daher und benötigt eine separaten Wrapper-Container.

See the Pen marked headline – example 5 by Jens Grochtdreis (@jensgro) on CodePen.

Lösung von Dennis Erdmann

Dennis Erdmann wies mich auf ein ähnlich formatiertes Element innerhalb der Slider bei der Segeberger Kliniken Gruppe hin. Es handelt sich dabei um Zitate, keine Überschriften. Ich habe die dahinterliegende Idee auf die Überschriften transportiert.

Diese Lösung kommt wieder mit zwei ineinander verschachtelten SPAN-Elementen, hat einen Wrapper-Container, der die Breite und damit den Umbruch vorgibt und hat ein leichtes Positionierungsproblem, weil die Überschrift links rausragt.

See the Pen marked headline – example 6 by Jens Grochtdreis (@jensgro) on CodePen.

Vorschlag von Fabian Beiner

Fabian machte einen Vorschlag in den Kommentaren zum Artikel, der nur auf zwei Eigenschaften beruht. Das Ergebnis finde ich charmant. So kann ich auf die BR-Elemente verzichten.

See the Pen marked headline – example 7 by Jens Grochtdreis (@jensgro) on CodePen.

Vorschlag von Tomas Caspers

Der Vorschlag von Tomas verbessert den von Fabian in der Weise, dass nur noch eine Regel notwendig ist. Mein Favorit! Aber wir kommen nicht um die SPAN-Elemente herum.

See the Pen marked headline – example 8 by Jens Grochtdreis (@jensgro) on CodePen.

Author: "Jens Grochtdreis" Tags: "CSS und XHTML"
Comments Send by mail Print  Save  Delicious 
Date: Friday, 18 Jul 2014 06:30
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 17 Jul 2014 06:37

HTML und die Semantik einer Seite ist die eine Seite der Medaille. Wir können uns viel Mühe bei der Strukturierung unserer Inhalte geben, die Seite wird erst durch pfiffige Designideen zu einem Hingucker. Erst die Optik weckt unser Interesse an den Inhalten richtig.

Es kann immer wieder vorkommen, dass wir bei der Auszeichnung einzelner Inhalte zweifeln, welche Semantik die korrekte ist. Ich empfehle zudem immer, nur so viele Tags wie notwendig zu nutzen. Und die “Notwendigkeit” ist immer wieder ein Knackpunkt. Denn zahlreiche Designideen sind nicht mit einfachen Mitteln zu realisieren. Oft muss man Extra-Code schreiben, um das gewünschte Ergebnis zu erzielen.

Früher hat es mich immer wieder geärgert, wenn ich aus optischen Gründen “mein” HTML aufblähen musste. Das hat wohl mehr mit Entwicklerstolz als mit allem anderen zu tun. Denn ein zusätzliches DIV oder SPAN interessiert weder eine Suchmaschine, noch einen Screenreader. Und wir sehende Nutzer haben sowieso keine Verbindung zum Quellcode, also kann er uns egal sein.

Mittlerweile habe ich weniger Problem damit, Extra-Code für einen optischen Effekt zu schreiben. Aber es sollte sich im sinnvollen Rahmen halten. Ich bin nun über ein Beispiel gestolpert, bei dem der sinnvolle Rahmen m.E. gesprengt wurde und die naheliegende, saubere Lösung nicht gesucht wurde.

Die Seite “fussball.de” wird demnächst einen Relaunch erleben. Zu diesem Zweck gibt es eine Infoseite, die mit einem netten Design aufwartet. Die Überschriften haben einen Hintergrund bekommen, der an einen Textmarker erinnert. Dieses Designdetail kommt vor allem im Print immer wieder vor und ist recht beliebt. Lassen wir Geschmacksfragen einmal beiseite, stellt sich die Herausforderung, diese Optik auch im Internet zu realisieren.

Die Herausforderung: eine Headline mit Marker-Hintergrund

Die Überschrift ist also in drei Teile geteilt und die Hintergrundfarben sind immer nur so breit, wie der jeweilige Teil der Überschrift. Der von der Agentur erdachte Code ist dafür denkbar schlecht gewählt. Alle drei Teile sind separate, übereinander verschachtelte Überschriften. Diese befinden sich nicht einmal auf der gleichen Ebene, sondern sind immer in DIV-Container geschachtelt.

Schauen wir uns die Herausforderung einmal genauer an:

  1. Wir benötigen eine Lösung, bei der die Überschrift in zwei oder mehr Teile geteilt werden kann.
  2. Diese Teile sollen einen Hintergrund bekommen.
  3. Der Hintergrund läuft nur so weit, wie der Text läuft.
  4. Der Text hat in alle vier Richtungen Padding.

Ich möchte bei der Lösung dieser Aufgabe die Überschrift nicht aufteilen. Denn es handelt sich schliesslich nicht um drei Überschriften, sondern nur um eine. Ich kann akzeptieren, extra HTML für ein Designergebnis zu schreiben. Dabei sollte aber die Semantik der Seite nicht beeinträchtigt werden. Also umfasse ich alle drei Überschriftsbestandteile mit einem SPAN. Dies nutze ich, um die Hintergrundmarkierung zu realisieren. Es läge jetzt nahe, die SPANs als Blockelemente zu formatieren. Allerdings würden dann die Hintergründe so breit laufen, wie die Überschrift Platz hat. Und alle Markierungen wären gleich breit.

Da der Text aber in alle vier Richtungen ein Padding haben soll, muss ich die SPANs zumindest als Inline-Block-Elemente formatieren. Die gewünschten Zeilenumbrüche realisiere ich dann mit dem BR-Element, das genau für diesen Zweck da ist. Ich vergesse nur gerne, dass es BR gibt.

See the Pen Headline mit Marker-Hintergrund by Jens Grochtdreis (@jensgro) on CodePen.

Das Ergbnis ist nicht so pur und rein, wie ich es gerne hätte. Aber das Designziel ist erreicht, ohne dabei mein HTML zerstört zu haben. Und das ist ein gutes Ergebnis. Ich wünschte, die Entwickler von fussball.de hätten ein wenig über das Designproblem nachgedacht, dann wären sie sicher zum gleichen Ergbenis gekommen.

Author: "Jens Grochtdreis" Tags: "CSS und XHTML"
Comments Send by mail Print  Save  Delicious 
Date: Wednesday, 16 Jul 2014 06:30
  • PleaseJS erstellt Zufallsfarben unterschiedlichster Art. Insbesondere für die Suche nach der richtigen Inspiration kann das recht nützlich sein.
  • grunt-photobox macht Screenshots von Webseiten und vergleicht unterschiedliche Entwicklungsstände. Man kann auch nur einzelne Bestandteile der Webseite fotografieren.
  • Hugo Giraudel hat mit SassDoc ein Dokumentationstool für Sass-Files erstellt. Es orientiert sich an den bekannten JSDoc, JavaDoc usw. Mittlerweile gibt es auch Zusatztools zu SassDoc. Ich habe SassDoc mal getestet: es lässt sich problemlos einrichten und erzeugt sehr schnell ein Ergebnis. Man muss allerdings seine Kommentare dementsprechend gestalten.
  • CSS-Colorguard ist ein node.js-Tool, das Farben eines CSS auf Ähnlichkeit überprüft und Warnungen ausspricht. Die Plugins für Grunt, Brokkoli und Gulp sind im Projekt selber verlinkt. Leider kann man nur CSS-Dateien überprüfen, keine SCSS-Dateien. Das scheint auch nicht angedacht zu sein.
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Tuesday, 15 Jul 2014 06:24
Author: "Jens Grochtdreis" Tags: "Barrierefreiheit, Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Friday, 11 Jul 2014 11:04

Was lange währt wird endlich fertig. Die Auswertung der Webkrauts-Umfrage hat längere Zeit in Anspruch genommen, als gedacht. Doch jetzt ist meine kleine Zusammenfassung der Umfrageergebnisse fertig. Ergänzt sind die textlichen Auswertungen durch Charts. Die hat Ralf Graf mit der Bibliothek Highcharts erstellt. Es war ein interessantes Experiment. Wir würden uns freuen, wenn insbesondere Screenreadernutzer uns in den Kommentaren Feedback zu Highcharts geben würden. Sind die Diagramme für sie nutzbar?

Author: "Jens Grochtdreis" Tags: "Webkrauts"
Comments Send by mail Print  Save  Delicious 
Date: Tuesday, 08 Jul 2014 08:10
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Monday, 30 Jun 2014 06:45

Web Components werden immer mehr beworben. Vielleicht sollte ich mich mal ernsthaft damit beschäftigen. Ich hatte in der Vergangenheit schon auf ein paar Seiten hingewiesen. Eine neue ist hinzugekommen: polymer-project.

Auf der letzten Google I/O gab es auch einen Haufen Vorträge zu Web Components. Alle Vortragsvideos für Entwickler findet ihr auf einer separaten Seite gesammelt.

Can I Use zeigt, dass Web Components im Wesentlichen von Blink (also Chrome und Opera) unterstützt werden. Mozilla ist offenbar dran. Für alle fehlenden Features empfiehlt sich dann das oben genannte Polymer. Rey Bango hat bei tutsplus ein Tutorial zu Polymer veröffentlicht. Ausserdem schrieb er einen Zweiteiler über “Sharing Polymer Components” (Teil 1, Teil 2).

Als thematischer Einstieg bieten sich die beiden Artikel von Peter Kröner über Web Components an:

  1. Web Components erklärt, Teil 1: Was sind Web Components?
  2. Web Components erklärt, Teil 2: Web Components mit Polymer erstellen und verwenden
Author: "Jens Grochtdreis" Tags: "Linklisten, Webstandards allgemein"
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 26 Jun 2014 06:30
  • jquery-plugins.net ist eine gut gemachte Übersichtsseite für jQuery-Plugins.
  • Eine 16-teilige Artikelserie beschreibt, wie Ubuntu.com responsive gemacht wurde. Solche Berichte aus der Praxis sind klasse, vor allem, wenn sie so umfangreich sind.
  • Luke Wroblewski zeigt in einem kleinen Video, warum Selectfelder nicht immer die erste Wahl für ein Formular sind und wie man sie für mobile Endgeräte umgehen kann.
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Tuesday, 24 Jun 2014 06:30
  • Die Bahn hat offenbar rührige Social-Media-Leute. Der Google+-Stream ist voller Informationen, nicht nur platter Werbung. So erfahren wir beispielsweise, wie es zu umgekehrter Wagenreihung kommen kann. Und auch das leidige Verpassen von Anschlusszügen wird mit einer Infografik aufbereitet. Finde ich klasse.
  • “Die Sendung mit der Maus” zeigte am letzten Sonntag einen herrlichen Film, in dem Fußballfloskeln wörtlich genommen wurden. Absolut sehenswert!
  • Das Olivenöl-Kartell” bestärkt mich mal wieder in meiner Haltung, gutes Olivenöl vom Bauern oder aus ökologischer Herstellung zu kaufen. Nicht die Billigplörre aus dem Discounter. Wie soll tolle Qualität fast ohne Kosten entstehen?
  • Die grüne Heinrich Böll Stiftung publiziert den Fleisch-Atlas, eine sehr schön layoutete Studie rund um “Tiere als Nahrungsmittel”. Kann man als PDF kostenlos runterladen.
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Monday, 23 Jun 2014 06:30
  • Microsoft hat einen Developer Channel für den IE eingerichtet. Sie ziehen damit den anderen Browserherstellern nach. Wir Entwickler können also in Zukunft auch Beta-Versionen des IE einfach testen. Prima Sache.
  • Improving the hamburger button befasst sich mit dem beliebten Menü-Icon.
  • Github für den eigenen Server gefällig? GitLab sieht gut aus und lässt gut bedienen. Kann aber nicht auf jedem x-beliebigen Server installiert werden.
  • Chris Coyier stellt ein paar kleine Sass-Mixins vor. Durch diesen Artikel habe ich überhaupt erst vom neuen Codepen-Feature mitbekommen: man kann ein eigenes Blog einrichten. Lohnt sich möglicherweise für kleine Codeerklärungen.
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 19 Jun 2014 06:45
  • The WordPress Template Hierarchy stellt die Template-Hierarchie von WordPress in einem nettn Diagramm dar. Alle Templates sind mit den jeweiligen Seiten der offiziellen Doku verlinkt. Eine nette Ressource für WordPress-Entwickler und die, die es werden wollen.
  • Am 16. Juli trifft sich der Accessibility Club in Nürnberg. Ziel ist, Barrierefreiheit erfahrbar zu machen. Dazu führt Wilhelm Lutzenberger – selbst blind – in assistive Technologien ein. Gezeigt wird u.a. der Screenreader JAWS. Organisiert wird das Ganze von Joschi Kuphal.
  • Tobias Hartmann hat eine Präsentation über OOCSS, BEM und Sass gehalten. Leider war ich nicht dabei und es gibt keine Aufzeichnung. Ich habe aber von den Slides einen guten Eindruck.
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Tuesday, 10 Jun 2014 06:32
  • Codrops ist eine anscheinend nie versiegende Quelle für tolle Inspirationen und für Code, den man sich einfach nehmen und anpassen darf. Diesmal werden uns ein paar Ideen präsentiert, wie man Links interessanter machen kann.
  • Der IE 11 hat einen Unternehmensmodus spendiert bekommen. Man kann das eigentlich nur mit einer Mischung aus Mitleid, Bedauern und Häme zur Kenntnis nehmen. Denn dieser Modus emuliert für auswählbare Seiten den IE8. “Unternehmen” ist also quasi synonym zu “veraltet, antik, technologisch abgehängt”. Traurige Sache, oder?
  • Im Smashing Magazine gibt es einen “Guide to picture and srcset“, also einen Überblicksartikel zu responsiven Bildern.
  • Brad Frost erklärt, wie man sein Pattern Lab zusammen mit Grunt nutzen kann.
  • Die Vorträge von der SmashingConf in Oxford gibt es jetzt bei Vimeo.
Author: "Jens Grochtdreis" Tags: "CSS3, Linklisten, Responsive Webdesign"
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 05 Jun 2014 07:00

Auf der diesjährigen Webinale durfte ich zwei Vorträge halten, einen über Responsive Webdesign und einen über YAML.

Die Zukunft muss noch warten

In meinem ersten versuchte ich klar zu machen, dass wir bei der Umsetzung von responsiven Webseiten eigentlich nur zwei Kategorien von Problemen haben.

Die erste Kategorie, technische Probleme, müssen wir hinnehmen und können sie eventuell mit Behelfskonstruktionen beheben. Responsive Bilder sind ein gutes Beispiel. Eien erste echte Lösung ist mittlerweile in Chrome, Opera und Safari implementiert, Firefox folgt irgendwann. Aber selbst wenn der IE 12 gleichzeihen würde, müssten alle IE-Versionen bis einschliesslich Version 11 ausgestorben sein, bis wir keine Krücken per JavaScript mehr benötigen würden.

Die zweite Problemkategorie sind wir Menschen, deshalb sind diese Probleme am Leichtesten zu lösen. Ich sprach vom falschen Blick auf das Internet, von überbordenden Designideen, die eine Seite fett und lahm werden lassen. Und ich sprach vom Workflow. Ich finde, wir müssen uns klar machen, dass wir in den letzten 15 Jahren allesamt faslch gearbeitet haben. Doch erst jetzt fällt dies auf.

Hartmut Schlosser gibt im PHP-Magazin eine schöne Zusammenfassung. Der Vortrag wurde auch gefilmt. Ich werde Bescheid geben, wenn er veröffentlicht wurde. Bis dahin müssen die Folien genügen:

Schnell und sicher zum Ziel mit YAML4

In meinem zweiten Vortrag, der ebenfalls gefilmt wurde, habe ich das CSS-Framework YAML vorgestellt. Am Vortrag kam ich zufällig mit einer Gegnerin/Skeptikerin von CSS-Frameworks ins Gespräch. Das war Ansporn genug, meine Inhalte kurzfristig umzustellen und auf die Vorteile von Frontend-Frameworks einzugehen.

Ich hoffe, ich konnte deutlich machen, dass die schnelle Realisierung unfallfreier Layouts und Formulare gerade für Rapid Prototyping sinnvoll ist. Aber ich fürchte, ich habe den Sinn und Zweck von Rapid Prototyping insbesondere bei der Erstellung moderner, responsiver Webseiten nicht ausreichend herausgestellt.

Auch diese Folien gibt es bei Speakerdeck.

Author: "Jens Grochtdreis" Tags: "Responsive Webdesign, Veranstaltungen, Y..."
Comments Send by mail Print  Save  Delicious 
Date: Wednesday, 21 May 2014 07:00

All my friends are boppin’ the blues” – äh ich meine, alle meine Freunde haben mir von der Beyond Tellerrand vorgeschwärmt. Da musste ich mir doch endlich mal ein eigenes Bild machen. Letztes Jahr ging der 95. Geburtstag meiner Oma vor, dieses Jahr gab es keine Entschuldigung, keine störenden Einflüsse. Also fuhr ich nach Düsseldorf und ließ mich überraschen.

Ich habe seit 2006 an vielen Konferenzen teilgenommen. Meist war ich Sprecher, manchmal aber auch einfach nur Zuschauer. Doch nur wenige dieser Konferenzen spielen qualitativ in der gleichen Liga wie Beyond Tellerrand: mir fallen nur die Fronteers und die erste Smashing Conference (damals ebenso von von Marc Thiele organisiert) ein. Alle sogenannten Enterprise-Konferenzen haben einen ganz anderen Charakter, eine andere Zielgruppe und erreichen inhaltlich nicht die gleiche Qualität.

Der Rahmen

Der Veranstaltungsort – ein altes Kino – atmet Geschichte und hat ein Gesicht. Es ist nicht eines der vielen austauschbaren Konferenzzentren oder großen Hotels. Es gibt kein Buffet in der Pause. Die Eintrittspreise sind auch deshalb so moderat/billig, weil nur wenig inklusive ist. Marc Thiele hatte mit dem Caterer zivile Preise für Getränke ausgehandelt, ein Sponsor stellte Kaffee aus großen Kannen zur Verfügung. Mittags kam der Burger Truck für all diejenigen, die nicht um die Ecke etwas zu Essen suchen wollten.

Die Pausen zwischen den Talks waren ausreichend groß dimensioniert: eine halbe Stunde statt der sonst üblichen Viertelstunde. Das reduzierte die Hektik an den Theken und ermöglichte Gespräche. Gegen Ende der Pausen erfreute uns ein DJ mit netter Musik, in die Sprachfetzen des vorherigen Vortrags reingesampelt wurden. Das war eine tolle Idee, die sich noch besser anhörte. Und es zeigt den Blick fürs Detail, den Marc Thiele hat und der diese Konferenz zu etwas Besonderem macht.

Das Konzept

Das Konzept der Konferenz ist, Anregungen zu geben, die Teilnehmer “über den Tellerrand hinausschauen” zu lassen. Bei den ersten beiden Malen hatte ich den Eindruck bei grober Durchsicht der Themen, dass kaum etwas wirklich Spannendes für mich dabei gewesen wäre. Aber nach einigen Gesprächen über den Sinn von Konferenzen und über die inhaltliche Qualität bei Beyond Tellerrand, entschied ich mich, keine Erwartungen in die Vorträge zu haben und mich einfach überraschen zu lassen.

Da ich selber viel öffentlich spreche – und das glaube ich auch ganz gut mache -, kann ich sowohl Talent als auch Vorbereitung sowie generelle Qualität eines Vortrags ganz gut einschätzen. Die Qualität der Vortragenden war schwankend. Eigentlich nur die amerikanischen/kanadischen Speaker waren richtig gut. Dabei war aber auch eine übertrieben grimmassierende Karen McGrane, bei der ich Schwierigkeiten hatte, sie während des Talks anzuschauen.

Kurzkritik der einzelnen Talks

Ich versuche, eine kurze Einschätzung der einzelnen Talks zu geben. Es sollen keine inhaltlichen Zusammenfassungen sein. Mehr eine Einschätzung darüber, ob es sich lohnt, das hoffentlich bald erscheinende Video zu schauen.

Ethan Marcotte

Ethan Marcotte – der Erfinder des Schlagworts “Responsive Webdesign” (RWD) – sprach über “Laziness In The Time Of Responsive Design”. In den ersten Minuten hatte ich den Eindruck, er würde uns das kleine Einmaleins des RWD beibringen. Doch er bekam noch die Kurve. Mir sind zwar keine besonderen Inhalte mehr präsent, aber die Präsentation war inhaltlich solide und ganz interessant. Eine nette Eröffnung.

Chris Coyier

Es folgte eine amerikanische Urgewalt: Chris Coyier erzählte uns, warum SVG eine tolle Sache ist. Chris turnte sehr aufgekratzt auf der Bühne herum, hätte sicherlich die Hektik auch ein wenig runterschrauben können, brachte aber unterhaltsam einige sehr interessante Details über SVG rüber. Ich war am Ende nicht der Einzige der sich dachte, er müsse doch mal ernsthaft mit SVG experimentieren. Dieser Talk ist definitiv für Entwickler interessant.

Robin Christopherson

Nach dem Irrwisch Coyier hatte es Robin Christopherson naturgemäß ein wenig schwer, uns über die positiven Seiten der Technik zu informieren. Robin ist blind und erzählte uns aus seiner Perspektive, wie Technik ihm persönlich hilft und welche Neuentwicklungen anstehen, von denen er sich viel verspricht. Es war sicherlich der persönlichste und in Details anrührendste Vortrag der ganzen Veranstaltung. Denn Robin zeigte, dass Technik nicht nur gefährliche Aspekte wie den Verlust der Privatsphäre hat, sondern gleichzeitig auch sehr positive.

Nicht nur mir blieb ein Kloss im Hals stecken als er sagte, er habe noch nie seine Kinder gesehen, aber mit Google Glas und der Gesichsterkennung könne er informiert werden, dass ihm gerade sein Bruder entgegen käme oder welchen Gesichtsausdruck sein Gegenüber gerade habe. Wenn Du nur ein paar wenige Vorträge der Veranstaltung sehen möchtest, sollte dieser unbedingt dabei sein.

Jessica Hische

Nach der langen Mittagspause zeigte uns Jessica Hische viele ihrer Arbeiten. Ich bin nicht der Einzige der bis jetzt nicht weiss, ob uns Jessica mit ihrem Vortrag irgendetwas sagen wollte, ausser dass sie tolle Projekte gemacht hat. Ich habe mitgenommen, dass sie über Jahre ihrem Stil treu geblieben ist, um es freundlich zu formulieren, und dass sie mittlerweile weniger optische Dekoration macht. Ich fand die Akkuratesse ihrer Sketches toll. Aber gelernt habe ich nichts. Das Video kann man sich schenken, es sei denn, man ist selber Designer und mag ausufernde Schriften.

Ola Gasidlo

Danach versuchte uns Ola Gasidlo für das Konzept von Hood.ie zu begeistern. Das misslang ihr ein wenig. Ihre Nervosität war gar nicht so schlimm, der Vortrag war einfach nicht passend aufgebaut. Der thematische Unterbau wurde zu ausufernd besprochen, da blieb leider zu wenig Zeit, um Hood.ie im Detail zu besprechen. Ich habe leider nicht mehr als eine grobe Idee, was diese Technik kann und welches Problem sie mir löst. Doch hatte ich diesen Stand schon vorher.
Ich denke, es wäre besser gewesen, mehrere konkrete Beispiele zu besprechen und an ihnen den Charme des Konzeptes zu demonstrieren. Nichtsdestotrotz bleiben interessante Gedanken und eine Erinnerung an eine interessante Technik übrig.

Bastian Allgeier

Es folgte Bastian Allgeier, der als Deutscher zwar gut Englisch sprach, sich aber sichtlich nicht so ganz wohl fühlte. Ich kann mir vorstellen, dass er auf Deutsch seine sehr interessanten Ideen leidenschaftlicher rüberbringt. Bastian entwarf ein Konzept, wie jeder Nutzer sozialer Netzwerke seine Daten in seinem persönlichen Zugriffsbereich vorhält und nicht den walled gardens der großen Betreiber überlässt. Inhaltlich ein spannendes, wichtiges Thema, das man durchaus als Video schauen sollte, zusammen mit dem letzten Vortrag der Konferenz.

Für mich endete der erste Tag hier, den abschliessenden Talk eines Künstlers gab ich mir nicht, ass stattdessen noch einen Burger draussen und unterhielt mich angeregt.

Dan Mall

Der zweite Tag wurde von Dan Mall eröffnet. Für mich war dies einer der wichtigsten und interessantesten Vorträge. Er zeigte anhand vieler Projekte, mit welchen unterschiedlichen neuen Ansätzen und Methoden man sich einem neuen Projekt nähern kann. Ich fand die Idee des Perfomance-Budgets sehr interessant und bin geneigt, dies in einem nächsten Projekt vorzuschlagen.

Da ich selber Schulungen zu Responsive Design gebe und dabei die Veränderung des Workflows anmahne, war ich gespannt, wie er diesen Aspekt sieht. Ich fand seine pragmatische Herangehensweise für die Transformation einer Wasserfall-Agentur in eine agile Agentur sehr gut. Dieser Vortrag ist voll wichtiger und interessanter Anregungen, die in der Praxis getestet wurden, deshalb empfehle ich dringend, das hoffentlich bald erscheinende Video zu schauen.

Jonathan Snook

Jonathan Snook hatte ich schon vor zwei Jahren in Freiburg auf der Smashing Conference gesehen. Er hat mit SMACSS einen interessanten Ansatz publiziert, wie man sein CSS vernünftig organisieren kann. Der ihm wichtigste Teil sind seine Namenskonventionen.

Ich hatte befürchtet, dass er im Prinzip den gleichen Vortrag wieder halten würde, da die Variationsmöglichkeiten bei diesem Thema ja schliesslich begrenzt sind. Er blieb durchaus beim Thema, machte aber keine SMACSS-Werbeveranstaltung, sondern widmete sich seinem Leib- und Magenthema einfach mal grundsätzlich. Er baute sehr schön und logisch auf, warum es sehr sinnvoll ist, sein CSS mit Köpfchen zu schreiben und welche Wege man beschreiten sollte.

Wer sein CSS schon modular aufbaut und eine Namenskonvention hat, wird in diesem Vortrag keine revolutionären neuen Einsichten finden. Snook spricht eloquent und interessant, aber ohne große Begeisterung und ohne Begeisterung auslösen zu können. Ich empfehle das Video also nur denjenigen, die wirklich Interesse an CSS-Architektur haben und auf den entscheidenden Erkenntnisschub hoffen.

Karen McGrane

Karen McGrane führte uns mit ihrer drohenden “Zombie Apocalypse” in die Pause. Dieser wirklich sehr schiefe und reisserrische Begriff sollte die große Anzahl an Devices symbolisieren, mit denen wir es heute zu tun haben. Karen drehte den Blick auf die Inhalte unserer Webseiten. Ich fand den Begriff des “Blob” für Inhalte sehr passend. Denn wenn diese in einem “WYSIWYG”-Editor innerhalb des CMS platziert werden, geht jede Kontrolle über die einzelnen Bausteine des Inhaltes verloren.

Ihr Thema ist wichtig, keine Frage. Es war allerdings eine echte Herausforderung ihr zu folgen. Denn erstens machte sie ständig furchterregende Grimassen, die wohl ihre Positionen untermalen sollten. Und zweitens sprach sie im Tonfall der fies übersetzten amerikanischen Teleshopping-Frauen, die Bügelbretter oder Pfannen anbieten. Zudem war der Vortrag im Wesentlichen schamlose Eigenwerbung, ohne wirkliche Lösungen zu bieten.

Nichtsdestotrotz fand ich den Vortrag interessant. Denn obwohl mir das Thema nicht unbekannt ist, habe ich erst jetzt die Hintergründe und die Bedeutung erkannt. Da vergebe ich Karen, dass man beim nachträglichen Videostudium am Besten etwas über die Vortragende legt, um nicht dauernd diese fiesen Grimassen mitzubekommen.

Erik Spiekermann

Nach der Pause kam Erik Spiekermann, eine Typografen-Legende. Ich kann schöne Schriften geniessen, bin aber kein Fan und war deshalb nicht ansatzweise so aufgeregt über sein Kommen, wie so mancher meiner Freunde.

Angesichts seines Legendencharakters war sein launiger Auftritt schlecht. So wirklich gelernt habe ich nichts, ausser dass er prima auf Englisch fluchen kann und einen auf bescheiden macht, dabei aber fürchterlich mit seinen Leistungen prahlt. Mir ist ähnlich wie bei Jessica Hische nicht klar, was er uns eigentlich mitteilen wollte. Mir bleibt ein Diagramm in Erinnerung, mit dem er den agilen Prozess seiner Firma sehr schön visualisierte.

Ich denke, das Video ist nur für Fans interessant. Alle anderen können es sich schenken.

Stephen Hay

Stephen Hay kam nun endlich mit interessanten Inhalten, die er launig und souverän wie immer präsentierte. Er zeigte an vielen Praxisbeispielen falsche UI-Entscheidungen. Sein Plädoyer, dass man möglichst einfach vom Ausgangspunkt zum Ziel kommen solle, kann ich nur unterschreiben. Dieser Vortrag ist definitiv wichtig und sollte auf keiner Playlist fehlen. Sein Buch über “Responsive Design Workflow” kann ich hingegen nicht so empfehlen. Er schreibt einfach zu geschwätzig. Was auf der Bühne noch ein nettes Stilmittel ist, nervt mich persönlich im Buch sehr.

Maciej Cegłowski

Maciej Cegłowski, der Gründer der Bookmarking-Site Pinboard, näherte sich sehr humorvoll einem schwierigen Thema. Er zeigte auf, in welcher Hinsicht das Internet an vielen Stellen “kaputt” ist. Er ergänzte damit den Vortrag von Bastian Allgeier. Seine An- und Einsichten kann ich allesamt unterschreiben. Der Vortrag ist komplex und witzig und definitiv einer der besten und sehenswerten der gesamten Konferenz. Dieser Vortrag bildet mit dem von Bastian Allgeier, dem Hood.ie-Vortrag von Ola Gasidlo und dem Vortrag von Robin Christopherson eine sehr interessante thematische Einheit.

Ich denke, innerhalb dieses Spannungsfeldes zwischen positiven Einflüssen von Technik, Konstruktionsfehlern des Internet und technischen Lösungen für einen besseren Umgang mit den eigenen Daten werden in der nächsten Zeit viele interessante und sehr wichtige Diskussionen stattfinden. Angesichts der enormen Bedeutung des Internet und Computer jeglicher Art für jeden Einzelnen sowie für Unternehmen und unser Wirtschaftssystem, ist es an der Zeit, nicht einfach nur technische Entwicklungen passiv hinzunehmen. Wir sollten die Gestaltung unserer Gegenwart und Zukunft nicht einigen wenigen überlassen, sondern selber eingreifen.

Sprecherauswahl

Ich habe sehr viele interessante Gedanken und Anregungen mitgenommen. Nicht alle Vorträge waren hundertprozentig mein Ding, aber das erwarte ich auch nicht. Selbst die Vorträge, die mir weniger gut gefielen, waren qualitativ gut genug, um bei den meisten anderen Konferenzen als der Knaller des Tages durchzugehen. Deshalb kann ich Marc nur für seine Auswahl beglückwünschen.

Fazit

Es kommt sehr selten vor, dass ich auf einer Konferenz bin und von allen Vorträgen etwas mitnehmen kann und von der Hälfte der Vorträge begeistert bin. Die Qualität der Vorträge war sehr gut, die Location war klasse, obwohl die Stühle auf die Dauer unbequem sind. Die generelle Stimmung war fröhlich und offen, es machte Spass, Teil dieser Menge zu sein. Ich habe dabei einige nette Menschen und Freunde wiedergetroffen, was will man mehr.

Ich finde den Ansatz, Getränke und Essen nicht einzukalkulieren, sondern den Teilnehmern selber zu überlassen, sehr gut. Wir waren schliesslich mitten in einer Großstadt, jeder konnte sich in der Nähe mit Essen und Getränken eindecken. Es gab kostenlosen Kaffee und für ziviele Preise dann auch Kaffee, der schmeckte. Einen Espresso für einen Euro habe ich ausserhalb von Italien noch nie bekommen, hier gab es ihn und er schmeckte.

Meine Freunde hatten Recht, als sie mir dringend anrieten, Beyond Tellerrand zu besuchen. Ich schätze, ich werde auch nächstes Jahr wiederkommen. Inhaltlich kann es kaum besser werden. Aber ich freue mich, bekannte Gesichter wiederzutreffen und neue kennenzulernen. Vielleicht sehen wir uns ja?

Author: "Jens Grochtdreis" Tags: "Veranstaltungen"
Comments Send by mail Print  Save  Delicious 
Date: Friday, 16 May 2014 06:11
Author: "Jens Grochtdreis" Tags: "Linklisten, Responsive Webdesign"
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 08 May 2014 06:30
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Date: Wednesday, 07 May 2014 06:30

Ende April war ich zusammen mit Peter Kröner in Düsseldorf, um eine dreitägige Schulung zu geben. Am Rande dieser Veranstaltung trafen wir uns abends mit Christian Schäfer und nahmen zusammen eine neue Folge Workingdraft auf. In dieser Folge sprachen wir im Wesentlichen darüber, wie wir zu unseren Jobs kamen. Welche Vor- und Ausbildung haben wir, welche Entscheidungen haben wir getroffen? Was haben wir so alles getrieben? Ich habe dabei auch erzählt, wie es dazu kam, dass ich die Webkrauts gründete.

Herausgekommen ist eine untypische Workingdraft-Folge mit einem leichten “Opa erzählt vom Krieg”-Touch. Aber erste positive Reaktionen über Twitter zeigen, dass unsere Idee und unser Plausch nicht schlecht waren. Ich hoffe, die Folge gefällt Euch.

Author: "Jens Grochtdreis" Tags: "In eigener Sache"
Comments Send by mail Print  Save  Delicious 
Date: Monday, 05 May 2014 07:16
Author: "Jens Grochtdreis" Tags: "Linklisten"
Comments Send by mail Print  Save  Delicious 
Next page
» You can also retrieve older items : Read
» © All content and copyrights belong to their respective authors.«
» © FeedShow - Online RSS Feeds Reader