Quantcast
Viewing all 231 articles
Browse latest View live

Nicht ins Stocken geraten

Image may be NSFW.
Clik here to view.
Schnecke
Animationen mit CSS und JavaScript

Animationen können ein nützliches Werkzeug sein, um Interaktionen zu fördern und Informationen leichter verständlich zu machen. Doch wo viel Licht ist, ist auch viel Schatten. Ruckelnde Animationen mit geringer Framerate beeinträchtigen die Usability und wirken sich oft negativ auf das Nutzerverhalten aus. Mit ein, zwei Tricks könnt ihr die Performance der Animationen verbessern.

Animationen mit CSS

CSS3 bietet zwei Möglichkeiten, Inhalte zu animieren: Transitions und Keyframe Animationen.

Transitions sind Übergänge von einem Start- in einen Endzustand, Zwischenzustände sind hier nicht möglich. Sie haben zwei praktische Anwendungsbereiche: Zum einen sind Transitions sehr nützlich, um interaktive Zustandswechsel, zum Beispiel durch das Fokussieren eines Elements, zu animieren. Zum anderen eignen sie sich auch sehr gut im Zusammenspiel mit JavaScript, da Transitions auf jede Art von Styleänderungen (also durch inline Styles, Klassenzuweisungen oder Pseudoklassen) reagieren. → Beispiel ansehen

Sehr hilfreich ist außerdem, dass Transitions einen »eingebauten Fallback« besitzen: Browser, die keine Transitions kennen, führen denselben Zustandswechsel einfach abrupt durch. Das bedeutet, dass diese User dadurch keine bedeutenden Nachteile bei der Nutzung der Website haben.

Um jedoch eine optimale Performance bei Transitions zu erreichen, empfiehlt es sich, das Verhalten des Browsers etwas genauer unter die Lupe zu nehmen. Werden Eigenschaften, die sich auf das Layout einer Website beziehen (z.B. width/height, top/right/bottom/left, margin,…) geändert, so muss der Browser bei jeder Änderung das Layout der Seite neu berechnen. Schließlich ist es möglich, dass gefloatete Elemente durch die Änderungen umbrechen oder sich nachfolgende Elemente verschieben. Das Berechnen des Layouts ist ein vergleichsweise aufwändiger Prozess, der je nach Komplexität der Seite einige Millisekunden in Anspruch nehmen kann. Bei einmaligen Änderungen ist dies in der Regel kein Problem, aber bei Animationen können diese Millisekunden entscheiden, ob die Animation mit 60, 30 oder weniger Frames pro Sekunde abläuft und somit ruckelt. Dieses Problem könnt ihr jedoch umgehen, indem ihr statt Layout-Eigenschaften sogenannte CSS-Transformationen verwendet. Diese beziehen sich nur auf das jeweilige Element selbst und dessen Unterelemente, der Rest der Seite wird davon nicht beeinflusst und somit muss das Layout nicht neu berechnet werden. Ein weiterer Vorteil von CSS-Transformationen ist, dass diese auf Subpixel-Ebene arbeiten. Das heißt Elemente können auch um Bruchteile von Pixeln verschoben werden, wodurch die Pixel-Stufen umgangen werden können. → Beispiel ansehen

Weiterhin könnt ihr an der Performance-Schraube drehen, indem ihr einige Animationen vom Hauptprozessor (CPU) auf den Grafikprozessor (GPU) auslagert, der für grafische Berechnungen deutlich besser geeignet ist. Dies erreicht ihr im Moment durch den einfachen Trick, auch in der 2D-Ebene 3D-Transformationen zu verwenden. Dass sich die Animation trotzdem nur in zwei der drei Dimensionen bewegt, stört schließlich niemanden. Die meisten Browser lagern diese »komplexeren« Berechnungen dann auf die schnellere GPU aus. Leider können 3D-Transformationen allerdings Seiteneffekte hervorrufen und zu einem Flackern der Seite oder ähnlichen Problemen führen. Glücklicherweise werden zukünftig aber auch 2D-Transformationen auf die GPU ausgelagert, sodass der Umweg über die dritte Dimension nicht mehr gegangen werden muss. Einen umfassenden Artikel zur Hardwarebeschleunigung in CSS hat Martin Kool bei Smashing Magazine veröffentlicht.

Keyframe Animationen sind die zweite Möglichkeit, Animationen mittels CSS zu realisieren. Sie eigen sich besonders, wenn sich Animationen selbstständig, ohne Eingreifen des Users, ablaufen sollen. Gegenüber Transitions haben sie außerdem den Vorteil, dass komplexere Abläufe mit Zwischenzuständen definiert werden können. → Beispiel ansehen

Natürlich spielt aber auch hier das Rendering-Verhalten des Browsers eine Rolle, sodass ihr die bei den Transitions erwähnten Tricks hier ebenso anwenden könnt.

Doch diese beiden Techniken alleine werden zur Umsetzung komplexerer Animationen, bei denen zum Beispiel mehrere Elemente in Abhängigkeit voneinander animiert werden müssen, nicht ausreichen. Zum Glück gibt es da aber noch JavaScript, mit dessen Hilfe ihr auch diese Animationen in den Griff bekommt.

Animationen mit JavaScript

Für komplexe Animationen solltet ihr weiterhin auf JavaScript zurückgreifen, da Animationen mit vielen Abhängikeiten mit den oben genanten Methoden zwar möglich, aber unnötig kompliziert sein können. Auch hier hat sich in letzter Zeit einiges getan, um eine bessere Performance zu erreichen. Die bisherige Strategie, Eigenschaften mit einem festgelegten Intervall alle paar Millisekunden zu ändern, hat ausgedient und dient heutzutage nur noch als Fallback für ältere Browser. Fast alle aktuellen Browser können mit der Methode requestAnimationFrame umgehen, die unnötige Berechnungen verhindert und somit die CPU und den Akku schont, was vor allem auf mobilen Geräten sehr wichtig ist. Der Trick dabei ist, dass der Browser angibt, wann er die Seite neu rendern kann und Eigenschaften somit nur dann neu berechnet werden müssen, wenn diese auch verwendet werden. Die praktische Anwendung von requestAnimationFrame wird in einem Artikel von Paul Irish thematisiert.

Fazit

CSS3 und JavaScript bieten gute Möglichkeiten, Animationen performant umzusetzen. Dennoch sollten sich Entwickler immer klar darüber sein, dass Animationen denselben Effekt wie eine Latenz haben: Der User muss warten. Deshalb gilt auch hier oft der allgemeine Satz »weniger ist mehr«. Animationen sind gut geeignet, um Übergänge leichter verträglich zu machen und können auch optisch ein Pluspunkt sein, wenn man sie richtig einsetzt. Wer allerdings alles wild durcheinander bewegt, der wird dem User schnell den Überblick nehmen und diesen verärgern. Deshalb: Keep it simple!

Daniel Rauber

Agile Ideen für Webentwickler

Image may be NSFW.
Clik here to view.
Ein Scrum-Kanban-Board
Einstieg in Scrum und Kanban – Teil 1

Bei größeren Webprojekten kann es schwierig, sogar hinderlich sein, im Voraus festzulegen, was am Ende wirklich benötigt wird. Agile Entwicklungsmethoden bieten einen anderen Ansatz: Mit wenigen Regeln und einem iterativen Vorgehen sollen die Projekte flexibler und einfacher werden. Methoden und Ideen wie Sprints, User Stories und Kanban Board eignen sich auch für kleinere Teams und Projekte.

Kanban und Scrum sind agile Vorgehensmodelle, die sich gegenwärtig großer Aufmerksamkeit erfreuen und seit Jahrzehnten erfolgreich eingesetzt werden – sowohl im Großen bei Weltkonzernen wie Toyota als auch auf individueller Ebene zur Selbstorganisation.

Unzählige Schulungsangebote, Fachvorträge und Bücher bieten einen guten Einstieg in die Methoden und deren Umsetzung in Entwicklungsteams oder ganzen Unternehmen. Anstelle einer weiteren Einführung in die Methoden findet ihr im Folgenden einen Überblick über die »agilen« Ideen und Werkzeuge sowie deren mögliche Anwendungen in der täglichen Arbeit – in Form einer Kombination von Kanban und Scrum. Diese bietet insbesondere für einzelne Webworker oder kleine Teams eine Chance, die Vorteile auch im »nicht-agilen« Umfeld zu nutzen.

Verbesserung in kleinen Schritten

Der Kern der beiden Vorgehensweisen – das Agile Manifest– hat folgende Kernaussagen:

  • Individuen und Interaktionen sind wichtiger als Prozesse und Werkzeuge.
  • Funktionierende Software ist wichtiger als umfassende Dokumentation.
  • Zusammenarbeit mit dem Kunden ist wichtiger als Vertragsverhandlung.
  • Schnelle Reaktion auf Veränderung ist wichtiger als die strikte Planung.

Das bedeutet nicht, dass Prozesse, Werkzeuge, Dokumentation, Vertragsverhandlungen und ein Projektplan unwichtig oder unnötig wären. Es geht mehr um die richtigen Prioritäten.

Insbesondere Kanban legt großen Wert darauf

  • Prozesse zu standardisieren und kontinuierlich zu verbessern.
  • Fehler zu vermeiden und die Kosten von Fehlern zu reduzieren.
  • Im Kundentakt zu produzieren (nur das, was der Kunde wirklich benötigt, bei kontinuierlicher Anpassung der Planung an geänderte Anforderungen).
  • Verschwendung zu reduzieren.

Es wird versucht, die Welt des Kunden mit dessen Augen zu sehen:

  • Denken wie der Kunde beziehungsweise der Nutzer.
  • Direkte Kommunikation zwischen den Entwicklern und dem Kunden.
  • Priorisierung von Entwicklungszielen anhand ihres Wertes für den Kunden.
  • Zeitnahe Lieferung und Verifizierung von Zwischenständen.

Die Werte sind daher Offenheit, Verantwortung und Einfachheit.

Die Kundenzufriedenheit wird hierbei durch einen kontinuierlichen und institutionalisierten Dialog gesteigert; die Entwicklung bewegt sich dabei »von 100% unbekannt« hin zu »100% fertig«. Änderungen an der Planung werden genauso berücksichtigt (und sind willkommen/eingeplant) wie die regelmäßige Lieferung fertiger Softwarestände.

Einfachheit

Das wichtigste Ziel agiler Methoden ist die Einfachheit. Viele Entwickler neigen dazu, technisch komplizierte Lösungen und interessante Zusatzfunktionalitäten zu entwickeln, die zur Lösung des Problems gar nicht benötigt werden. Die Vorteile der »einfachsten Lösung«:

  • Es muss weniger Code produziert werden.
  • Es muss weniger Code getestet werden.
  • Weniger Funktionalität und Komplexität bedeutet meist eine einfachere Nutzung, geringeren Schulungsaufwand, was zu einer höheren Zufriedenheit bei den Nutzern führt.
  • Die Komplexität der Lösung ist geringer, dadurch sinkt die Wahrscheinlichkeit, auf unerwartete Probleme zu stoßen.
  • Die Gesamtkosten aus Sicht des Kunden sinken (Stichwort: »total cost of ownership«), da in Zukunft auch weniger Code gewartet werden muss.
  • Das Projekt wird schneller fertig.

Daher führen weniger Funktionen und einfachere Lösungen fast automatisch zu zufriedeneren Kunden und Nutzern. Wie kann dies nun in der Praxis umgesetzt werden?

User Stories und Product Backlog – oder: »was soll entwickelt werden?«

Als User Story wird eine in Alltagssprache formulierte Anforderung aus Nutzersicht bezeichnet. User-Stories sollten in ein bis zwei Sätze gefasst werden und möglichst auf eine Karteikarte passen. Es ist sinnvoll, innerhalb eines Projektes eine einheitliche Struktur für User Stories zu wählen. Ein Beispiel mit dem Fokus auf die Benutzerrolle (zum Beispiel »Besucher der Webseite«, »Editor«): »Als <Rolle> möchte ich <Ziel/Wunsch>, um <Nutzen> zu erreichen.«

  • »Als Besucher der Webseite möchte ich dem Betreiber eine Nachricht zukommen lassen, um weitere Informationen zu einem Produkt anzufordern«.
  • »Als Besucher der Webseite möchte ich dem Betreiber eine Nachricht zukommen lassen, um einen Termin auszumachen«.
  • »Als Betreiber der Website möchte ich Nachrichten von Besuchern der Webseite als E-Mail erhalten, um direkt darauf reagieren zu können«.

In User Stories werden Ziele und Nutzen aus Sicht des Anwenders beschrieben, statt sich bereits auf eine Funktionalität und Implementierung zu begrenzen. Anstelle von »wie umsetzen« wird beschrieben was erreicht werden soll. Die Frage nach dem Ziel erleichtert es zudem, ungeeignete oder unnötig komplizierte Funktionalitäten leichter zu identifizieren, da der Nutzen des Anwenders klar im Vordergrund steht. Das gleiche gilt für Spielereien und subjektive Präferenzen. Folgende User Stories sind schwerlich vorstellbar:

  • »Als Besucher der Webseite wünsche ich mir, dass Musik im Hintergrund gespielt wird, weil ich das total toll finde«
  • »Als Besucher der Webseite wünsche ich mir, dass wichtige Textstellen unterstrichen sind, damit ich mir diese besser merken kann«
  • »Als Besucher der Webseite möchte ich gefragt werden, bevor ich die Webseite schließen kann, damit ich nochmals bestätigen kann, ob ich wirklich die Seite verlassen will«

User Stories reduzieren Komplexität. Insbesondere zu Anfang eines Projektes sind viele Anforderungen noch sehr abstrakt. Kundenziele, die auf einer horizontalen Achse den gesamten Umfang des Projektes beschreiben, können durch weitere Verfeinerung in vertikaler Richtung immer detaillierter beschrieben werden.

Größere Themenblöcke werden als »Epic« bezeichnet. Dies können zum Beispiel Funktionalitäten wie Authentifizierung, die Nutzung eines Kontaktformulars oder die Anmeldung zu einem Newsletter sein. Aus »Als Besucher der Webseite möchte ich mich zu einem Newsletter anmelden, um eine Mail zu erhalten, sobald es Neuigkeiten gibt« (Epic) können dann weitere User Stories abgeleitet werden, die insbesondere aus Sicht verschiedener Nutzergruppen oder Bestandteile des Systems formuliert werden.

Praxistipps zur Strukturierung:

  • User Stories sollten eine eindeutige Identifikationsnummer haben, um leicht in Bezug zueinander gesetzt werden zu können.
    Beispiel: »Siehe auch: #2456, #3322« oder »Blockiert: #994, #4110«.
  • Zur leichteren Strukturierung bietet es sich an, eine Überschrift mit Modulzuordnung zu verwenden. Beispiel:
    • Überschrift: »Newsletter: Anmeldung« (Modul: Funktion).
    • User Story: »Um mich zum Newsletter anzumelden, möchte ich als Besucher der Webseite meine E-Mail-Adresse angeben können«.

Neben Epic und User-Stories gibt es noch Task (Aufgabe). Eine Task beschreibt die konkrete Umsetzung und somit das »wie« einer User Story. Beispiel:

  • Orderstruktur und CSS Dateien anlegen.
  • jQuery dem Projekt hinzufügen.

Als »Product Backlog« wird die Summe aller Epics, User-Stories und Tasks beschrieben, die das zu entwickelnde Produkt beschreiben.

Sprint Backlog und Kanban-Board‎

Im Scrum-Prozess erfolgt die Umsetzung in sogenannten »Sprints« – in sich geschlossene Zyklen – die üblicherweise eine Länge von zwei Wochen haben. Je nach Team, Projekt oder auch Projektphase sind natürlich auch kürzere oder längere Intervalle möglich. Insbesondere während der Einführung von Scrum kann es sinnvoll sein, für eine begrenzte Zeit im Wochenrhythmus zu arbeiten, um Erfahrungen zu sammeln und den Prozess zu etablieren.

Image may be NSFW.
Clik here to view.
Die Srum-Projektmanagement-Methode
Die Srum-Projektmanagement-Methode

Sehr stark vereinfacht besteht ein zweiwöchiger Sprint (10 Arbeitstage) aus folgenden Phasen:

  1. Planung (5 Tage vor Sprintbeginn)
  2. Auswahl der User Stories für den Sprint
  3. Priorisierung der User Stories
  4. Aufwandsschätzung für die einzelnen Aufgaben
  5. Kick-Off – Detailplanung (1. Tag)
  6. Umsetzung (2. bis 9. Tag)
  7. Präsentation der Ergebnisse in einer »Sprint Demo« (10. Tag)

Scrum ist ein sehr stark regulierter und strukturierter Prozess (circa 35 Regeln), mit sehr detaillierten Beschreibungen von Rollen und Verantwortlichkeiten.

Einige dieser Regeln lauten:

  • Die Anzahl der zu erreichenden Ziele wird vor dem Sprint festgelegt. Muss während des Sprints eine Änderung vorgenommen werden, erfolgt dies durch einen sogenannten »Change Request«. Für jede zusätzliche Aufgabe wird eine mit vergleichbarem Aufwand aus den Sprintzielen entfernt. Für das Team stellt dieses Vorgehen eine zentrale Schutzfunktionen dar.
  • Am Ende des Sprints steht immer ein nutzbares Arbeitsergebnis, das wiederum als Grundlage für die nächste Sprintplanung dienen kann. Konkret bedeutet das: Funktionalitäten so früh wie möglich nutzbar machen, um authentisches Feedback sammeln zu können.
  • Die gleichbleibende Länge der Sprints ermöglicht eine gewisse Plan- und Vorhersagbarkeit der folgenden Sprints, da eine Metrik für die Team Geschwindigkeit (Velocity) abgeleitet werden kann. Im einfachsten Fall könnte dies »Anzahl der Stories / Sprint« sein, wobei aus vergangenen Erfahrungen natürlich immer nur begrenzt auf die Zukunft schließen lässt.

Kanban hat im Vergleich zu Scrum nur wenige Regeln. Die zentralen Ideen lauten:

  • Visualisierung des Arbeitsprozesses.
  • Begrenzung der Anzahl gleichzeitiger Aufgaben (»Work in Progress« - WiP).

Zentrales Element ist das »Kanban Board«: Es umfasst verschiedene Spalten, welche die einzelnen Prozessschritte abbilden. Beispiel:

  1. Todo: Alle zu erledigenden Aufgaben
  2. In Bearbeitung
  3. Fertig
Image may be NSFW.
Clik here to view.
Ein Scrum-Kanban-Board

Ein etwas detaillierteres Board in der Programmierung mit acht Schritten könnte so aussehen:

  • Backlog
  • Umsetzung
    • Programierung
    • Programmierung fertig
    • Verifizierung
  • Abnahme- und Akzeptanztests
    • Testen
    • Tests fertig
  • Auslieferung

Kanban begrenzt dabei die Anzahl der gleichzeitig offenen Aufgaben im Status Bearbeitung (WiP) um eine Überlastung zu vermeiden. Wie würde also eine Verbindung der beiden Ansätze in der Praxis aussehen? Scrum lässt sich als Rahmen verwenden, um das Backlog zu strukturieren und Ziele für ein Team zu definieren, um dann die persönlichen Aufgaben für jedes einzelne Teammitglied mittels eines Kanban Boards zu organisieren. Ein Beispiel für ein Team aus jeweils einem Redakteur, Designer, Frontend- und Backend-Entwickler:

  • Sprint Länge: zwei Wochen.
  • Jedes Teammitglied erhält ein persönliches Kanban Board.
  • Die beiden Entwickler sind Vollzeit im Projekt verfügbar.
  • Die beiden Entwickler werden mit netto 40 (von ca. 75 möglichen) Arbeitsstunden im Sprint geplant, um über ausreichend Puffer zu verfügen.
  • Die Entwickler bearbeiten gemeinsam das Sprint Backlog, aber strukturieren ihre persönlichen Aufgaben auf jeweils eigenen Kanban Boards.
  • Der Redakteur wird im Scrum je Sprint flexibel eingeplant, wobei dies zwischen 0% zum Projektstart und 100% zum Projektende (Testen) variiert. Sein Kanban Board umfasst auch andere Projekte und berücksichtigt insbesondere täglich neu auftretende Aufgaben im Kontakt mit dem Kunden.
  • Notwendige Zulieferungen des Designers müssen vor Beginn des jeweiligen Sprints vollständig vorliegen, weshalb diese nicht im Scrum geplant werden.
  • Der Designer profitiert durch die Visualisierung seiner Aufgaben durch ein Kanban Board insbesondere, da er jederzeit »zeigen« kann, woran er gerade arbeitet. Darüber hinaus unterstützt die Begrenzung des WiP den kreativen Prozess.
  • Die Sprint Demo bringt alle Beteiligten zusammen und ermöglicht, die Arbeitsergebnisse zu diskutieren.

Im morgigen zweiten Teil geht es um den Praxiseinsatz, Werkzeuge und die Frage, wie ein Vertragsentwurf für ein agiles Projekt aussehen könnte.

Bernhard Welzel

Agile Ideen in der Praxis

Image may be NSFW.
Clik here to view.
Gesprächsrunde im Team
Einstieg in Scrum und Kanban – Teil 2

Wenn sich Kunde und Auftraggeber einig sind und auf einen agilen Prozess einlassen, stellen sich automatisch einige Fragen: Wie funktioniert das System nun im realen Projekt? Wie lässt sich diese Umsetzung kalkulieren? Und wie wird das im Vertrag festgehalten?

Im ersten Teil ging es um die grundlegenden Ziele und Methoden agiler Entwicklung. Dazu kommen nun verschiedene Positionen im Team, Werkzeuge sowie feste Elemente in agilen Prozessen:

Product Owner, Scrum Master und das Team

Im Scrum Prozess obliegt es dem sogenannten »Product Owner«, die Kundenbedürfnisse zu repräsentieren und die Einträge im Backlog nach diesen zu priorisieren. Der »Scrum Master« trägt die Verantwortung für die Einhaltung der Scrum-Regeln, Moderation von Meetings und Lösung von Problemen, die Fortschritte des Teams behindern (»Blocker«). Eine detaillierte Beschreibung der Rollen und ihrer Aufgaben sprengt den Rahmen dieses Artikels. Bei Verwendung der Methoden zur persönlichen Organisation oder zur Strukturierung der Aufgaben in kleinen Teams ist es ohnehin eher fraglich, inwiefern die »reine Lehre« von Scrum angewendet werden kann oder sollte.

Empfehlenswerte Werkzeuge

Meiner persönlichen Erfahrung nach ist es nicht sinnvoll, spezielle Softwarelösungen für agile Prozesse einzusetzen. Sie beschränken in der Regel die Möglichkeit, den Prozess an die eigenen Bedürfnisse anzupassen. Eine Mischung der folgenden Werkzeugen halte ich für sinnvoller:

  • Ein Board, um Karteikarten mit Epics / User Stories zu befestigen. Für eine Übersicht über das Product Backlog und wichtige Meilesteine / Termine, eher vergleichbar mit einer Roadmap.
  • Das vollständige Product Backlog in digitaler Form, zum Beispiel als Tabelle (etwa Excel, Open Office, google docs) oder in einem einfachen Ticketsystem (zum Beispiel redmine).
  • Das Sprint Backlog: entweder als eigenständiges Text-Dokument oder als Zuweisung einer Zielversion in Redmine. Es ist darüber hinaus sehr sinnvoll, in Form von Karteikarten auf einem weiteren Board für alle Beteiligten eine Visualisierung vorzunehmen, in Sprint Backlog – in Bearbeitung – Fertig.
  • Ein Kanban Board für jedes Mitglied im Team, das mindestens einmal am Tag aktualisiert wird.

Daily Standup Meeting

Ein fester Bestandteil im Scrum-Prozess ist das sogenannte »Daily Standup Meeting«. Zu einer festgelegten Zeit (möglichst zu Anfang des Arbeitstages) trifft sich das Projektteam. Jedes Teammitglied gibt dabei einen kurzen Statusbericht ab:

  • Was habe ich gestern getan?
  • Was werde ich heute tun?
  • Benötige ich Unterstützung? Was blockiert mein Fortkommen?

Ziel ist es, den Wissensstand aller Beteiligten abzugleichen, Probleme frühzeitig zu identifizieren und transparent zu kommunizieren, wer gerade an welcher Aufgabe arbeitet. Die wichtigsten Aspekte des Daily Standup:

  • Findet wirklich im Stehen statt, um möglichst dynamisch und kurz zu bleiben.
  • Ist sehr kurz (weniger als eine Minute pro Person).
  • Dient nicht als Diskussionsforum.
  • Benötigt Moderation (zumeist durch den Scrum-Master).
  • Als Vorbereitung auf den Daily Standup sollte sich jedes Teammitglied Gedanken über die an diesem Tag anstehenden Aufgaben gemacht haben. Als einfache und sehr effektiv Methode hat sich dabei bewährt, die Aufgaben schriftlich nach Priorität auf einem Blatt Papier festzuhalten. Selbstverständlich bildet ein gepflegtes Kanban Board genau diese Funktion ab. Es ist jedoch nicht immer praktikabel, alle Boards zum Standup Meeting mitzubringen.

Retrospektiven und Kaizen

Ein weiteres zentrales Element agiler Prozesse sind regelmäßige Überprüfungen des Prozesses selbst. Im Scrum Prozess ist hierfür in jedem Sprint ein »Retrospective Meeting« vorgesehen, um den Prozess zu reflektieren. Jedes Teammitglied bereitet dafür vorab Antworten auf die folgenden drei Fragen vor:

  • Was ist gut gelaufen / wovon sollten wir »mehr« tun?
  • Was ist schlecht gelaufen / was sollten wir »weniger« tun?
  • Wie können wir konkret eine Verbesserung einführen?

Generell finden sich zum Thema kontinuierliche Verbesserungsprozesse oder Kaizen zahlreiche erprobte Ansätze, die sich auf die Arbeit des Teams und die Arbeitsumgebung anwenden lassen. Wichtig ist, für diese Art der Prozessverbesserung genügend Zeit einzuplanen und die Umsetzung von Verbesserungen auch konsequent zu verfolgen. Ansonsten droht die Gefahr, dass Retrospektiven zu reinen Pflichtveranstaltungen ohne Wert für die Beteiligten verkommen und früher oder später als Zeitverschwendung betrachtet werden.

Exkurs: Projektarbeit – der Vertrag

Agile Verträge bergen zahlreiche Fallstricke. Dieser Artikel soll, kann und darf keine Rechtsberatung darstellen.

In der Praxis kann oftmals eine klassische Vorgehensweise als »einfacher« verkauft werden. Diese Erfahrung schlägt sich dann auch im Angebot nieder – ein möglicher Rahmen ist also ein (Wasserfall-)Werkvertrag, der dann explizit definiert, dass dieses Projekt in Stufen umgesetzt wird und agile Elemente aufgreift. Mögliche Stufen:

  • Planung
    • Gemeinsame Definition der Projektziele
    • »content first« Ansatz
    • Entwicklung einer visuellen Formensprache (»Design«)
  • Umsetzungsphase (Scrum Prozess)
    • Umsetzung einer ersten Version
    • Hinzufügen von Funktionen in kurzen Zyklen
    • Verifizierung der Umsetzung
  • Einführung
    • Schulung
    • Finalisierung von Inhalten
    • Auslieferung

Agile Kalkulation

Erwartungsgemäß »fixe« Kosten wie Konzeption, Design, Installation von Softwarekomponenten, Schulung und Auslieferung können aufgrund einer Anforderungsanalyse und Erfahrungenswerten aus der Vergangenheit gut kalkuliert werden. Für den agilen Teil könnte jetzt ein »fixes« Zeitkontingent angeboten werden. Wobei dies wirklich als Budget betrachtet werden sollte, da in enger Abstimmung mit dem Kunden dann während der Umsetzung der Umfang und die Verwendung angepasst werden. Ziel ist es, das Projekt gemeinsam mit dem Kunden vertrauensvoll und transparent zu realisieren. Dies ist möglich, wenn der Kunde jederzeit klar erkennen kann, wofür sein Geld verwendet wird, welchen Gegenwert er erhält, und an welchem Punkt der Entwicklung sich das Projekt befindet.

Wieso sollte sich ein Auftraggeber auf eine agile Vorgehensweise einlassen?

  • Priorisierung der Projektziele durch den Kunden anhand des Wertes (sowohl aus Unternehmens- als auch Nutzersicht).
  • »Nutzbare« Version der Software ab der ersten Iteration. Hierdurch sinkt das Risiko von kostspieligen Fehlentwicklungen.
  • Eine Neupriorisierung ist als Teil des Prozesses jederzeit möglich.

Weitere Ideen in der Zusammenfassung

Ziel agiler Vorgehensmodelle ist es, wertige Ergebnisse zu produzieren. Hierfür kommen unter anderem auch folgenden Ideen zum tragen:

  • Das Pull-Prinzip: Ein Mitarbeiter arbeitet nur an Aufgaben, für die er und die nachfolgenden Prozessschritte genügend Ressourcen haben.
  • Pareto-Prinzip (80/20): 80% der Ergebnisse benötigen 20% der Zeit – und die restlichen 20% der Ergebnisse 80% der Zeit. In Zusammenhang mit einer Betrachtung des Wertes einer Funktionalität kann die konsequente Anwendung dieser Idee bereits während der Projektplanung dazu führen, dass Überschreitungen des Zeit- und Budgetrahmens erkannt und dann vermieden werden können.
  • Qualität ist Bestandteil des Prozesses – zum Beispiel in Form von Test Driven Design (TDD).
  • Minimierung von Risiken durch kleine Schritte: Funktionalitäten sollten möglichst innerhalb eines Sprints realisiert werden, Arbeitspakete innerhalb eines Tages.
  • Überflüssige und nutzlose Features durch das KISS-Prinzip (Keep it simple stupid!) vermeiden: »so einfach wie möglich halten«.
  • Nur umsetzen, was jetzt wirklich benötigt wird: Yagni Prinzip oder auch Just-In-Time-Implementierung.
  • Features, die lange im Backlog liegen, sind in der Regel überflüssig (Stichwort: Backlog Grooming).
  • Das Konzept »Technische Schulden« beachten: Je länger die Lösung aufgeschoben wird, desto höher die Kosten der Lösung.

Als letzer Aspekt kann noch der Wissensaufbau und Transfer betrachtet werden. Beispiele hierfür sind:

  • Synchrones & asynchrones Pair-Programming.
  • Systematischer Erwerb von theoretisches Wissens zum Beispiel durch Weiterbildung, Besuch von Konferenzen, regelmäßige interne Vorträge.
  • Vermeidung von Insel-Know-How.

Grenzen agiler Methoden

Meine persönliche Meinung ist: Agile Vorgehensmodelle sind nicht automatisch besser. Unzählige Beispiele aus der in der Praxis zeigen, dass Produktivität und Zufriedenheit aller Beteiligten sinken kann, wenn der agile Prozess nicht konsequent befolgt und gelebt wird.

Es lohnt sich in jedem Fall, sich intensiver mit dem Thema auseinanderzusetzen und zumindest einzelne Elemente zu verwenden, selbst wenn eine Umsetzung kompletter Prozesse nicht ratsam erscheint, zum Beispiel weil auf Kundenseite noch keine Bereitschaft besteht, sich darauf einzulassen. Bereits die Verwendung einzelner Elemente wie Daily Standup Meetings, Planung mit User Stories, Planungsboards nach Kanban oder regelmäßige Retrospektiven können einen großen positiven Einfluss auf die persönliche Zufriedenheit für alle Beteiligten haben. Und nicht zuletzt den Projekterfolg.

Bernhard Welzel

Pflichtlektüre für Webworker

Image may be NSFW.
Clik here to view.
Aufgeschlagenes Buch
Buchtipps

Zum Abschluss des diesjährigen Adventskalenders haben wir die Webkrauts gefragt: »Wenn du jeden Webworker zwingen könntest, ein Fachbuch zu lesen: Welches wäre das?«

»Der Web-Report«
Tim Berners-Lee, Econ (1999)

1988 begann ein am CERN-Institut angestellte Informatiker namens Tim Berners-Lee mit der Arbeit an einem neuen Hypertext-Dokumentationssystem. Es sollte dezentralisiert sein und so von möglichst vielen Nutzern auf möglichst vielen Systemen verwendet werden zu können. Das System nannte er »World Wide Web«. Er startete mit der Programmierung eines Browsers. Anschließend schrieb er den Code für das Hypertext Transfer Protocol (HTTP), über das Computer über das Internet kommunizieren würden, sowie den Universal Resource Identifier (URI), das Schema, nach dem Dokumentadressen erstellt und aufgefunden werden können. Im Dezember 1990 arbeitete er an seiner Hypertext Markup Language (HTML), darüber hinaus programmierte er einen eigenen kleinen Webserver.

Einige Jahre später, 1999, war das World Wide Web bereits etabliert und Berner-Lee blickte zurück und schrieb sein Buch »Der Web-Report«. 1999, also in dem Jahr, in dem Yahoo! noch eine große Nummer war; in dem wir HTML 4 gesprochen haben; als Microsofts Internet Explorer den Browserkrieg bereits gewonnen und den Netscape Navigator auf einen Marktanteil von vielleicht noch 40% zurück gedrängt hat – alles ist unglaublich lange her, aber genau das macht Berners-Lees Buch so faszinierend.

Auf dem Buchrücken bezeichnet Michael L. Dertouzos, damals Direktor des M.I.T. und mittlerweile verstorben, das Buch als »einzigartige Geschichte über eine einzigartige Erfindung, geschrieben von ihrem genialen Erfinder«. Das trifft es ganz gut. Aus meiner Sicht eine Pflichtlektüre für jeden der ... ach, eigentlich tatsächlich für jeden.

Michael Jendryschik

»Don't Make Me Think: A Common Sense Approach to Web Usability«
Steve Krug, New Riders (2009; 2013)

»Don't Make Me Think« ist das Buch über Web-Usability und gehört zur Pflichtlektüre für alle, die beruflich im Web arbeiten – seien es Designer, Entwickler, Konzepter oder Entscheider. Dass sich diese Erkenntnis noch nicht vollständig verbreitet hat, sehen wir leider tagtäglich um uns herum: Von Texten, die mit viel heißer (Marketing-)Luft gefüllt sind, über umständliche Online-Bestellformulare bis hin zur frustrierenden Bedienung von Ticket-Automaten.

Dieses Buch gibt eine gute Übersicht über Usability im Allgemeinen, wie man verständlich fürs Web schreibt, Navigationen entwirft und vieles mehr. Dazu kommen nützliche Alltagstipps bei typischen Problemen wie »Hilfe, mein Chef will, dass ich __________ mache!«.

Ein kleiner Tipp: Ende Dezember kommt die überarbeitete dritte Auflage auf den Markt, dann auch (laut Cover) mit einem Kapitel zu Usability für Mobile.

Frederic Hemberger

»Clean Code: A Handbook of Agile Software Craftsmanship«
Robert C. Martin, Prentice Hall (2008)

Robert C. Martin, im Netz auch »Uncle Bob« genannt, ist sozusagen der »Godfather of Software Craftsmanship«, einer immer größer werdenden Bewegung, die Softwareentwicklung als Handwerk begreift. Dazu gehört auch das Bewusstsein, wie man seine Arbeitsweise kontinuierlich verbessert und sein Handwerk mit der Zeit besser beherrschen lernt. Denn auch in unserer »Zunft« gibt es Kunstschreiner und Ikea-Schrauber.

»Clean Code« ist eine der Grundlagen dazu: Was unterscheidet guten Code von schlechtem Code? Wie erkenne ich »code smell«? Wie benenne ich Variablen, Funktionen und Objekte so, dass sie wirklich exakt ihre Aufgabe beschreiben und mein Code verständlicher wird? Wie kann ich meinen Code zuverlässig testen?

Das Buch führt den Leser in verständlicher und unterhaltsamer Weise an das Thema heran. Auch wenn die Code-Beispiele in Java geschrieben sind und das zunächst abschrecken mag: Die Inhalte gelten für alle Sprachen, auch wenn sich die Art der Implementierung oder sich die Gewichtung der vorgestellten Konzepte unterscheiden mag. Wer sich schon einmal grundlegend mit anderen Programmiersprachen beschäftigt hat, wird sich sehr schnell zurecht finden.

Daher meine Leseempfehlung: Bessere Programmierer werden immer gebraucht!

Frederic Hemberger

Designing Web Navigation
James Kalbach

James Kalbach schreibt ein ganzes Buch über Naviagtionen, ohne eine einzige Zeile Code dazu zu veröffentlichen. Ihm geht es darum, die vielfältigen Ausdrucksformen und Vorkommen von Navigationen zu beleuchten, ihre Usability zu beschreiben. Er sensibilisiert den Leser für einen ganz zentralen Bestandteil einer Webseite. Denn wie soll der Nutzer von einer Seite zur anderen kommen, wenn nicht durch eine Navigation?

Als ich das Buch das erste Mal in der Hand hielt, konnte ich mir kein interessantes Thema dahinter vorstellen. Doch ich war schnell gefesselt. Auch von den facettenreichen Beispielen, die der Autor aus der ganzen Welt nimmt. Nicht nur aus den USA oder Europa. Leider gibt es das Buch nicht mehr bei O'Reilly auf Deutsch. Eventuell findet es sich irgendwo als Restposten. Es heißt dann »Handbuch der Webnavigation« und ist jeden Cent und jede Leseminute wert.

Jens Grochtdreis

»Designing with Progressive Enhancement«
Todd Parker, Patty Toland, Scott Jehl und Maggie Costello Wachs, New Riders (2010)

Dieses Buch ist für mich zu einem absoluten Klassiker geworden. Es ist zwar nicht mehr ganz neu, beschreibt aber eindrucksvoll und nachhaltig die Paradigmen der Webstandards. Progressive Enhancement ist ein Garant für Accessibility, Performance und letztlich auch technische Suchmaschinenoptimierung. Das Buch zeigt anhand von praktischen Beispielen die Konzipierung von Fallbacklösungen auf, wie WAI ARIA richtig eingesetzt wird und Best Practices für den Einsatz von HTML(5) und CSS(3) aussehen. Eine Pflichtlektüre für jeden Frontendentwickler und sicher auch noch in ein paar Jahren aktuell.

Henry Zeitler

»Scalable and Modular Architecture for CSS – SMACSS«
Jonathan Snook (2011)

»Das Frontend? Och, das ist doch nur ein bisschen HTML und CSS«. Diese Aussage habe ich im Laufe der Zeit zu oft gehört und jedes Mal antworte ich: »Das erklärt dann auch, warum da draußen nur Websites existieren, die nett anzusehen und technisch einwandfrei sind?«. Genau aus diesem Grund liebe ich Bücher wie SMACSS.

SMACSS hebt die oft unterschätzten Stylesheets auf einen Level, den sie verdienen und zeigen, dass sie es Wert sind, ihnen eine eigene Logistik und Architektur zuteil werden zu lassen. Gut organisierte Stylesheets sorgen für eine bessere Performance, Wartbarkeit und Nachhaltigkeit der Website. Dieses Buch zeigt einen möglichen Weg, Stylesheets zu organisieren, und wie wichtig es ist dieses zu tun. Dabei muss der Leser die vorgeschlagene Architektur von Jonathan Snook nicht exakt so übernehmen, es reicht völlig aus, sich einfach nur inspirieren zu lassen. Und das Beste ist, es ist auch als kostenloses Online-Book erhältlich.

Henry Zeitler

»Das Design-Buch für Nicht-Designer: Gute Gestaltung ist einfacher, als Sie denken!«
Claudia Korthaus, Galileo Design (2013), 330 Seiten

Dieses Buch bietet einen umfangreichen Einstieg in das Thema Grafikdesign. Der Themen-Schwerpunkt liegt im Grafikdesign, mit einem besonderen Fokus auf Formen, Auswahl von Schriften und Farbpaletten. Zahlreiche Praxisbeispiele und eine passende, sehr visuelle Art der Wissensvermittlung runden den Inhalt gekonnt ab.

Die Lektüre ist besonders empfehlenswert für Programmierer, Texter, Projektleiter und auch Kunden, um den Blickwinkel eines Designers zu »verstehen« und um eine gemeinsame Sprache und ein gemeinsames Verständnis zu entwickeln.

Bernhard Welzel

»Visuelle Intelligenz«
Donald D. Hoffman, Klett-Cotta (2001)

Einem dreizehnjährigen Jungen wird zu Beginn des 18. Jahrhunderts der angeborene graue Star gestochen, er kann plötzlich sehen. Der Junge denkt zuerst, die nun sichtbaren Objekte der Welt berühren direkt seine Augen. Anschließend lernt er, Dinge anhand des Aussehens zu unterscheiden. Es dauert aber noch zwei Monate, bis der Junge lernt, die gesehenen Objekte nicht als unterschiedliche Ebenen mit unterschiedlichen Farben wahrzunehmen, sondern als dreidimensionale Objekte.

Dieses Beispiel stammt aus dem Buch Visuelle Intelligenz: Wie die Welt im Kopf entsteht vom US-amerikanischen Wissenschaftler Donald D. Hoffman, meine Empfehlung vor allem für Designer und Konzepter. Kurz gesagt, beschreibt das Buch, wie unser Gehirn lernt, das Bild der Welt zu erschaffen. Jeder kennt das Sprichwort »Ein Bild sagt mehr als tausend Worte«, aber kaum jemand weiß genau, warum das eigentlich so ist. Als Leser erfährt man anschaulich, präzise und auch noch recht unterhaltsam, dass es den unbefangenen Betrachter nicht gibt, dass wir vielmehr mit Hilfe unseres Gehirns gelernt haben, unsere Welt so wahrzunehmen, wie wir sie mit Hilfe unserer Augen sehen. Hoffman zeigt nicht nur bekannte und weniger bekannte optische Täuschungen, er erläutert auch, warum wir uns täuschen lassen und welche Funktion diese Wahrnehmungen für unser Leben und Überleben im Laufe der Evolution hatten und noch immer in unserem täglichen Leben haben.

Interessant ist das Buch auch für die Gestaltung im Webdesign, da hier auch Grundlagen wie Figur-Grundbeziehungen, Abstand und Nähe von Objekten, Flächenwirkungen und dreidimensionale Effekte verständlich erklärt werden.

Nils Pooker

»Flexible Boxes«
Peter Müller, Galileo Press (2013)

Peter Müllers Buch richtet sich zwar nicht an gestandene Entwickler, dennoch sollte es als Pflichtlektüre dessen betrachtet werden, was man als gestandener Webdesigner und -entwickler wissen sollte.

Peter Müller ist seit seinem Bestseller »Little Boxes« bekannt für seinen unterhaltsamen und kurzweiligen Schreibstil, sein Buch Flexible Boxes macht keine Ausnahme. Der Titel könnte zwar nahelegen, hier handele es sich um eine Einführung zum Thema Responsive Webdesign, inhaltlich umfasst es jedoch weit mehr. Als Leser erfährt man angenehm zusammengefasst die Grundlagen zu HTML5, CSS3 und Responsive Webdesign. Innerhalb dieser Bereiche werden diejenigen Aspekte näher erläutert, die für die Praxis moderner Webentwicklung wichtig sind, beispielsweise Grid-Systeme, CSS-Frameworks, der Einsatz von Media Querys, Gestaltung von Formularen und die Einbindung von Webfonts.

Allein diese zusammenfassende Darstellung in Verbindung mit der bewährt hohen Schreibqualität von Peter Müller macht das Buch zu einer sinnvollen Ergänzung der Standardwerke zum Webdesign, denn als Webentwickler oder -designer können wir nicht alles wissen und sind auch nicht in allen Bereichen gleich kompetent. As beruhigende Gewissheit zitiert Müller deshalb schon im Vorwort Jeffrey Way: »You'll never graduate«. Auch Flexible Boxes verhilft nicht zu einem Doktortitel im Webdesign, das Grundstudium ist damit aber vollständig abgedeckt.

Nils Pooker

»Deutsch für junge Profis: Wie man gut und lebendig schreibt«
Wolf Schneider, 2010

Wenn ihr schon etwas mit Klebeband an eurem Monitor befestigt, um es nicht zu vergessen, dann sollte es dieses Buch sein!

Wolf Schneider – Ausbilder an mehreren Journalistenschulen und u.a. Träger des »Medienpreises für Sprachkultur« – führt euch über 32 kleine Rezepte zu klarem, verständlichem Deutsch. Aber Moment, warum sollte ein Webworker ein Buch über deutsche Sprache lesen? Für den Inhalt ist doch schließlich der Kunde zuständig? Ganz klar: Wer als Webworker darauf Wert legt, aus einzelnen Disziplinen wie Usability, Barrierefreiheit, Security, Performance oder Design das Beste herauszuholen, sollte auch vom Content das Beste fordern!

Die kleinen Rezepte drehen sich um den richtigen Einstieg in Texte, Verben, Adjektive, Phrasen, Nebensätze, Redundanzen, Synonyme und einiges mehr – zum Ende geht es auch kurz um Mails, Blogs und Twitter. Ich habe mich beim Lesen ein paar mal über die tollen Beispiele gefreut. Sogar gelacht. Die kurzweilige Schreibweise lädt dazu ein, die 180 Seiten in jedem Jahr einmal neu zu lesen.

Selbst für Webworker, die nie Fachartikel schreiben und auch kein eigenes Blog betreiben, lohnt sich die Lektüre. Schließlich schreiben wir alle Mails, Hilfetexte und Fehlermeldungen fürs CMS, Anleitungen und Dokumentationen. Und auch für die gilt der Leitsatz des Buches: Wer schreibt, möchte auch verstanden werden.

Nicolai Schwarz

»Social Media Marketing & Recht«
Thomas Schwenke, O'REILLY (2012)

Ein tolles Grundlagen- und Nachschlagewerk ist für mich das Buch von Rechtsanwalt Thomas Schwenke. Es ist für uns Praktiker geschrieben, die wir für uns oder andere Social-Media-Marketing betreiben. Darin enthalten sind z.B. folgende Themen:

  • Welche rechtlichen Anforderungen gibt es beim Social Media-Marketing?
  • Was ist bei der Einrichtung von Social Media-Präsenzen zu beachten?
  • Alles was man über das Urheberrecht bei der Verwendung von Bildern, Videos und Texten inklusive der Lizenzen von Stockarchive und Creative Commons wissen muss, damit eine Abmahnung vermieden wird.
  • Rechtliche Stolperfallen bei Gewinnspielen und Direktmarketing und vieles mehr.

Das Buch ist durch die anschaulichen und bebilderten Beispielen sehr gut zu lesen und vermittelt das notwendige Wissen im Umgang mit Social Media und Recht.

Marita Betz

Disclaimer: Die folgenden Bücher können wir ebenso empfehlen. In dieser Liste fallen sie lediglich insofern etwas heraus, als dass sie von Webkrauts stammen.

»Der erfolgreiche Webdesigner«
Nils Pooker, Galileo Press (2011)

Eines der wenigen Bücher, das sich eben nicht primär den technischen Aspekten des Jobs, sondern vor allem dem »Drumherum« widmet. In meinen Augen – trotz des Untertitels »Der Praxisleitfaden für Selbstständige« – mindestens aufgrund des ausgiebigen Teils über Kundenkommunikation auch für angestellt arbeitende Webentwickler absolut lesenswert. Und so ganz nebenbei eines der wenigen Fachbücher, die überaus unterhaltsam zu lesen sind.

Matthias Mees

Responsive Webdesign
Christoph Zillgens

Es gibt mittlerweile mehrere Bücher zu Responsive Webdesign. Christophs Buch ist aber sowohl faktenreich, als auch sehr schön gestaltet. Es kommt zudem mit einer kostenlosen PDF-Version zum gedruckten Buch daher. Dadurch ist es vielseitig einsetzbar.

Über Responsive Webdesign sollte sich jeder Webworker Gedanken machen und sich informieren. Aus diesem Buch können sowohl Entwickler, als auch Designer und Projektmanager ihren Nutzen ziehen. Die Inhalte werden nicht oberflächlich, aber knapp behandelt. Denn vor allem die richtige Grundhaltung ist für diesen Ansatz wichtig. Und man muss inhaltlich über Online-Quellen am Ball bleiben. Dieses Buch bietet eine prima Grundlage dafür.

Jens Grochtdreis

Nach all den Empfehlungen hat nun der ein oder andere von euch vermutlich seinen eigenen Vorschlag, was als Pflichtlektüre gelten sollte?

Michael JendryschikFrederic HembergerJens GrochtdreisHenry ZeitlerBernhard WelzelNils PookerNicolai SchwarzMatthias Mees

2. Kasseler Web Montag

Der Web Montag wurde 2005 in Köln aus der Taufe gehoben und bietet seither eine Plattform für alle Webentwickler, Webdesigner und Webarchitekten, die kreativ am Fortschritt des Internets teilhaben wollen und sich mit anderen Enthusiasten auf diesem Gebiet austauschen möchten. Usprünglich inspiriert vom Hot Spot Silicon Valley ist der Web Montag heute eine Institution in über 40 Städten mit aktiven Gruppen in Deutschland, Österreich, Schweden und Kalifornien.

Weitere Infos zum Web Montag im allgemeinen.

Der zweite Web Montag Kassel findet am 20. Januar statt! Ab 19:00 Uhr in der Kombinatsgasstätte »Zur Marbachshöhe«, Amalie-Wündisch-Str. 3, 34131 Kassel. Um Voranmeldung via Web Montag Wiki wird gebeten (das erleichtert uns die Planung).

Übrigens: Wir suchen noch Leute, die den Web Montag Kassel mit guten Ideen und mit Freude an der Sache unterstützen wollen (Präsentationen, Organisation, Programmierung etc.). Und natürlich sind wir auch einem Sponsoring gegenüber nicht abgeneigt (immerhin müssen Örtlichkeiten & Verköstigung usw. finanziert werden).

20.01.20142014Web Montag Kassel
Zur Marbachshöhe
Amalie-Wündisch-Str. 3
34131Kassel
Deutschland

Darauf freuen wir uns in 2014

Image may be NSFW.
Clik here to view.
Bleistift auf einem Kalender
Konferenzen und BarCamps

Als Webworker können wir Monat für Monat aus einer ganzen Reihe an Konferenzen, BarCamps, Webmontagen und Stammtischen auswählen. Irgendetwas ist immer los. Bei all den vielen Terminen gibt es einige, auf die wir uns besonders freuen. Eine kleine Auswahl.

Vom 17.-21. Februar 2014 findet die Social Media Week unter anderem in Hamburg statt. Das Motto »THE FUTURE OF NOW« bietet viel Fläche für spannende Diskussionen, visionäre Keynotes und interessante Workshops. Und natürlich bietet sich eine gute Gelegenheit, Freunde und Kollegen zu treffen und sein persönliches Social Network zu erweitern.

Bernhard Welzel

Im letzten Jahr hatte ich leider keine Zeit. Dieses Mal will ich auf jeden Fall hin: Zum CMS Garden auf die CeBIT vom 10. bis zum 14. März 2014. Weil sich dort viele große Open-Source-CMS nebeneinander tummeln und es eine großartige Gelegenheit ist, nicht nur Werbung für sein bevorzugtes CMS zu machen, sondern sich auch einmal anzusehen, was all die anderen mittlerweile zu bieten haben.

Nicolai Schwarz

Nach mehrjähriger Pause wird am 20. und 21. März 2014 wieder der Webkongress Erlangen stattfinden. Uns erwarten zwei spannende Tage mit 24 Sessions und ad hoc Vorträgen im Barcamp-Stil rund um Barrierefreiheit, Content Management Systeme und Webdesign. Eine gute Gelegenheit, alte Kontakte aufzufrischen, interessante neue Menschen kennenzulernen und sich auszutauschen.

Kerstin Probiesch

Vom 19.-21. Mai 2014 findet zum vierten Mal die »beyond tellerrand« in Düsseldorf statt, oder wie viele schon sagen »Das Klassentreffen«. Es tut mir leid, liebe Kunden, in diesen Tagen kann Ihre Website leider nicht bearbeitet werden. Denn hier treffen sich alte und neue Bekannte aus dem Web-Volk gleichermaßen, um sich für die tägliche Arbeit inspirieren zu lassen, den Blick vom Projektalltag »über den Tellerrand« zu heben und neues Gedankenfutter zu bekommen.

Dies gelingt nicht nur dank der hervorragenden abwechslungsreichen Talks und der entspannten Atmosphäre im Capitol Theater, in der man sich mit Sprechern und anderen Besuchern austauscht, sondern nicht zuletzt durch das tolle Line-Up, das Organisator Marc Thiele jedes Jahr wieder aus dem Hut zaubert: Dieses mal unter anderem Chris Coyier, Jessica Hische, Jonathan Snook und Erik Spiekermann. Ich bin schon sehr gespannt, wir sehen uns auf jeden Fall!

Frederic Hemberger

Vermutlich im August wird die Konferenz zu Open Source FrOSCon in Bonn stattfinden. Die Themen sind tendenziell eher etwas für Entwickler und Administratoren, steht doch Entwicklung, Betriebssysteme und Sicherheit im Vordergrund. Besonders bemerkenswert ist die offene, freundliche und persönliche Atmosphäre - die »Community« zum Erleben, Anfassen, Eintauchen und Mitmachen!

Bernhard Welzel

Die Konferenz Mensch & Computer ist die jährlich stattfindende Tagung des Fachbereichs Mensch-Computer-Interaktion der Gesellschaft für Informatik e.V. und der German UPA und die führende Veranstaltung zum Thema Mensch-Computer-Interaktion im deutschsprachigen Raum. Nächstes Jahr wird die Tagung mit dem Schwerpunkt »neue Interaktionsformen zwischen Mensch und Systemen« vom 31. August bis zum 3. September an der Ludwig-Maximilians-Universität in München ausgerichtet – für Usability Engineers ein Pflichttermin. Für Besucher, die primär an der praktischen Anwendung interessiert sind, wird die Teiltagung Usability Professionals die interessantesten Sessions bieten. So war das auch im letzten Jahr (Rückblick bei der German UPA, Tagungsband).

Michael Jendryschik

Und auf welche Konferenzen freut ihr euch?

Michael JendryschikKerstin ProbieschFrederic HembergerBernhard WelzelNicolai Schwarz

Contao-Konferenz 2014

Vom 15. – 16. Mai 2014 findet die Contao-Konferenz im Club Office Berlin in Berlin statt.

Die Contao-Konferenz ist die offizielle Konferenz zum gleichnamigen Open Source Content Management System. Was 2008 als familiäres Usertreffen ins Leben gerufen wurde, hat sich mittlerweile zu einer unverzichtbaren Veranstaltung für Interessierte und Profis, welche mit Contao arbeiten, entwickelt. Anders als in den Vorjahren ist der Termin bewusst nicht während eines Feier- oder Brückentages angesetzt.

Organisiert wird die Konferenz seit dem letztem Jahr von der Contao-Association, dem offiziellem Förderverein von Contao. Weitere Informationen zur Themeneinreichung für Sprecher, zum Programmablauf und dem Ticketverkauf folgen in den nächsten Wochen.

15.05.2014 bis 16.05.20142014News auf contao.orgVeranstaltungsort
Gustav-Meyer-Allee 25
13355Berlin
Deutschland

DevCamp Karlsruhe

Vom 21. bis 23. März 2014 findet in Karlsruhe zum zweiten Mal das DevCamp statt. Diese kleinere Schwesterveranstaltung des etablierten BarCamp Karlsruhe fokussierte sich auf eine ganz spezielle Zielgruppe: Entwickler!

21.03.2014 bis 23.03.20142014Website
Gameforge AG
Albert-Nestler-Str.8
76131Karlsruhe
Deutschland

WW Ruhr Webworker Treff Ruhr

Themen: schwatzgelb.de hinter den Kulissen und Workshop: Hosting
Markus Wigbels und Christian Fritzkowski geben (auch für "Nicht Fussball Fans") einen Einblick in die Organisation und Technik hinter der Webseite und zeigen, wie man trotz des CMS MODx emotionale Spielerwechsel oder Verlinkungen von Spiegel Online überlebt.
und
Workshop / offene Runde: richtige Auswahl von Hostingangeboten. Jeder von uns braucht/nutzt Hostingangebote. Aber was tun zur Auswahl?
23.01.20142014Event auf Google+Twiter
Unperfekthaus
Friedrich-Ebert-Straße 18
45127Essen
Deutschland

CMS Garden Group Ruhrgebiet

ehemalige Drupal Usergroup Ruhrgebiet
Die Gruppe ist die Fortsetzung der bisherigen Drupal User Group Ruhrgebiet/Dortmund. Statt uns allein mit Drupal zu beschäftigen, erweitern wir unser Spektrum. Es geht nun offener um Themen für alle Webworker mit Schwerpunkt auf den CMS aus dem CMS Garden (unter anderen: Contao, Drupal, Joomla, Redaxo, Typo3, WordPress). […] Am 30. Januar beschäftigen wir uns erst einmal mit Symfony.
30.01.20142014drupalcenter.deCMS GardenStändige Vertretung Dortmund
Ständige Vertretung
Hoher Wall 15
44137Dortmund
Deutschland

3. Kasseler Web Montag

Der Web Montag wurde 2005 in Köln aus der Taufe gehoben und bietet seither eine Plattform für alle Webentwickler, Webdesigner und Webarchitekten, die kreativ am Fortschritt des Internets teilhaben wollen und sich mit anderen Enthusiasten auf diesem Gebiet austauschen möchten. Usprünglich inspiriert vom Hot Spot Silicon Valley ist der Web Montag heute eine Institution in über 40 Städten mit aktiven Gruppen in Deutschland, Österreich, Schweden und Kalifornien.

Weitere Infos zum Web Montag im allgemeinen.

Der dritte Web Montag Kassel findet am 17. März statt! Ab 19:00 Uhr in der Kombinatsgasstätte »Zur Marbachshöhe«, Amalie-Wündisch-Str. 3, 34131 Kassel. Um Voranmeldung via Web Montag Wiki wird gebeten (das erleichtert uns die Planung).

Übrigens: Wir suchen noch Leute, die den Web Montag Kassel mit guten Ideen und mit Freude an der Sache unterstützen wollen (Präsentationen, Organisation, Programmierung etc.). Und natürlich sind wir auch einem Sponsoring gegenüber nicht abgeneigt (immerhin müssen Örtlichkeiten & Verköstigung usw. finanziert werden).

17.03.20142014Web Montag Kassel
Zur Marbachshöhe
Amalie-Wündisch-Str. 3
34131Kassel
Deutschland

Flexbox light – das neue Layoutprinzip schon heute anwenden

Image may be NSFW.
Clik here to view.
Schriftzug flexible auf einem Tor. Sieht nicht sehr flexibel aus.
Modernes Layout mit CSS

Flexbox ist eine interessante neue CSS-Technik, mit der Webworker einfacher Inhalte in einem Layout anordnen können. Dabei können sie auch Elemente unabhängig von der Codereihenfolge sortieren. Leider ist die Verbreitung dieser Technik nicht besonders groß. Einfaches Umsortieren kann aber mit einem einfachen Trick schon heute realisiert werden.

Im Juni letzten Jahres veröffentlichte Ian Devlin einen Vorschlag, wie man mittels der Display-Eigenschaft die Darstellungsreihenfolge einer Webseite entscheidend beeinflussen kann. Diese Technik ist sozusagen »Flexbox light«, weil sie in die Richtung der mächtigen Technik Flexbox weist. Diese wird glücklicherweise immer besser implementiert. Aber leider gibt es keinen Fallback-Zustand und auch kein Polyfill, weshalb wir Flexbox sicherlich erst in vier oder fünf Jahren flächendeckend werden einsetzen können.

Bis dahin können allerdings im kleinen Maßstab Webseiten mit einfachen Mitteln für kleine Bildschirme umarrangiert werden. Meine Beispielseite bei Codepen zeigt das Grundprinzip an einem Zweispalter. Das Beispiel wurde mit YAML aufgebaut. Die meisten CSS-Regeln stecken deshalb in externen Dateien. Auch die Inhalte stecken in separaten Pens, die man bei dieser Testumgebung inkludieren kann.

Image may be NSFW.
Clik here to view.
Ein Beispiellayout in breiter Darstellung, die rechte Spalte floatet
Das Beispiellayout in voller Breite, zweispaltig

Die Contentspalte kommt am Ende des Codes, weil sie flexibel in der Breite ist. Die Seitenspalte mit den nebensächlichen Inhalten (die im Zweifel allerdings die Kohle bringt) kommt als erstes im Code und floatet nach rechts. Es soll nun dafür gesorgt werden, dass der Inhalt auf einem schmalen Bildschirm vor der Werbung und den weiterführenden Links kommt. Im Beispiel kommt Ians Idee bei einem Breakpoint von 720px Maximalbreite zum Zuge:

  1. @media only screen and (max-width: 720px){
  2. /* vorher floatende Seitenspalte */
  3.         .ym-col1{
  4.         float: none;
  5.         width: 100%;
  6.         display: table-footer-group;
  7.         }
  8. /* statische Inhaltsspalte */
  9.         .ym-col3{
  10.         margin-right: 0;
  11.         width: 100%;
  12.         }
  13. }
Image may be NSFW.
Clik here to view.
Ein Beispiellayout in schmaler Darstellung, die vorher rechte Seitenspalte hängt nun nach dem Ende des Inhalts
Das linearisierte Beispiellayout mit der zweiten Spalte am Ende der Seite

Die floatende Seitenspalte wird »entfloatet« und bekommt eine neue Display-Eigenschaft: display: table-footer-group;.
Die umgebenden Container werden vom Browser automatisch zu einer neuen Tabelle umdefiniert. Und da in dieser die table-footer-group am Ende der Darstellung ist, wird der Inhalt nun am Ende der neu implizit gedachten Tabelle platziert. Es ist wichtig, dass das nicht automatisch das Ende der Seite ist. Die Unterstützung von display: table reicht bis runter zum IE8. Es ist doch einen Versuch beim nächsten Projekt wert, in dem die Sourceorder für die Darstellung auf kleinen Bildschirmen unpassend ist.

Jens Grochtdreis

Grüße vom Webkongress Erlangen 2014

Image may be NSFW.
Clik here to view.
Mappen mit dem Logo vom Webkongress Erlangen
Webkrauts unterwegs

In der letzte Woche fand der vierte Webkongress Erlangen statt. Die Vorträge drehten sich um Barrierefreiheit, Content-Management-Systeme (CMS) und Webdesign. Auch einige Webkrauts waren als Referenten und Gäste auf dem Kongress, hier unsere Eindrücke.

Inhaltlich hat das WKE-Team hier eine 1A-Veranstaltung auf die Beine gestellt. Glücklicherweise ist es eines der wenigen Events, die immer noch Barrierefreiheit in den Fokus rücken. Bei all den Buzzwords der letzten Jahren habe ich das Gefühl, dass das Thema bei einigen Projekten immer häufiger im Hintergrundrauschen untergeht. Was sich auch in Erzählungen zeigt wie: »Die Firma hat zugesichert, die Website barrierefrei zu liefern. Ich habe mal nachgefragt: Was heißt denn das? Dass die Website valide ist.« Dass die betreffende Agentur hier inkompetent ist, kann ein Kunde natürlich nicht unbedingt folgern.

Für mich standen die Einblicke in andere Content-Management-Systeme im Vordergrund. Gerade als Drupal-Mensch ist es interessant zu sehen, was andere Systeme zu bieten haben bzw. auch deutlich besser machen als Drupal. So hat Typo3 Neos etwa ein tolles Baukasten-System, mit ProcessWire hat ein Webentwickler mehr Kontrolle über das generierte HTML und Kirby schafft erstaunlich viel mit sehr wenig Core-Code (429kb). Das bedeutet für mich, im laufenden Jahr mal das ein oder andere überschaubare Projekt mit einem dieser CMS aufzubauen, um es genauer kennenzulernen.

Und wenn es mal nicht um CMS, responsive Design oder Barriefreiheit ging, fachsimpelte man in den Pausen oder den Abendveranstaltungen über den Captain-Future-Themesong als Klingelton, digitale Comics, Abnehmen mit Paleo, Joggen vs. Krafttraining oder den Vorzügen von Arbeiten im Stehen. Was will man mehr?

Nicolai Schwarz

Der Webkongress Erlangen zählt für mich schon jetzt zu den Highlights des Jahres. Eine tolle Orga, gute Speaker, spannende Diskussionen und gemütliche Small Talks mit alten und neuen Bekannten machten den Webkongress zu einem erfreulichen Ereignis.

Die Kombination der drei Themen Content Management Systeme, Barrierefreiheit und Webdesign sorgte für neuen Input und war gleichzeitig eine gute Gelegenheit in verwandte Bereiche und über den eigenen Tellerrand zu schauen. Ich habe aus jedem Vortrag etwas mitnehmen können und viele Anregungen bekommen. Vor allem habe ich mich natürlich im gut besuchten Barrierefreiheitstrack getummelt.

Die Abendveranstaltung mit exzellentem Catering, aufmerksamer Bedienung sowie die stets freundlichen und hilfsbereiten Helfer machten den Webkongress Erlangen 2014 zu einer runden Sache.

Wer nicht dabei war, hat was verpasst. Vielen Dank!

Kerstin Probiesch

Ich habe mich ebenfalls auf den Einblick in andere Content Management Systeme konzentriert – fast ein bisschen schade, dass der WKE keine Single-Track-Veranstaltung ist, bei der jeder alle Vorträge hört, aber das bringen eben auch die Größe und die Themenvielfalt mit sich. Dafür werden alle Vorträge später als Video- und Audio-Fassung bereit gestellt, so dass man Verpasstes nachholen kann. Zudem kann man sich in den Pausen eben auch über den Tellerrand und das Technische hinaus austauschen – man würde sich fast wünschen, die Pausen zwischen den Vorträgen wären etwas länger.

Alles in allem ist der Webkongress Erlangen eine thematisch wie personell bunte Veranstaltung, die für jeden etwas bietet. Sie ist darüber hinaus wunderbar mit der Erfahrung mehrerer Jahre von einem eingespielten Team organisiert. Zudem ist Erlangen eine ganz reizende Stadt.

Matthias Mees

Die thematische Mischung des Webkongresses Erlangen war gelungen. So kamen neben dem Dauerbrenner Barrierefreiheit auch unterschiedliche CMSe zur Geltung. Und vor allem wurde das Konzept Responsive Webdesign für den öffentlichen Dienst aufbereitet. Denn die meisten Teilnehmer schienen dem öffentlichen Dienst anzugehören. Wolfgang Wiese und sein Team machten also eine Art »Entwicklungshilfe«.

Leider war die Qualität und inhaltliche Aussagekraft der CMS-Beiträge sehr unterschiedlich. Für ein nächstes Mal wäre ein kleiner Fragebogen nützlich, den jeder Referent abzuarbeiten hat. Doch auch bei manchen Teilnehmern scheint das Wissen darüber, was ein CMS kann oder nicht, nicht besonderes tief zu gehen. Die »Entwicklungshilfe« trägt hoffentlich dazu bei, dass demnächst niemand mehr fragt, mit welchem CMS man denn Responsive Webdesign umsetzen könne.

Ich finde es prima, dass alle Vorträge aufgezeichnet wurden. So kann ich einige, die ich verpasst habe, nachträglich schauen. Für das nächste Mal wünsche ich mir kleinere Räume, in denen sich die Zuhörer nicht verlieren und längere Pausen. Denn Gesprächsstoff gab es genug und Gesprächspartner fand ich auch genügend.

Ganz egoistisch betrachtet war es schön, einige Webkrauts mal wieder (bzw. einmal sogar zum ersten Mal) persönlich zu sehen und lange miteinander abhängen zu können. In diesem Sinne war es wie ein kleines Familientreffen. Und da wir das Essen in der Mensa ohne Probleme überlebt haben, freue ich mich auf ein Wiedersehen in zwei Jahren. Es lohnt sich!

Jens Grochtdreis

Der Webkongress Erlangen gehört traditionell zu den großen Familienfeiern der Webkrauts, bei denen neben dem fachlichen Austausch vor allem der kulinarische Input zu den Höhepunkten zählt. Die Atmosphäre auf dem Campus war wie gewohnt locker und ungezwungen, auch wenn »Dr. WKE« Wolfgang Wiese als offizieller Chef des Front- und Backends der Organisation am Eröffnungstage mit vorbildlich gebundener Fliege zu beeindrucken wusste (leider ohne transition).

Der WKE legte die Schwerpunkte auf die drei Themenblöcke Webdesign, CMS und Barrierefreiheit. Zwei parallel laufende Tracks ermöglichten es den Teilnehmern, den jeweils passenden Vortrag auszuwählen, die Veranstalter haben dabei die Aufteilung sehr gut strukturiert. Insgesamt war der Kongress ohnehin vorbildlich organisiert.

Die Vorstellung verschiedener Redaktionssysteme war für mich ein wichtiges Highlight. Als freier Webdesigner mit überwiegend kleinen Kunden sind für mich die pragmatischen und schlanken Lösungen von Process Wire und Kirby interessant, beide werde ich mir genauer ansehen. Für größere Projekte erschien mir auch die neue Drupal-Version 8 vielversprechend: ein intuitiv zu erfassendes Backend, sehr gute Logik und überaus flexibel, ich bin gespannt, was da noch kommt.

Während ich selbst auch einen Vortrag zum Selbstverständnis des Themas Responsive Webdesign gehalten habe, war es prima, Sven Wolfermann und Marc Hinse endlich real und offline kennengelernt zu haben, ihre Vorträge waren klasse. Sven klärte fundiert über Progressive Enhancement auf, ein toller Vortrag mit der vermutlich besten Startfolie aller Zeiten. Marc, der seine Slides superpünktlich und mindestens schon zehn Minuten vorher fertig hatte, zeigte vor allem eindringlich und kurzweilig, was so alles schief gehen kann, wenn man als Webdesigner Nachdenken mit Instant-Lösungen verwechselt.

Untergebracht waren die Referenten im bewährten NH-Hotel in Erlangen mit schönen Zimmern und gutem Frühstück, abgesehen von der ebenfalls bewährten und eigenwilligen Schwarzgetränkekreation mit imitiertem Kaffeearoma, bezüglich Geschmack und Anregungsperformance ganz klar der IE6 unter den Heißgetränken.

Ausreichend Bewegung, gesunde Ernährung und diszipliniertes Maßhalten haben auf so einer Veranstaltung selbstverständlich nichts zu suchen. Auch abseits des Campus lernte man viel, beispielsweise über die vermutlich kulturhistorisch geprägte Auffassung zur übersichtlichen Fleischmenge einer Mixed-Grill-Platte und den überraschenden Erfolgen fränkischer Züchter angesichts eines servierten Wiener Schnitzels in der Größe einer Turnhallenmatratze.

Insgesamt finde ich es sehr angenehm, dass der WKE als kleine, feine Veranstaltung für Teilnehmer erhalten bleibt, die nicht über das konzentrierte Wissen eines reinen Fachpublikums verfügen müssen, um den Vorträgen zu folgen. Die Notwendigkeit der Sensibilisierung der Verantwortlichen und Entscheider aus Institutionen, Behörden und Unternehmen bedingt, dass es solche Konferenzen geben muss, bei den die Besucher nicht alle Techniken, Aspekte und Details moderner Webentwicklung als Voraussetzung der Teilnahme kennen.

Nils Pooker

Auch der zweite Webkongress Erlangen hat mir wieder neue Erkenntnisse und Informationen beschert. Responsive Webdesign (RWD), das Buzzword der letzten Jahre, wurde nach allen Regeln der Kunst »auseinandergenommen«. Sicher weiß ich, dass RWD nur ein Baustein im Gesamtkonzept ist. Aber es ist sehr nützlich, wenn gewisse Absurditäten so auf den Punkt gebracht werden wie bei Nils Pooker, Sven Wolfermann und Marc Hinse. Meinen Kopf hat es mal wieder in eine andere Richtung gedreht. Vielen Dank dafür.

Mit Ansätzen wie Mobile First und Progressive Enhancement dachte ich bislang, mehr Zugänglichkeit in Webprojekte bringen zu können. Dass der falsche Gebrauch von WAI-Aria-Rollen Screenreader sogar ausperren kann, dafür hat mir vor allem Jan-Eric Hellbusch die Sinne geschärft. Über die enge Verzahnung von Responsive Webdesign und Barrierefreiheit hatte ich so bisher nicht nachgedacht. Nachschlag gab es dann noch bei der Mittagspause mit den German UPAs.

Und letztlich gab es mit dem Blick durch die Behördenbrille noch einen Nachschlag in Sachen Datensicherheit. Ich fand den WKE auch diesmal rundum gelungen und freue mich schon auf 2016.

Renate Hermanns

Es ist lange her, dass ich zuletzt auf einem Web Kongress Erlangen war. Um genau zu sein, ich war bislang nur auf dem ersten Kongress in 2006; es gab seinerzeit das Schwerpunktthema "Barrierefreiheit". Auf dem WKE 2014 teilte "Barrierefreiheit" die Aufmerksamkeit mit zwei weiteren Schwerpunktthemen: "Webdesign" und "Content-Management-Systeme". Ich hatte allerdings nicht das Gefühl, dass die Barrierefreiheit weniger wichtig war als vor acht Jahren, denn sie tauchte in vielen Vorträgen auf - eine sehr positive Entwicklung.

Persönlich war es für mich schön, einige Leute wieder zu treffen, mit denen ich in den letzten Jahren nur noch per E-Mail oder Telefon in Kontakt war. Das gilt für Kollegen und Kunden. Schön war auch zu sehen, wie professionell die Veranstaltung organisiert war und wie engagiert und sympathisch das Orga-Team war.

Die Qualität der Vorträge war durchaus im grünen Bereich. Ein besonderes Lob möchte ich an Darius-Nikolaus Krupinski richten, der es wie kaum ein anderer schaffte, seine Inhalte zu vermitteln. Es gab auch andere gute Speaker, aber ich denke, wir müssen alle noch daran feilen. Das gilt letzten Endes auch für mich, denn das Team um Wolfgang Wiese hat die Videos der Vorträge schon online gestellt.

Der Webkongress Erlangen ist zu einem wichtigen Fixpunkt in der Webentwicklerszene geworden.

Jan Eric Hellbusch

Nach 2008 hatte ich bereits zum zweiten Mal die Gelegenheit beim Webkongress Erlangen einen Vortrag halten zu dürfen. Ich habe über meine Erfahrungen und Erkenntnisse bei der Entwicklung komplexer Benutzeroberflächen gesprochen – die ich bei der Arbeit an »Thinkin‘ Tags«. Die Schwerpunkte des diesjährigen Webkongresses lagen jedoch auf der Vorstellung verschiedenster Content-Management-System, Barrierefreiheit und Responsive Design, sodass mein Thema ein klein wenig exotisch, jedoch hoffentlich nicht uninteressant war.

Die auf zwei Tage ausgelegte Konferenz war übrigens perfekt durchorganisiert und so gab es nicht nur Wissen im Überfluss zu konsumieren, sondern auch für das leibliche Wohl (insbesondere Kaffee) war stets gesorgt.

Für mich war es eine der seltenen Gelegenheiten, den einen oder anderen Referenten (man kennt sich aus dem Netz) endlich persönlich kennenzulernen und nicht zuletzt bei der Abendveranstaltung war begleitet von einem hervorragenden Buffet und gutem Wein, Zeit für ausführliche Gespräche.

Ein besonderes Lob verdienen sich die Organisatoren damit, dass alle Vorträge aufgezeichnet (Video) wurden und zum überwiegenden Teil bereits nach vier Tagen (!) online zur Verfügung stehen.

Dirk Jesse

Vorträge von Webkrauts

  • Jan Eric Hellbusch: »HTML5 und WAI-ARIA oder: die Suppe nicht versalzen«
    Video | Blog | Folien
  • Dirk Jesse: »Lessons learned from the Design of an User Interface«
    Folien
  • Matthias Mees: »ProcessWire – ein CMS voller Freiheiten«
    Video | Folien
  • Nils Pooker: »Alle(s) so schön responsive hier?«
    Video | Folien
  • Kerstin Probiesch: »Barrierefreie PDF – Diesseits und jenseits von Tags und Co.«
    Video | Folien
  • Nicolai Schwarz: »Vorschau auf Drupal 8«
    Folien
  • Vladimir Simović: »WordPress 2014«
    Folien

Weitere Links

Nicolai SchwarzKerstin ProbieschMatthias MeesJens GrochtdreisNils PookerRenate HermannsJan Eric HellbuschDirk Jesse

DrupalCamp Frankfurt 2014

Das erste DrupalCamp in Frankfurt.

12.04.2014 bis 13.04.20142014Website
Goethe-Universität Frankfurt
Grüneburgplatz 1
60323Frankfurt am Main
Deutschland

WordCamp Hamburg 2014

Was ist ein WordCamp?
Ein WordCamp ist eine lockere Konferenz im Stile eines BarCamps zu allen erdenklichen Themen rund um WordPress. WordCamps finden rund um den Globus statt, sind lokal organisiert und werden von der WordPress Foundation unterstützt.

An wen richtet sich das WordCamp Hamburg?
Unsere Zielgruppe sind WordPress-Begeisterte aus den Bereichen Entwicklung, Design, Marketing, Journalismus, Blogging und vielen weiteren Disziplinen, die im privaten oder beruflichen Kontext WordPress nutzen.

Es geht darum WordPress besser kennen zu lernen, sich auszutauschen, Leute zu treffen, Spaß zu haben, zu netzwerken und vieles mehr.

Wo und wann findet das WordCamp Hamburg statt?
Das WordCamp Hamburg wird vom 14. bis 15. Juni 2014 im Geomatikum der Uni Hamburg (Bundesstraße 55, 20146 Hamburg) stattfinden.

Muß ich mich anmelden?
Für den Besuch des WordCamps ist ein Ticket notwendig. Der Ticketverkauf für das WordCamp startet in Kürze.

In welcher Sprache findet das WordCamp Hamburg statt?
Der Großteil der Sessions wird auf Deutsch gehalten. Wir haben uns für Deutsch als Hauptsprache für das Camp entschieden, da das WordCamp Hamburg ein lokales Event mit Fokus auf die deutschsprachige Community ist. Bei internationalen Speakern kann eine Session auch ausnahmsweise in Englisch angeboten werden.

http://2014.hamburg.wordcamp.org

14.06.2014 bis 15.06.20142014http://2014.hamburg.wordcamp.org
Geomatikum der Uni Hamburg
Bundesstrasse 55
20146Hamburg
Deutschland

Webworker-Umfrage 2014: Wir wollen es wieder wissen

Die Webkrauts starten die Webworker-Umfrage 2014. Wir wollen einen Eindruck gewinnen, wer aktuell im und für das Internet arbeitet. Es geht dabei unter anderem um thematische Spezialisierungen, um verwendete Technologien und Software. Natürlich interessiert uns auch die berufliche Situation und Zufriedenheit. Die Befragung ist selbstverständlich anonym.

Die Umfrage soll von heute bis zum 30. April laufen. Danach werden wir die Daten auswerten. Die Auswertung werden wir ebenso veröffentlichen, wie die Rohdaten der 28 Fragen. Jeder Interessierte kann dann seine eigenen Auswertungen machen.

Vor sechs Jahren machten wir unsere erste Umfrage. Wir sind gespannt, welche Veränderungen wir ausmachen können.

Manuela Hoffmann hat dankenswerterweise ein paar Banner für die Umfrage erstellt, die ihr gerne nutzen könnt:

Banner 125x125

Image may be NSFW.
Clik here to view.
Banner Webkrauts-Umfrage 2014, Format 125x125

Banner 200x125

Image may be NSFW.
Clik here to view.
Banner Webkrauts-Umfrage 2014, Format 200x125

Banner 300x250

Image may be NSFW.
Clik here to view.
Banner Webkrauts-Umfrage 2014, Format 300x250

Banner 410x125

Image may be NSFW.
Clik here to view.
Banner Webkrauts-Umfrage 2014, Format 410x125

Banner 468x60

Image may be NSFW.
Clik here to view.
Banner Webkrauts-Umfrage 2014, Format 468x60

WK-Umfrage.svg

Image may be NSFW.
Clik here to view.
Banner Webkrauts-Umfrage 2014, SVG

Figur.svg

Image may be NSFW.
Clik here to view.
Figur Webkrauts-Umfrage 2014, SVG
Image may be NSFW.
Clik here to view.
Webkrauts-Umfrage 2014

Notiz: WAI-ARIA 1.0 als Recommendation verabschiedet

Notiz: Eine unglaublich fakten- und umfangreiche Präsentation über SVG.

Content Strategy Forum 2014

Content Connects - Shaping the Future of Digital Corporate Communications and Marketing

Mehr als 50 Speaker aus 15 Ländern, 3 intensive Tage mit Vorträgen, Workshops und Diskussionen, ein neuer Blick auf Content, Design und Webentwicklung.

Content ist derzeit sicher eines der am meist diskutierten Schlagworte in Marketing und Unternehmenskommunikation. Aber was steckt genau dahinter und was macht die digitale Kommunikation von Unternehmen und Organisationen erfolgreich? Genau das diskutieren mehr als 200 Experten aus aller Welt auf dem Content Strategy Forum 2014 vom 1. – 3. Juli in Frankfurt.

Die von einer internationalen Community ins Leben gerufene Konferenz fand erstmals im Jahr 2010 in Paris statt. Nach Stationen in London, Kapstadt und Helsinki kommt sie nun in den deutschsprachigen Raum. Organisiert wird sie in diesem Jahr von der Frankfurter Agentur Script Communications.

Was die Konferenz besonders macht, ist das vielfältige internationale Programm. Insgesamt vermitteln mehr als 50 Expertinnen und Experten (http://www.csforum2014.com/speakers/) aus 15 Ländern ihre Erfahrungen in Vorträgen, Werkstattberichten, Diskussionsrunden und Vorträgen. Auf dem Programm (http://www.csforum2014.com/schedule/)) stehen unter anderem Projekte von BMW, Bosch, E-Plus, eBay, der Europäischen Kommission, Facebook, MLP, Nestlé, der britischen Regierung, der schwedischen Auslandskommunikation, uvm.

Die Konferenz beginnt am 1. Juli 2014 mit Workshops im Frankfurter Presseclub. Referenten sind u.a. Nico Brünjes, Leiter Frontendentwicklung bei Zeit Online, Klaus Eck und Doris Eichmeier von der Eck Consulting Group, Uwe Knaus, Daimler und Thomas Pleil, Hochschule Darmstadt und Rahel Baillie, die eine Content Strategy Master Class zu COPE (Create Once Publish Everywhere) gibt.

Am 2. und 3. Juli gibt es in der Union Halle in Frankfurt dann mehr als 30 Vorträge, Werkstattberichte und Diskussionen.

01.07.2014 bis 03.07.20142014Content Strategy Forum 2014CS Forum 2014 - TwitterCS Forum 2014 - Lanyrd
Union Halle Frankfurt
Hanauer Landstraße 188
60314Frankfurt
Deutschland

Webmontag Marburg XI

Der Webmontag ist ein informelles, nicht-kommerzielles, dezentral organisiertes Treffen, das zum Ziel hat, all diejenigen miteinander zu verbinden, die die Zukunft des Internet gestalten. Alle, die mit Web 2.0 und benachbarten Themen zu tun haben und interessiert daran sind, ihr Wissen zu teilen und sich miteinander auszutauschen, sind herzlich willkommen. Der Webmontag Marburg dient der Vernetzung von Webworkern und Interessierten in Mittelhessen und findet mittlerweile zum 11. Mal statt. Interessierte und Sessions können gerne formlos im Wiki eingetragen werden.

23.06.20142014Webmontag Marburg
Tripuls
Neue Kasseler Straße 62a
35039Marburg
Deutschland
Viewing all 231 articles
Browse latest View live