Katharina Brunner

Lesenswertes: Code und Drohnen beim Bund

How Fusion does agile

Once your communication is like oxygen, agile goes best with a heavy dose of open source software.

Daniel Bachhuber, einer der prominentesten WordPress-Entwickler und ehemaliger Automattic-Angesteller, ist seit Kurzem bei Fusion. Dort leitet er die Entwicklungsabteilung. Fusion ist einer der neuen Player auf dem Medienmarkt, der sich mir vor allem bemerkbar gemacht hast, weil er prominente Köpfe abgeworben hat. Unter anderem Alexis Madigal vom Atlantic, Felix Salmon von Reuters und eben Daniel Bachhuber von Automattic.

Coding History

Genauer gesagt ist Coding History hörenswert. Die Selbstbeschreibung:

Ein Podcast zur Frage, wie die digitale Welt geworden ist, wie sie ist: Warum sieht Software so aus, wie sie aussieht? Wie hat sich das Programmieren von Software verändert und was für Auswirkungen hat das eigentlich darauf, wie wir Software benutzen?

„Ich bin kein Computerspieler“

Wie sieht die Arbeit von Drohnenpiloten bei der Bundeswehr aus? Wirklich interessantes Interview bei Zeit Online.

Storyteller: Multimediales Storytelling möglichst einfach

Gestern habe ich Storyteller veröffentlicht, ein Tool für multimediales Storytelling. Das Ziel: möglichst einfach zu verwenden. Die Zielgruppe: Journalisten, die nicht coden können. Ein Interview mit mir selbst.

Sind solche Geschichten die Rettung des Journalismus?

Nein, natürlich nicht. Verlangt das jemand? Ob die Geschichten gemacht werden, die mit Storyteller (oder Pageflow oder copytext.py von NPR), etwas taugen, liegt ja nicht nur am Werkzeug. Je einfacher allerdings das zu bedienen ist, desto mehr kann man sich auf die Geschichte konzentrieren.

Findest du diese Art des Erzählens immer super?

Nein. Sehr oft finde ich sie sogar ziemlich schlecht. Aber manchmal sind wirkliche Perlen darunter. Meiner Meinung nach die beste Veröffentlichung in dieser Stilform ist Borderland von NPR: Tolle Fotos, sehr kurze Texte, spannend. Es ist nicht zu übersehen, dass ich mich bei Storyteller daran orientiert habe.

demo

Es gibt doch Pageflow. Warum braucht es da noch ein Tool?

Ich finde Pageflow aus mehreren Gründen nicht ideal. Der wichtigste: zu hohe Einstiegshürden. Ich selbst bin zum Beispiel schon an den Voraussetzungen für die Installation auf dem eigenen Server gescheitert. Storyteller basiert auf WordPress, dem sehr viele Menschen, die ins Internet schreiben, schon begegnet sind. Das Ziel ist es, dass Journalisten, die nicht coden können, damit klar kommen. Den letzten Anstoß gab ein Tweet von Mario Haim:

Und wie willst du das schaffen?

Storyteller reduziert den Admin-Bereich auf das Wesentliche – unnötiges, wie beispielsweise „Seiten“ oder Kommentare sind entfernt. Dazu gibt es auf der Startseite des Adminbereichs und in auf jeder „Slide erstellen“-Seite einen Hilfebereich. Die einzelnen Slides selbst sind schnell gemacht: Ein Beitragsbild hochladen, Text rein, fertig.

Aber die Geschichten sehen dann ja alle gleich aus!

Das ist möglich, aber nicht sehr wahrscheinlich. Schließlich sind die dominanten visuellen Elemente Fotos oder Videos, die Schrift tritt eher in den Hintergrund. Und immerhin können Nutzer im Adminbereich aus vier verschiedenen Schriftarten auswählen. Wer noch mehr Individualisierung will, kommt um CSS nicht herum. Dafür gibt es zu jeder Folie ein Feld, in dem diese Elemente Platz haben.

Und ist das jetzt wirklich alles so einfach?

Ich hoffe doch! Allerdings bin ich auch befangen. Um das besser zu beurteilen und um Schwachstellen auszumerzen, muss das Ding getestet, genutzt und verbessert werden – am besten von euch! Ich würde mich freuen. Wer Storyteller mal ausprobieren will, bekommt von mir auch gerne einen Account für meine Version.

Wo bekomme ich Storyteller?

Auf seiner eigenen Webseite oder GitHub.

Mehr zum Thema

Multimedia-Reportagen: Was geht – und was nicht: Christian Jakubetz gibt Ratschläge
Der Irrweg „Multimedia-Reportage“: Jan Tißler findet solche Geschichten nicht so dufte.

Hooray! Ich hab mein erstes WordPress-Plugin gemacht

Und Dominik lieferte mir mit seinem Blogartikel „Liebe Blogger – macht es euren Lesern leichter!“ die Funktionalität: Ein Feld mit der URL des Posts, die man zum Teilen verwenden kann. Das Wirtschaftsmagazin Quartz verwendet das auch so.

Das gute daran: Die Funktion selbst ist schnell gemacht, keine zehn Zeilen Code. Deshalb konnte ich mich ganz dem widmen, vor dem ich etwas Respekt hatte: der Backend-Seite mit den Eigenschaften. Mit genauem Lesen der Dokumentation, der Beispiele und eines Tutorials war das überraschenderweise aber ziemlich einfach, der Settings API sei Dank.

Was das URL Sharing Plugin genau macht, kann man hier nachlesen oder etwa 20 Pixel tiefer bewundern.

URL Sharing Plugin for WordPress

The URL Sharing Plugin adds a text field with the post URL at the end of your posts – a qz.com like sharing approach. Additionally you get a button that enables copying the URL to the user’s clipboard. Look at the end of this post to see a live version of the plugin.

The plugin can be used as a more privacy-friendly alternative to sharing buttons or as an additional sharing-option. I was inspired by Dominik’s post about readability and usability on blogs (in German) who uses the Quartz-like approach – something I wanted to have, too.

URL share implementation on qz.com.
URL share implementation on qz.com.

Download

You have two options to get the code:

Installation

  1. Upload the files in your plugins directory. Then activate it.
  2. For a label in front of the URL and a text on the copy-to-clipboard-button, go to the settings page and insert your strings in the input fields. Of course, you can leave the label blank, the button, however, should have a call to action.

Change style

You can change the styling by adding your changes to stylesheet of the plugin. The URL Sharing plugin uses three CSS-elements:

  • .url_share: div-container
  • .url_share_label: label of the input field
  • .url_share_input: input field
  • .zeroclipboard-is-hover: hover status for copy-button
  • .zeroclipboard-is-active: active status for copy-button

In the default version url_share_label and url_share_input don’t have values and therefore are using your theme’s style for label and input. Of course, you can change them just the way you want. For example: To change the color of the URL to red, add the following to the plugin’s stylesheet or your theme’s stylesheet: .url_share_input {color:red;}

To-do List

Things that might be considered in the future:

  • Enable font color change of the URL in backend
  • Offer a PHP-Snippet to enable more flexible positioning
  • A button to automatically copy the URL to the user’s clipboard (by using an existing JavaScript library)Added with version 1.1 by using ZeroClipboard

Questions? Comments?

If you have any remarks and/or questions, feel free to leave a comment.

How to Use SideComments.js with WordPress

Medium.com and Quartz are both famous for their innovative ways of presenting content. Both use side comments in order to allow to comment individual paragraphs rather than whole articles.

A few days ago SideComments.js was released by Eric Anderson. It allows an easy integration of that commenting system.

A demo of sidecomments.js
A demo of sidecomments.js

If you want to use SideComments.js within your WordPress installation, follow these 3 simple steps:

1. Download the adaption for WordPress on Github by strategio: WP Side Comments (.zip).

2. Upload the plugin to your plugins folder and activate it.

3. Go to settings –> WPSC. There you have to include two CSS-Selectors, one for your content, one for your comments. For example, in order to make the plugin work with twentyfourteen you have to write:

One class and one ID selector in the twentyfourteen theme.
One class and one ID selector in the twentyfourteen theme.

Be aware that you need a . for a class, or a # for an ID. If you don’t use twentyfourteen you can find out your selectors with developer tools in your browser.

Every comment is a regular comment in the WordPress system and can be edited, reviewed etc. in the WordPress backend.

That’s it 🙂

Orte von WordPress-Posts dynamisch mit Leaflet.js posten

Ich habe endlich eine Methode gefunden, wie WordPress-Posts automatische einer Leaflet-Karte hinzugefügt werden kann. Wer auf das CMS WordPress setzt, kann damit einen Schritt Richtung structured journalism tun.

Die Lösung basiert auf einem Code von Alicia Duffy und Ben C. Bond, die Entwickler bei der Tierschutzorganisation PETA sind und so verschiedene US-Universitäten auf einer Karte darstellen.

Über einen Custom Post Type und Taxonomien werden die Ort festgelegt, dann über geojson exportiert und in Leaflet eingelesen. Über einen Shortcode kann eine Karte überall leicht eingebunden werden.

Responsive Maps in WordPress from Alicia Duffy

Die Komponenten des Codes

  • Die Leaflet-Bibliothek und die dazu notwendigen Dateien (JavaScript und CSS).
  • Die Geocoder-Funktion von Google, die sich über JavaScript-Datei einbinden lässt. Orte, Postleitzahlen und Adressen werden so automatisch in Koordinaten umgewandelt. Dazu notwendig: Eine Google Maps API v3.
  • Eine Geojson-Datei, die sich jeden Tag updated und ggf. neue Standorte der Karte hinzufügt.
  • Die Icons von Fontawesome für die Marker.

Den Code gibt es bei Github: Generic Map.

FeedWordPress: Texte via RSS automatisch auf der eigenen Webseite veröffentlichen

Autoren mit einem Zweitverwertungsrecht können ihre Texte auch auf der eigenen Seite veröffentlichen. Mit dem FeedWordPress-Plugin kann der Prozess automatisiert werden.

Für meine Artikel habe bei den Netzpiloten habe ich das Zweitverwertungsrecht – ich wäre dumm, wenn ich das nicht nutzen würde. Nur bisher war ich zu faul, die Artikel jedes Mal in meine WordPress-Installation einzupflegen. Mit dem FeedWordPress-Plugin kann das automatisch erledigt werden: Ich brauche nur den Feed, alles weitere erledigt das Plugin.

Nach der Installation findest du im linken Menü den Bereich „Syndication“. Unter „New Feed“ in der rechten oberen Ecke kannst du die URL eingeben, unter der der RSS-Feed zu finden sein wird. In meinem Fall: http://www.netzpiloten.de/author/katharina-brunner/feed.

Danach kannst du viele Einstellungen machen: Sollen Kategorien und Schlagworte übernommen werden? Soll auf den Beitrag auf deinem Blog oder die Erstveröffentlichung verlinkt werden? Soll der übernommene Beitrag sofort publiziert werden oder soll es eine Karzenzzeit geben? Willst du noch einmal drüber lesen oder automatisch veröffentlichen?

Es macht Sinn, alle diese Texte unter einem Schlagwort oder einer Kategorie wie zum Beispiel Artikel zusammenzufassen. Dadurch kannst du sie dir leicht gebündelt wieder auf deiner Webseite ausgeben lassen. Du kannst auch einen Custom Post Type für deine Artikel aus Feeds erstellen und dann in diese Artikelgruppe automatisch einordnen.

Detaillierte Informationen zur Konfiguration des FeedWordPress-Plugins gibt es auf der Webseite der Entwickler.

Downloaden kannst du das Plugin über das Backend deiner WordPress-Installation oder über das Plugin-Repository bei WordPress.

Bei dem Interviewformat Auf ein Bier mit von und mit Journalisten war vor wenigen Wochen Tobias Schwarz zum Thema Zweitverwertung von Artikeln zu Gast:

Google News straft Sponsored Content ab: Ein Überblick und eine Lösung

Advertorials, Native Advertising, Sponsored Posts – Werbung, die makellos in das redaktionelle Kleid gewandet ist, scheint der Hoffnungsträger vieler journalistischer Geschäftsmodelle sein*. Doch das mag Google und erst recht Google News nicht.

Die wichtigste Quelle dazu ist ein YoutTube-Video des Google-Mitarbeiter Matt Cutts, der erläutert, welche Konsequenzen es für Webseiten-Betreiber haben kann, wenn sie sich nicht an die Regeln halten. Bezeichenend ist seine Abteilung: „Web Spam Team“.

Cutts spricht ab Minute 2:15 Uhr vor allem zwei Punkte an, die Auswirkungen auf die Sichtbarkeit einer Seite bei Google haben können:

  1. Google Suchmaschine: Bezahlte Beiträge mit Links sind gekaufte Links. Punkt. Die Links müssen also mit einem rel=“nofollow“ versetzt werden und ließen dadurch nicht in den PageRank ein.
  2. Google News: Bezahlte Beiträge sollen bei Google News nicht vorkommen, weshalb damit gedroht wird, dass nicht nur die fälscherlicherweise indexierten Beiträge gelöscht werden, sondern die gesamte Webseite. Google-Mitarbeiter Cutts empfiehlt eine „abundunace of caution“.

Ein Beispiel für eine Bestrafung ist eine Lokalzeitung in England, deren PageRank auf 0 gesetzt wurde, nachdem dort ein Text über einen Blumerlieferdienst veröffentlicht wurde, der zwar als sponsored content gekennzeichnet war, aber der Link zum Lieferdienst aber kein nofollow-Attribut hatte.

Wie soll man nun damit umgehen, wenn journalistische Beiträge und bezahlte Texte auf einer Seite liegen und bei GoogleNews auftauchen möchte?

Eine Lösung beim Content-Management-System WordPress: Das Google News XML Sitemap Plugin erstellt eine spezielle Sitemap für Google News. Besonders praktisch: Dort kann man bestimmte Kategorien ausschließen – also die, in der sponsored content liegt. Die Sitemap für Google News ist dann unter deinedomain.de/google-news-sitemap.xml erreichbar.

Linkliste zum Thema Google News und Sponsered Content/Advertorials:

Google: Separating different types of content on your site

Seokratie: Advertorials und Sponsored Posts: Eine unbequeme Wahrheit

Die juristische Perspektive auf den Konflikt zwischen redaktionellen und werblichen Beiträgen bietet der Blog Recht-Freundlich.de.

PaidContent: If you are running advertorial or sponsored content, Google is watching you

Business Insider: Google Just Threatened To Ban News Sites That Run Advertising It Doesn’t Like

Bueltge: Google News Sitemaps in WordPress

* Man kann natürlich darüber diskutieren, inwieweit das dem journalistischen Ethos dient. Aber hey – Geldverdienen mit Journalismus ist kein Zuckerschlecken.

Mei Dog bam Hog’n

Alter Holzboden, weiße Wände, Dachterrasse: Im dritten Stock eines ehemaligen Brauereigebäudes tummeln sich am Stadtplatz1, Freyung, Bayerischer Wald, die, die man gemeinhin Kreative nennt. Ich besuche für einen Tag den Hog’n, das Onlinemagazin ausm Woid, um die Ecke haben auch eine Web- und eine Designagentur ihre Büros.
Weiterlesen →

Das CMS ist tot, es lebe das CMS!

WordPress, Drupal und Joomla können eines richtig gut: homogenen Inhalt darstellen, in einer Datenbank ablegen und auffindbar machen. Doch sobald die Darstellung komplexer wird oder trendy Sachen, wie Parallax Scrolling miteingebaut werden, stoßen die gängen CMS an ihre Grenzen. Nicht von ungefähr empfiehlt Aaron Phielhofer von der New York Times, bei Projekten, die sich unter dem Buzzword „Digital Storytelling“ zusammenfassen lassen, Content-Management-Systeme zu vergessen. Den Rat haben wir bei der Lautschrift verfolgt, als wir „In grauer Vorzeit“ erstellt haben: Eine Geschichte aus den Anfangsjahren der Uni Regensburg im Snowfall-Stil.

Dort ist alles hard-gecoded, d.h. der Text wurde dort wirklich in das HTML-Gerüst eingearbeitet und wurde nicht über eine Datenbankabfrage o.ä. eingearbeitet. Das ist nervig und für wiederkehrende Projekte sehr unhandlich – gerade wenn man davon ausgeht, dass viele Redakteure HTML nicht fließend können.

Daraus folgt: Früher oder später muss man doch auf ein wie auch immer geartetes CMS zurück kommen, um verschiedenen Geschichten im Backend einen Rahmen zu geben. Die üblichen Verdächtigen – WordPress, Drupal Joomla – sind dabei oft zu unflexibel, um wirklich geilen Scheiss zu machen. Doch es scheint Abhilfe zu geben:

Open News, eine Platform von Mozilla, die sich mit Datenjournalismus, digital Storytelling und ganz allgemein Onlinejournalismus beschäftigt, stellt vier Systeme vor, die in Redaktionen entwickelt wurden – denen man fehlende Praxistauglichkeit also mal per se nicht absprechen kann:

With the growing number of nerds in the newsroom, it’s only fitting that new technology patterns for building news applications have emerged. The latest rage? Ultralight content management systems.

Am vielversprechensten klingt Tarbell: Gespeichert wird in der Cloud, vorwiegend mit Google Spreadsheet. Vorteil: Auch weniger code-affine Leute können mit Tabellenverarbeitungsprogrammen umgehen, auch um ein Backup braucht man sich nicht mehr groß kümmern. Gehostet wird gerne bei Amazon. Vorteil davon: Dort wird flexibel auf die Zugriffszahlen angepasst. Dennoch bleibt ein fader Beigeschmack: Soll man wirklich den ganzen Content bei Google speichern?

Aber abschreiben sollte man WordPress und Konsorten nicht. Nur einen Klick weiter berichtet Joey Marburger von der Washington Post in einer Case Study davon, wie er und seine Kollegen, das Portal „The Grid“ auf WordPress aufgebaut haben:

We made the decision early to use WordPress as the front-end controller because it allowed us to create multiple instances of The Grid simply by created new “posts” in WordPress. (…) Furthermore, we were using WordPress in a very different way than it was designed for. WordPress did not store or distribute the true content of The Grid. It simply contained The Grid itself with the various options set.

Das klingt ganz nach Matt Muellenweg, dem Mitbegründer von WordPress. In seiner jährlichen Rede „State of the Word“ wünschte er sich 2013, dass WordPress zu einem Framework für Web-Applikationen wird.