praegnanz.de

(Immer noch) kein DirectWrite in Firefox und Chrome

2012-05-29T15:20:12Z

Vor ziemlich genau 3 Jahren hat Microsoft im Zuge des Service Pack 2 von Windows Vista die neue Schriftrendering-Engine DirectWrite eingebaut. Jegliche Schriften sehen damit besser aus, es gibt so gut wie keine Nachteile.

Dennoch nutzt auch Ende Mai 2012 nur ein einziger Browser unter Windows 7 standardmäßig DirectWrite, um seine Texte darzustellen. Es ist der IE9.

Unter Firefox – wir erinnern uns: Version 12(!) – muss man DirectWrite manuell in der about:config aktivieren, für Chrome ist das Feature noch nicht einmal experimentell implementiert, es existiert lediglich ein Ticket.

Der Unterschied zwischen GDI und DirectWrite ist im Regelfall zwar nicht groß, kann aber bei experimentellen Layouts schnell dramatisch werden.

Es wäre so einfach! Es ist alles da! Macht es einfach!

update 22:00 Uhr: Es ist wohl so, dass bei manchen Firefox-Nutzern sehr wohl DirectWrite per default aktiviert ist, nur lässt sich bisher kein eindeutiges Muster erkennen. Vermutlich hängt es mit der erkannten Hardware (Grafikkarte/3D-Beschleunigung usw.) ab. Eventuell auch vom Upgrade-Pfad? Mag sein, dass ein frisch installierter Firefox sich anders verhält als ein brav von 1.0 bis 12.0 hochgezogener Firefox? Hier ist noch weitere Feldforschung nötig. Bis dahin könnt ihr selber mal testen: Demo

update 23:00 Uhr: Unser Freund Schepp hat ein kleines Detection-Skript geschrieben, mit dem sich per JavaScript herausfinden lässt, ob DirectWrite aktiviert ist oder nicht. Ich werde das morgen zu einem github-Projekt verarbeiten, welches einfach eine entsprechende Klasse auf das HTML-Element legt.

update 30.5., 10:45 Uhr: Dank Rodney und Eric ist das Detection-Script nun weiterentwickelt, funktioniert bisher ganz gut und kann hier getestet werden

update 30.5., 11:45 Uhr: Und jetzt auch auf github

Wochenlinks

2012-05-27T23:00:00Z

Netzfundstücke vom 21.05. bis zum 28.05.:

@Flocke: Kostenlose Keynote prototyping Templates #design #UX #mockups http://t.co/1yBTSQhy via @keynotopia
(vor 5 Tagen)

Facebook hat RSS- und Atom-Feeds

2012-05-24T21:00:27Z

Auch wenn sie es richtig gut verheimlichen: Facebook stellt tatsächlich XML-Feeds zu Timelines/Chroniken bereit, die man ganz normal von außen abgreifen und weiterverarbeiten kann. Die URLs dazu sind folgendermaßen aufgebaut:

https://www.facebook.com/feeds/page.php?format=atom10&id=123456789012

oder

https://www.facebook.com/feeds/page.php?format=rss20&id=123456789012

Die ID-Nummer einer Facebook-Seite ist allerdings gar nicht so leicht herauszufinden. Ihr könnt aber beispielsweise die URL zum Portraitbild der Timeline hernehmen, diese sieht etwa so aus:

https://www.facebook.com/photo.php?fbid=12345678901234567&set=a.12345678901234567.123456.123456789012&type=1&theater

Die letzte(!) der drei Zahlenreihen, die mit Punkten getrennt sind (Attribut »set«), ist die korrekte id, die für den Feed verwendet werden muss. Seltsam, aber so steht es geschrieben. Danke auch an Robert Schwaiger für’s Ausbuddeln.

Wochenlinks

2012-05-20T23:00:00Z

Netzfundstücke vom 14.05. bis zum 21.05.:

HTML5 adaptive images: end of round one | HTML5 Doctor
from HTML5 Doctor http://html5doctor.com…
@MadeMyDay: Das ist schon ganz cool: http://t.co/jfXdxXPL #firefox #metro
(vor 3 Tagen)

Mein Buch ist finanziert!

2012-05-16T19:44:16Z

Und ich bin sehr glücklich, dass Ihr es mir ermöglichst habt! Weitere Details im Blog von Startnext.

Ich habe außerdem die Domain webtypobuch.de registriert, die derzeit noch auf Startnext weiterleitet, aber später dann eine eigene Website spendiert bekommt, auf der man das Buch kaufen können wird, und eventuell auch in HTML online lesen. Mal sehen.

Bis dahin widme ich mich noch meinen Kundenprojekten sowie dem Relaunch von praegnanz.de – stay tuned!

Altersvorsorge für Selbstständige bald verpflichtend?

2012-05-13T08:00:38Z

Das Bundesministerium für Arbeit & Soziales plant, ab Sommer 2013 eine Pflicht zur Altersvorsorge für Selbstständige einzuführen. Bei Deskmag gibt es eine gute Zusammenfassung des Sachverhaltes. (die letzten Absätze sind leider polemisch und unsachlich.)

Man muss sich das mal genauer anschauen und durchdenken. Grundsätzlich bin ich ein Freund vom Solidarsystem und halte beispielsweise private Krankenversicherung für ungerecht (obwohl ich selber Mitglied bin). Die Eckpunkte der geplanten Pflicht-Altersvorsorge sehen aber in meinen Augen ebenfalls potenziell ungerecht aus. Der entscheidende Knackpunkt: Die Höhe des Pflichtbeitrages in die gesetzliche Rente soll sich nicht nach dem tatsächlichen Einkommen der Selbstständigen richten, sondern nach deren Alter. Ein 25-jähriger muss ich also signifikant weniger pro Monat zahlen als ein 45-jähriger, wenn die Regelung in Kraft tritt. Immerhin: ab 50 muss gar nicht mehr gezahlt werden.

Ein bisschen wirkt das geplante Gesetz auf mich wie eine Behelfsmaßnahme, um intern das Geld zwischen den Behörden herumzuschieben: Wenn ein Mensch mit 65 in Rente geht, er aber selber nicht genug vorgesorgt hat, muss seine staatliche Rente mit Sozialhilfegeldern aufgestockt werden. Beide Geldquellen liegen letztlich beim Staat, nur aus verschiedenen Töpfen. Mit dem Gesetz erreicht man meines Erachtens nur, dass weniger aus dem Sozialversicherungstopf und mehr aus dem Rententopf fließen kann. Letztlich sind aber beide Töpfe von den Bürgern finanziert. Vielleicht sehe ich das aber auch zu naiv.

Um das Gesetz vollständig beurteilen zu können, brauchen wir im Grunde eine Reihe von konkreten Beispielzahlen. Wieviel muss ein 40-jähriger Selbstständiger zusätzlich im Monat berappen, wenn er bereits eine private Rente abgeschlossen hat, und eventuell eine Eigentumswohnung geerbt hat. Wie sieht es mit einem 28-jährigen aus, der noch keinerlei Vorsorge getroffen hat? usw.

Ein Betrag, der sich nach dem realen Gewinn des Selbstständigen richtet, erscheint immer gerechter als ein Betrag, der – wie in diesem Falle – anhand der Erreichung eines absoluten Ziels festgemacht ist. Zumal kein Mensch weiß, wie teuer das Rentnerleben im Jahr 2045 sein wird.

Am besten, ihr informiert euch noch weiter über das Thema, und könnt bei Missgefallen eine Petition gegen das Gesetz unterzeichnen! Eine abschließende Empfehlung vermag ich (noch) nicht zu treffen.

Wochenlinks

2012-05-06T23:00:00Z

Netzfundstücke vom 30.04. bis zum 07.05.:

@codepo8: Viewport Sized Typography - http://t.co/aK5h3gT6
(vor 5 Tagen)

Ganz schön still hier

2012-05-03T20:54:19Z

Langjährige Leser wissen es längst: Wenn bei praegnanz.de Ruhe herrscht, ist die Auftragslage gut! Deshalb an dieser Stelle nur ein kurzes Lebenszeichen von mir. Ja, es gibt mich noch.

Derzeit werkele ich an diversen Kundenaufträgen, bereite darüber hinaus einen Relaunch dieser Website vor. Das wird übrigens sehr nett: Modernes Frontend, noch größere Schrift, maximale Reduktion von verwendeten Schmuckbildern, alles Retina-tauglich und/oder vektorbasiert. Außerdem will ich statt jQuery das schlankere und teilkompatible zepto.js einsetzen.

Darüber hinaus gilt es immer noch, die Anfang April gegründete praegnanz.de GbR komplett an den Start zu bringen – dazu später mehr.

Und ich bemühe mich gleichzeitig immer noch um Sponsoren für mein geplantes Buchprojekt. Langsam wird’s zeitlich ein wenig eng. Solltet Ihr also jemanden kennen, der 500 Euro gegen prominente Werbung in einem dollen Fachbuch eintauschen möchte – immer her damit!

In ein paar Wochen sehen wir alle klarer, und praegnanz.de erstrahlt in neuem Glanz. Bis dahin sehen wir uns auf Twitter, mindestens.

Wochenlinks

2012-04-15T23:00:00Z

Netzfundstücke vom 09.04. bis zum 16.04.:

@anselmhannemann: Please help me, making this topic an important point @webm @googledevs. WebP should be streaming / responsive! http://t.co/sIyamVHA
(vor 1 Tag)
@vpieters: retina.js a script that makes it easy to serve high-resolution images to devices with retina displays. Bookmarked! http://t.co/JIY9QAkJ
(vor 2 Tagen)
@ginader: good write up on cross-browser kerning-pairs & ligatures: http://t.co/pFMajSSj
(vor 2 Tagen)

Wochenlinks

2012-04-08T23:00:00Z

Netzfundstücke vom 02.04. bis zum 09.04.:

@timohetzel: Früher war alles besser. Auch die Werbung. Achtung, hartes Zeug. Via @benjamin_nagel http://t.co/lxjtkeO2
(vor 1 Tag)
Jilion Blog - SublimeVideo Awarded 1st Prize of the “Trophées PERL 2012”
from Jilion Blog http://blog.jilion.com…

Wollt Ihr mein #webtypobuch-Projekt unterstützen?

2012-04-03T15:52:16Z

Es ist ja allgemein bekannt, dass ich die besten Leser der deutschsprachigen Blogosphäre habe. Im Jahr 2006 habe ich mir mal ein MacBook von meinen Lesern finanzieren lassen, was damals nicht unkontrovers war – gab es doch keine direkte Gegenleistung.

Und jetzt erneut für mich in die Tasche greifen? Versprochen: Diesmal lohnt es sich ganz konkret. Ich werde nämlich dieses Jahr mein erstes Buch schreiben, produzieren und herausgeben. Es soll um eines meiner Lieblingsthemen gehen, nämlich Webtypografie. Und ich nutze diesmal die Crowdfunding-Plattform Startnext, um mir die Arbeitszeit am Buch finanzieren zu lassen.

Konkret sammele ich 7.500 €, was (abzüglich der Mehrwehrtsteuer und Kosten für 100 limitierte Druckexemplare) ungefähr 5 Wochen Vollzeitarbeit entspricht. Ob das reicht, um das Buch zu verfassen? Ich hoffe es.

Alle Infos über das Buch finden sich auf der Projektseite von Startnext. Die Plattform ist im Grunde eine tolle Sache, wenn auch etwas umständlich in der Bedienung. Der Community-Gedanke wird groß geschrieben. Ich hätte zwar lieber einen nackten technischen Dienstleister gehabt, aber man sollte nicht wählerisch sein.

Keine Bange: Wenn das Budget bis Ende Mai nicht zustande kommt, wird das Projekt abgeblasen und alle bekommen ihr Geld zurück. Ich bin aber frohen Mutes, dass es klappen wird. Helft mit und meldet euch an! Bezahlen könnt ihr per Paypal, Banküberweisung oder Online-Sofortüberweisung.

Hier geht’s zur Projektseite!

(Und um die Gedanken aus meinem letzten Artikel aufzugreifen: Das Buch wird unter einer CC-Lizenz erscheinen und darf frei weitergegeben werden, solange kein Geld damit verdient wird.)

update 16.4.2012: Die 100 limitierten Erstexemplare waren im Nu ausverkauft. Deshalb gibt’s ab jetzt die gedruckte Zweitauflage in unbegrenzter Menge zum Vorbestellen!

Wochenlinks

2012-04-01T23:00:00Z

Netzfundstücke vom 26.03. bis zum 02.04.:

Using Modernizr to detect HTML5 features and provide fallbacks | HTML5 Doctor
from HTML5 Doctor http://html5doctor.com…
@johndyer: WANT: list-style-type: dash;
(vor 5 Tagen)
@espiekermann: Glyphish is still da thing for UI work: http://t.co/Ez44bLFG
(vor 5 Tagen)
@smashingmag: ☁ Entypo: a set of 100+ carefully crafted pictograms available as an OpenType font, released under CC: http://t.co/Sa83qlFD
(vor 6 Tagen)

Gedanken über Künstler und die Digitalkopie

2012-03-30T19:26:26Z

Egal ob Regener oder Tatort-Autoren – man muss sich dieser Tage immer wieder wundern. Nicht zwingend aufregen oder verfluchen, aber ganz stark wundern, wie wenig die traditionell denkende »Autorenschaft« mal einen Schritt zurücktreten kann in der Situation rund um Urheberrecht und Digitalkopie, um sich das alles aus einer globaleren Perspektive anzusehen. Sie würde erkennen, dass ein Künstler eben kein automatisches Recht darauf hat, von seiner Kunst leben zu können. Warum auch? Wenn das so wäre, würden wir vermutlich alle Künstler werden!

(In einer alternativen Realität hätte ich vor 12 Jahren meine Design-Aufnahmeprüfung nicht geschafft. Und ich hätte mich als Musiker bezeichnet und meine grottenschlechten Songs auf Platte gepresst und alle verklagen lassen, die sie rippen und im Netz getauscht hätten. Nach heutiger perverser Praxis wäre das wohl irgendwie okay. Moralisch oder realitätsbezogen ist es nicht.)

Woher kommt diese Anspruchshaltung der Vollzeitkreativen? Sie werfen den Internet-Nutzern (sind sie selber eigentlich keine?) deren Kostenloskultur vor, treten aber selber für die selbstverständliche Vergütung Ihrer Werke ein, auch wenn diese unter Umständen gar nicht gehört werden.

Ich bin des 30 Jahre alten Pseudoarguments müde, nachdem sich die Kids alle ihre Songs/Computerspiele/Filme kaufen würden, wenn sie sie nicht kopieren könnten. Songs werden heute festplattenweise auf dem Schulhof getauscht. Ihr glaubt doch nicht wirklich, dass ein 13-Jähriger in der Lage ist, 120 GB an Musik tatsächlich zu hören? Und fürs gemeinschaftliche Backupen der digitalen Songdateien sollen fünfstellige Strafgebühren fällig sein?

Wenn vergütet werden soll, dann bitte nach tatsächlicher Nutzung, nicht nach reiner Verfügbarkeit. Spotify und Co. machen es derzeit vor. Aber die Menschen haben schon seit einigen Jahrzehnten die Möglichkeit, kostenlos und legal Musik zu hören, nämlich über das Radio. Das geht jetzt zwar alles ein bisschen gezielter und einfacher, und meinetwegen hat sich die Art und Weise, wie wir das Musikhören bewerten und zelibrieren, auch gewandelt. Aber grundsätzlich kostenlos Musikhören kann man seit den 1950er Jahren. Sollte das Internet und MP3 morgen verschwunden sein, hören die Kids halt wieder nur Radio und MTV und kaufen genauso wenig Musik wie aktuell. Hören und Bezahlen waren nie so direkt miteinander verbunden, wie uns die Musikindustrie immer glauben lässt. Wer es sich leisten konnte und wollte, zahlte. Wer nicht, nicht.

Und überhaupt: Künstler lebten in den letzten 80–90 Jahren in einer für sie extrem vorteilhaften historischen Sondersituation, die aber eine Übergangsphase darstellte: Sie mussten keine »Originale« mehr schaffen (in Form von Livekonzerten, Ölgemälden, Partituren …), sondern konnten auch mit der Herstellung von physischen Kopien Geld verdienen (Vinyl, CD, Notenblätter …). Diese Phase geht gerade vorüber, denn die physischen Kopien weichen den digitalen, und diese können technisch eben ohne nennenswerten Mehraufwand beliebig kopiert und verbreitet werden. Das kann man doof finden, oder auch einfach Fortschritt. Man kann die alten Zeiten (die gar nicht so alt sind!) und seine Sondersituation politisch zurückfordern, oder sich was anderes ausdenken.

Zum Beispiel könnte man sich alte und neue Formen für »Originalwerke« zu Nutze machen. Livekonzerte sind im Popbereich seit einigen Jahren stärker im Kommen als je zuvor (Deichkind macht damit 80% Ihres Umsatzes). Oder halt die handsignierte Superedition des neuen Albums, à la NIN. Oder was spricht gegen eine Versteigerung der Mastertapes eines beliebten Songs? Oder des Skizzenbuchs, wo dessen erste Textideen angeskribbelt sind? Auf jeden Fall Dinge, das das Herz eines Fans höher schlagen lassen.

Und genau darum geht’s: Lasst eure Fans die Mäzene sein! Eure Songs mögen zwar im Spartenradio gespielt werden, ihr mögt auch auf der 120-GB-Schulhoffestplatte mit dabei sein; doch richtige, geldwerte Anerkennung bekommt ihr eh nur von den richtigen Fans. Die sollen ruhig blechen, denn die machen es gerne und freiwillig und wissen, dass es eure Kunst sonst vielleicht nicht gäbe.

Übrigens: Wer als verkaufender Künstler auch noch Labels und Verlage umgeht, streicht statt 5 Prozent des Verkaufspreises bis zu 70 Prozent ein, je nach Vertriebsplattform. Es muss also nicht immer Massenmarkt sein. Manchmal reicht auch eine steile Nische, um auf seine Kosten zu kommen.

Trotzdem führt das alles, ganz klar, zu einem stärkeren Wettbewerb um die Gunst der Fans und deren Geld. Aber wer hat denn gesagt, dass man sich nicht anstrengen muss? Ganz ehrlich: Richtig gute Kunst wird immer seine zahlende Fans finden. Und schlechte Kunst, tja, die hat dann eben kein Anrecht darauf, seinen Schöpfer ernähren zu können. Flurbereinigung in einer vor Kultur sowieso strotzenden Welt.

Denn um Buntheit und Vielfalt in der Kulturlandschaft müssen wir uns nun definitiv keine Sorgen machen: Kultur zu schaffen ist ein Grundbedürfnis vieler Menschen, man muss das nicht zwingend professionell machen. Anders als früher nämlich, als man ohne Geld nichts publizieren konnte, ist das heutzutage viel einfacher möglich. Ergo: Hobbykünstler sein war nie so cool wie heute!

Meine Ideen zum Urheberrecht

Was ganz konkret das Urheber- und Verwertungrecht angeht; Dazu hätte ich übrigens auch noch ein paar Stichworte zu sagen:

Weil heutzutage viel mehr Menschen Urheber und gleichzeitig potenzielle Urheberrechtsverletzer sind, muss dieser ganze Rechtskomplex deutlich leichter zu begreifen sein. Dinge, die alle angehen, müssen einfach sein.
Urheberrecht und Verwertungsrecht sollten vereint werden. Sie werden eh ständig in einen Topf geschmissen, und ich sehe die Unterscheidung nur begrenzt ein.
Dieses vereinigte Copyright sollte für jedes Werk automatisch 5 Jahre gelten (sofern der Autor keine andere Lizenz dafür proklamiert).
Nach den ersten 5 Jahren kann das Copyright eines Werkes jeweils für 3 Jahre erneuert werden (gegen eine angemessene Verwaltungsgebühr), bis maximal zum Tode des Autors.
CC-Lizenzen und klassisches Copyright stehen als freie Wahlmöglichkeit nebeneinander. Verstöße werden mit fairen Methoden auch im Netz konsequent geahndet. Eine Deckelung der Strafgebühren muss dabei aber verhindern, dass Abmahnen ein Geschäftsmodell für Verwerter bleibt.
Die GEMA (und ähnliche Organisationen) muss umstrukturiert und vereinfacht werden. Sie sollte als Statistikdienstleister und Treuhändler fungieren, bei dem die Künstler nach Wunsch einzelne Songs anmelden können. Die GEMA-Vermutung muss sterben. Die Trennung zwischen Supermitgliedern und Fußvolk muss aufhören.

tl;dr

Von nichts kommt nichts. Alle Künstler müssen sich anstrengen, um Fans und Geld zu erhalten, indem sie mehr tun als nur Platten aufnahmen und Bücher schreiben: Selbstvermarktung wird zur Pflicht. Die Sorge um zu wenig Kultur ist unbegründet. Ein vereinfachtes Urheberrecht hilft, Missverständnisse und verhärtete Fronten aufzulösen.

Wochenlinks

2012-03-25T23:00:00Z

Netzfundstücke vom 12.03. bis zum 26.03.:

links vom 23.03.2012 - wirres.net, fachblog für irrelevanz
from wirres.net http://wirres.net…
@gerritvanaaken: Lesebefehl: Malte Welding über das deutsche Fernsehen! http://t.co/dtpdnwdO
(vor 2 Tagen)
Unter Schneeblinden | Sprachlog
from Sprachlog http://www.scilogs.de/wblogs/blog/sprachlog…
@espiekermann: Designing for the Retina display: http://t.co/BKQqiQzL via @brad_frost
(vor 3 Tagen)
@gerritvanaaken: Interessant: keynote als Web-Layout-Tool. http://t.co/Ah2tMqss
(vor 4 Tagen)
@MatzeLoCal: Uschi von der Leyen will Selbständige in die Festanstellung drängen, oder wie habe ich das hier zu verstehen: http://t.co/gEZDC3WL
(vor 4 Tagen)
@TypoJournal: Wayfinding Sans Pro - die neue Schrift für Leit- und Orientierungssysteme http://t.co/qcgC7PhK
(vor 4 Tagen)
@patrick_allaert: A: Do you have a time estimation to develop it? B: Mhhh, about 2. A: Hours? B: Don't know the unit yet. #epic #estimation #development
(vor 6 Tagen)
@clauseggers: @ScottKellum @rogerblack @iA text- rendering:optimizeLegibility turns on kerning and common ligatures in iOS.
(vor 8 Tagen)
@iA: I have another suspicion about typography on the iPad3. It needs organic noise, otherwise it all looks like dead plastic. #NewAesthetic
(vor 8 Tagen)

Wochenlinks

2012-03-19T00:00:00Z

Netzfundstücke vom 12.03. bis zum 19.03.:

@clauseggers: @ScottKellum @rogerblack @iA text- rendering:optimizeLegibility turns on kerning and common ligatures in iOS.
(vor 1 Tag)
@iA: I have another suspicion about typography on the iPad3. It needs organic noise, otherwise it all looks like dead plastic. #NewAesthetic
(vor 1 Tag)
@iA: Forget hinting. Low resolution needs it. iPad1+2 just needs bigger sizes. iPad3 wants old school fonts, a bit bolder: http://t.co/t4xusNz5
(vor 1 Tag)
@mrgan: It's not WHY they did it, but the Retina display will help Apple move even more people from websites to apps. Websites look fuzzy now.
(vor 2 Tagen)
@mauritzl: Designing in the browser is not the answer http://t.co/QuxXYeZO
(vor 3 Tagen)
@timpritlove: Idealism vs. pragmatism: Mozilla debates supporting H.264 video playback http://t.co/gQ51emPj
(vor 4 Tagen)
@FontBookApp: We’re proud to announce that our rendering server is prepared to deliver Retina display resolution http://t.co/MCwLVwMv
(vor 6 Tagen)

Was High-PPI-Bildschirme fürs Webdesign bedeuten

2012-03-16T20:04:11Z

Während die einen noch ihre Achseln zucken, bin ich der Meinung, dass gerade für uns Webdesigner, Frontend-Entwickler und CMS-Konfigurierer spannende Zeiten anbrechen: Die Zeiten der doppelt hinterlegten Bilder.

Beim iPhone 4 (und Smartphones mit vergleichbarer Auflösung) ist es noch nicht so sehr aufgefallen, weil man auf diesen Bildschirmen selten eine Website in 1:1-Darstellung angesehen hat, sondern meist wild rumzoomte. Und die grafische Opulenz von nichtzoombaren, Web-App-ähnlichen Layouts hielt sich in Grenzen.

Doch mit dem iPad der 3. Generation könnte der Startschuss gefallen sein für duale Bildquellen. Denn nun haben wir es Bildschirmen zu tun, die in der CSS-Pixeldimension bei gewohnten 1024×768px Breite liegen, wo aber jeder virtuelle CSS-Pixel aus 4 Gerätepixeln gebildet wird. Und das iPad wird sicher nicht das einzige »Vollbildschirm«-Gerät bleiben, welches in Kürze den Faktor 1:1 bei CSS vs. Gerätepixeln durchbricht.

Nun haben wir die Aufgabe, unsere bestehenden (und natürlich auch zukünftigen) Websites zu untersuchen, und in verschiedene Bestandteile zu sortieren:

1. Text, vom Browser gerendert

Hier muss man eigentlich nichts machen, weil das reguläre Textrendering immer die volle Gerätepixelauflösung einbezieht.

I’m a creep, I’m a weiro, but: System fonts, Web fonts, print fonts… To a snob like me, they all look wrong on the iPad3. New fonts!
— Oliver Reichenstein (@iA) März 16, 2012

Doch wie Oliver Reichenstein richtig anmerkt, könnte ästhetisch etwas zu tun sein: Vormals bildschirmoptimierte Schriften wie Verdana, Arial oder Georgia sehen auf einmal noch klobiger und ungelenkiger aus. Denn Retina-Auflösungen verhalten sich nicht mehr wie Bildschirme, sondern sind eher mit Offset vergleichbar. Und da wirken »Offset-Schriften« mit mehr Würze und kleinen Details oftmals schöner.

2. Text, als Grafik hinterlegt

Die größte Katastrophe. Abgesehen davon, dass man diese Textersetzungstechnik sowieso seit Jahren nicht mehr empfiehlt: Es kommt vor. Und es gilt, hier schleunigst Abhilfe zu schaffen, denn auf High-PPI-Bildschirmen erwartet der Nutzer, dass zumindest Schrift immer knackig scharf ist. Wenn es irgendwie geht, sollte man hier auf nativ gerenderten Text umstellen. Webfonts machen es möglich!

3. Grafische Schmuckelemente und Icons

Hier sollte man versuchen, sooft wie möglich mit CSS3-Techniken zu agieren, denn diese nutzen natürlich die Geräteauflösung voll aus: Abgerundete Ecken, Randlinien, Schrägstellen von Elementen usw.

Bei komplexeren Formen und vor allem Icons sieht die Sache ein wenig anders aus. Hier kann es sich lohnen, eine Version mit doppelter Auflösung separat anzufertigen und für entsprechende Clients auszuliefern. Hier eine Anleitung für die entsprechenden CSS-Media-Queries. Nichts spricht übrigens dagegen, die High-DPI-Grafiken mit in das reguläre CSS-Sprite reinzunehmen. Ihr arbeitet ja alle brav mit Sprites!

Eine Alternative (vor allem) für Icons sind vektorbasierte Formen. Entweder als monochromer Webfont oder irgendwie mit SVG-Dateien. Wobei für Letzteres immer noch keine zufriedenstellenden Best-Pratices existieren. Oder?

4. Inhaltsbilder

Tja, was machen wir mit Bildern, die nicht per CSS als Schmuckelement, sondern als inhaltliches Element per <img> eingebunden werden? Hier wird es kniffelig, weil hier zum ersten Mal auch der Redakteur eines CMS ins Spiel kommt. Folgende Thesen:

Rein fotografische Motive mit einer gewissen Komplexität fallen nicht so sehr als minderbepixelt auf. Bei Ihnen wäre eine Vervierfachung der Pixel auch ganz schon heftig, was die Datenmenge betrifft.
sehr grafische oder gar typografische Darstellungen leiden dagegen extrem unter halber Auflösung. Zum Glück lassen sich diese Art von Motiven meist ganz gut komprimieren (vor allem als PNG8), so dass das Dateigewicht sich nicht so gravierend auswirkt.
Es wäre vom Workflow recht einfach, alle Bildmotive stur ausschließlich in hoher Auflösung anzulegen und über die width=""- und height=""-Attribute entsprechend in halber Größe ins Layout zu setzen. Die Datenmenge für Nicht-Retina-Nutzer wird dadurch aber unnötig groß.
Es ist vom Workflow her schwieriger, immer zwei Versionen des Bildes vorzuhalten, und dann per serverseitiger oder clientseitiger Abfrage die jeweilige Version auszuliefern. Hier wird noch ein bisschen geforscht und programmiert werden müssen. Ich denke vor allem an entpsprechende CMS-Plugins und/oder serverseitige On-Demand-Skalierungsskripte.

Noch gibt es kaum Patentlösungen, weil das Thema erst jetzt akut wird. Dennoch hier ein paar Artikel zum Weiterlesen. Ich bleibe dran, versprochen!

Montag ist Webmontag in Würzburg!

2012-03-16T11:52:47Z

Nur zur Erinnerung, falls ihr’s mal wieder verpennt habt:
19. März 2012, im Coworking Space, Veitshöchheimer-Straße 14
Hier mehr Info

QR-Codes

2012-03-14T12:43:00Z

Wer mich und meine Texte ein wenig kennt, wird eventuell ahnen, dass ich kein sonderlich großer Freund von QR-Codes bin. Der Grund: Sie sind meistens nutzlos, bzw. werden zu 95 % in unpassenden Situationen eingesetzt. Daher lache ich am lautesten über jeden guten Witz, der derzeit mit ihnen veranstaltet wird. Aber ich kann verstehen, warum QR-Codes derzeit dennoch überall auftauchen.

QR-Codes sind nämlich ein Kommunikationsdesigner-Ding. Usability-Experten haben mit der gehäuften Präsenz recht wenig zu tun, nein, die »Creative- und Artdirektoren« sind schuld. Da ich ja selber Design studiert habe, weiß ich das.

Designer mögen es nämlich oftmals nicht, wenn man auf dem direktesten Weg zum Ziel kommt. Es geht ihnen meist um eine »Brand Experience«. Es geht um Geschichten, die erzählt werden sollen, Entdeckungsreisen, Überraschungen und das Erhalten von Spiel, Spannung und Unterhaltung.

Das Abtippen einer URL von einem Plakat in sein Smartphone ist öde, weil man vorher schon weiß, was einen erwartet: Eine stinklangweilige, nicht-personalisierte Corporate-Landing-Page. Was will man bei www.nivea.com oder www.adidas.de/anniversary schon groß erwarten? Deshalb wird der mysteriöse QR-Code vorgeschaltet, der den angefixten Plakatgucker (WTF?) spielerisch dazu verleitet, sich überraschen zu lassen, was sich da für ein Wunderland auftut, wenn er sich die Mühe macht.

Das Argument mit der »Eintipphilfe« ist Quark. Auf heutigen Touch-Smartphones hat man eine Adresse dreimal schneller in den stets präsenten Browser eingetippt, bevor man das QR-Scanprogramm gestartet bzw. heruntergeladen hat. Unter iOS muss man das ja erstmal im AppStore suchen. Unter Android ist es (meines Wissens nach) schon vorinstalliert.

Aber darum geht es nicht. Die QR-Code-Fans unter den Werbeleuten sind die gleichen, welche Flash-Intros für eine gute Idee halten, und die Navigationsmenüs ohne Beschriftungen entwerfen. Oder irreführende Navigationsmenüs mit blumigen Bezeichnungen wie »Erleben«, »Reizen«, »Integrieren« usw.

Lasst es euch nochmal gesagt sein: Niemand betrachtet ein Plakat oder eine Website als Erlebniswelt! Niemand ist dermaßen daran interessiert, das große Branding-Mysterium einer neuen Feuchtigkeitscreme aufzudecken, dass er bereit ist, sich mit dem Gefummel eines QR-Codes auseinanderzusetzen.

Wenn ihr etwas wollt, schreibt es einfach hin. Wer gute Botschaften hat, muss sich nicht hinter einer künstlichen Mauer verstecken. Spielerische Werbung schön und gut, aber ein bisschen mehr Konkretheit tut der professionellen Kommunikation immer gut.

Wochenlinks

2012-03-12T00:00:00Z

Netzfundstücke vom 05.03. bis zum 12.03.:

@zeitweise: „Lorem ipsum dolor sit amet“ heißt übrigens „Wenn diese Datei gedruckt wird, wird der Typ gefeuert, der sie final.pdf genannt hat.“
(vor 1 Tag)
@opentype: The webfont symbols set I have been waiting for http://t.co/AWc6JBcF
(vor 3 Tagen)
@yatil: #BPSE Awesome icon font! http://t.co/t2elZ1e4
(vor 4 Tagen)
@espiekermann: Adobe Shadow looks useful: http://t.co/ObWtotvI
(vor 5 Tagen)
@falkoloeffler: Auch Office 15 hat ein Disketten-Icon zum speichern. Wie soll ich das meinen Kindern verständlich erklären?
(vor 5 Tagen)
Encoding WebM Videos | LongTail Video | Home of the JW Player
ro…
@function: Jeder ist Urheber, fast überall.
(vor 6 Tagen)
@iA: What works well and feels good will eventually start looking good. But not everything that looks good, feels good or works well.
(vor 6 Tagen)
@MadeMyDay: Ich brenne eine CD. Gehe dann später noch eine Zeitung kaufen und leihe mir ein Video aus.
(vor 7 Tagen)

Deswegen ist Twitter cool:

2012-03-08T08:22:11Z

Für mich ist das so ähnlich wie wenn sich Daft Punk und Jean-Michel Jarre privat über neue Synthesizer unterhalten, und ich darf lauschen:

Verlage verspielen Verlinkungswürdigkeit

2012-03-05T07:13:37Z

Ungefähr einmal im Jahr bekomme ich von irgendeinem übervorsichtigen Mitarbeiter einer Online-Publikation eine Anfrage, ob sie denn auf eines meiner Essays auf praegnanz.de verlinken dürften. Bisher habe ich diese Verlinkungsanfragen immer innerlich laut ausgelacht, und dann leicht belustigt geantwortet, dass sich das ja von selbst verstünde, dass ich mehr Traffic auf meinen Artikeln haben möchte. Jeder will das.

Nun, seit gestern werde ich nicht mehr lachen, sondern kann leider verstehen, was da passiert. Die Erwähnung und Verlinkung von frei zugänglichen Inhalten ist seit gestern abend in Deutschland kein generöser Akt der Empfehlung mehr, sondern eine potenzielle Bereicherung mittels fremder Inhalte – nah dran am Diebstahl. Und das wissen die deutschen Verlage mit dem sogenannten Leistungsschutzrecht zu verhindern!

Zum Glück gibt es genügend guten Inhalt in österreichischen und schweizerischen Publikationen, sowie die ganze Welt der englischsprachigen Webangebote, die man noch gefahrlos verlinken kann. Bis auf weiteres rufe ich hiermit einen vollständigen Verlinkungs- und Zitatboykott auf, was große deutsche Verlage angeht. Mal sehen, wer am längeren Hebel sitzt.

Wochenlinks

2012-03-05T00:00:00Z

Netzfundstücke vom 27.02. bis zum 05.03.:

EricssonLabs: 10 awesome HTML5 audio players | CatsWhoCode http://t.co/xLJs6xOJ
(vor 2 Tagen)

Unsortierte Gedanken zu Windows 8

2012-03-01T20:44:05Z

Als Betriebssystem-Hersteller mit Anspruch auf den Gesamtweltmarkt kommt heute nicht mehr drum herum, mindestens drei unterschiedliche Oberflächen zu bauen: eine für Touch-Smartphones, eine für größere Touchscreens (vor allem Tablets), und eine für traditionelle Non-Touch-Screens mit Tastatur/Maus-Bedienung.

Apple hat aus den Dreien zwei gemacht, und vollzieht eine klare Trennung: iOS für Touchgeräte (mit geringfügigen Zugeständnissen an die jeweilige Bildschirmgröße von Phone und Tablet), und das sehr unterschiedliche OS X für den klassischen Mac. Dass sich einige iOS-Elemente so langsam wieder in OS X einschleichen, übersehe ich hier mal. Finde ich nämlich pupsdoof!

Microsoft träumt hingegen noch ein wenig konsequenter von der kompletten Vereinheitlichung der drei Plattformen, und portiert seinen Metro-Look, den man von Windows Phone 7 kennt, auf Tablets und klassische PC. Und man merkt es den Demos und der aktuellen Beta deutlich an: Metro ist als Default-Zustand gedacht, während der klassische Desktop inzwischen das ungeliebte Stiefkind zu sein scheint (»… gibt es auch noch …«).

Das ging flott!

Vor allem, weil gerade Windows ja als das Betriebssystem bekannt war, in dem alles sehr kleinteilig und detalliert zu konfigurieren ist, und das eher mit Rückwärtskompatibiliät und Featuritis zu bestechen versuchte. Gerade hier jetzt eine komplette Kehrtwendung zur extremen Einfachheit und großzügigen, flächigen Gestaltung! Auf jeden Fall mutig, und zumindest theoretisch ein logischer Schritt.

Es ist das Zugeständnis, dass noch mehr kleine Icons in noch mehr Symbolleisten und Settings-Popus nicht die Richtung darstellen, in die der Massenmarkt unterwegs ist. Ganz blöd sind sie ja nicht: Auch Microsoft weiß, dass nur wenige Prozent der Funktionen in Word von den meisten Nutzern verwendet werden. Und sie haben auch begriffen, dass die allermeisten User nicht viel mit dem Rechner anstellen außer Web, E-Mail, Games und Fotos. Letztlich zeigt der galaktische Erfolg des iPads endgültig, dass verminderte Komplexität eventuell eher zum Erfolg führt als noch stärkere Konfigurierbarkeit.

Wenn ich mir die Demo-Videos so anschaue, könnte der klassische Desktopmodus in Windows 8 einen ähnlichen Stellenwert bekommen wie aktuell das Terminal unter UNIX-ähnlichen OSen: Ein paar Prozent der Profis und engagierten Amateure werden das nutzen (und auch zum Überleben brauchen). Aber die 90% der Privatanwender werden Metro vielleicht nie verlassen. (Und auf Tablets mit ARM-Chipsatz wird es ausschließlich Metro geben, habe ich gehört. Stimmt doch, oder?)

Ich habe mich immer gefragt, ob man Word und Excel in vollem Umfang überhaupt konzeptionell in Metro bauen könnte. Und wieviel dann noch vom Metro-Look übrigbleibt. Vielleicht plant Microsoft das aber auch gar nicht, sondern bietet Light-Versionen von Office-Programmen in Metro-Technologie (sprich: Webstandards) an, die (natürlich voll kompatibel zum .docx-Format) nur die 10% der Funktionen bieten, die man wirklich braucht. Google Docs soll ja auch ganz gut auf Webbasis funktionieren …

Microsoft setzt also alles auf die Metro-Karte und damit auf die Reduzierung von Komplexität. Doch wie weit kommt man mit Metro, und wie fühlt es sich an? Genügt es tatsächlich den Ansprüchen an ein Windows-OS, und werden die Leute auf einmal anfangen, die ganzen Touch-Gesten und Maus-Gesten zu lernen? Jetzt wo gerade ein Gros der Bevölkerung (und eben auch Oma und Opa!) gelernt hat, wie das mit den Icons und dem Doppelklick funktioniert? Eine solche Agilität und Radikalität hätte man eigentlich kaum von Microsoft erwartet und macht die Firma deutlich sympathischer.

Eine Sache, die mir aber doch komisch vorkommt, ist das etwas unscharf zu beschreibende Fisher-Price-Gefühl, wenn ich mit dem kleinen Mauszeiger auf diese riesigen Tiles klicke, dann die großzügigst gesetzten Menüpunkte anklicke und so weiter. Man ist von Windows die Kleinteiligkeit und Präzision so gewohnt (bzw. war stolz darauf, soviel Infos auf einem Blick im Griff zu haben), dass es jetzt schon fast archaisch wirkt, nur diese gigantischen Bauklötzchen grobmotorisch klicken zu müssen. Und dass das Scrollrad im Startscreen zum horizontalen Scrollen verwendet wird – naja. Ich hoffe mal nicht, dass das jetzt zu einem neuen Trend im Webdesign wird. Der Horizontalscroller ist nicht gerade das, was ich tagein, tagaus befürworte.

Fazit: Ich find’s toll, dass experimentiert wird und werde das mit Interesse und wenig Häme in Zukunft beobachten und probieren. Was denkt Ihr zu diesem Thema? Wollt ihr den klassischen Desktop wieder mehr im Fokus, oder habt Ihr Bock auf was radikal neues und werdet versuchen, möglichst viel in Metro zu machen?

Windows 8 als Test-ISO (kostenlos und offiziell)

to facebook or not to facebook …

2012-02-22T21:16:19Z

… das ist hier die Frage!

Derzeit kommt in meinem erweiterten Kundenkreis am laufenden Meter die Frage auf, ob man denn jetzt als Unternehmen bei Facebook sein müsse, und wie ich da behilflich sein könne. Man höre ja soviel, dass das total viel bringen würde, und man wolle doch nicht zu spät sein, der Zug solle nicht ohne sie abfahren. Etc.

Ich komme dann immer in Bedrängnis; Auf der einen Seite beherrsche ich natürlich die Kenntnisse, um Firmen technisch unfallfrei zu einer Facebook-Präsenz zu verhelfen. Doch abgesehen von der technischen Machbarkeit stellen sich bei einer solchen Situation immer weitere Fragen, die erst einmal geklärt werden müssen (was den Fragenden meist gar nicht klar ist):

Wie definiert man eine Facebook-Präsenz? Was soll dort passieren? Welche Leute möchte man dort erreichen und was will man tun?
Wer kümmert sich um die laufenden Facebook-Aktivitäten?
Und nicht zuletzt: Brauchen wir dafür überhaupt professionelle Unterstützung, oder sollte man das nicht lieber selber übernehmen, alleine der Authentizität wegen?

Fakt ist: Ich mache keine Social-Media-Beratung. Wer also von mir einen professionellen Rat möchte, wie er das Thema Facebook angehen sollte, bekommt keinen. Ich teile höchstens meine private Meinung mit, und die ist so:

Wenn ein Unternehmen nicht zumindest ein paar Ideen hat, was es auf Facebook machen könnte, sollte es lieber draußen bleiben.

Anders herum formuliert: Wenn ich einen konkreten inhaltlichen und konzeptionellen Plan vorgelegt bekomme, was gemacht werden soll, bin ich zu allen Schandtaten bereit. Design, Umsetzung, API-Apps, eingebundene iFrame-Websites-Konstrukte – alles kein Problem! Ich fummel mich gerne zurecht.

Sollte ich aber um inhaltlichen oder konzeptionellen Rat gefragt werden, würde ich meine Beratungstätigkeit immer auf die klassische Website beschränken. Da kenne ich mich aus, an das Medium glaube ich. Social Networks kommen und gehen, die Fans- und Followermechaniken ändern sich, die Methoden der Aktivätsanregung und -messung ebenfalls. Aber das ist alles reines Marketing, und sehr flüchtiges noch dazu. Da spiele ich gerne als Techniker mit, kann mich in diesem Rahmen auch durchaus begeistern, aber stehe doch nicht wirklich dahinter.

Der offen zugänglichen Website, mediengerecht und unabhängig, gehört sowohl Vergangenheit als auch Zukunft im Web. Derzeit scheint sich zwar für manche Branchen die Einrichtung einer individuellen »Homepage« nicht zu lohnen. Gerade junge Kneipen und Cafés sind mit einer gut aufgebauten und engagiert gepflegten Facebook-Seite tatsächlich besser beraten. Aber ich verwette meinen Popo darauf, dass hier die Unternehmer von sich aus das Konzept und die Umsetzung betreuen, oft sogar höchstpersönlich.

Denn wenn es einen Rat gibt, den ich trotz meiner Eigenschaft als Social-Media-Berater-Kritiker geben kann, dann diesen:

Nur wenn die Begeisterung eines Unternehmers für Social Media real und authentisch ist, kann es zum Erfolg führen.

Und in diesem Falle brauchen die Unternehmen auch keine großartige Hilfe. Denn eine Facebook-Präsenz einrichten, bitteschön, das kann jeder, der es wirklich möchte, auch ohne professionelle Hilfe. Falls nicht, sollte sie oder er sich das nochmal überlegen. Und wenn es um komplexere, nicht-standardisierte Facebook-Apps geht, mich gerne anrufen. Aber vorher – richtig – ein Konzept in der Tasche haben! Danke.

Die intransparente Transparenz der USFB-Blitztabelle

2012-02-02T23:03:30Z

Designmäßig zwar Off-Topic, aber aus medienkritischer Sicht trotzdem passend hier im Blog: Ich frage mich, wie authentisch die Livetabelle bei der Castingshow »Unser Star für Baku« tatsächlich ist. Und das aus mehreren Gründen:

Da ich eine Zeitlang fürs Fernsehen gearbeitet habe, weiß ich, dass man dort nichts gerne dem Zufall überlässt und überall betrügt, wo man kann und darf.
Die letzten Minuten und Sekunden der USFB-Abstimmungen sind mir eine ganze Spur zu spannend und zu gut getimed. Soviel Glück, so oft hintereinander? Wie realistisch ist das?
Die Tabelle hat sich die ganze Show über relativ gleichmäßig immer wieder bewegt, wo man normalerweise erwarten würde, dass sie sich spätestens nach Ende des letzten Gesangs-Acts stabilisiert.

Wenn ich lange Autobahnfahrten absolvieren muss, beobachte ich gerne die Durchschnittsgeschwindigkeit im Bordcomputer. Da tut sich nach eine Stunde nicht mehr viel. Und wenn man dann ein paar Minuten lang mal Stop & Go fahren muss, dauert es erstaunlich lange, bis man beispielsweise die 100 km/h Durchschnitt wiederunterschreitet. Rein gefühlsmäßig: Die Votings müssten sich schneller auf ein stabiles Level einpendeln, und davon nicht mal so eben ruckartig abzurücken sein.

Nun kann man Mutmaßungen anstellen:

Eventuell werden gar nicht alle Stimmen seit Votingbeginn komplett kumuliert?
Eventuell werden ja nur die letzten 5 Minuten oder 30 Sekunden als Basis herangezogen? Oder eine unbestimmte Zeitspanne, abhängig vom aktuell vorherrschenden Grundrauschen an Stimmen? Eventuell immer die letzten 1000 Stimmen?
Eventuell auch eine Mischkalkulation aus echten Stimmen und gewissen dramaturgischen »Dehnungen«. Zeit soll ja relativ sein… (Das Endergebnis kann dann ja ruhig vom ESC-Notar überprüft werden, aber die Zwischenwerte lassen sich locker ein wenig spannender in Szene setzen als sie tatsächlich sind.)
Oder aber – und das wäre eine sympathische Theorie – die Anzahl der Anrufer steigt immer dann extrem an, wenn die Tabelle sich zu stabilisieren droht (weil Fans der unterlegenen Künstler vermehrt gegensteuern wollen), und steigt insgesamt im Laufe des Abends linear an (um die bisherige Kumulation zu übertreffen), und wird gegen Ende des Votings tatsächlich exponentiell, und ist damit auch nach drei Stunden ständigen Addierens noch in der Lage, die Stabilität der Tabelle aufzubrechen.

Diese Tabelle! Ein interessantes, fast lebendiges Objekt. Der eigentliche Star der Sendung. (Man sollte die Blitztabelle nach Baku schicken, um dort aufzutreten. Als Band könnten Die Märkte fungieren.)

Ich meine: Wenn man schon auf maximale Voting-Transparenz setzt (was ich begrüße!), sollte man noch deutlicher erklären, wie es zu den ungewöhnlich spannenden Instabilitäten – gerade gegen Ende der Show – kommt. Eventuell sollte man die Entwicklung der Gesamtanruferzahlen auf einem Zeitstrahl abbilden. Keiner erwartet absolute Zahlen. Aber viele erwarten eine Erklärung für die wiederholte dramaturgische Punktlandung: Einfach nur gutes Konzept und ein bisschen Glück? Oder wird nachgeholfen?

(Statistiker und Spieltheoretiker würden – wenn sie irgendwann mal die Rohdaten der Votings bekämen – in Freudentränen ausbrechen. Sie könnten dann riesige selbstregulierende Systeme in Reinkultur analysieren, die relative Annäherung der Gesamtstimmen zum Ende einer festgelegten Zeitfrist. Spannender Stoff!)

E-Books – prima selbstgemacht!

2012-02-02T11:00:46Z

Auf Hypes muss man aufspringen, solange sie heiß sind. Also schreibe ich ein paar Erkenntnisse aus der E-Book-Forschung auf, die ich in den letzten Wochen zusammengesammelt habe. Dieses Stück ist gleichzeitig eine Art Gedächtnisprotokoll meines Mini-Vortrages auf dem letzten Webmontag, mit einigen Umstrukturierungen, Fehlerkorrekturen und Ergänzungen.

Am Anfang jedweder Überlegung steht selbstredend der Wunsch, ein eigenes E-Book zu veröffentlichen. Dazu muss dieses fachgerecht hergestellt werden, und damit beginnen schon die Probleme! Denn natürlich haben wir hohe Ansprüche an die gestalterische, technische und mediengerechte Umsetzung unseres Werkes. Es bringt also enorm viel, erst einmal zu überlegen, welche Art von E-Book wir überhaupt machen, und auf welchen Plattformen wir es in die Welt tragen wollen.

Das PDF-Format

Da wäre erst einmal das gute, alte PDF. Dieses lässt sich seit einem guten Jahrzehnt problemlos herstellen und auf beliebigem Wege vertreiben. Tageszeitungen und Printmagazine haben sich irgendwann geeinigt, ihre PDF-Ausgaben als E-Paper zu bezeichnen und grotesk überteuert über ihre Websites zu vertreiben. Manche Fachbuchverlage bieten ebenfalls PDF-Versionen Ihrer Werke an, die sie per Gutscheincode ihren Printkäufern zum Download anbieten. Kurz gefasst: Das PDF ist die direkteste digitale Umsetzung eines Print-Erzeugnisses. (Es gibt in der Tat einige Ausnahmen. Aber PDF-Magazine, die für die Bildschirmdarstellung optimiert wurden, haben sich nie so recht durchgesetzt. Und wurden trotzdem oftmals einfach ausgedruckt.)

PDFs sind starr und unflexibel, das Layout pro Seite in allen Parametern festgebacken. Die einzige Anpassung an unterschiedliche Bildschirme besteht in der plumpen Skalierung der gesamten Seite auf die jeweils gewünschte Größe. Zwar können fast alle Endgeräte und E-Book-Readerprogramme PDFs anzeigen, doch wie viel Spaß so eine Gala oder c’t auf dem verhältnismäßig winzigen Graustufen-Display des Kindle macht, kann man sich denken. Ob man PDF überhaupt als E-Book-Format bezeichnen kann, ist fraglich. Im Volksmund geschieht dies aber, deswegen. Und der Vollständigkeit halber.

PDFs herstellen

PDFs lassen sich grundsätzlich in jedem beliebigen Textverarbeitungs- oder Layout-Programm zusammenstellen und exportieren. Der Design-Profi greift hier natürlich zu Adobe InDesign, der clevere Amateur kann es mit Apple Pages oder dem neuen iBooks Author versuchen, stressresistente Büroarbeiter starten instinktiv MS Word oder OpenOffice, bevor sie entnervt aufgeben (oder den Schrott zu Ende führen). Informatiker sowie Hierarchiefans und religiöse WYSIWYG-Gegner sind dagegen happy mit LaTeX. Bevor es ans Layouten geht, sollte man jedoch auf jeden Fall die Gretchenfrage stellen: Sag, Nutzer, wie hältst du’s mit dem Ausdrucken? Screenoptimierte PDFs können im Querformat (16:9) und mit höherem Schriftgrad deutliche Erleichterungen für den umweltbewussten Digitalfan mit sich bringen. Der Traditionalist druckt PDFs jedoch reflexartig aus – hier ist dann kleinere Schrift und DIN A4 im Hochformat die richtige Wahl.

Das ePUB-Format

In einer perfekten Welt hat ePUB schon gewonnen. Es ist das offizielle, vom IDPF standardisierte und von allen Parteien respektierte Dateiformat für richtige E-Books, also die Dinger ohne fixes Seitenlayout (wie beim PDF) und ohne native Programmierung (wie bei Apps). Statt dessen ist ePUB offen, kann schick per Hand analysiert, und genauso schick per Hand hergestellt werden. Es lassen sich sogar proprietäre DRM-Maßnahmen draufstöpseln, wenn man das als Verlag unbedingt will. Alles super also!

Wäre da nicht das Problem, dass die weltweit populärste E-Book-Plattform, namentlich Amazon Kindle, ePUB eben nicht unterstützt! Fast paradox: Selbst Apples iBooks und der dazugehörige Store (auf iPhone und iPad) arbeiten seit Jahr und Tag mit ePUB-Büchern, die ganzen kleineren, alternativen E-Book-Shops ebenfalls, und jeder neue Marktteilnehmer täte gut daran, sich voll auf ePUB einzuschießen: Bücher im diesem Format lassen sich sowohl semantisch strukturieren (Syntax ist identisch mit HTML), als auch visuell ansprechend gestalten (per CSS-Anweisungen). Im Grunde sind ePUBs also Websites mit ein paar Extra-Informationen zu Titelbild, Inhaltsverzeichnis und anderem Buchkram.

Wie ein ePUB beim Leser letztlich dargestellt wird, hängt allerdings stark von der verwendeten Leseumgebung ab: Ein kleiner E-Ink-Reader mit Graustufendisplay wird die meisten CSS-Anweisungen schlicht ignorieren und alles so darstellen, wie es für seine Hardware optimal ist (und wie der User es sich konfiguriert hat). Reader mit größeren Farbbildschirmen und mit mehr Speicher und Prozessorpower lassen sich meist stärker auf die vom Autor gesetzten CSS-Regeln ein. Es gilt, wie immer bei der Gestaltung von flexiblen Layouts: Der Autor kann gut gemeinte Gestaltungsvorschläge machen – aber das Endgerät muss sich nicht daran halten!

ePUBs herstellen

So ein ePUB ist – wie oben schon angedeutet – nichts weiter als eine Reihe von regulären HTML-Dateien (grob: für jedes Kapitel eine Datei), dazu eine CSS-Datei, und zur Garnierung einige wenige XML-Dateien, die das Inhaltsverzeichnis und ein paar Meta-Informationen enthalten. Zur Krönung eine Grafik als Buchcover dazu – wunderbar. Der Ordner mit dem ganzen Kram wird dann gezippt (aber nicht mit dem eingebauten ZIP-Tool des Betriebssystemes!), und die .zip-Datei in .epub umbenannt, fertig ist die Laube. (Diese Erläuterung war nur um ca. 15 Prozent vereinfacht. Den gesamten Prozess sollten Sie unbedingt in diesem vollständigen Tutorial zur ePUB-Erstellung nachvollziehen.)

Die neueste Inkarnation von ePUB, Version 3, basiert konsequenterweise auf den aktuellen Webstandards HTML5 und CSS3. Auch hier gilt natürlich: Es gibt keine Garantie, dass propagierte Features auch wirklich funktionieren – das können die unterschiedlichen Reader schon rein hardwaretechnisch nicht leisten. Aber HTML und CSS sind ja seit Jahren Weltmeister im Fallback – dies sollte also nicht das Problem sein. Ein richtig ordentliches ePUB bedeutet demnach Handarbeit im Code-Editor, denn zuverlässige Programme zur sauberen WYSIWYGigen Erstellung sind Mangelware. Zwar gibt es sowas wie einen ePUB-Export in Apple Pages, und sicher auch das eine oder andere Word- oder InDesign-Plugin. Doch die taugen genauso viel wie der jeweilige HTML-Export dieser Programme: nichts. Wer es ernst meint, schreibt seine ePUBs in purem HTML, oder beauftragt einen Webstandards-erfahrenen Dienstleister seiner Wahl.

Das MOBI/KF8-Format

Auch wenn es an allen Ecken und Enden Gerüchte über eine Verbesserung der Situation gibt: Derzeit wird auf der populärsten E-Book-Plattform das ePUB-Format nicht unterstützt. Um ein E-Book auf den Kindle zu bringen, muss man entweder das MOBI-Format (ehemals Mobipocket) oder das KF8-Format (Kindle-Format 8) zu bieten haben. Am besten beide: Ältere Kindles können nämlich noch kein KF8 darstellen, das Nachfolgeformat von MOBI.

Das Witzige daran ist eigentlich, dass sich beide Formate von der Funktionalität her nicht wesentlich von ePUB unterscheiden. Sie leisten die gleichen Dinge, KF8 beruft sich ebenfalls auf CSS3, und so weiter. Allein: Das Reingucken in ein Kindle-E-Book ist eben nicht so einfach, weil es sich nicht um eine gezippte Dateisammlung handelt, sondern um eine binär kompilierte, proprietäre Software.

Technisch gibt es dafür freilich keinen echten Grund, wohl aber unternehmenspolitisch. Dies zu diskutieren ist aber müßig, und für diesen Artikel nicht angemessen. Von daher akzeptieren wir einfach, dass wir

a) die Kindle-Plattform auf jeden Fall bedienen müssen und wollen, weil sie weltweit und inzwischen wohl auch in Deutschland die verbreitetste Plattform ist.

b) dafür eine weitere Version unseres E-Books herstellen müssen.

MOBI/KF8-Dateien herstellen

Klingt alles schlimmer als es ist, denn Amazon greift einem unter die Arme, was die Erstellung von E-Books im MOBI/KF8-Format angeht. Es gibt einen kostenlosen Kindle-Simulator, ein dickes Kompendium (was niemand lesen will), und einen kommandozeilenbasierten Generator namens KindleGen. Dieser wird gefüttert mit – wait for it! – ePUB-Dateien. Überrascht? Nun, hier schließt sich der Kreis: Kindle-E-Books können als kompilierte ePUBs angesehen werden, und je besser und sauberer mein ePUB umgesetzt ist, desto besser und sauberer ist am Ende auch mein Kindle-E-Book.

Wer sich den Stress mit der Kommandozeile nicht geben möchte, kann auch einen bequemen Online-Converter verwenden (Qualität jedoch nicht getestet). Und für eine genaue Schritt-für-Schritt-Anleitung gibt es abermals ein hervorragendes Tutorial für die Kindle-E-Book-Erstellung.

update: Man kann für noch besser auf Kindle angepasste Bücher ein paar spezielle Funktionalitäten einsetzen, die es so im reinen ePUB nicht gibt. Alles Wissenswertes dazu hat Vlad hier detailliert aufgeschrieben

Hätten wir dann alles? Nun, nicht ganz:

Das .ibooks-Format

Vor ein paar Tagen hat Apple mit einer Produktpräsentation für Aufruhr gesorgt, wo eigentlich gar kein Aufruhr angebracht ist. Es handelt sich um das (nicht ganz taufrische) Konzept von Multimedia-Textbooks (Textbook = amerikanisches Highschool-Lehrbuch mit Text, Illustrationen, Tabellen und Grafiken, sowie unterschiedlichen redaktionellen Ebenen). Diese sollen ab sofort gefälligst auf dem iPad konsumiert werden, allerlei bunte Glasperlen in Form von Videos und interaktivem Schnickschnack enthalten, und kommen im neuen Dateiformat .ibooks daher, welches in Zukunft parallel zu .epub im iBooks Store unterstützt wird. Und weil Apple gründlich ist, liefert die Firma auch gleich das dazugehörige Erstellungsprogramm mit: iBooks Author.

Ein Teil des Aufruhrs rührt daher, dass das .ibooks-Format auf der einen Seite von Apple als ihre proprietäre Entwicklung kommuniziert wird, auf der technischen Seite aber einem .epub zum Verwechseln ähnlich sieht. Man kann es aufmachen, sich angucken und darin stöbern, wie alles umgesetzt ist. Und kommt dann allerdings zu der Erkenntnis, dass die technische Basis zwar tatsächlich ePUB ist, jedoch derart umgebogen und ohne Rücksicht auf den aktuellen Stand der Webstandards um diverse eigene webkit-Funktionen erweitert, dass ein .ibook nirgendwo anders sinnvoll angezeigt werden kann als eben auf dem iPad.

Um das klarzustellen: Apple behauptet nicht, ePUB zu verwenden. Sie tun es auch nicht. Die Ähnlichkeiten mit dem ePUB-Standard sind eher pragmatischer Natur, und man sollte sich nicht darauf verlassen. Und dies ist das Traurige an der Geschichte: Mit iBooks Author hätte der engagierte E-Book-Verfasser endlich ein halbwegs rundes WYSIWYG-Werkzeug an der Hand, um coole (oder auch normale) E-Books im ePUB-Format zu erstellen. Doch was iBooks Author am Ende ausspuckt, ist ein reines Apple-Format, welches nur auf dem iPad nutzbar ist, und welches zusätzlich juristisch geschützt ist: Möchte man nämlich Geld für seine .ibooks-Datei verlangen, muss man sie ganz offiziell im iBooks Store anbieten, mit 30 % Umsatzbeteiligung für Apple. Verschenkt man hingegen sein »Textbook«, kann man das auf beliebigem Wege tun.

~~Nicht ganz eindeutig geklärt ist die Frage, ob diese Nutzungseinschränkung auch für PDFs gilt.~~ (update 4.2.2012: PDFs sind okay) Denn iBooks Author besitzt einen simplen PDF-Export. Damit lassen sich natürlich nicht die ganzen Multimedia-Spielereien erhalten (Obwohl PDF erstaunliche Multimedia-Fähigkeiten besitzt, doch das ist ein Thema für sich); Aber warum sollte man nicht die nutzerfreundlichen Layoutfunktionen von iBooks Author missbrauchen, um schlicht und ergreifend ansprechende PDFs zu gestalten? Ich persönlich glaube nicht, dass Apple dies aktiv verhindern möchte. Sie wollen die »nativen Textbooks« schützen und im eigenen Ökosystem behalten. Das ja. Aber PDFs sind eine andere Schiene und lassen sich ja zur Not auch mit Pages, Keynote oder anderen kostengünstigen Programmen erstellen. (Aber dies ist keine Rechtsberatung. ~~Abgesehen davon wird sich das mit Sicherheit klären in den nächsten Tagen.~~)

Fazit

Bleibt die kaum überraschende Erkenntnis, dass sich angehende E-Book-Autoren am Anfang einige konzeptionelle Fragen stellen müssen:

Soll das Buch gedruckt oder am Bildschirm gelesen werden?
Ist mein Buch sehr Layout-lastig und benötigt eine gute und unverfälschte Darstellung von Illustrationen?
Oder habe ich viel Prosa und nur ganz vereinzelt mal eine grafische Abbildung?
Lege ich Wert auf eine maximale Verbreitung auf möglichst vielen Plattformen, oder reichen mir einzelne Plattformen, damit ich bessere Kontrolle über die Darstellung habe?
Will ich das Buch verschenken oder verkaufen?

Ich hoffe, dass der geneigte Autor nach Beantwortung dieser Fragen hier im Text die richtigen nächsten Schritte für sein E-Book-Projekt gefunden hat. Feedback, Fehlerkorrekturen und Ergänzungen bitte per Mail oder Kommentar, dann machen wir diesen Text zu einem Living Document. (So Dinge, die mit klassischen E-Books nicht so richtig gut funktionieren.)

Weitere Links

Webdesigner Johnathan Snook über seine Erfahrung beim Bauen eines E-Books

Wochenlinks

2012-01-30T00:00:00Z

Netzfundstücke vom 23.01. bis zum 30.01.:

videojs: New @zencoderinc blog post with practical advice on iOS encoding: Encoding Settings for Perfect iPad/iPhone Video http://t.co/O8vq45Sb #ios
(vor 5 Tagen)

Von früher erzählt: Podcasting

2012-01-24T08:38:29Z

Beim medientheoretischen Podcast Stimmen der Kulturwissenschaften war ich neulich zu Gast und erzähle aus den Anfangstagen des Podcasting. Bisserl Technik, bisserl Kultur – eine entspannte gute halbe Stunde zum Hören. Viel Spaß!

Coworking Würzburg wird 1 – Einladung zum Jubiläums-Webmontag

2012-01-19T08:32:05Z

Herzliche Einladung zum Jubiläum!

Seit Ende Januar 2011 werden in den Räumlichkeiten der Frankenhalle (Veitshöchheimer Straße 14) moderne Arbeitsformen gelebt: Vor einem Jahr öffnete der erste Coworking Space in Würzburg seine Pforten und bietet seitdem interessierten Medienschaffenden einen spannenden Arbeitsplatz sowie einen beliebten Treffpunkt für den informellen Austausch. Mehrmals im Monat finden außerdem Branchentreffs und Fortbildungsveranstaltungen der (unter)fränkischen Medienszene statt. Übersicht der vergangenen Events: http://www.coworking-wuerzburg.de/termine/vergangenes

Das einjährige Jubiläum von »CoWoWue« muss gefeiert werden, und das wollen wir mit dem 12. Webmontag tun – einer konstant populären Veranstaltung, die natürlich seit geraumer Zeit in den Coworking-Räumen stattfindet. Beim Webmontag gibt es interessante und stets praxisnahe Kurzvorträge, meist aus den Bereichen Social Media, Informatik, Medienproduktion und Journalismus. Wir laden Sie ein, mit dabei zu sein:

12. Webmontag & Coworking-Jubiläum
am 23. Januar 2012, ab 19.00 Uhr
Veitshöchheimer Straße 14

(Optionale) Anmeldung auf folgenden Websites:

Wir freuen uns auf Ihr Kommen!

Mein Kindle 4 im Testbericht

2012-01-08T17:20:56Z

Im Grunde kann niemand einen wirklich ausführlichen Praxistest eines E-Book-Readers schreiben, wenn die Autorin oder der Autor nicht mindestens einen mittellangen Roman oder ein prosalastiges Sachbuch unter realistischen Bedingungen damit gelesen hat.

Von daher kommen hier, etwas später als anderswo, meine Erfahrungen mit dem Kindle 4 (auch 99-Euro-Kindle genannt). Gleich vorweg: Ich mag das Ding, wenn es auch viele Schwächen hat.

Die Hardware ist vor allem eins: angenehm leicht. Bei kaum einem elektronischen Gerät ist mir das Gewicht wirklich wichtig. Ich bin meist eher der Vertreter der »Gewicht steht für Qualität«-Fraktion. Doch bei E-Book-Readern muss man einfach eine Ausnahme machen. Hier ist geringes Gewicht Trumpf! Man kann den Kindle locker zwischen zwei Fingern oder in einer Hand halten; auch den Screen zu betatschen ist für das Erreichen einer angenehmen Lesehaltung nicht Tabu (es ist ja kein Touchscreen!), so dass man sich nach ein paar Stunden Lesezeit seine drei oder vier Lieblingspositionen zurechtgelegt hat, die man dann unbewusst durchwechselt. Ist ja beim Taschenbuch nicht anders.

Überhaupt Taschenbuch! Das Kindle-Leseerlebnis ist eher ein Ersatz für das Taschenbuch statt für das Hardcover. Die Kindle-Hardware wirkt etwas billig (aber nicht schäbig), das Format und das Gewicht sind handlich und praktisch. Die Umblättertasten sind zunächst gewöhnungsbedürftig, weil sie untereinander angeordnet sind, und zwar sowohl links als auch rechts. Normalerweise würde man denken, dass links zurück, und rechts weiter platziert wäre, doch dem ist nicht so. Die Verarbeitung der Blättertasten ist so lala und könnte sich definitiv hochwertiger anfühlen. Doch immerhin ist das Klickgeräusch angenehm leise und weckt schlummernde Zweitpersonen nicht auf. Seltsam ist, dass man die Tasten aus einem bestimmten 45-Grad-ähnlichen Winkel drücken muss, damit sie reagieren. Man denkt bald nicht mehr drüber nach, aber komplett intuitiv ist das zunächst nicht.

Die Software-Ergonomie in der Menüführung und beim Stöbern ist ganz allgemein nicht komplett perfekt durchdacht. Als Apple-User fühle ich mich da schon ein wenig unwohl. Gleichzeitig bewegt man sich ja nur einen Bruchteil der gesamten Nutzzeit in den Menüs, und letztlich kommt man schon irgendwie zurecht. Alles, was mit Texteingabe zu tun hat (WLAN-Passwort, Anmerkungen, Shop-Suchen) sind naturgemäß eine große Katastrophe, aber das ist der fehlenden Hardwaretastur und/oder dem fehlenden Touchscreen geschuldet. Immerhin ist es überhaupt möglich, mit dem Gerät autark zu agieren (iOS 1-4 konnte das ja nicht!), aber das Einkaufen ist definitiv bequemer, wenn man es auf dem heimischen Rechner oder dem iPhone macht.

Kommen wir zu einem der interessantesten Punkte für mein anspruchsvolles Publikum: Die Lesbarkeit. Die ist nicht eindeutig als gut oder schlecht zu bezeichnen, hängt sie doch von mehreren Faktoren ab.

1) Darstellungsqualität. Die entspricht gefühlt einem mittelmäßigen Taschenbuchdruck. Ich habe schon miesere (englische) Taschenbücher gesehen, die katastrophale Verschmierungen und Unregelmäßigkeiten aufwiesen. Hochwertige deutsche Taschenbücher hingegen sind deutlich sauberer bedruckt. Das E-Ink-Display des Kindle ist in den Feinheiten manchmal ein wenig rumpelig, aber nach anfänglichem Eingrooven fallen die Pixel nicht mehr ins Gewicht und man genießt die ruhige und nicht-strahlende, nicht-flackernde Darstellung. Das passt. Der kühle neutrale Grauton des Fonds wirkt für den eingefleischten Papierleser etwas ungewohnt – Taschenbuchpapier hat zumindest auf dem deutschsprachigen Markt üblicherweise eine etwas gelblichere Tönung – aber auch das ist reine Gewöhnungssache und nicht von grundsätzlichem Nachteil. Der Kontrast ist auf jeden Fall angenehm gewählt und bei ausreichender Beleuchtung gut zum Lesen geeignet.

2) Satzqualität. Hier leider keine positiven Nachrichten! Der Kindle versucht sich wie viele andere Lese-Applikationen am (fatalen) silbentrennungslosen Blocksatz, was überhaupt nicht gut geht. Es geht sogar so schlecht, dass bei solchen Zeilen, wo die Löcher zwischen den Wörtern zu groß wären, der Blocksatz für diese eine Zeile ausgesetzt wird. So sehen wir also Seiten, bei denen von insgesamt 26 Zeilen nur 17 Zeilen tatsächlich im Blocksatz stehen. 7 Zeilen sind künstlich verkürzt, weil die Löcher zu groß wären, und 2 Zeilen sind aufgrund von Absatz-Enden kürzer. (siehe Bild)

Dazu kommen hässliche Fehler in den E-Books, wie im obigen Beispiel die doppelten Leerstellen nach Gedankenstrichen, und auch die unschöne Platzierung von Fußnoten. Das sind alles Sachen, die über Software-Updates meines Erachtens relativ leicht behoben werden können. Mittels Silbentrennung ließe sich ein annehmbarer Blocksatz realisieren, und eine Option zum Ein- und Ausschalten des Blocksatzes dürfte eigentlich auch nicht fehlen. Schade, dass auch hier die englische Sprache der einzige Maßstab zu sein scheint; Unsere deutschen Wörter sind halt nunmal länger, lassen sich aber prinzipiell gut automatisch trennen, wenn man denn wirklich wollte!

3) Schriftwahl. Auf dem Kindle findet man nur drei Schriften: Eine moderne, screenoptimierte Serifenschrift ohne Schnörkel, die gleiche Schrift in schmal, und eine helveticaeske Serifenlose. Zum Lesen sind die alle gut geeignet, da gibt es nichts zu meckern. Ein bisschen mehr Auswahl hätte jedoch wohl nicht geschadet. Gerade eine etwas historischer angehauchte Antiqua hätte als zusätzliche Option nicht geschadet.

Fazit

Vor ziemlich genau einem Jahr habe ich auf dem iPad einen kürzeren Roman gelesen, und bin dann an Frank Schätzings »Limit« gescheitert – zu anstrengend der selbstleuchtende Bildschirm und zu schwer und unhandlich zum entspannten Rumlungern. Und natürlich die Akku-Problematik! Der Kindle muss nur alle paar Wochen aufgeladen werden, was den Umgang damit extrem erleichtert. Es ist eine komplett andere Gerätekategorie. Die Auswahl an deutschen E-Books ist ganz okay, wenn auch lange nicht vollständig. Und wenn man – wie ich – so langsam in die englischsprachige Literatur einsteigt, ist es sowieso praktisch: Englische E-Books kosten nämlich oftmals nur ein Bruchteil dessen, was man im deutschen Handel für das entsprechende Taschenbuch ausgeben würde.

Insofern freue ich mich über mein neues, leichtes Lesegerät, mit dem ich aufgrund des Preises nicht allzu sorgsam umgehen muss (Lesen in der Badewanne erfolgreich praktiziert!), und dass sich als treues, unprätentiöses Arbeitspferd erweisen könnte. Und hoffentlich mit ensprechenden Software-Updates auch noch ordentlichen Satz lernt!

Wochenlinks

2012-01-02T00:00:00Z

Netzfundstücke vom 26.12. bis zum 02.01.:

yatil: Austria: IE6 is at 1.85%, Adoption of new Firefox versions is really good, 3.x still used by 20% of Firefox users http://t.co/1201JiOJ
(vor 5 Tagen)

Nur bis Neujahr: Videoworkshops zum halben Preis

2011-12-29T10:26:15Z

Alles lernen, was ich kann: Mit den Undsoversity-Workshops ist das ziemlich gut möglich.

Nun, vielleicht nicht wirklich alles. Aber die Grundlagen des Webdesigns. Angefangen vom Screendesign in Photoshop, über statische HTML/CSS-Seiten, über WordPress und zum Schluss noch Würze mittels jQuery.

Jeden dieser mehrstündigen Videoworkshops kann man nun für lachhafte 14,99 € in der Undsoversity erwerben. Entweder im Webshop, oder als Inn-App-Kauf in der iPhone- oder iPad-App. Viel Spaß beim Lernen!

Wochenlinks

2011-12-26T00:00:00Z

Netzfundstücke vom 19.12. bis zum 26.12.:

Fontblog: Brilliant: Why You Should Invest in the Future of Typography http://t.co/juw1BfR8
(vor 3 Tagen)

Auf ein fantastisches Jahr 2012!

2011-12-23T10:07:31Z

Die zwei Wochen zwischen der willkürlich neu datierten Geburt des weltpopulärsten Wanderpredigers und der Ankunft dieser ominösen arabischen Wissenschaftler verschafft sogar uns nie ruhenden Selbstständigen ein wenig Entspannung, bevor es wieder frisch ans Werk geht.

Eine hervorragende Gelegenheit, Danke zu sagen für all das Vertrauen, das mir auch in 2011 von meinen Kunden, Freunden und der gesamten Netzgemeinde zuteil wurde. Ihr seid die Besten!

Ich verspreche, dass auch das Jahr 2012 nicht minder interessant wird! Das erste Vierteljahr ist auftragsmäßig schon größtenteils gesichert, was großartig ist. Ab dem zweiten Quartal wird es dann eine höchst spannende Veränderung geben, auf die ich eingehe, sobald es soweit ist. In der zweiten Jahreshälfte werde ich dann noch ein wenig sesshafter in meiner Wahlheimat Würzburg. Ich plane im nächsten Jahr darüber hinaus, wieder häufiger an Unkonferenzen teilzunehmen, und vielleicht sogar eine oder zwei Schulungen auf eigene Faust zu organisieren.

Andererseits werde ich auch in 2012 sicherlich kein Fachbuch verfassen und weiterhin keinen Respekt vor dem Status Quo haben. Das solltet Ihr ebenfalls nicht. (Also, die Sache mit dem Respekt zumindest.)

Ich freue mich und sage Danke! Wir sehen uns auf der anderen Seite :-)

Die Großartigkeit der neuen Twitter-Mobile-App für iPhone/iPod/Android

2011-12-16T17:06:19Z

Aus meiner Sicht gibt es eine neue technische Referenz in Sachen »Mobile Web-App«, und die heißt Twitter. Ich hatte ja vor einigen Monaten schon Spiegel Online gelobt für ihre beispielhaft schlanke und gut bedienbare mobile Website. Im Bereich der Web-Applikationen sitzt nun Twitter auf dem Thron. Hier ein paar Gründe und Beobachtungen:

Die App ist pfeilschnell und wirkt ungewöhnlich nativ, zumindest auf dem iPhone 4. Sie besitzt einen Footprint von initial 276 KB mit 23 HTTP-Requests. Zieht man die Avatar-Bildchen ab, sind es nur noch 7(!) Request und 220 KB. Wie kriegt man das so klein und handlich? Nun:

Es gibt nur eine einzige CSS und eine einzige JS-Datei. Beide sind per Code-Optimierer komprimiert und werden natürlich per gzip übertragen.
Das JavaScript ist mutmaßlich ohne großes Framework verfasst und enthält nur die notwendigsten Dinge.
Sämtliche dekorativen Bilder sind in einer einzigen 50 Pixel hohen sprite.png zusammengefasst

Eine entscheidende Frage stellt sich zusätzlich jedem mobilen App-Entwickler: natives oder nachgebautes Scrolling? Und obwohl es ja unter iOS 5 möglich wäre, per position: fixed; die Menüleiste festzukleben und darunter nativ zu scrollen, hat man sich bei Twitter für die nachgebaute Variante, und zwar die mit CSS3 3D-Transforms entschieden. (Auch ohne sichtbare 3D-Effekte sorgt der Einsatz dieser Technik nämlich dafür, dass der Grafikbeschleuniger-Chip des iPhone angesprochen wird, und das Scrolling so weich wird, dass Android nur neidisch sein kann.)

Die zweite entscheidende Frage: Mache ich beim Hinzufügen zum Home-Screen eine »abgeschlossene App« draus, werde dadurch Adressleiste und Footerleiste los und nehme dafür in Kauf, dass Hyperlinks nach draußen einen Sprung zu MobileSafari verursachen, wie in meinem Artikel neulich bemängelt? Twitter hat sich dagegen entschieden: Die Adresszeile wird durch intelligentes Anspringen von ~~Ankern~~ Koordinaten pixelgenau versteckt, und die hässliche hellblaue Fußleiste wird schlicht in Kauf genommen und für Vor- und Zurück-Operationen genutzt.

Visuell entspricht die iOS-Version der Web-App fast 1:1 der nativen Version. Geht man jedoch mit einem anderen User Agent als »iPhone/iPod/Android« auf mobile.twitter.com, erwartet einen eine komplett andere App, die deutlich weniger Bling-Bling mit sich bringt:

Ob diese Fokussierung auf ~~eine bestimmte Plattform~~ die modernen Plattformen das ist, was man unter »One Web« versteht, ist natürlich fragwürdig. Aber lässt man diese idealistischen Überlegungen außen vor, kann man hier viel lernen über Performance und intelligentes mobiles Webdesign. jQuery Mobile ist dagegen eine lahme Schnecke.

Die große Internet-Explorer-Autoupdate-Übertreibung

2011-12-16T15:51:40Z

Microsoft braucht derzeit ganz offensichtlich Streicheleinheiten und holt sich von daher Vorschusslorbeeren der billigsten Sorte ab: Per gewohnt Bullshit-triefender Pressemitteilung wird der Welt mitgeteilt, dass man im neuen Jahr beim Internet Explorer auf automatische Updates setzt, die beim Aktualisieren des Windows-Betriebssystems mitinstalliert werden. Und das für XP, Vista und 7.

Daraus folgern viele Medien nun den raschen Tod von IE6 und IE7. Aber das ist Schwachsinn!

Abgesehen davon, dass ich sowieso bisher davon ausging, dass neue IE-Versionen mit den OS-Updates eingespielt werden (was wohl eine falsche Vermutung war), ist der eigentliche Knackpunkt nämlich die Upgrade-Willigkeit der Kunden. Natürlich kann es keine wirklich »heimlichen« oder »silent« Updates geben, wie vielfach behauptet. Zumindest unter Windows XP müssen Systemupdates immer mit OK oder Passwort bestätigt werden. Und werden auch nur dann ungefragt angeboten, wenn man die Auto-Update-Funktion irgendwann mal aktiviert hat.

Jeder Schwiegersohn (oder Nachbarsjunge) weiß, dass man den Teufel tut, und seine Schwiegermutter (oder Nachbarin) mit Auto-Updates verwirrt! Alle paar Tage poppt irgendeine Meldung auf und verlangt nach Zustimmung zum Update, auf die reflexartig mit einem Anruf mein persönlichen Systemadmin reagiert wird. Und dann geht das Geklicke und Gewarte und Geboote los.

Auf der anderen Seite die immer noch zahlreichen (und oft unbewussten) Windows-XP-Raubkopierer, die ebenfalls seit 5 Jahren keine Update-Prozedur mehr gesehen haben, weil sonst die Aktivierungsfalle zuschlägt.

Es hat sich nichts geändert: Wer sich bisher aus Faulheit, Unwissenheit oder Absicht den Updates verschlossen hat, wird dies auch in Zukunft tun. Wer bisher brav alle Updates aufgespielt hat, ist mutmaßlich bereits mit IE8 (WinXP) oder IE9 (WinVista, Win7) versorgt.

Microsoft hat von daher vor allem eine Weichenstellung für die Zukunft getroffen. Es betrifft in erster Linie WinVista und Win7-Nutzer, die jetzt mit noch größerer Wahrscheinlichkeit etwas schneller die aktuellen IE-Versionen nutzen werden. Das ist unbedingt zu begrüßen!

Ich behaupte aber, dass unter Windows XP alles beim alten bliebt, und die bisherige Sterbegeschwindigkeit von IE6 und IE7 exakt gleich bleibt.

Der einzige Browser, der sich wirklich heimlich updaten kann, ist immer noch Chrome. Er bereitet komplett eigenständig den Delta-Download der neuen Version vor, und beim nächsten Start des Programm hat man – ohne Begrüßungsbildschirm! –, die neue Version am Laufen. Das ist übrigens nur möglich, weil sich Chrome ins User-Verzeichnis statt ins Programme-Verzeichnis installiert. Ein Sicherheitsrisiko? Das vermag ich nicht zu beurteilen. Aber mit der Webdesigner-Brille auf der Nase kann ich das nur als famos bezeichnen!

De-activating CodeSense for CSS in Espresso.app

2011-12-15T09:07:24Z

Auto-completion for CSS drives me nuts! But I do love Espresso as my default code editor. Here’s what I do to get rid of the annoying suggestions:

Find Espresso.app in the Applications folder
Context click -> Show Package Contents
Open Contents > SharedSupport > Sugars
Find CSS.sugar
Context click -> Show Package Contents
Open CodeSenseLibraries -> Delete CSS.xml
Open CodeSenseProviders -> Delete CSS.xml
Restart Espresso.app

That’s it.

Skeuomorphes Gerede bei poly:logo

2011-12-13T20:17:16Z

Neulich habe ich mich mit Markus Schlegel über Trends im UI-Design unterhalten, mit Fokus auf Mobile Interfaces und das Skeuo-Dings. Und weil wir gerade cool drauf waren, haben wir das Gespräch mitgeschnitten und als Podcast veröffentlicht.

Nachzuhören natürlich bei poly:logo, eurem Lieblingspodcast da draußen im World Wide Web!

Erneutes Experiment mit Werbung

2011-12-05T08:47:52Z

Kurze Hausmitteilung: Auf praegnanz.de wird es ab sofort testweise wieder ein bisschen Werbung geben. Der offiziell empfohlene »Nachfolge«-Werbevermarkter für uns ehemalige adnation-Mitglieder ist Mokono. Offen gesprochen: Ich kenne den Laden noch nicht, aber sie machen einen vertrauenswürdigen Eindruck. Und ich vertraue zunächst mal dem Urteil der adnation-Macher.

Ich werde versuchen, das Werbe-Erlebnis so The Deck-mäßig wie möglich zu halten. Das bedeutet:

Nur ein Skyscraper pro Seite, ausschließlich in der linken Seitenspalte
Banner ausschließlich im Weblog- und Essay-Bereich
Keine Banner von Arschlochfirmen
Ständige Evaluierung. Nur bei halbwegs signifikanten Einnahmen (mehr als 30 Euro pro Monat sollten es schon sein…) wird das Experiment fortgeführt.
Keinerlei Einfluss auf den Inhalt meiner Artikel

Ich bin auf die Werbeeinnahmen nicht angewiesen, das macht mich unabhängig. Wenn es mich nervt, hör ich sofort auf. Aber ein kleines Zubrot kann nicht schaden.

Und wen es stört: Einfach AdBlocker einschalten und glücklich sein. Mach ich ja auch so :-)

Knapp zehn Jahre alte CSS-Funktionen, die man jetzt so langsam einsetzen kann, wenn der IE6 keine Rolle spielt

2011-11-30T09:17:53Z

Ein kleiner Reminder an mich selber. Der Internet Explorer 7 kann problemlos folgende Dinge:

Mehrklassenselektoren wie .teaser.long
Nachbarselektoren wie #content .teaser + p
Direkte-Eltern-Selektoren wie #content > p
:first-child
Attribut-Selektoren wie a[rel=lightbox]
PNG24-Bilder mit Alpha-Transparenz
position: fixed; (Aber Vorsicht mit iOS!)
min-height / max-height
:hover auf allen Elementen, nicht nur Links

(Mit recht simplen Hacks kann man auch display: inline-block; verwenden. Mehr dazu in einem Artikel der Mozilla Blogs)

IE7 kann jedoch nicht:

Content-Erzeugung per :before und :after
:last-child oder gar :nth-child, wo kämen wir denn dahin?
display: table-cell; und Co.

Mit Dank an When can I use …

Podcastkonsum, dritte Stufe

2011-11-29T16:36:27Z

Als ich mit dem Podcasthören angefangen habe (Ende 2004), war das ganz schön kompliziert. Man brauchte ein Programm zum Verarbeiten des Feeds und Herunterladen der Audiodateien, zum Beispiel iPodder. Dieses Programm hat die Dateien dann in iTunes überspielt. Und iTunes hat die Audiofiles dann auf den iPod übertragen, wo man sich den Kram angehört hat. (Leute, die Podcasts am stationären Rechner hören, habe ich nie verstanden.)

Mitte 2005 hat dann Apple die Podcasting-Funktionalität direkt in iTunes integriert. Der iPodder wurde unnötig.

Dann passierte lange Jahre nichts. Und die schnell zusammengestückelte Podcasting-Funktionalität von iTunes hat sich seitdem nicht wesentlich verbessert, außer dass man heute meist mit funkelnden iOS-Geräten synchronisiert statt mit ranzigen iPods.

Vorletzte Woche bin ich dann endlich umgestiegen und habe iTunes komplett von der Verwaltung meiner Podcasts entbunden. Ich nutze jetzt mit großer Begeisterung Instacast auf meinem iPhone. Endlich versorgt sich das Gerät, mit dem ich sowieso seit über 3 Jahren ausschließlich meine Podcasts höre, selbstständig mit neuem Hörstoff. So hätte es schon immer sein müssen.

Und das war’s auch schon. Von drei auf eins in nur sechs Jahren …

Hauptsache: Seiten

2011-11-29T08:56:30Z

DER SPIEGEL rettet das Seitenkonzept in die Bildschirm-Ära. Auf Teufel komm raus! Bloß kein neumodisches Scrollkonzept für das klassische Spiegel-Magazin. In der iPad-App mag das noch halbwegs funktionieren, denn hier ist – abgesehen von den beiden Variablen Schriftgrad und Bildschirm-Orientierung – noch halbwegs klar, wie das Konsummedium aussieht.

Nun gibt es den wöchentlich erscheinenden Spiegel als neuartige Web-App für den normalen Desktop-Browser. Er ersetzt damit die PDF-basierte ePaper-Ausgabe. Und das ist auf den ersten Blick eine gute Sache. Niemand hat Spaß beim Lesen eines Print-PDFs am Bildschirm. Der Schritt zu einem HTML-basierten Magazin-Reader ist begrüßenswert!

Doch warum müssen es schon wieder nach unten geschlossene Seitenlayouts zum »Blättern« sein? Abgesehen davon, dass automatisiert berechnete Seitenlayouts nie mit manuell gestalteten Layouts mithalten können, haben wir mit dem Zielmedium »Desktop-Browser« ein extrem ungenaues Medium mit sehr vielen Unbekannten, dass die Aufteilung des Inhalts deutlich erschwert.

Der Spiegel hat sich für eine ~~fixe~~ maximale Breite von 1072px entschieden. Der eigentliche Inhalt ~~nimmt 1026px(!)~~ fließt automatisch im üblicherweise dreipaltigen Textlayout. Und die Höhe? Nun ja, die Höhe. Es gibt ja eigentlich keine fixe Höhe im Webdesign, weil sie extrem unterschiedlich sein kann. Hier wird lustig per Javascript der Text eines Artikels neu umflossen, je nach aktueller Höhe des Browserfensters. Mal besteht ein Artikel aus sieben Einzelseiten, mal nur aus fünf. Manchmal verschwinden auch Infos, wenn der Viewport arg niedrig ist.

Normales Scrolling ist streng untersagt. Sogar das Scrollrad wird per JavaScript gekapert und führt zu horizontalem Umblätter-Scrolling. (Oliver Reichenstein weint sich heute abend sicher in den Schlaf, wenn er diese Medien-Vergewaltigung sieht.)

Es ist ja durchaus ein respektables Bedürfnis, die Website »SPIEGEL ONLINE« vom Magazin »DER SPIEGEL« abgrenzen zu wollen. Aber wenn etwas im Browser stattfindet, will ich doch bitte ein browsergerechtes Erlebnis haben. Und dazu gehört vertikales Scrolling und ein Layout-Konzept, das nach unten offen ist und nicht per angeschraubtem Pseudo-Umblättern krampfhaft die Tote-Baum-Welt zu simulieren versucht.

Damit man mich nicht falsch versteht: Der Spiegel-Reader ist natürlich besser und mediengerechter als reine PDFs oder die unsäglichen Flashpapers. Er performt auch (unter Chrome) sehr gut und ist grundsätzlich gut lesbar. Aber wenn man schon den Schritt zu einer HTML-»Applikation« macht, sollte man auch neu über das Umblättern nachdenken. Diese Sache mit dem Scrollen macht gar nicht so viel Aua wie die Printleute immer denken.

… und hier noch ein Interview mit Spiegel-Chef Blumencron

Zwei Ärgerlichkeiten in iOS-Webapps

2011-11-29T07:59:06Z

Es ist ja wunderbar, dass es unter iOS schon seit Version 1 möglich ist, einfache Websites als Web-Applikation auf dem Homescreen abzulegen. Es handelt sich dabei um mehr als simple Bookmarks, denn beim Klick auf das Icon startet quasi eine dedizierte Browser-Instanz, die wahlweise auch die Adresszeile unterdrückt und somit potenziell wie eine native App wirken kann. Auf den ersten Blick. Frameworks wie Sencha Touch oder jQuery Mobile helfen dem geneigten Webdesigner dabei, amtliche Apps in Windeseile zu entwickeln, die auf Webtechnologien basieren, sich aber an den Paradigmen von nativen mobilen Apps orientieren.

Schön.

Weniger schön sind zwei Details, die ich hiermit anprangere:

1) Umgang mit einfachen Hyperlinks

Apple ist der Meinung, dass eine Web-App eine geschlossene Einheit sein muss, sobald man die Adresszeile über <meta name="apple-mobile-web-app-capable" content="yes" /> ausblendet. Jeglicher normaler Hyperlink ist dann toxisch; Sobald ein User innerhalb der App auf einen Link klickt, bricht die Web-App ab, man gelangt zum normalen MobileSafari-Browser, wo sich dann die gewünschte Website öffnet. Uncool. Der einzige Weg, innerhalb von Webapps zu navigieren, ist also das Nachladen von Daten per Ajax. Normale Seitenwechsel über normale Links brechen das Konzept, was aus meiner Sicht unverständlich ist.

In der von mir gestalteten Kultur-Terminkalender-App sind natürlich Hyperlinks zu den Websites aller Spielstätten enthalten. Aber wehe, man klickt dort tatsächlich drauf! Damit kommen wir zum zweiten Problem:

2) Fehlende Resume-Fähigkeit

Wenn die aktuell laufende Web-App beendet wird, ist sie beendet. Es gibt keinen Freeze-Zustand. Wer die App verlässt, muss sie danach neu starten und manuell zu seiner Unterseite zurückfinden. Extrem ärgerlich für den neugierigen Linkklicker. Er wird bestraft, fliegt aus der App und kommt nicht so leicht wieder zum Ausgangspunkt zurück.

Ich wünsche mir hier Besserung! Warum haben Web-Apps nicht eine eingebaute Webview-Funktion für externe Links, wie sie in fast allen nativen Apps (Twitter-Clients, RSS-Reader usw.) üblich sind? Man begibt sich kurz in das »echte« Web, und kann dann per Back-Button wieder zurück zur Web-App wechseln. Und interne Links sollten einfach per default innerhalb der App verbleiben, damit die Ajax-Laderei nicht mehr verplichtend, sondern nur noch eine Option ist

Und warum kann man nicht zumindest ein paar Megabyte RAM für laufende Web-Apps reservieren, um deren Zustand zu speichern, wenn man sie mal kurz verlassen muss?

Apple, mach mal bitte! Schnell.

Mobile Web- und Appentwicklung – Frameworks im Monstervergleich

2011-11-18T08:40:13Z

Markus Falk hat – in mühevoller Kleinarbeit – eine große Menge von Frameworks zur mobilen Web- und Appentwicklung auf Ihre Features abgeklopft. Herausgekommen ist eine dynamisch filterbare Monstertabelle, die für viele meiner Leser interessant sein dürfte!

(Ich weiß, wieviel Arbeit sowas macht – schließlich habe ich auch schonmal eine Vergleichstabelle gemacht!)

Individuelle Abstände in HTML/CSS: So geht’s!

2011-11-17T16:23:13Z

Damit hätte ich nicht gerechnet! Auf mein lapidares Twitter-Gestöhne, man könne doch nicht <p></p>, <br><br><br> oder     verwenden, um sich Abstände in HTML/CSS-Layouts zurechtzuzimmern, kamen einige ernstgemeinte Rückfragen in Richtung: »Wie sollen wir es denn dann handhaben?« Dafür dieser Artikel.

Zunächst einmal: Der Grund, warum oben genannte Abstandstechniken uncool sind, ist eine Vermischung von Struktur und Styling. Ich packe damit das Styling-Vorhaben »horizontaler Abstand« und »vertikaler Abstand« in den HTML-Code, wo es nicht hingehört. HTML ist für die logisch-hierarchisch-semantische Struktur zuständig, und im CSS kümmert man sich um alles, was visuell zum Styling beiträgt, also auch die Abstände.

Für entsprechende vertikale Abstände nutzt man selbstredend margin und padding, und beschreibt damit die gewünschten Abstände vor und nach bestimmten Headlines und Absätzen. Gerne auch mittels :first-child oder :nth-child() die Abstände zwischen schwerer zu greifenden Konstellationen. Auch der Plus-Selektor (.content ul + p) kann wertvolle Dienste leisten, um dort Abstände zu setzen, wo sie sinnvoll sind.

Doch manchmal ist die Konstellation des Inhalts etwas ungünstig, denn man möchte bisweilen an bestimmten Stellen Abstände haben, wo vielleicht gerade kein besonderes Strukturelement gesetzt ist, der diesen Abstand mit sich bringt. Wenn man also in Gottes Namen ins HTML eingreifen muss, um genau zu definieren, wo denn nun der Abstand hin soll, verwendet man in der Regel das class-Attribut, hängt es an bestehende Elemente (z. B. p oder ul) und denkt sich sinnvolle Klassennamen aus, an die man dann per CSS Abstand zuweist.

Nicht cool sind dabei Klassen wie .large-space-top oder .bottom35, denn dabei handelt es sich um de-facto-Styling-Angaben. Auch diese haben in HTML nichts zu suchen.

Besser wären Klassen wie .teaser, .new-section oder keep-seperated, denn dabei wird ein wenig Semantik deutlich: Man beschreibt mit den Klassen die Funktion, die dieses HTML-Element erfüllt, und kann das im CSS mit den gewünschten Styling-Regeln hübsch machen. Ist mehr Denkarbeit, letztlich aber sinnvoll, denn man bleibt im CSS flexibel und kann statt 35 Pixel auch später mal auf 45 Pixel hochgehen, wenn es besser aussieht. Und im HTML steht dann diese blöde 35er-Klasse nicht fälschlicherweise herum!

In der Horizontalen sieht’s ähnlich aus. Statt:

<div class="timing">17.11.2011  –  19.11.2011</div>

schreiben wir im HTML lieber:

<div class="timing"><span class="from">17.11.2011</span>–<span class="to">19.11.2011</span></div>

Klar, das ist länger. Aber ich habe zwei wunderbare Haken, an denen ich flexibel handhabbare CSS-Regeln festmachen kann, die über padding-right: 20px; oder padding-left: 16px ganz exakt den Abstand der beiden Datumsangaben definieren können.

Also: Scheut nicht die Arbeit! Haltet das HTML sauber und denkt euch ordentliche, bedeutungsschwangere HTML-Klassennamen aus, dann klappt’s auch bei der Code-Übergabe zu einem anderen Frontend-Entwickler.

Flash und Silverlight denken um

2011-11-09T17:21:37Z

Na, Wahnsinn! Jeder dritte Tweet in meiner heutigen Timeline berichtet von Adobes Entscheidung, das Flash-Browserplugin für mobile Plattformen einzumotten, und sich statt dessen stärker auf HTML5 zu konzentrieren. Das Gleiche wird seit geraumer Zeit von Microsofts Silverlight gemunkelt – entsprechende Gerüchte verdichten sich jetzt.

Was ist passiert? Nun, ganz einfach: Offenbar ist es technisch nur extrem schwer machbar, ein hochgradig multimediales und mächtiges Browserplugin für schwachbrüstige ARM-Prozessoren so zu implementieren, dass es wenig Abstürze verursacht, performant läuft und sparsam mit dem Strom umgeht. Auch wenn Flash in Android-Browsern generell funktioniert hat – besonders viel Spaß hatten die Anwender damit nicht.

Doch damit ist Flash und Silverlight noch nicht dem Tode geweiht. Klar, auch auf dem Desktop-Browser werden die entsprechenden Plugins immer unwichtiger werden, bis sie in zwei bis vier Jahren niemanden mehr ernsthaft interessieren. Alle modernen Websites müssen – schon heutzutage, aber in Zukunft noch viel mehr – gut auf mobilen Plattformen funktionieren. Und niemand bastelt zwei Versionen, wenn es eine auch tut, und diese ist natürlich Webstandards-basiert.

Doch warum sollen Flash und Silverlight nicht einfach – außerhalb des Browsers – ein neues Leben beginnen (wenn es nicht schon längst begonnen hat). Silverlight war bereits seit seinem Start als Chimäre geplant und lebte sowohl im Browser als auch als .NET-Windows-Media-Foundation-Dingens-irgendwie. Und mit AIR stellt Adobe seit geraumer Zeit eine unabhängige Runtime für Flash- und Webapps zur Verfügung, die überall lauffähig ist – aber eben als eigene Applikation ohne Webkontext.

Flash wird nun also zum SDK für die Erstellung von Apps (mit wahrscheinlich verpfuschter Möglichkeit zum HTML5-Export). Sowohl für den Desktop-Bereich, als auch (und hier ist das größte Potenzial) für mobile Plattformen, einschließlich iOS. Die Exportmöglichkeit von Flash zu iOS ist bereits da und funktioniert. Mein Bürokollege Michel Wacker macht dieser Tage umfassende Performance-Tests für die Spieleentwicklung. Das ist Realität. Und Flash ist – abgesehen davon, dass es proprietär ist – eine hervorragende, professionelle Entwicklungsumgebung. Man hört nur anerkennende Worte für ActionScript 3, es ist eine ausgereifte Sache. Warum nicht diese Infrastruktur (und die riesige Entwicklergemeinde) nutzen und voll in die Entwicklung von abgeschlossenen Apps einsteigen statt sich den Browser mit halbgaren Plugins und Embedding-Inseln kaputt zu machen? Dort, wo Flash jetzt hingeht, sehe ich es an der richtigen Stelle. (Klar, es droht natürlich, zu einer Art Desktop-Java der nächsten Generation zu werden – aber seien wir ehrlich: Solche Cross-Platform-Bestrebungen wird es immer geben. Das stört mich nicht weiter.)

Und bei Silverlight genau das gleiche: Microsoft sieht Silverlight inzwischen – nach einigem Hin und Her – als eine mögliche Entwicklungsplattform für Win8-Metro und Windows Phone an, wenn ich das richtig verstanden habe. Aber halt als App/Widget, und nicht im Browser. Keine miese Entscheidung, wenn Performance und Stabilität hier besser gewährleistet werden können.

Ein bisschen wehmütig bin ich – ehrlich gesagt – schon, denn natürlich habe auch ich mit Flash als Browserplugin viel Spaß gehabt in den späten Neunzigern und frühen Nullerjahren. Aber diese Zeiten sind aus guten Gründen vorbei – und die Webstandards-Bewegung hat den Kampf um den Browser jetzt mit großer Sicherheit gewonnen! Yea!

Apple und sein Skeuomorphismus

2011-11-07T23:07:26Z

Ja, es hört sich ein wenig so an, als sei Apple krank. Also, die Überschrift. Und nach Meinung vieler UI-Experten hat Apple wohl in der Tat zumindest psychisch ein Gesundheitsproblem – wie sollte man sonst die Sache mit der Lederumschlag- und Notizpapieroptik erklären, die derzeit in immer mehr Apple-Software den UI-Look definiert?

Ich will anhand eine Assoziationskette erläutern, was ich dazu denke. Gehen wir ein paar Schritte zurück. Gestern sah ich eine Folge von »How I met your mother« aus dem Jahre 2005 und habe mich ein wenig geärgert; Ted wird in dieser Epsiode Kunde einer Paarvermittlung, die »Love Solution« heißt. Und weil diese computerbasiert ist, musste wohl auch ein »computermäßiges« Logo her. Dem Ausstattungsdesigner (= Volltrottel) ist leider nichts besseres eingefallen als die uralte Computer-Schrift auszuwählen, die tatsächlich so heißt und schon in den frühen Neunzigern als abgegriffen und klischeehaft galt. Sie wurde 1970 veröffentlicht.

Und damit beginnt das Dilemma: Bis in die späten 80er Jahre hatte man meist eine klare Vorstellung davon, wie die Zukunft aussehen muss: irgendwie technisch, digital und computerig. Das wirkte sich dann auch auf die verwendeten Schriften aus: Alles muss clean, konstruiert, spacig und kühl sein. Eine warme, kuschelige, menschliche und verspielte Zukunft war undenkbar, denn digitale Technik ist nunmal erbarmungslos, was ihre Kühle und Berechenbarkeit angeht – schließlich hat man es mit Einsen und Nullen zu tun, sowie mit viel Mathematik und Logik.

Nun sind wir aber inzwischen an einem Punkt angekommen, wo unsere Wirklichkeit die Science-Fiction von damals eingeholt und in vielen Fällen sogar längst überholt hat. Man vergleiche mal die Steuerterminals der TNG-Enterprise mit unseren heutigen Touchscreens, und sehe sich an, was ein Tricorder ist – nichts weiter als ein Smartphone mit ein paar zusätzlichen Sensoren. Und der Bordcomputer besitzt ja wohl nichts Geringeres als ein Siri-Interface.

Wenn die Zukunft von damals nun im Heute angekommen ist, brauchen wir eigentlich auch eine neue visuelle Vorstellung von der jetzt aktuellen Zukunft, oder nicht?

Es gibt nun zwei Möglichkeiten, diese weiterführende Zukunft zu skizzieren. Entweder man führt die gleiche Richtung fort wie bisher: Man extrapoliert die Entwicklung des UI-Looks der vergangenen Jahre und mischt sie mit den etwas aktuelleren Science-Fiction-Konzepten der vergangenen 10 Jahre (Stichwort Minority Report). Heraus kommt prinzipiell die [Metro-Oberfläche)]. Und – ein klein wenig weiter gedacht – das Microsoft-Zukunftsfilmchen von neulich.

Im Grunde ist das nur logisch. Alles wird noch cleaner, noch kühler, noch technischer und noch virtueller. Hardware verschwindet zusehends und Software wird minimalistischer. Bis nichts mehr übrig ist.

Die Frage ist: Ist ein solch technischer Look notwendig? Muss das wirklich so aussehen? Nein, natürlich nicht. Früher, als die Computer noch langsam und der Speicher knapp war, konnte man nicht anders: Man musste schlicht und reduziert sein, weil jedwede Opulenz die Leistung des Systems beeinträchtigt hätte. Früher. Doch irgendwie scheinen viele Designer – selbst wenn es um tollkühne Zukunftsvisionen geht – auch heute immer noch der Meinung zu sein, alles muss speicherschonend, mit möglichst wenig Vektorpfaden und möglichst wenig Ornament gestaltet sein, damit es auf jeden Fall futuristisch genug aussieht.

Apple hingegen ist dabei, dieses Stadium zu verlassen – wenn auch mit viel hin und her. (Seit dem bonbonbunten Aqua-Look von 2001 ist das »Profi-System« MacOS X wieder deutlich cleaner geworden, seit Lion und iOS 5 wird aber wieder auf die Komplexitätstube gedrückt.) Man denkt dort inzwischen anders über die Anmutung von UIs nach, insbesondere bei Touchgeräten. Ausgangssituation sind mehrere Annahmen:

Hardware und die Software sind unterschiedliche Dinge und haben unterschiedliche Funktionen.
Es gibt keine ernstzunehmenden technischen Grenzen für die Gestaltung von UI. Man kann mit Software prinzipiell alles machen, was möglich ist.
Die Geräte der Post-PC-Ära sind weitaus persönlicher und intimer als es PCs jemals waren.

Aus Punkt 1 wurde folgendes Konzept: Das iPad ist ein leerer Rahmen, der im ausgeschalteten Zustand keinerlei erkennbare Funktion besitzt. Es ist eine Blackbox, eine Magicbox, die alles oder nichts kann. Man weiß es nicht, und deshalb ist es so wichtig, dass das iPad so aussieht wie vom Himmel gefallen: keine Schrauben, kein wechselbarer Akku, keine Aufkleber, möglichst wenig Beschriftung. Ein mysteriöses Aliendevice. Darin deckt sich die Zukunftsvision von Microsoft und Apple – eine Extrapolation des üblichen Science-Fiction-Minimalismus.

In Punkt 2 und 3 jedoch weichen die Konzepte ab. Apple benutzt die Neutralität der Hardware, um die Software umso persönlicher und vertrauter zu gestalten, bekannte Konzepte aus der analogen Welt aufzugreifen, viel Materialien und Texturen zu verwenden. Dadurch wird das kühle, minimalistische Aliendevice zu einem magischen Gerät, was sich mit einem Fingerstreich in ein Filofax, eine Gitarre oder eine Wasserwaage verwandelt. Für den Nutzer läuft dann keine App zum Musikerstellen, sondern das iPad verwandelt sich in eine Gitarre.

Diese Magie funktioniert nur dann, wenn die Hardware ausreichend mysteriös und clean daherkommt, die Software dafür aber umso opulenter und detailverliebter ausgestaltet ist. So kann das Gerät zu einem wahrhaft persönlichen Gerät werden, das man gerne und oft herausholt, um sich damit zu beschäftigen. Es fügt sich einfach besser ins echte Leben eines Nicht-Nerds ein, wenn alles auch ein wenig nach echtem Leben aussieht.

Es geht aber eben auch nicht nur darum, reale Gegenstände nachzubilden. Sondern auch darum, nichtexistente Gegenstände digital so zu kreieren, dass der Nutzer sie als freundlich und natürlich erlebt. Wie die vielbesprochene »Finde meine Freunde«-App, welche in Leder gebunden zu sein scheint, obwohl es natürlich im echten Leben keinen Freundefinder aus Leder gibt.

Apple geht damit über die Star-Trek-UI-Vision von 1988 hinaus. Zugegeben, der UI-Look, der bei TNG gezeigt wurde, war zu damaliger Zeit absolut revolutionär, wie sowieso fast alles an dieser Serie. Aber während Microsofts Metro sich anschickt, eine 1:1-Kopie von Wesley Crushers Pult zu bauen, geht Apple auf die Menschen zu und lässt seine Anwendungen entsprechend menschlich aussehen. Manchmal leider auf Kosten der Effizienz, was die Nutzerführung angeht. Aber mit dem größeren Ziel vor Augen, auch noch den restlichen Leuten die Angst vor dem Computer zu nehmen. Das ist Apple wichtiger als ein paar jammernde Nerds, die lieber nackte Listen sehen, ohne Omas Küchenbrettchen im Hintergrund.

update 14. Dezember: Ich rede mit Markus Schlegel im poly:logo Podcast über das Thema

Wochenlinks

2011-11-07T00:00:00Z

Netzfundstücke vom 31.10. bis zum 07.11.:

jQuery 1.7 Released
jQuery 1.7 is ready for download! You can get the code from the jQuery CDN: http://code.jquery.com/jquery-1.7.js http://code.jquery.com/jqu…

iPhone-Restore aus der Wolke: not there yet.

2011-11-03T08:03:20Z

Nicht ganz so einfach, wie von Apple propagiert, dieses iCloud-Restore. Während der Backup-Vorgang in die Wolke sehr smooth und unsichtbar angeht, kommt es im Ernstfall zu Schwierigkeiten. Hier die Gründe:

Um das iPhone komplett wiederherzustellen, benötigt man vier Dinge:

Aktuelle iOS-Version. Hat das neue Gerät nur iOS4 drauf, muss man zwingend per iTunes aktualisieren. Mit Kabel und so.
iPhone-Einstellungen. Die kommen aus dem Cloud-Backup. Das hat ebenfalls recht gut funktioniert und dauert nur wenige Minuten. Was nicht dabei ist: Passwörter. Diese müssen für alle relevanten Dienste neu eingegeben werden.
Apps vom AppStore. Hier startet iOS auch brav den erneuten Download und zeigt 150 Icons an der korrekten Position. Allerdings alle im »Warten…«-Status. Das Problem: dabei bleibt es auch. Tatsächlich richtig los geht der Download und die Installation, wenn alle Passwörter (siehe 2) korrekt eingetragen sind. Bei mir musste ich noch die beiden GMail-Konten nachtragen. Außerdem darf das Fotoalbum nicht zu groß sein. Und so weiter. Der App-Download geht also erst richtig los, wenn das iPhone wirklich nichts anderes zu tun hat und nicht irgendwie »blockiert« ist.
Musik und Videos. Hier kommt der Inhalt nicht aus der Cloud oder vom AppStore,. sondern (fast immer) vom lokalen iTunes. Und hier gibt es enormes Fehlerpotenzial in der Bedienung. Sehr schnell passiert es nämlich, dass man einen falschen Haken setzt, und das iPhone wird ein weiteres Mal zurückgesetzt. Oder alle Apps sind verschwunden. Oder die Spielstände sind weg. Grundsätzlich hat sich bei mir bewährt: die App-Synchronisation aktiviert lassen, wenn sie vorher auch aktiviert war!

Ich will nicht sagen, dass das nicht alles Bedienfehler sind, wenn es nicht klappt. Aber es ist nunmal um ein Vielfaches komplizierter, wenn man verschiedene Quellen hat, aus denen sich der letztendliche Datenbestand des iPhones zusammensetzt. Ein ISO-Image des iPhone-Inhaltes in der Cloud wäre sinnvoller, aber soweit sind wir wohl noch nicht…

Also: Macht vor dem Übertragen eurer Daten vom alten auf das neue iPhone zusätzlich ein lokales Backup per iTunes – es hilft!

Ich bin der Musikant mit Tonstudio in der Hand

2011-11-01T23:04:50Z

Dass Garageband auf dem iPad schon eine wahnsinnige Aktion war – geschenkt. Seit ein paar Stunden gibt es Garageband auf dem iPhone. Und man kann damit ernsthaft Musik produzieren. Folgende kleine Fingerübung habe ich in nach etwa 60 Minuten Spielerei mit 5 Spuren herauskitzeln können.

Heart (iPhone Version) (mp3)

Das hätte man sich die Pet Shop Boys anno 1986 auch nicht träumen lassen. Dass jemand ihren Song klaut und auf einem zigarettenschachtelgroßen Gerät nachproduziert. Wohlgemerkt: Keine fertigen Loops! Alles per Touch eingespielt und mit dem mitgelieferten Kabel-Headset eingesungen.

Wochenlinks

2011-10-31T00:00:00Z

Netzfundstücke vom 24.10. bis zum 31.10.:

Apple Lossless Audio Codec Now Open Source
Apple: The Apple Lossless Audio Codec project contains the sources for the ALAC encoder and decoder. Also included is an example command…

Wochenlinks

2011-10-24T00:00:00Z

Netzfundstücke vom 17.10. bis zum 24.10.:

chriscoyier: This is a rather clever vertical text block centering technique using pseudo elements: http://t.co/VXmT2pDt (send to be my Michał Czernow)
(vor 7 Tagen)
typefacts: Stephen Coles stellt auf @typographica den neuen Android-4-Frankensteinfont „Roboto“ vor → http://t.co/hIJFIDnf
(vor 10 Tagen)

Gelungen: Das neue Postbank-Online-Banking

2011-10-23T18:53:38Z

Man ist ja wahrlich nicht verwöhnt! Online-Banking war aus softwareästhetischer Sicht lange Zeit eine eher gräusliche Angelegenheit. Man hatte auf Bankseite wohl genug zu tun, die Transaktionen halbwegs sicher und verschlüsselt über die Bühne zu bringen, da blieb auf Frontend-Seite leider nicht viel Zeit für schicke Gestaltung und Umsetzung.

Doch 30 Jahre nach den ersten Telebanking-Schritten über BTX wurde es Zeit, dass Nutzerfreundlichkeit, gutes Design und ordentliche Frontend-Entwicklung Einzug hält. Damit auch Online-Banking-Bereiche sich wie 2011 anfühlen können, bedarf es einer Anhebung des gefühlten Branchen-Standards auf ein Mindestniveau, das wir bei Web-Applikationen der Web 2.0-Welle schon seit einigen Jahren kennen: Übersichtlichkeit, Reduktion, dezente visuelle Effekte zur Verdeutlichung des Userfeedbacks, große Schriften wo sinnvoll. Und das wichtigste: Online-Banking soll sich für den Nutzer, bitteschön, nicht so furchtbar kaputt anfühlen! Das stärkt auch das Vertrauen in die Technik und das Bankinstitut im Allgemeinen.

Die Postbank hat den Bogen seit einigen Wochen raus. Bereits die Anmeldemaske erinnert an eine aufgehübschte Version der Google-Suchmaske:

Und auch die anderen Ansichten … So sinnvoll und nett gestylt, als wär’s ein 2009 gestarteter Web-2.0-Dienst, der gerade seinen ersten Relaunch erhält. Dabei reden wir hier von der Postbank, okay? Deren Online-Banking war zugegebenermaßen immer schon etwas Besonderes, nämlich seit geraumer Zeit weitestgehend barrierefrei umgesetzt, doch diese neue Nummer ist meines Erachtens noch interessanter: Typografische Elemente sind auf ein nötiges Minimum reduziert und sinnvoll in Szene gesetzt, Formulare sind übersichtlich, angemessen ajaxfiziert, sowie mit eleganten CSS3-Übergangen sanft animiert. Nicht zu vergessen: Frutiger Condensed als Webfont. Hui ;-) Im Hintergrund eine Subtle Pattern, die ich ja auch so gerne mag …

Ich finde es schön, dass man an dieser Stelle endlich mal ausgehend von der Nutzerseite aus gedacht, die alten Paradigmen über Bord geworfen hat, und sich nicht von der Datenbankprogrammierung hat vorschreiben lassen, wie so ein Ablauf für den Endkunden auszusehen hat. Daumen rauf für soviel Geschmack und Modernität!

Endlich erhältlich: Mein jQuery-Videoworkshop

2011-10-19T12:52:11Z

Und wieder hat es ein wenig länger gedauert, was aber nichts an der Aktualität ändert: Mein neuer Videoworkshop ist nun erhältlich und kann online für den Einführungspreis von 34,99 € erworben werden.

Diesmal geht es um das JavaScript-Framework jQuery, in das ich meine wissbegierigen Zuschauer einführen möchte. Es wurde Zeit – nachdem ich vor ziemlich genau 5 Jahren beim Webmontag Frankfurt meinen ersten Vortrag über jQuery gehalten, und vorgestern in Hamburg auf der web DevCon eine Live-Coding-Demo präsentiert habe, profitieren nun potenziell alle Interessierten von meiner Erfahrung auf dem Gebiet des frameworkunterstützten DOM-Scripting.

Dabei geht es nach einigen einführenden Kapiteln bald richtig zur Sache: animierte Slideshows, multimediale Videodemos, Drag-’n’-Drop-Warenkörbe, ajaxfizierte Twitterlisten, sortierbare Tippspiele und einiges mehr gilt es zu bauen – immer mit dem gut erläuterten Blick über die Schulter. Aus dem Feedback der vorherigen Workshops weiß ich, dass diese Form des Lernens recht effizient ist und vielen meiner Zuschauer gut liegt.

Knapp 2 Stunden Gratis-Beispiele angucken!

Und weiter so:

Dieser jQuery-Workshop ist der jüngste aus einer ganzen Reihe von Webdesign-Themen. Los ging es vor zwei Jahren mit Photoshop für Webdesigner, dann kam HTML & CSS, im Anschluss Wordpress, und nun jQuery. Es sind auch dieses Mal wieder über 6 Stunden Material, bei dem man einiges mitnehmen kann – HTML/CSS-Grundkenntnisse natürlich vorausgesetzt.

Für den Erwerb gibt es derzeit zwei Möglichkeiten (weitere Modelle folgen möglicherweise in Zukunft…). Entweder ihr bezahlt über PayPal/ClickandBuy auf der regulären Undsoversity-Website oder ihr ladet die vollständig runderneuerte Undsoversity-App für iPhone, iPod oder iPad herunter und kauft den Workshop als In-App-Purchase über euer Apple-Konto. In beiden Fällen besteht die Möglichkeit, die DRM-freien Dateien auf den eigenen Rechner herunterzuladen – dazu wird einmalig iTunes als Software benötigt, doch danach sind die Dateien universell einsatzfähig – ein großer Vorteil!

Es ist schon ein wildes Ding, was Timo hier mit der Undsoversity anstellt. Dass man solche Videoworkshop als reine Zwei-Mann-Produktionen fahren kann, wäre vor einigen Jahren undenkbar gewesen. Timo erledigt Produktion, Marketing, Vertrieb, Technik und Controlling in Eigenregie und ist dadurch mehrere Dimensionen effizienter als ein beliebiger Verlag es je sein könnte. Und das kommt natürlich auch den Tutoren zugute. Dass mein Anteil am Verkauf signifikant höher ausfällt als die 3–5%, die man sonst so bekäme, ist logisch. Da verzichtet man auch mal auf die Präsenz im Buchhandel. Ich bin jedenfalls stolz, bei dem Beweis dabei zu sein, dass ein schlanker Online-Vertrieb von digitalen Medien funktionieren kann – entsprechende Zielgruppen-Reputation natürlich vorausgesetzt.

Typografenstreit um Roboto

2011-10-19T10:26:56Z

Nachdem Google dieser Tage sein neues mobiles Betriebssystem »Ice Cream Sandwich« vorgestellt hat, was – wie man hört – mit allerlei Nettigkeiten gesegnet sein wird, kann man den dort verwendeten Font »Roboto« schon jetzt herunterladen und testen.

Das einhellige Urteil der Typografengemeinde: Zusammengeklaut! Die einen behaupten, es handelt sich um eine Mischung aus Helvetica, Myriad, Univers, FF Din und Ronnia, die anderen halten die neue Google-Schrift schlicht für ebenso Helvetica-geripofft wie die Arial seinerzeit.

Nun gut.

Ich bin da etwas entspannter, denn meines Erachtens ist bei genau dieser Art von Schrift, also bei bewusst neutral gehaltenen serifenlosen Schriften ohne jeden Schnörkel, die aber nicht geometrisch konstruiert sind, ohnehin kein sonderlich großer Spielraum, was individuelle Kreativität angeht.

Die Roboto ist keine originelle Schrift, aber sie gleich als Rip-Off oder Chimäre zu bezeichnen, erscheint mir zu hart. Auch die Myriad ist von der Frutiger nur schwer zu unterscheiden.

Typotermine

2011-10-19T08:18:37Z

Einfach nur, weil sie im tgm-Newsletter so schön zusammengefasst wurden, hier per copy und paste ein paar interessante Termine für Typofans:

Samstag, 12. November 2011

Seminar mit Oliver Linke:

FontLab »Part Zwei« – Schriften beißen nicht
Für einen tiefen Blick ins Innenleben des digitalen Buchstabenmaterials

Weitere Infos und Anmeldung hier

Sonntag, 13. November 2011

Seminar mit Tim Ahrens:

Fonts fit fürs Netz
Webfonts erstellen und richtig anwenden

Weitere Infos und Anmeldung

Freitag, 18. November 2011, München

8. Typotag 2011

TYPOLYGLOTT & MULTITASK – Vom Schriften und Sprachen mischen
Mit Johannes Bergerhausen, Veronika Burian, Nadine Chahine, Shoko Mugikura und Anuthin Wongsunkakon. Lässt sich auch prima mit dem Webfontday am Folgetag verbinden!

Weitere Infos und Anmeldung

Samstag, 19. November, München

Webfontday

Über die typografische Revolution im Web. Mit Ralf Herrmann, Oliver Reichenstein, Tim Ahrens, Helmut Ness, Martina Grabovszky, Andreas Henkel, Jürgen Siebert, Georg Seifert, Adam Twardoch, Dan Reynolds, Dan Rhatigan, Torben Wilhelmsen, Luc(as) de Groot u.a. Anschließend am Abend die Eröffnung der TDC-Show. Unbedingt dabei sein!

Weitere Infos und Anmeldung

… und ab Freitag bis April 2012 eine furiose Ausstellung über »Moving Type« in Mainz. Mehr Info

Die Glaskugel zum nächsten Smartphone eines Herstellers, für das ich mich interessiere *

2011-10-03T20:00:46Z

* Meme von Leo geklaut

Das Schöne an nichtgeklauten Smartphone-Prototypen (oder zumindest nicht veröffentlichen Details über geklaute Smartphone-Prototypen) ist, dass man schön ins Blaue hinein Gerüchte verbreiten kann. Und das morgige Apple-Event lädt dazu ein, zu spekulieren!

Zunächst einmal wird es ein iPhone-Event sein, welches aber zum gleichen Termin stattfindet wie früher die iPod-Events. Ich sage voraus, dass dies so bleiben wird und sich ab jetzt jährlich wiederholen wird. Es wird kein gesondertes iPod-Event mehr geben, sondern ein kombiniertes iPhone/iPod-Event, welches auf das Weihnachtsgeschäft abzielt. Mal mit John Mayer oder Alicia Keys, mal ohne! Und das ist auch gleichzeitig die Richtung, die der iPod einschlagen wird – er wird Schritt für Schritt durch das iPhone (oder zunehmend iPhone-artige Geräte) ersetzt. Apple leistet sich derzeit noch 3 verschiedene iPods, die quasi ausschließlich zum Musikhören verwendet werden und sonst nichts können, und ein hoffnungslos veraltetes Betriebssystem laufen haben, welches notdürftig an den Look von iOS angepasst wurde. Das machen die derzeit nur mit Bauchschmerzen!

Mein Tipp deshalb für ein vereinfachtes iPhone- und iPod-Lineup:

Das iPhone 5 wird so heißen, ganz klar. (Das 3GS hieß nur deswegen 3GS, weil man wieder die normale Generationen-Zählweise erreichen wollte, nachdem das 3G eine Generation »übersprungen« hatte.) Es wird eine 64GB- (evtl. sogar 128GB-Variante) geben. Gestalterisch wird es fast exakt so aussehen wie der GIGA-Prototyp, allerdings ohne Tropfenform, sondern an beiden Enden gleich dick.
Das iPhone 4 wird unverändert als 16GB-Variante verkauft zu einem reduziertem Preis.
Der iPod touch erhält die jährlichen Speedbumps und platziert sich zwischen iPhone 4 und iPhone 5. Design eher am iPhone 5 orientiert. Evtl. gibt es eine Umbenennung, um das Gerät noch telefoniger zu vermarkten, weil es wahlweise einen UMTS-Chip bekommt, wie das iPad. Aber kein GSM-Legacy! Statt des UMTS könnten es aber auch 128GB eingebauter Speicher sein, damit der …
… iPod classic sterben kann.
iPod nano und iPod shuffle verschmelzen zu einem Gerät mit neuem Namen, welches sich aber eher am Shuffle orientiert. Der jetzige Nano ist ein seltsames Ding, hässlich und inkonsequent. Der shuffle hingegen hat Stil und Selbstbewusstsein.

Also nochmal als Tabelle:

Name	Varianten	Preis
iPhone 5	32/64/128	599$ / 699$ / 799$
iPhone 4	16	449$
iPod touch	32/64/128	279$ / 399$ / 549$
iPod »shuffle«	16GB, 5 Farben	79$

(Ja, ich weiß, dass Apple keine unsubventionierten Hardware-Preise für die iPhones auf der Keynote rausrückt. Auf der Store-Website kann man sie aber nachgucken!)

In der Präsentation wird es nicht um Musik gehen, sondern um Hardware und iOS5, insbesondere iCloud. Keine Überraschung! Evtl. verzichtet Apple auf die 128GB-Varianten von iPhone und iPod touch – aber nur im Hinblick auf die iCloud. Also müsste der touch auch UMTS bekommen, um den Classic zu ersetzen.

Und morgen lachen wir alle über meine Vorhersagen, okay?

Als ich Musik gemacht habe, Teil VI

2011-10-03T11:10:09Z

Punkbands pflegen sich ja stets direkt nach Veröffentlichung des ersten Albums aufzulösen, um bloß nicht in die Kommerzialisierungsfalle zu tappen. Das war bei unseren Projekten 2 Boys 4 Love und Base-Box allerdings gar nicht nötig, denn einerseits klang unsere Musik von vornherein extrem kommerziell, andererseits hat sich auch kaum jemand für die Werke interessiert, außer ein paar dutzend Musiksaugern auf den diversen Online-Plattformen.

Die Gründe, warum sich Base-Box dann 1999 doch auflöste, waren schlicht organisatorischer Natur: Abitur, Zivildienst, Umzug, Studium – da blieb nicht viel gemeinsame Zeit für zwei Hobbyproduzenten, die sich vor allem über ihre Schulkameradschaft und die Arbeit an der Schülerzeitung definiert hatten.

Etwa ein Jahr lang also ruhte die Arbeit an neuer elektronischer Musik, bevor ich Ende 2000 nach Mainz in ein kleines Studentenappartement zog. Mit im Gepäck: mein treues Master-Keyboard, ein brandneuer Dr. Groove DR-202 von BOSS, sowie mein bewährter Escom-Tower. Zeit für das erste Soloprojekt, das auf den viel zu generischen Namen Chronos hörte.

Musikalisch orientierte ich mich diesmal an ruhigen instrumentalen Klängen – Café del Mar, Nightmares on Wax und die frühen Morcheeba waren meine Vorbilder, denn ich wollte weg vom bunten und lustigen Mainstream-Pop. Lieber die Musik machen, die ich tatsächlich auch selber am liebsten hörte! (Und wie es sich gehört, ist mein Musikgeschmack auch exakt hier eingefroren: Ich bevorzuge immer noch das gleiche Zeug, was ich mit Anfang 20 konsumiert habe. Ihr etwa nicht?)

Technisch rüstete ich freilich abermals auf, und zwar sowohl in Hard- als auch in Software. Der schon erwähnte Dr. Groove war mein erstes externes Gerät zur Sounderzeugung; Davor entstanden die eigentlichen Klänge grundsätzlich virtuell im Rechner. Für mich eine Herausforderung, denn erstmals brauchte ich tatsächlich ein Hardware-Mischpult zum Abmischen, um die beiden Klangquellen zusammenzuführen. (Das Mischpult hatte ich natürlich vorher schon, allerdings nur zur Mikrofonverstärkung …) Der Dr. Groove ist ein ganz netter kleiner Drumcomputer, welcher vergleichsweise amtliche Klänge eingebaut hat, und auch mit melodischen Basslines klarkommt. Im Grunde ist er für den Live-Einsatz von DJs konzipiert, aber auch im Rahmen meiner Cubasis-Arrangements ließ er sich natürlich per MIDI problemlos einbinden. Er brummt ein wenig, zugegeben.

Doch auch auf Software-Seite gab es Neuerungen: Ich entdeckte virtuelle Synthesizer und Effektgeräte in Form von VST-Modulen! Cubase (und seine Light-Version Cubasis) bot unglaublicherweise die Möglichkeit, Softwareinstrumente von Drittanbietern einzubinden, was für mich einer Offenbarung gleichkam – obschon durch meine lahme CPU ein wenig begrenzt. Doch ich erinnere mich noch daran, wie ich große Mengen von Shareware- und Freeware-Hallgeneratoren durchprobierte, sowie nach schicken, analog klingenden Synthesizern Ausschau hielt. Ich wurde fündig!

Somit sind die Produktionen von Chronos eine Mischung aus Drums und Basslines vom externen Dr. Groove, Melodie- und Harmonietracks aus der (seit 2 Boys 4 Love-Zeiten im Einsatz befindlichen) Wavetable-Soundkarte Yamaha DB 50-XG, weiteren Melodie-Tracks und Effekten aus verschiedenen virtuellen VST-Modulen, sowie natürlich klassische Samples und Drumloops aus der Retorte. Um Letztere zu finden, erwarb ich für günstiges Geld ein 8er-Set von CD-ROMs, in dem viele tausend Samples, Loops und Single-Shots aus den diversesten Genres enthalten waren. Absolut keine Profi-Qualität, aber ich konnte mir die eine oder andere Frauenstimme ausleihen und gewinnbringend einsetzen.

Eigenen Input lieferte ich vereinzelt in Form von Cello-Solos, die ich aber deutlich verzerrte und mit Effekten eher unkenntlich machte. Ebenso im Spiel: Zweckentfremdeter Mönchgesang (einmal Enigma, immer Enigma …), sowie ein aus dem Gedächtnis gecovertes Lied aus Lemmings, welches dort – wie ich sehr viel später erfuhr – auch bereits ein Cover aus Shadow of the Beast auf dem Amiga war. Sämtliche Rechte sind nicht geklärt.

Insgesamt sind von 2000 bis 2001 fünf sphärisch-chillige Songs entstanden, plus ein missratener Jungle-Versuch, den ich aber nicht mitzähle. In bester Jean-Michel-Jarre-Manier sind die Titel der einzelnen Songs durchnummeriert und tragen den gleichen Namen wie das Album: Introvert. Okay, man müsste im Grunde von einer EP sprechen. Es ist Musik, die mir noch heute fast überhaupt nicht peinlich ist – im Gegensatz zu unseren früheren »Werken«. Ein bisschen langweilig: ja. Aber definitiv von einer gewissen Zeitlosigkeit geprägt.

Das Musikmachen war damals eine ideale Zeitbeschäftigung im ersten Semester: Ich wohnte alleine, hatte lange Abende zu füllen und machte mir bei einsamen Nachtspaziergängen viele Gedanken über Grooves, die ich mal ausprobieren wollte.

Überhaupt stand bei den meisten meiner Lieder am Anfang eine Rhythmus- oder Groove-Idee. Ich war und bin kein Melodienerfinder. Erst Groove, dann Harmonie, und am Ende dann irgendeine Melodie, damit es sich nicht so leer anfühlt – so ging das bei mir fast immer. Ach ja: Text gab es dann auch noch, zumindest bei den früheren Projekten. Aber mit Text haben wir uns grundsätzlich nie lange aufgehalten.

Mit diesem Absatz schließt sich diese kleine Reihe, die ich mit voller Ignoranz gegenüber meinen Stammlesern geschrieben habe. Es ist meine Art, einen Teil meines Lebens autobiografisch festzuhalten, damit ich es später nicht vergesse. Ich wünsche euch abschließend noch viel Spaß mit Introvert 1 und Introvert 3. Und natürlich dem Hinweis, dass man mein vorzeigbares Gesamtwerk unter der Adresse base-box.de in Form einer ZIP-Datei kostenlos herunterladen kann!

Mehr lesen

Teil 1 | Teil 2 | Teil 3 | Teil 4 | Teil 5 | Teil 6

Webfontday 2011 in München

2011-10-01T05:19:51Z

am Samstag, den 19. November 2011

Auch in diesem Jahr veranstaltet die tgm (Typografische Gesellschaft München) wieder einen Webfontday. Letztes Jahr zum ersten Mal am Start, konnte der Tag als großer Erfolg verbucht werden – zumindest aus Besuchersicht, denn es kamen tolle Leute und hielten interessante Vorträge. Darunter auch ich.

Dieses Jahr werde ich es zeitlich nicht schaffen, einen Vortrag mitzubringen, und es ist fraglich, ob ich überhaupt vor Ort sein werde. Dennoch klingen die ersten Fakten sehr gut: Die Räumlichkeiten bei Kochan & Partner haben sich bewährt, die Rednerliste ist beeindruckend: Tim Ahrens, Martina Grabovszky, Luc(as) de Groot, Andreas Henkel, Ralf Herrmann, Oliver Reichenstein, Dan Reynolds, Georg Seiffert, Jürgen Siebert, Helmut Ness, Adam Twardoch und Torben Willemsen.

Da sollte für alle was dabei sein: webfontday.de #wbfntdy

How to use visit time and duration for tracking goals in Piwik

2011-09-30T18:58:20Z

I’m (ab)using custom variables and the client-side clock to fire Piwik goals like »Visit has been at least 5 minutes long«. Here’s how:

In the regular Piwik code at the bottom of your html page, just add following code, right before piwikTracker.trackPageView();

var currentTime = new Date();
var mystamp = currentTime.getTime();
var piwikStart;
if (piwikStart = piwikTracker.getCustomVariable(1)) {
  if ((mystamp - piwikStart[1]) > 300000 ) { piwikTracker.trackGoal(99); }
} else {
  piwikTracker.setCustomVariable( 1, "StartTime", ""+mystamp, "visit");
}

Where 300000 is the amount of milliseconds for this goal, in this case 5 minutes = 300 seconds = 300000 milliseconds
Where 99 is the id of your goal, which you have to configure before adding this code. It has to fire »manually«, of course. That’s what we do here.

Please comment below and tell me about bugs and stuff!

CMS-Vergewaltigung

2011-09-28T14:46:42Z

Ich muss das einfach aufschreiben, weil ich es mir sonst später selber wahrscheinlich nicht mehr glaube. Ich habe heute eine Website analysiert, die von einer anderen Agentur in MODX Evolution umgesetzt wurde. Wobei hier schon nicht ganz klar ist, inwieweit das überhaupt zutrifft. Denn noch nie habe ich gesehen, wie eine (funktionierende!) Website derart am CMS vorbei entwickelt wurde.

Deshalb – für alle MODX-Kenner – die Details:

Im Seitenbaum gibt es einen Container »Menü« mit einigen Untercontainern, welche ausschließlich als Navigation dienen. Jede Ressource innerhalb von »Menü« ist eine direkte Weiterleitung (über Link-Attribut) auf eine andere Ressource, die dann alle flach im Seitenbaum auf der ersten Ebene liegen. Also insgesamt ca. 50-60(!) Ressourcen auf der ersten Ebene im Seitenbaum.

Diese Ressourcen sind natürlich Templates zugewiesen. Pro Ressource ein eigenes Template, also ungefähr 50 unterschiedliche Templates. Alles klar. Doch damit nicht genug: Diese Template bestehen jeweils aus nichts weiter als einem Mini-Snippet-Aufruf, welches einen simplen PHP-Include auf je eine .php-Datei durchführt. Also nochmal 50 einzelne .php-Dateien(!) im Root-Ordner(!) der Installation. Und was ist in diesen PHP-Dateien enthalten? Richtig, der eigentliche Template-Code, allerdings komplett mit php-Anweisungen durchsetzt, auch dort, wo es ein simples Snippet oder Chunk genauso getan hätte. Und: Der Inhalt der 50 php-Dateien ist jeweils zu 98 % identisch.

Wenn man das durchgestanden hat, wundert einen auch nicht mehr, dass Wayfinder und PHx und Ditto keine Anwendung finden, sondern alles per Hand über php-Schleifen und dem nackten $modx-Element gerendert wird.

Man findet keine Worte. Aber ansonsten geht’s mir gut :-)

Wochenlinks

2011-09-25T23:00:00Z

Netzfundstücke vom 19.09. bis zum 26.09.:

Capital Sharp S explained to Typographers (screencast)
In my talk together with Nadine Roßa at the ATypI conference 2011 in Reykjavík I explained why Germany and Austria need a capital Es…
EULA: es geht auch besser!
Ich hatte mich ja letztens schon einmal über die Zumutung des Lizenzvertrags von Adobes Flash Player aufgeregt. Dass Apple in diesem Fal…

Aktuelle CMS-Stimmungslage

2011-09-25T14:35:54Z

Wer meinen Twitter-Account verfolgt, hat die entnervten Dramen um MODX sicher mitbekommen. Sorry dafür. Aber als jemand, der immer noch auf der Suche nach der perfekten CMS-Lösung ist (die es niemals geben wird), muss man viel Frust und Euphorie durchmachen. Hier ist die aktuelle Stimmungslage, was die mir bekannten CMSe angeht:

WordPress ist auf einem wirklich guten Weg und kommt bei den meisten meiner Projekte zum Einsatz, sowohl bei Blogs als auch bei kleinen bis mittleren Websites. Nutzerfreundlich, entwicklerfreundlich, erstaunlich mächtig und stabil. Die Update-Frequenz hat erfreulicherweise etwas nachgelassen, die Backend-Performance hat sich verbessert, WordPress findet derzeit die richtige Balance zwischen Features und Performance. Die erwartete Wordpokalypse bleibt erstmal aus!
Textpattern kommt nur noch extrem selten zum Einsatz, nämlich bei sehr reduzierten Blogs und sehr kleinen Websites, die keine hierarchische Navigation benötigen. TXP hat sich seit 2005 kaum spürbar weiterentwickelt, ist aber grandios stabil und gut abgehangen. Tut, was es soll. Das ist zwar nicht viel, aber manchmal ist Verlässlichkeit und Performance wichtiger als Features!
MODX Evolution schlägt in die gleiche Kerbe wie Textpattern, nur eben für hierarchische Websites, weniger für Blogs: Pfeilschnell, robust ohne Ende, extrem gut abgehangen, seit Jahren keine neuen Core-Features, was aber okay ist. Als verlässliches Arbeitspferd, mit dem man null Stress hat, wenn es einmal läuft, ist Evo immer noch sehr zu empfehlen.
MODX Revolution ist in Sachen Verlässlichkeit das Gegenteil seines älteren Bruders: Hier könnte man manchmal in die Tischkante beißen, weil alles noch so wenig ausgereift ist. Das Backend ist träge und instabil. Die Entwickler hatten mit den Rewrite etwas ganz Großes und Ultimatives im Sinn, und verrennen sich gerade ein wenig in der selber geschaffenen Allmacht des Systems. Die TYPO3-Leute kennen das vielleicht, oder? Dennoch kann man – entsprechendes Vorwissen vorausgesetzt – bestimmte Funktionen einer Website in so wahnwitziger Geschwindigkeit und Eleganz umsetzen, dass es eine Freude ist – solange es sich nicht um große Mengen von zeitbasierten Artikeln handelt, denn da versagt Revo (und auch Evo) immer noch kläglich. Allerdings: Nie war man an der Entwicklung eines Systems so hautnah dran: Bugreports werden von den drei Core-Entwicklern zeitnah beantwortet, man kann schön nachvollziehen, wie das System Schritt für Schritt besser wird. Leider dauert es alles zu lange, und man wünschte sich einen FF-Button. Fazit: Im Sommer 2012 ist MODX Revo evtl. ready for prime time!
Drupal macht da weiter, wo WordPress aufhört, und zwar in jeder Hinsicht: größere Websites, sauberere Content-Typen, stärkere Generalisierung der Strukturen, höhere Flexibilität, aber auch deutlich mehr Arbeit in der Konfiguration und im Theming. In WordPress »macht man mal eben«. In Drupal investiert man Zeit und Gehirnschmalz in jede kleine Funktion. Ansonsten gehen beide Systeme (fast) gleichermaßen gut mit zeitbasierten und hierarchiebasierten Inhalten um, was nicht jedes CMS von sich behaupten kann. Drupal ist alles andere als frustfrei. Aber stabil und professionell ist es allemal. Man muss halt immer ein bisschen mehr Zeit einplanen.

So, das wär’s in knackiger Form von meiner Seite. Weitere Hinweise außer »Mein CMS ist besser als dein CMS«? Immer her damit!

Alter Sack zieht Bilanz

2011-09-25T13:53:31Z

Unabhängig von Facebook’s neuer Timeline fiel mir heute mittag ein, dass ich ja jedes Jahr Anfang Oktober ein paar »ungefähre« Jubiläen zu feiern habe…

Oktober 1996: Ich baue meine ersten Vorversuche für eigene Websites.
Oktober 2000: Ich beginne mein Praktikum bei ZDF.online und verdiene erstmals echtes Geld mit dem Bauen von Websites. (z. B. die damalige »www.wetten-dass.com«)
Oktober 2007: Ich mache mich selbstständig mit dem Webdesign

Also sieht’s in diesem Jahr so aus:

Ich baue seit 15 Jahren Websites.
Seit 11 Jahren baue ich professionell Websites.
Ich bin seit 4 Jahren als Webdesigner selbstständig.

Nur mal so. Weiter geht’s!

Web-Branding in der Usability-Diktatur

2011-09-15T19:36:36Z

In den nächsten Wochen bin ich ziemlich viel unterwegs – und darunter auch ein paar Mal in der Öffentlichkeit. Morgen geht’s nach Hamburg zur Mediale, die von Schülern der Beruflichen Medienschule Hamburg Eilbektal veranstaltet wird. Also nichts großes kommerzielles, sondern was nettes! Da bin ich immer besonders gern vor Ort.

Vortrag angucken

Um 12 Uhr werde ich meinen Vortrag mit dem Titel »Web-Branding in der Usability-Diktatur« halten. Es geht darin um eine Thematik, die ich in ähnlicher Form immer mal wieder in meinem Vorträgen aufgreife. Meine These ist, dass Branding im Web etwas ganz anderes bedeutet als in der Offline-Welt. Zum Beispiel, weil zu dick aufgetragene Markenwelten die Usability stören. Ein natürlicher Gegensatz: Usability lebt unter anderem davon, dass Website-Konzepte sich gleichen und allgemein bekannten Prinzipien unterwerfen, während man im Branding gerne auffallen möchte, und sich von den Mitbewerbern abheben möchte.

Branding sollte sich also im Web auf andere Dinge als das Make-Up oder die zwanghafte Originalität in der Bedienung besinnen: Lieber einzigartige Inhalte schaffen oder großartige Mitmach-Möglichkeiten! Klar, es ist anstrengender, sich durch prägnanten Inhalt eine (Corporate) Identität zu beschaffen als durch prägnante Markenwelten. Aber es geht schon: Die neue Online-Banking-Seite der Postbank zeigt, wie’s geht: Radikal reduziert, modern und abseits dessen, was man im allgemeinen Corporate-Design-Handbuch finden würde. Sehr mediengerecht, und zusätzlich mit Liebe zu den Details.

Traditionelle Marken haben es natürlich schwerer als Facebook und Co.! Diese nativen Webmarken bestechen allein durch ihre Funktionen oder ihre Inhalte und haben es leicht, ikonisch zu wirken allein durch einen bestimmten Aufbau des Bildschirms. Dennoch ist die Chance da, dass auch alte, große Marken sich eine Frischzellenkur verschaffen und webgerechte Konzepte und Attitüden annehmen, ohne zuviel Rücksicht auf die alte Brandingwelt zu nehmen. Da ist noch Musik drin!

Wochenlinks

2011-09-11T23:00:00Z

Netzfundstücke vom 05.09. bis zum 12.09.:

heiseonline: Code für 2-Klick-Empfehlungsbutton von Heise ist erhältlich http://t.co/oQKlzXu
(vor 5 Tagen)

Wochenlinks

2011-09-04T23:00:00Z

Netzfundstücke vom 29.08. bis zum 05.09.:

web_martin: Adaptive Images — Deliver small images to small devices: Automatically adapts your existing HTML images for mobile d... http://t.co/ezPKx9h
(vor 3 Tagen)

Als ich Musik gemacht habe, Teil V

2011-09-04T20:09:31Z

Neben all den elektronischen und Mainstream-imitierenden Klängen darf eine nicht unwichtige Episode meiner musikalischen Laufbahn nicht verschwiegen werden: Die Mondstaub-Zeit. Nach meinem Abitur ging die Zusammenarbeit mit Kumpel Johannes naturgemäß ihrem Ende zu, und ich startete in einen weitestgehend stressfreien Zivildienst, in dem ich jede Menge Zeit für neue musikalische Horizonte hatte.

Fragt mich nicht. Aber die Reise führte mich zur Liedermacher-Zunft, obwohl ich dieser Musik bis heute überhaupt nichts abgewinnen kann! In meinem Freundeskreis tat sich Dirk aber schon seit einigen Jahren als politisch-lyrischer, ein bisschen christlich angehauchter Liedermacher hervor und spielte – erst alleine, dann mit einer kleinen Combo namens »Mondstaub« – in diversen evangelischen Gemeinden vor sich hin. Kaum gegründet, veränderte sich die Band personell und wollte auch weg vom Christen-Image. Zeit, dass ich da mal nach dem Rechten sah!

Mondstaub bestand in den Jahren 1999 bis Anfang 2001 unter meiner Mitwirkung aus Dirk (Gitarre, Gesang, Songwriting), Michi (E-Bass, Songwriting), Gerrit (Cello) und erhielt perkussive Unterstützung durch Patrick, der jedoch kein festes Mitglied war. Meine Aufgabe war, neben der Klangaufhübschung durch Cello-Begleitung und -Soli, vor allem das Coaching von Frontmann Dirk, der so manches Mal Probleme mit dem Rhythmus und der Metrik seiner eigenen Texte hatte (jaja …). Außerdem kümmerte ich mich um die technische Produktion unserer Studio-Aufnahmen. Wobei »Studio« wieder einmal eine himmelschreiende Übertreibung darstellt: Natürlich fand das alles in diversen elterlichen Haushalten statt, aber durch meine Erfahrung mit 2 Boys 4 Love und Base-Box konne ich auch ohne professionelle Aufnahmetechnik ganz anständige Demo-Qualität erreichen. Die Software machte es möglich!

Mondstaub spielte insgesamt träumerische und teilweise herzschmerzverursachende Musik mit starkem Schwerpunkt auf deutschen Texten. Intellektueller als die peinlichen Sachen von PUR, weniger verschlüsselt als Blumfeld, bodenständiger als Tocotronic, aber grundsätzlich irgendwo dazwischen. Wir haben uns sogar eine eigene Musikrichtung für uns ausgedacht: Fachwerk. Hat nie einer näher nachgefragt ;-)

Wie es sich für eine amtliche Hobbyband gehört, gab es trotz der kurzen Zeit, die wir miteinander haten, eine EP mit sechs vollwertigen Titeln: »Verlorene Träume«. Auf fünf Liedern ist Patrick mit seinem Schlagzeug zu hören, wobei der Clou darin bestand, dass er niemals mit uns geprobt hatte, und wir seine Soundspur trotzdem als erstes aufgenommen hatten. Er konnte also nur eine grobe Ahnung davon haben, was er da eigentlich spielte; Songstruktur, Tempo und Grundstimmung hatten wir ihm in einem kurzen Briefing mitgeteilt, den Rest hat er ins Blinde improvisiert. Die Drum-Aufnahmen dienten uns dann als Grundlage für die weiteren Spuren: Gitarre, Gesang, Bass und Cello. Alles einzeln in Cubasis aufgenommen, dann noch minimal abgemischt und mit Hall versehen: Fertig! Sehr garagig. Im Grunde wäre Mondstaub tatsächlich ein ideales Anwendungsfeld für die Apple-Software GarageBand gewesen, doch selbstverständlich war anno 2000 daran noch nicht zu denken. Ich war ja froh, dass mein Rechner genügend Festplattenspeicher und CPU-Power hatte, um die ganzen unkomprimierten Tracks gleichzeitig zu speichern und abzuspielen. Ich meine mich allerdings zu erinnern, dass ich Gesang und Gitarre vor der Aufnahme durch ein eigens erworbenes Hallgerät geschickt habe, um Rechenzeit zu sparen. Verrückt!

Beim ersten Lied (»Wir wagen es nochmal«) mussten wir leider auf Patricks Perkussions-Performance verzichten, und ich bastelte (ohne jegliche Erfahrung am echten Schlagzeug) die Drums per MIDI-Soundkarte hinzu. Sie klingen völlig anders als bei den anderen Stücken, allerdings nicht unbedingt schlechter. Man würde sagen: poppiger und exakter. Und steriler, natürlich.

Mit diesem zusammengestückelten Erstlingswerk wagten wir es nun, uns beim jährlichen Würzburger Festival »Umsonst & Draussen« zu bewerben (nachdem wir bereits Anfang Juni 2001 einen ersten Auftritt im Würzburger Omnibus selber organisiert hatten). Wir konnten auf dem U&D schon die Jahre zuvor erste Erfahrungen als Straßenmusiker sammeln (in der »offenen Stunde«), doch dieses Mal wollten wir offiziell auf die Bühne, egal wie klein. Und was soll ich sagen? Es hat tatsächlich geklappt! Ich weiß nicht mehr ganz exakt, wie es war, aber eine Performance von Mondstaub auf dem U&D im Sommer 2001 markierte den Höhepunkt unserer bescheidenen Karriere. Im Zelt war die Stimmung insgesamt positiv, wenn auch keine gigantische Mengen an Zuhörern vor Ort war. Wir waren trotzdem zufrieden, wenn wir uns auch ein wenig wie Betrüger fühlen, denn wir sahen uns gar nicht als echte Rockband, schon gar nicht im Vergleich zu dem Niveau, welches die anderen Band auf dem Festival vorlegten. Aber wir hatten eine Menge Fans, die sich in erster Linie aus persönlichen Freunden zusammensetzen. Gut für unseren dritten richtigen Live-Auftritt, welcher im Herbst 2001 im Schweinfurter Stattbahnhof über die Bühne ging!

Beim dortigen Band-Contest waren wir zwar, objektiv betrachtet, die mindestens zweitschlechteste Gruppe, doch unsere mitgebrachten Freunde verhalfen uns zum begeistertsten Applaus aller Teilnehmer. Dass das die Jury letztlich nicht interessierte, war aber nur fair und richtig: Wir hätten auch gar nicht so recht gewusst, was wir im Falle eines Gewinns angestellt hätten, denn danach ging alles relativ flott; Ich zog nach Mainz, um dort zu studieren, Dirk wurde Lehrer, und Mondstaub bleibt heute nicht viel mehr als eine schöne Erinnerung in meiner Übergangszeit zwischen Schule und Designkarriere.

Wir hören nun zum Abschluss »Wir wagen es nochmal« (das Lied mit den MIDI-Drums):

Und: »Sie hat Schluss gemacht«, einer der ersten gemeinsamen Songs, den ich übrigens ein paar Wochen später – relativ respektlos – für Base-Box gecovert habe.

Mehr lesen

Teil 1 | Teil 2 | Teil 3 | Teil 4 | Teil 5 | Teil 6

Bei aller Cleanness …

2011-08-31T10:35:40Z

… eines der nervigeren UI-Probleme des Internet Explorer 9 ist die Tatsache, dass die Adresszeile genauso aussieht wie die Tabs. Und dass sowohl erstes als auch letzteres nicht so aussehen, als ob man da was reinschreiben könnte.

Manchmal hilft so ein Innenschatten oder ein Verlauf ganz beträchtlich, um den Nutzer zu leiten.

Links: Adresszeile, rechts: Tab. Zu ähnlich für zwei Dinge, die komplett unterschiedliche Funktion haben!

Diese Browser-Silbentrennung

2011-08-18T10:36:03Z

Nach 20 Jahren intensiver Entwicklungsarbeit kommt nun endlich ein Feature in die öffentlich erhältlichen Browser, das wir Typografen alle schmerzlich vermisst haben: Automatische Silbentrennung. Bisher beherrschen Safari 5.1 und Firefox 6 diese Funktionalität. Sie muss noch mit den enstprechenden Vendor-Prefixes aktiviert werden, beispielsweise mit:

p {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}

(Mehr Info im Fontdeck-Blog)

Obwohl gerade die deutsche Sprache von der Silbentrennung profitiert (wegen der langen Wörter), und man erst mit Silbentrennung sinnvoll über Blocksatz nachdenken kann, bleibt die deutsche Sprache dem Safari vorbehalten. Firefox 6 kann vorerst nur englische Texte hyphenaten. Und damit bleibt das Feature auch erstmal eine akademische Spielerei. Für wie viele weitere Jahre wohl?

Adobe und die vielen Strohhalme

2011-08-15T07:57:49Z

Es gibt zwei verschiedene Anzeichen dafür, dass es einer Firma schlecht geht. Entweder man hört so gar nichts neues mehr, oder es wird pausenlos über neue Dinge berichtet, die in der Mache sind.

Letzteres trifft zweifelsohne auf Adobe zu. Seit einiger Zeit – lassen wir es zwei Jahre sein – sucht der Konzern sein Heil im hektischen Aktionismus. Dieser ist dadurch geprägt, dass man seine Produktpalette in alle Himmelsrichtungen des webbasierten Publizierens erweitert, dabei jedoch keinerlei verlässliche Aussage trifft, außer: »Wir machen alles mit, wir sind immer dabei. Bitte lasst uns mitspielen, denn wir haben Angst, das nächste große Paradigma zu verpassen!« So sieht kein souveräner Konzern aus.

Als Adobe vor sechs Jahren Macromedia gekauft hatte, glaubte man wohl ein Stück weit, dass man sich dadurch den »Webdesign-Markt« gekauft habe. Schließlich kamen von Macromedia so erfolgreiche Produkte wie Flash, Dreamweaver und ColdFusion.

Leider hat Adobe damit wohl auf das falsche Pferd gesetzt, denn die Realität im Webdesign ist seit dieser Zeit eher in die komplett andere Richtung umgeschlagen: Weg von den clientseitigen Authoring-Tools, hin zu serverseitigen CMS-Lösungen. Der Anteil der Webdesigner, die heute noch aus der traditionellen Print-Denke heraus Websites baut, wird immer geringer. Im professionellen Bereich sind zwar weiterhin auch klassisch geschulte Designer unterwegs, aber sie arbeiten (entweder in Personalunion oder im Team) mit Entwicklern zusammen, die sich um Semantik und Coding kümmern. Die Frage »Welches Programm verwendest Du eigentlich zum Webdesign?« habe ich in den letzten fünf Jahren nur noch ganz selten gehört – im Studium dagegen ständig. Es ist inzwischen jedem klar, dass man Websites per Hand baut. Natürlich mit Unterstützung durch clevere Texteditoren, JavaScript- und evtl. CSS-Frameworks, Browsererweiterungen wie Web Inspektor oder Firebug, und natürlich serverseitigen Content-Management-Systemen für die Dynamisierung. Die heutigen Anforderungen an die allermeisten Websites sind nun mal, unter anderem, Flexibilität und Semantik. Benutzer und Suchmaschinen wollen klar strukturierte Inhalte sehen. Das Web drängt gleichzeitig auf immer größere und immer kleinere Bildschirme, da ist es mit einer starren Umsetzung eines InDesign-Entwurfes oftmals nicht getan. Zumal natürlich auch Web-Aplikationen ein Riesending sind. Kaum jemand will noch eine Website, auf der man ausschließlich gucken kann!

Man muss Adobe lassen, dass sie auch diesen Trend irgendwie mitmachen. Es gibt ganz interessante Einreichungen beim W3C, was Textfluss-Varianten in CSS angeht. Und wenn es um ordentliche Authoring-Tools für HTML5-Animationen geht, kann man mal Edge ausprobieren. Denn natürlich verlangt niemand, dass man Canvas, SVG oder CSS3-Transitions per Hand coden muss. Klares Signal: Adobe kümmert sich neben Flash auch um Webstandards-Techniken. Die Open-Source-Browserengine Webkit ist Teil von AIR, man unterstützt den WebM-Videostandard usw.

Doch manchmal kann man Dinge auch von der falschen Seite umarmen. Gerade als man dachte, Dreamweaver würde so langsam sterben oder zumindest zu einem komfortablen Code-Editor mit Vorschau-Funktion und FTP-Client umgemünzt werden, kommt ein brandneues Produkt auf den Softwaremarkt, das ganz offenbar konzeptionell in den späten Neunziger Jahren eingefroren und jetzt wieder aufgetaut und umgesetzt wurde: Adobe Muse (Arbeitstitel).

Muse ist im Grunde ein abgespecktes InDesign, welches HTML-basierte Websites ausspuckt. Die Prämisse: Der Designer soll auf keinen Fall irgendwelchen Code zu sehen bekommen. Was natürlich Quatsch, aber in diesem Falle leider ernst gemeint ist. Man schaue sich die offizielle Promo-Website an, die natürlich bereits mit Muse hergestellt wurde. Die Hauptüberschrift ist mit

<p id="n188"><span class="muse-hero-primary">Muse (code name)</span></p>

ausgezeichnet. Weitere Nettigkeiten:

Schriftauswahl: Es gibt in der Liste sowohl »Websafe Fonts« (darunter Franklin Gothic und Futura), als auch »System Fonts«, die dann – yea! – beim Export als Pixelgrafik gerendert werden.
Zu Beginn eines Projektes wird erstmal die Seitenbreite und Mindesthöhe festgelegt, damit gleich klar wird, dass man bei Adobe mit flexiblen oder responsiven Layouts nichts zu tun haben möchte.
Die Logik, nach der zwei oder mehrere Boxen untereinander im Textfluss platziert werden, ist nicht ersichtlich. Immerhin wird nicht überall mit absoluter Positionierung gearbeitet, aber man kann erstmal nicht wissen, was passiert, wenn Texte evtl. kürzer oder länger werden.

Muse ist wirklich ein Tool aus der Web-Steinzeit, als man noch einzelne Seiten festgebacken und mit fixen Text- und Bildarrangements versehen hat. An dynamische Pflegbarkeit ist hierbei nicht zu denken. Im Grunde könnte man statt HTML auch gleich ein PDF ausgeben, es würde keinen allzugroßen Unterschied machen. (PDFs können ja ebenfalls Navigationen und Links enthalten, Videos und andere Dinge in sich aufnehmen. Das dazugehörige Authoring-Tool »InDesign« ist jahrelang erprobt und gut abgehangen.)

Muse ist demnach wirklich ein verzweifelter Versuch, ein weiterer von vielen Webstandards-Strohhälmen, an die sich Adobe derzeit zu klammern versucht – ohne rechten Sinn dahinter. Denn im Grunde hat Adobe dieses HTML immer noch nicht richtig verstanden. Sie mögen wissen, was es technisch damit auf sich hat. Aber sie können es sich einfach nicht vorstellen, dass professionelle Webdesigner tatsächlich HTML, CSS und JavaScript manuell schreiben wollen! Sie vergleichen es im Muse-Promovideo mit PostScript, dass ja wohl auch keiner von Hand schreiben will. Sie denken, wir warten alle nur darauf, dass uns jemand das lästige Coden abnimmt, und dass in Zukunft der handcodende Webdesigner eine skurrile Ausnahmeerscheinung sein wird.

Sie verkennen dabei jedoch, dass HTML gleichzeitig Authoring- und Auslieferungssprache ist, während bei PostScript am Ende die gedruckte Broschüre das Auslieferungsmedium ist. Und ja: Bei einer gedruckten Broschüre ist mir die Semantik des zugrunde liegenden InDesign/PDF wirklich egal. Aber bei offenen und interpretierbaren Medien wie HTML sind Flexibilität und Zugänglichkeit sehr wichtige Stichworte. Und beides erreicht man nicht durch eine Software mit dem Geiste der Druckvorstufenzeit, wie sie Muse darstellt.

In Zukunft wird der Anteil der codenden Webdesigner eher anstiegen: Suchmaschinenoptimierung, Webapplikationen, CMS, Mobile Web: All das sind Megatrends, auf die mit Muse kein Stück eingegangen wird! Ein Rückschritt sondergleichen! O Adobe, was ist aus dir geworden?

Obligatorischer Liontext

2011-08-14T07:56:51Z

Dass nicht alle Leute mit der neuen MacOS-X-Version auf Anhieb klarkommen würden, liegt in der Natur der Sache. Änderungen im Bedienkonzept sind nie gerne gesehen – vor allem beim Betriebssytem. Der junge Herr in diesem impulsiv vorgetragenen Video ist ein Musterbeispiel:

(via dem Olma)

Nun ist das alles recht witzig anzusehen. Doch es lohnt sich ebenfalls, einen differenzierten Blick auf die Dinge zu werfen.

Zunächst einmal: Lion bringt seit längerer Zeit überhaupt wieder UI-Änderungen für MacOS X. Snow Leopard (2009) war ja eine reines Low-Level-Update und für den Endanwender eher uninteressant. Die letzten wirklich sichtbaren Änderungen für den unbedarften Anwender kamen mit Leopard (Spaces, 2007), Tiger (Spotlight, 2005) und Panther (Exposé, 2003). Irgendwie klar, dass jemand, der noch nicht so lange dabei ist, keine große Tradition darin sehen wird, aber Apple war immer schon fleißig dabei, den Nutzer sanft (oder weniger sanft) dazu zu bringen, neue UI-Features auszuprobieren. Nicht alles musste man nutzen, aber manches war sinnvoll, wenn man ihm eine Chance gab. Spotlight und (Single-App-)Exposé haben meine Art, mit dem Rechner umzugehen, schon sehr positiv beeinflusst.

Im Folgenden möchte ich nach ein paar Tagen Praxis meine Meinung zu den wichtigsten Paradigmen von OS X Lion kundtun:

Launchpad

Hier gehe ich völlig d’Accord mit unserem Freund aus dem Video: Launchpad ist mit Abstand die sinnloseste aller neuen Funktionen, zumindest für Power-Anwender. Es gibt eine ganze Reihe von Möglichkeiten, seine Programme zu starten – Launchpad ist sicherlich die umständlichste. Vielleicht interessant, damit Mutti auch mal in Gänze alle Programme sieht, die sie installiert hat. Der Profi startet Programme aber natürlich über Spotlight oder eine dedizierte Anwendung wie Launchbar. Programme, auf die man manuell Dokumente draggen möchte, residieren zusätzlich im Dock.

Ich habe daher Launchpad weitestgehend unzugänglich gemacht und sehe es nur noch ganz kurz, wenn ich eine App aus dem AppStore erwerbe.

Mission Control

Diese nette Idee vereinigt im gewissen Sinne Exposé, Spaces, Fullscreen-Modus und Dashboard und macht etwas sehr Großes und Umständliches daraus. Wieder frage ich mich, welches Problem hier genau gelöst werden soll! Das Doppel-Konzept »Fullscreen und Spaces« leuchtet mir zwar theoretisch ein, aber es ist ein weiterer Zwischenschritt, der mich beim Wechseln zwischen den Programmen belästigt. Ich nutze wie ein Wahsinniger cmd+TAB, und komme damit unglaublich gut klar – weil es einfach und schnell funktioniert! Meines Erachtens braucht es keinen anderen App-Switcher.

Zum Glück kann man aber fast alle Dinge von Mission Control ignorieren bzw. aus dem Funktionsbündel herauslösen. Im Grunde habe ich bisher nur drei Dinge wirklich benötigt:

Dashboard lässt sich per Einstellung so trimmen, dass es kein eigener Space mehr ist, sondern sich – wie gewohnt – über den aktuellen Desktop legt. So verliert man den Kontext nicht. Liegt auf F4. Auf dem MacBook Air ist das Symbol auf F4 zwar inzwischen nicht mehr »Dashboard« sondern »Launchpad«, aber so unterschiedlich sehen die Icons nicht aus :-)
Exposé für das gerade aktive Programm habe ich mir auf F5 gelegt
Desktop freiräumen ist auf F6, weil die wunderbare »Vier-Finger-nach-oben«-Wischgeste leider einer schlimmen Spreizgeste gewichen ist.

Klar, es mag Anwender wie @freshmango geben, die ihren Workflow extrem auf das »alte« Spaces-Konzept abgestimmt haben. Die kotzen jetzt. Aber ich kenne außer @freshmango auch niemanden, der Spaces so intensiv genutzt hätte, dass es jetzt für ihn eine unmöglich zu lösende Aufgabe wäre, sich umzustellen. Mission Control ist sicher für einen Großteil der Anwender eine bessere Lösung als das alte Exposé/Spaces-Konzept. Ich aber halte mich da komplett raus und nutze weiterhin cmd+TAB, F5 und F6. Reicht!

Natürliches Scrolling

Eigentlich kein großes Ding, aber für viele Lion-Gegner der wichtigste Aufhänger. Ich habe mich spaßeshalber drauf eingelassen, obwohl ich gar nicht die Zielgruppe bin. Das Feature ist eigentlich für Touchpad-Nutzer gedacht, und da – das muss jeder zugeben – erscheint es auch logisch. Ich sitze hingegen 90 % meiner Rechnerzeit an einer konventionellen Maus mit Scrollrad. Alle Versuche hinsichtlich Touchpad, Grafiktablett oder Magic Mouse sind in der Vergangenheit fehlgeschlagen. I’m holding it wrong! Prinzipiell hätte ich das natürliche Scrolling also gar nicht voreingestellt lassen müssen. Dennoch habe ich mich recht flott dran gewöhnt. Ich lass es jetzt erstmal so. Grundsätzlich sollte man ja sowieso versuchen, möglichst wenig mit der Maus zu machen und die Tastatur zu bevorzugen, wo immer es geht.

File Vault 2

Sowohl auf meinem iMac, als auch auf dem MacBook Air habe ich natürlich meine Festplatte verschlüsseln lassen. Das funktionierte pfeilschnell im Hintergrund, ich habe davon bisher nichts mitbekommen. Es ist ein unsichtbares Feature, welches mir ein gutes Gefühl gibt, ohne etwas extra zu zahlen.

Sonst so

Abgesehen davon war der Übergang von Snow Leopard auf Lion bemerkenswert problemfrei. Ich konnte nach dem Update sofort ganz normal weiterarbeiten. Die Endzeitstimmung vieler Anwender ist also krass übertrieben: Kein einziges Programm hat Probleme verursacht – nicht mal meine CS3-Suite, auch wenn jetzt umso stärker auffällt, wie unpassend die nachgebauten Aqua-Buttons in der Paletten-UI von Photoshop und Illustrator wirkt.

Der neue Look von iCal und Addressbuch ist durchaus nicht mein Ding, aber ich nutze diese Hilfsprogramme nur relativ selten, und es stört mich nicht wirklich. Ist halt der übliche Ami-Kitsch, den wir ja schon von den iDVD- und Pages-Templates her kennen. Man muss das ignorieren lernen.

Außerordentlich gut gefallen mir die neuen Buttons und die dezenten Scrollbalken! Da diese ja auch auf Website-Layouts auftauchen (solange der Webdesigner sie nicht individuell anpasst), sieht sogar das Internet teilweise besser aus!

Überhaupt: Für mich sind es eher die unscheinbaren Kleinigkeiten, die Lion attraktiv machen, als die heftiger beworbenen Features, auf die ich gut und gerne verzichten könnte. Mal sehen, wie sich Autosave und Versions so machen werden, wenn sie von den Programmen aktiviert werden, die ich so täglich verwende.

Und zum Abschluss noch ein Appell an alle MacOS-X-Anwender: Benutzt um Himmels willen eure Tastatur zum Starten von Programmen! Ob nun Spotlight, Launchbar, Alfred oder Quicksilver – Man kann ein Betriebssystem ohne tastaturbasierten Launcher nicht effizient bedienen!

Geld spenden, Filmprojekt fördern

2011-08-11T08:53:00Z

Für unsere kleine Videoplayer-Vergleichswebsite VideoSWS suchten wir vor ein paar Wochen nach einem schicken, abwechslungsreichen Beispielfilm. Die ehemalige Würzburger (inzwischen Berlin und International) Filmproduktion Moviebrats sprang dankenswerterweise mit einem eigens geschnittenen Showreel ein.

Und weil mir dieses Showreel so gut gefällt, fällt es mir jetzt umso leichter, ein Förderprojekt zu bewerben: ASTERNAUTS soll der professionell produzierte Abschlussfilm von Marta Masferrer werden, eine skurille SciFi-Komödie. Über Crowdfunding sollen insgesamt 18.000 € als Budget gesammelt werden – die edlen Spender erhalten natürlich exklusives Material zum Angeben und Sich-Cool-Fühlen.

Gecrowdfundet wird über Kickstarter und Startnext, und ich bin mit 20 Euro dabei – als Gegenleistung bekomme ich – falls das Projekt wirklich abhebt – eine schicke DVD. Falls es nicht klappt, ist das Geld natürlich nicht verloren, sondern wird (hoffentlich) zurücküberwiesen. So läuft’s im Internet-Business!

Auch Lust, einen ambitionierten Kurzfilm zu unterstützen? Nur zu!

(via Würzblog)

Wochenlinks

2011-08-07T23:00:00Z

Netzfundstücke vom 01.08. bis zum 08.08.:

malte welding über das aufhören

Neue Wege zur Erzeugung von HTML5-Animationen

2011-08-01T20:55:47Z

Und da war sie, die große Development Opportunity. Spätestens seit klar war, dass Adobe es technisch nicht hinbekommen würde, eine ordentliche und stromsparende Version von Flash auf ARM-Prozessoren zu bauen, und allerspätestens seit Steve Jobs allen klargemacht hat, dass Flash explizit kein erwünschter Gast auf der iOS-Party ist, mussten entsprechende Alternativen her. Wie praktisch, dass sich zeitgleich HTML5 als hypefähige Webtechnologie entpuppte. Zumindest konnte man sich aus einem ganzen Rudel von Webtechnologien einen neuen Hype zusammenaggregieren und diesen dann HTML5 taufen.

(Im Folgenden rede ich oft von HTML5-Animation. Gemeint sind Animationen und Interaktionen, die über JavaScript, CSS3, HTML5-Video, SVG oder Canvas realisiert wurden. Ich weiß, dass HTML5 auch nur für das Markup stehen kann, aber hier ist’s ein anderer Kontext!)

Natürlich muss sich eine neue Technologie die Frage stellen lassen, ob sie mit der alten, welche sie zu ersetzen gedenkt, auch wirklich mithalten kann. Technisch ist das mit Sicherheit nicht der Fall. Flash ist schlicht in fast allen Belangen überlegen. Die grafischen Möglichkeiten sind extrem vielfältig, ActionScript ist eine bestens dokumentierte und hochprofessionelle Programmiersprache, es existieren Schnittstellen zu allen möglichen Systemen. Kurzum: Die mangelhafte ARM-Unterstützung und die Tatsache, dass eine einzelne Firma über die Entwicklung waltet, sind quasi die einzigen Makel.

Denn – und damit kommen wir zurück zum Hauptthema dieses Artikels – man komme mir nicht mit dem alten Lied, Flash würde so unglaublich viel Performance fressen, und man solle doch bitte HTML5 statt dessen verwenden, um Strom zu sparen. Das ist nämlich Blödsinn, und die vielen neuen Programme zum Erzeugen von HTML5-Animationen beweisen das:

Hype (Authoring-Tool)
Sencha Animator (Authoring Tool)
Adobe Edge (Authoring-Tool)
Adobe Wallaby (»Kompiliert« FLA-Dateien zu HTML5-Animationen)
Swiffy (wandelt SWF in HTML5 um)
Dreamweaver 5.5 (kann auch HTML5-Animationen erzeugen)
Radi (Animations-Software für Canvas)

(Wir sehen also: Selbst Adobe ist mit drei – teils experimentellen – Produkten mit am Start und versucht, auf den HTML5-Zug aufzuspringen.)

Das Performace-Problem hingegen bleibt: Die exakt gleiche Animation, so sie eine gewisse Komplexitätsstufe erreicht, wird auch (und gerade!) unter HTML5 höllisch Performance fressen und den Lüfter der Notebooks zum Drehen bringen. Der Grund für den hohen Stromverbrauch ist nämlich nicht Flash an sich, sondern das Streben nach immer aufwändigeren Animationen, das vor allem im »Big Business« der großen Markenkonzerne und Werbeagenturen eine große Rolle spielt. Leider völlig vorbei am Endkunden, dem kleinen Internet-Surfer, der sich von aufwändigen und ruckeligen Bewegungen eher genervt fühlt.

Wenn wir Performance-Probleme mit Websites haben, sollten wir also nicht Flash oder HTML5 beklagen, sondern die Designer und Markenstrategen, die uns mit ihrem schwerverdaulichem Opulenz-Wahnsinn beglücken wollten. Die Zukunft aber liegt schon seit längerem im Speed. Wirklich erfolgreiche Webmarken wie Facebook, Google und YouTube haben das erkannt und warten mit schlichten, kleinen, handgeskripteten Animationen auf, um die Usability zu erhöhen, ohne die Ladezeiten zu erhöhen. Man muss sich in erster Linie schnell durch die Angebote klicken können, die Toleranz gegenüber lahmen Websites sinkt rapide!

Ich werde auch in Zukunft keinen Respekt vor Killer-Websites haben, auch wenn sie mit noch so schönem HTML5 gestrickt sind. Wir haben es nämlich mit einem konzeptionellen Problem zu tun, nicht mit einem technischen.

Soviel Rant darf am Abend erlaubt sein!

Wochenlinks

2011-07-31T23:00:00Z

Netzfundstücke vom 25.07. bis zum 01.08.:

Tablet Web Browsing Market Share
Charles Arthur, reporting on these web browsing stats from Netmarketshare: In other words, for every thousand page views by a tablet, 965 w…

Die Großartigkeit des tegut…–Designs

2011-07-31T13:55:42Z

Man kann das selten von einer Supermarkt-Kette sagen, aber bis auf die bescheuerten drei Punkte im Namen gefällt mir so ziemlich alles an tegut…. Ich könnte mir stundenlang die Schriftmischung aus FF Tisa und FF Unit Rounded ansehen, die fröhlichen Farben, die leicht verbeulten Kreise und auch insgesamt das Layout aller Drucksachen (vom Kundenmagazin bis zur Brötchentüte): Alles ist einerseits aufgeräumt und normiert, andererseits aber mit großzügigen Farb- und Freiflächen spannungsvoll und souverän umgesetzt. Die manchmal etwas arg bunten und perfekten ~~Stockfotos~~ Fotos – geschenkt!

Großes Lob an Edenspiekermann, himbeerblau und die anderen Leute, welche für den richtigen Look sorgen für den ~~Bio-Supermarkt, der auch normale Produkte anbietet~~ Supermarkt, der auch viele Bio-Produkte anbietet, und angenehm wenig Reformhaus-Feeling ausstrahlt.

Meine Bookmarkleiste

2011-07-27T15:26:13Z

Auch wenn Bookmarks sowas von 1998 sind (und der nächste wichtige Trend, nämlich Social Bookmarks ebenfalls seit 2008 keinen mehr interessieren), so nutze ich doch mit großem Gewinn die Bookmarkleiste meines Hauptbrowsers Safari. Ich habe dort all die Nachschlageseiten und kleinen Helferlein untergebracht, die ich mehrmals wöchentlich brauche und zu faul zum Googlen bin. Zur Ergötzung meiner Leser hier die Liste:

Verwaltung

mite. (Direkter Link zu meinem Mite-Account für die Online-Zeiterfassung)
Billomat (Direkter Link zur Online-Fakturierung)
Collmex (Direkter Link zur Online-Buchhaltung)
Google Unlock (Spezial: Weil sich so oft Leute fälschlicherweise mit meiner GMail-Adresse anmelden möchten, muss ich oft das Konto entsperren)

WordPress und Textpattern

MODX

Git

Webdesign Tools

Wochenlinks

2011-07-24T23:00:00Z

Netzfundstücke vom 18.07. bis zum 25.07.:

leralle: "apps vs the web" http://lnxs.de/h3 guter text, mal abseits der üblichen frontlinien gedacht
(vor 1 Tag)
Japanische Muster generieren
Wer steht bitteschön nicht auf diese traditionellen japanischen Muster? (Solche zum Beispiel.) Mit Hilfe des Japonizers kann man selbst we…
Making Desktop Web Apps in Lion
Andy Ihnatko: Automator — that singularly-awesome utility and infrastructure for automating damned-near any task — has a new feature th…

Responsives Layout auf praegnanz.de

2011-07-20T19:30:39Z

Ich habe mich heute abend zwei Stündchen hingesetzt und endlich das gemacht, was ich schon seit ca. einem Jahr vorhatte, nämlich das Layout von praegnanz.de für kleinere Bildschirme zu optimieren.

Dabei gehe ich in insgesamt vier Extra-Stufen vor, wobei es im Grunde nur zwei Hauptstufen sind, die mit drei Mini-Zwischenstufen ergänzt werden:

Normal-Layout (ab 1070px Breite)
praegnanz.de-Schriftzug wird eingerückt (780–1070px)
praegnanz.de-Schriftzug verschwindet, Abstände zwischen den Spalten schrumpfen (717–780px)
komplett linearisiertes Layout, linke Spalte entfällt (481–780px)
Mobile-Safari-Schriftgrößenanpassung wird deaktiviert (unter 481px)

Noch sind nicht alle Bereiche gut zugänglich und hübsch gemacht, aber in Kürze werde ich mich um die entsprechenden Anpassungen kümmern. Irgendwann muss man mal anfangen!

Darum ist Google+ derzeit keine Gefahr für Twitter

2011-07-16T07:22:49Z

Die gleiche Information. Links auf Google+, rechts auf Twitter (mit der offiziellen Mac-OS-X-Applikation):

Mehr Worte, aber exakt meine Meinung im t3n

Webmontag in Würzburg: Der Neunte

2011-07-14T06:28:32Z

Am Montag (18. Juli 2011) wird der neunte Webmontag in Würzburg begangen, wie immer im Coworking-Space in der Veitshöchheimer Straße 14.

Wir freuen uns auf alle, die vorbeikommen möchten! Ich werde jetzt noch schnell einen Vortrag ins Wiki stellen. Mal nachdenken.

BasicWein – Der cleane Weinshop im Internet

2011-07-08T07:49:30Z

Heute ist ein neues Projekt an den Start gegangen, mit dem ich nun testweise unter die Handelsvertreter gehe. Aber keine Angst, mein Fuß wird nicht eure Haustür blockieren, und ich werde auch nicht Burgunder mit Bordeaux mischen:

Vielmehr teste ich, zusammen mit einem meiner Kunden, die Möglichkeiten einer Wein-Verkaufs-Plattform im Netz, die ohne verschnörkeltes Brauchtum und ohne Weinkenner-Sophistication auskommt. Mit BasicWein habe ich mir eine Marke ausgedacht, die dem Gerne-Wein-Trinker eine Möglichkeit bietet, zu günstigen Preisen aus einer sehr übersichtlichen Auswahl an Weinen zu erwerben, und das zu sehr günstigen Preisen.

Das Geheimnis liegt in der geringen Menge von Flaschen, die für jeden Wein noch vorhanden ist. Für den traditionellen Weinvertrieb sind es zu wenige, aber mit einer kleinen und agilen Webplattform kann man hier noch das eine oder andere Schnäppchen anbieten. Wenn der Verkauf erstmal ein bisschen anrollt, lohnt es sich also, öfter mal vorbeizugucken.

Technisch setze ich auf das nicht unproblematische xtc:Modified, und zwar eher aus pragmatischen Gründen: Es lassen sich damit sehr schnell Ergebnisse erzielen, und diese Plattform ist erstmal nur ein Experiment, für dessen Einrichtung ich erstmal kein Geld verlangt habe. Statt dessen werde ich am Umsatz beteiligt, was für mich eine ganz neue Erfahrung darstellt, und eine Chance, in den Online-Marketing-Bereich hineinzuschnuppern.

Ich bin gespannt, wie es laufen wird mit BasicWein und ermutige natürlich alle, mir Feedback zu geben über Fehler und Verbesserungsvorschläge!

Mein Problem mit diesen Kreisen

2011-07-07T22:42:00Z

Für ein Generallob oder eine Generalabrechnung zu Google+ ist es meines Erachtens noch einige Monate zu früh. Aber ich muss kurz einen Aspekt besprechen, der mein Hirn derzeit durchknotet: Wie schaffe ich mir ein adäquates mentales Modell für die Kreise in Google+?

Alles klar – es sind Personengruppen, an die ich gezielt etwas richten kann, oder denen ich gezielt lauschen kann. Doch so ganz einfach ist es auch wieder nicht. Denn es sind nicht etwa die gleichen Personen, denen ich zuhöre wie die, an die ich Nachrichten sende – auch wenn man das meinen möchte.

In der Praxis sieht es aber so aus, dass ich Personen ungefragt einem meiner Kreise hinzufügen kann, ohne dass dieser etwas dagegen tun kann. Ja, diese Person muss ja nicht einmal Mitglied bei Google+ sein. Somit wird es bei mir kaum einen Kreis geben, in dem alle enthaltenen Personen mir auch tatsächlich zuhören. Extrembeispiel ist mein Kreis »Familie« – derzeit besteht dieser aus 5 Personen. Wenn ich auf die Idee käme, eine Nachricht an meine »Familie« zu richten, würde dies nicht eine einzige Person bemerken, weil niemand aus meiner Familie bei Google+ angemeldet ist, und das wird sich auch so schnell nicht ändern.

Oder ein anderes Szenario: Nehmen wir an, ich bin ein kleiner und unauffälliger Google+-Benutzer, der sich aber gerne von den »Stars« der Webwelt inspirieren lässt. Also packt er sich einen Kreis »Web-Promis« zusammen, und steckt dort von Lobo und Sixtus über Johnny und ix bis hin zum Knüwer alle siebzehneinhalb deutschen Web-Dampfplauderer hinein. Auf diesem Kanal wird er jede Menge interessantes Zeug lesen können, doch wenn er selber sein Wort an diese Gemeinde richtet, wird es keinen Effekt haben.

Mit einem Satz: Die Kreise in Google+ suggerieren gefühlsmäßig eine Art Club, oder zumindest eine feste Gruppe, in der man sich kennt und über Themen austauschen kann. Doch dieses mentale Modell ist falsch: Kreise sind einseitig und spielen nur auf meiner eigenen Seite der Verbindung eine Rolle. Sie sind ebenso asynchron wie das Followersystem von Twitter, nur dass es sich nicht so anfühlt.

Wenn ich beim Google+-Posten eine Gruppe auswähle, fühlt es sich an wie eine Gruppenmail an einen bestimmten Teil meiner Freunde. Und alle, die nicht darauf reagieren, haben mich bösartigerweise geblockt. Meine Erwartung (Das müssten doch jetzt alle aus dem Kreis gelesen haben!) wird enttäuscht, auch wenn mein Hirn das natürlich theoretisch verstanden hat.

Diese Verkomplizierung ist meines Erachtens unnatürlich und wird es Google+ schwer machen, im Mainstream gut aufgenommen zu werden, wo das simple ja/nein-Prinzip nicht ohne Grund erfolreich gewesen ist. Freund oder Nicht Freund – einfacher und simpler kann man’s nicht machen. Google’s Kreisgeschichte ist eine nette Reißbrettnummer mit ungewissem Massen-Appeal. Schaun wir mal, ob sich mein Gehirn dergestalt umprogrammieren lässt!

Wochenlinks

2011-07-03T23:00:00Z

Netzfundstücke vom 27.06. bis zum 04.07.:

‘Own a Shape’
Clayton Miller: Microsoft’s Metro UI owns the square. Apple has a corner on the roundrect, from the Springboard launcher to the iPhone ha…
clientsfh: Shades of blue - Client: I don’t like that blue, make it a bit lighter. Just a small bit! I send the... http://tumblr.com/xep39amejz
(vor 3 Tagen)
johnallsopp: Create awesome CSS3 gradients like this with @johnallsopp's new and improved tool: http://t.co/gDjSeTf
(vor 3 Tagen)
codepo8: Wow, full video course on CSS3 from @thinkvitamin is now free: http://bit.ly/dEAFT9
(vor 4 Tagen)

Natives Video-Fallback in Firefox: Durchgefallen!

2011-07-02T07:37:10Z

Wie lange gibt es das Video-Element in HTML5 schon? Und vor allem: Wie lange behaupten die Browserhersteller schon, dies in ihren aktuellen Versionen zu unterstützen? Zwei Jahre? Länger?

Bullshit! Wenn man einmal ohne JavaScript-Hilfen versucht, eine MP4-Datei über <video> einzubinden und sich erdreistet, auch noch eine Fallback-Information zu platzieren, die dann angezeigt werden soll, wenn der Browser das MP4 nicht nativ abspielen kann, wird sich ärgern! Folgender Code ist nun wirklich denkbar simpel:

<video width="640" height="360" controls autoplay>
  <source src="video.mp4" type="video/mp4">
  <p>Here’s fallback</p>
</video>

Hier in Aktion

~~Jeder Mensch, der eine HTML-Spec lesen kann, weiß, dass hier im Firefox das p mit dem Text angezeigt werden müsste, weil Firefox kein MP4 abspielen kann.~~ (In Chrome 12 geht MP4 übrigens immer noch ohne Probleme – so ernst hat es Google mit WebM dann wohl doch nicht gemeint)

Content may be provided inside the video element. User agents should not show this content to the user; it is intended for older Web browsers which do not support video, so that legacy video plugins can be tried, or to show text to the users of these older browsers informing them of how to access the video contents.

(Quelle: W3C HTML5 Working Draft)

Doch Firefox versucht sich statt dessen lieber am Abspielen der Datei und scheitert mit einem grauen Kasten. Was soll das? Die Mozilla-Stiftung gibt mir damit zu verstehen: Entweder ich benutze das Video-Elemen mit allen alternativen Codecs, oder ich lasse es lieber ganz sein (oder weiche auf JavaScript aus, wo man per API erkennen kann, was abspielbar ist und was nicht.)

Das Problem besteht mindestens in Firefox 4 und 5 und ist nicht haltbar. Die Hälfte der Videoplayer auf meiner Vergleichsseite (die Anfang der Woche relaucht wird) verlassen sich (zurecht) auf das native Fallback-Verfahren, weil es einfach und elegant ist: Video for Everybody hat’s vorgemacht. Aber wehe, ihr lasst WebM und OGG weg, dann klappt gar nichts mehr im Firefox!

Shame on you!

update: Offenbar eine bewusste Entscheidung. Macht’s nicht besser.

Korrektur: Wenn man die zitierte Stelle aus den Spec genau liest, erkennt man, dass nur ein Quasi-Fallback gemeint ist, wenn ältere Browser das video-Element gar nicht kennen. Wenn sie es kennen, aber den Codec nicht unterstützen, soll laut Spec das ganze Video-Element ignoriert werden, inkl. seines Fallback-Inhaltes. Lächerliche Entscheidung aus Praxis-Sicht, aber Ian Hickson verteidigt sie.

Ein Tag, vier interessante News

2011-06-29T08:05:48Z

Nummer 1: Google startet (mal wieder) wieder ein neues Social Network. Nachdem es mit Orkut, OpenSocial und Wave nicht ganz so gut geklappt hat, ist nun Google+ an der Reihe. Das interessante daran ist meines Erachtens vor allem die Aufteilung in Module, die verschiedene Dinge machen und auf die (wahrscheinlich) auch gesondert zugegriffen werden kann. Keine monolithische Website, sondern mehrere Web-Apps wie Video-Chat, Textchat usw., deren jeweilige Einstiegshürde hoffentlich sehr gering sein wird. Wenn es jemand gibt, der Facebook derzeit noch stoppen kann, dann wohl Google. Regentraufen- und Pestcholera-Vergleich bitte hier einfügen.

Nummer 2: Die neue iOS-5-Betaversion 2 bringt uns natives Touch-Scrolling (inkl. Gummiband- und Entschleunigungs-Physik) in beliebigen Block-Containern mit Overflow-Inhalt. Will heißen: Mit einem beherzten -webkit-overflow-scrolling: touch; kann man sich nachgebaute JavaScript-Lösungen wie iScroll und Scrollability in Zukunft sparen!

Nummer 3: Wieder Google. In den Labs brodelt nun Swiffy, ein vollautomatischer Konverter von SWF nach SVG-basiertem HTML5. Derzeit ein experimenteller Online-Service, wo man seine SWF hochlädt und die standardbasierten (aber mitnichten menschenlesbaren) HTML5-Dateien zurückbekommt. Zuviel sollte man (noch) nicht erwarten: Lediglich das Featureset von Flash 5 wird vollständig unterstützt (Erscheinungsjahr: 2000). ActionScript 2 (seit 2003) ist hochexperimentell und wird nur teilweise unterstützt. Ich vermute außerdem, dass komplexere Animationen unter nativem Flash deutlich besser performen. Jedenfalls bei meinem kleinen Privattest mit einer SWF aus dem Jahr 2004, die ich noch hier rumfliegen hatte. (Vorsicht beim Testen: Man kann richtig zugucken, wie ~~der Browserspeicher vollläuft~~ die CPU-Nutzung innerhalb einiger Sekunden auf 100% ansteigt! Browser-Tab nach einer Minute schließen, sonst geschieht ein Unglück!)

Demo anzeigen

Nummer 4: Jaja, schon wieder Google. Jetzt ziehen sie ihrem kostenlosen Webfont-Service schicke neue Klamotten an. Die Auswahl bleibt sehr gemischt – neben soliden und hervorragenden Schriften ist auch viel Schrott und Plagiatiges dabei. Handle with care!

Wochenlinks

2011-06-26T23:00:00Z

Netzfundstücke vom 20.06. bis zum 27.06.:

chaotin: Nazis werden immer dümmer: http://tsia.de/014 (via @Fr_Maus)
(vor 3 Tagen)
markus_schlegel: Hier übrigens nochmals der Hinweis darauf, dass der @web_martin und Icke über etwas am bloggen sind: http://bit.ly/mKSRvt
(vor 3 Tagen)
web_martin: Deutschland, schau hierher: »Niederlande schreiben Netzneutralität im Mobilfunk vor«; Extrakosten für Skype usw. tabu. http://j.mp/lW6zLS
(vor 3 Tagen)
basic payment
espiekermann: Why do proper quotes and apostrophes on iPhone & iPad keyboards turn into dumb ones in text? http://t.co/Qjk402a
(vor 5 Tagen)

Die Großartigkeit von MediaElement.js

2011-06-20T12:35:34Z

Ich habe mich lange Zeit gesträubt, im großen HTML5-Videoplayer-Vergleich einen Sieger zu küren, doch eigentlich war es die ganze Zeit klar: Es ist MediaElement.js von John Dyer

Der Player hat vier entscheidende Vorteile:

Er wird aktiv weiterentwickelt. John ist sehr engagiert und antwortet im github auf Bug Reports
Er ist übersichtlich aber erschöpfend dokumentiert
Er beherrscht sowohl Video als auch Audio
Er bietet eine extrem clevere Verschmelzung von nativem HTML5 und Flash-Fallback.

Letzteres ist eine weitere Erläuterung wert: MediaElement.js nimmt die offizielle HTML5-JavaScript-API-Befehle zum Manipulieren der Player-Eigenschaften und leitet sie gewissermaßen an den dafür präparierten Flashplayer weiter. Es ist also für den Anwender ganz egal, ob sich der Browser gerade nativ um das Abspielen der Videos kümmert oder bereits an Flash übergeben hat – die API zum Steuern des Players bleibt exakt gleich! Der Vorteil hierbei: Die (natürlich immer noch notwendige) SWF-Playerdatei besteht im Grunde nur aus einer einfachen Projektionsfläche, an die diverse Event-Listener geklebt wurden, die auf die nativen JavaScript-Befehle hören, welche zum Steuern des Players verwendet werden. Somit braucht man als Webdesigner beim Skinnen des Players nur mit CSS zu hantieren, denn auch das Flash-Fallback wird über die selben HTML-Elemente und JavaScript gesteuert! (Das gilt übrigens sogar für Silverlight, wenn man das unbedingt möchte …)

Darüber hinaus versteht sich der Player sogar auf RTMP-Flash-Streams, beherrscht unter Mac OS X echtes Vollbild, kann sowohl Kapitelmarken als auch Untertitel anzeigen, und letztere sogar in mehreren Sprachen ausgeben. Die automatische Übersetzung über die Google Translate API wird allerdings in Kürze kaputt gehen, aber das liegt natürlich an Google …

Ich habe in der letzten Woche ein sehr hübsches Projekt mit MediaElement.js umgesetzt und war zu jeder Zeit äußerst zufrieden mit dem Player. Well done, John!

Wochenlinks

2011-06-19T23:00:00Z

Netzfundstücke vom 13.06. bis zum 20.06.:

Tim Bray on ‘Web’ vs. ‘Native’ Apps
Tim Bray: I’m pedantic enough to be a little irritated by the common “Web vs Native” usage. They’re all Web apps, and this argument…
gerritvanaaken: Schickes Buch über die Lehre in Sache Typografie: http://t.co/eFVdYvs
(vor 6 Tagen)

Nochmal über native und webbasierte Apps (update)

2011-06-16T09:09:23Z

So wie es aussieht, wird es ein echtes Dauerthema bleiben: die Frage nach der besseren Methode, eine Applikation für ein Smartphone zu entwickeln. Und in diesen Tagen wird besonders viel darüber geschrieben. Kluge Essays sind dabei, zum Beispiel von Tim Bray.

Im Grunde kann man die Diskussion aber auf 5 simple Vor- und Nachteile herunterbrechen, und das will ich hier tun. Auch, um allen etwas Grundmunition für spätere Wortgefechte zur Verfügung zu stellen.

Fakt 1: Native Apps sind potenziell schneller, schöner und fühlen sich besser an. Das ist derzeit de facto so, auch wenn es nicht für alle Ewigkeit in Stein gemeißelt sein muss. Zumindest unter iOS und Android ist HTML/CSS und JavaScript noch nicht in der Lage, native UI so nachzuahmen, dass dem interessierten Nutzer der Unterschied nicht auffallen würde.

Fakt 2: Webapps können nur einen Teil der OS-APIs nutzen. Kamera, Zugriff auf Adress- oder Mediendaten, Dateiuploads, ~~Gyroskop~~, Kompass usw. sind für reine Webapps nicht einsetzbar. Native Apps sind besser ins Betriebssystem und in die Hardware integrierbar. Dies ist nicht immer ein gewichtiges Argument, aber muss ich Kopf behalten werden. Immerhin: Geolocation geht gut!

Fakt 3: Webapps können nicht in den diversen »AppStores« gelistet und dort gefunden, geladen oder gekauft werden. Das ist für viele Entwickler das Killer-Argument schlechthin: Eine Webapp wird einfach nicht gefunden und benutzt, wenn der Benutzer nicht explizit danach googlet, oder wenn die App nicht über vorhandene Infrastruktur aggressiv beworben wird. In den AppStores und Marketplaces dieser Welt können hingegen selbst bisherige No-Names reich und berühmt werden. Stichwort »Tiny Wings«.

Fakt 4: Native Entwicklung ist teurer und (derzeit) schwerer kalkulierbar. Der Markt für gute iOS-Entwickler ist zumindest mal leergefegt. Nur mit viel Geld oder einem glücklichen Timing kann man einen zuverlässigen und geschmackssicheren Entwickler überreden, für sich zu arbeiten. Darüber hinaus ist man (zumindest unter iOS) auf Apples Gunst/Willkür angewiesen, die bei manchen Apps auch mal »Nein« sagen können.

Fakt 5: Bei Webapps gibt’s Crossplattform-Fähigkeit als beinahe kostenlose Dreingabe. Es ist ja in vielen Fällen schon billiger, eine Webapp für eine bestimmte Plattform entwickeln zu lassen. Doch wenn der Entwickler nicht komplett dumm ist, läuft das Ergebnis ohne größeren Mehraufwand auch gleich unter allen Plattformen mit vernünftigem Browser. Der Einsatz von Frameworks hilft hier natürlich zusätzlich.

Soweit die wichtigsten Punkte, die wohl die meisten unterschreiben würden. Wie man das im Einzelnen gewichtet, hängt vom Projekt, dem Auftraggeber und letztlich dem persönlichen Geschmack und dem eigenen Fundamentalismus ab.

Dass man eine Webapp auch mit wenig Aufwand in einen nativen Mantel hüllen kann, soll am Ende nicht verschwiegen werden. PhoneGap kann hier beispielsweise behilflich sein – und sogar einige der nativen OS-APIs zur Verfügung stellen! Dafür muss man aber ab einem bestimmten Zeitpunkt in die jeweilige Entwicklungsumgebung (XCode oder Eclipse) wechseln und dort zu Ende entwickeln. Ob es da nicht fast einfacher ist, gleich nativ zu beginnen? In jedem Falle kann man mit einer Ummantelung das AppStore-Problem in den Griff bekommen, und das ist ja auch schon was – wenn auch nicht wirklich elegant …

Ich persönlich bleibe jetzt erstmal den Webapps treu. Nicht auszuschließen, dass ich irgendwann mal zusätzlich native Entwicklung lerne, aber vorerst kümmere ich mich um das, was ich am besten kann: Mit modernen Webstandards nette Websites und Webapps bauen!

Leseliste (wird erweitert)

Responsiv lebt sich’s cool

2011-06-15T07:12:08Z

Der neue heiße Scheiß ist ja Responsives Weblayout. Vor ziemlich genau einem Jahr habe ich Jon Hicks als Pionier für den kreativen Umgang mit CSS-Media-Queries herausgestellt. Inzwischen gibt es viele andere Websites, die nach ähnlichem Prinzip vorgehen und innerhalb eines Stylesheets unterschiedliche Viewport-Breiten bedienen. Im Webdesignledger gibt’s 30 tolle Beispiele! Damit dürfte die Totgeburt media=”handheld” nun endgültig dem Restmüll geweiht sein, nehme ich an.

Auch auf praegnanz.de möchte ich im Grunde sehr gerne responsiv werden, allein die Zeit fehlt mir für ein tolles Konzept. Das kommt aber noch. Ganz sicher!

(via Flocke)

Typografie in Dänemark

2011-06-13T13:06:36Z

Fluch und Segen zugleich: Als typoaffiner Designer kann man niemals aufhören, ständig Schriften zu entdecken, zu erkennen und zu analysieren. Auch im Urlaub nicht. Vor allem nicht, wenn das typografische Milieu, in das man reist, so prägnant und konformistisch daherkommt wie Dänemark.

Der Däne liebt moderne serifenlose oder serifenbetonte Schriften mit einer kubischen Note, offenen Formen und kleinen würzigen Besonderheiten. Es gibt eine Handvoll Fonts, die sich alle recht ähnlich sehen, und die man als Eurostile mit mehr Charakter bezeichnen könnte. Anbei eine kleine Collage mit dänischer Alltags-Typografie:

Der Buchstabe O muss in Dänemark offenbar 4 angedeutete Ecken besitzen, sonst kommt er nicht durch die Ästhetik-Politiet. ;-)

Die einzige richtig dänische Schrift, die ich bisher kannte, war die kostenlose Kontrapunkt. Und diese ist auch der Schlüssel zum Geheimnis. Sie stammt nämlich von der Designagentur Kontrapunkt, welche unter anderem eine ganze Reihe von Schriften und Markenwelten entwickelt, die landesweit von Bedeutung sind: Danske Bank, Danish Railways, Dänische Apotheken …

Sprich: gefühlte 50 % der öffentlichen Typografie in Dänemark stammt von einer einzigen Designagentur. Doch es ist nicht so, dass man sich nicht auch in Deutschland ein bisschen was vom kleinen nordischen Nachbarn abgucken könnte. Wer möchte, sollte mal folgende Schriften ausprobieren:

FF Max Pro
PF Beau Sans Pro
FF Sari und die unvermeidliche FF Dax (von Hans Reichel)
FF Dancer Pro
Stainless
Via für die Dänische Bahn (exklusiv)
Die kostenlose Kontrapunkt
… und eigentlich alles von Morten Olsen, dem dänischen Fontdesigner schlechthin. Da gab’s übrigens auch mal eine freie Schrift, die Union.

Solchermaßen ausgerüstet steht einem hyggeligen dänischen Plakat nichts mehr im Weg!

(Danke an Julia für die Hilfe beim Identifizieren und Recherchieren!)

So wie in InDesign …

2011-06-13T09:49:44Z

… das ist der Traum für viele Designer aus dem Printbereich, die heute wohl oder übel in den sauren HTML/CSS-Apfel beißen müssen und sich andere Paradigmen suchen müssen, nach denen »Seiten«-Layouts im Web funktionieren.

Doch hier springt Adobe in die Bresche: Gemäß ihres derzeitigen Credos »Wir müssen zum Superpragmatiker werden und unsere Fähnchen in alle Windrichtungen aushängen« gibt es jetzt einen Vorschlag für ein neues CSS3-Modul, mit dem man mehrere Textkästen frei positionieren kann, um dort Fließtext durchfließen zu lassen. Klingt sehr nach PageMaker/Quark/InDesign und dürfte wohl mit dem Plan im Hinterkopf entstanden sein, HTML-Layouts direkt aus jenen Layout-Programmen generieren zu können.

Ich bin skeptisch, weil ich immer dann Alarmglocken schrillen höre, wenn es um festgezurrte, mehrspaltige und »auf Textlänge layoutete« Textboxen in HTML/CSS geht. Das passt nicht zur medienunabhängigen Grundphilosophie des Web.

Vielleicht bin ich aber nur ein unflexibel denkender alter Mann und lasse mich in drei Jahren eines besseren belehren. Hier könnt ihr auf jeden Fall mehr über das CSS3-Regions-Modul erfahren.

(Danke, Lukas und Heise)

Wochenlinks

2011-06-12T23:00:00Z

Netzfundstücke vom 06.06. bis zum 13.06.:

smashingmag: How-To: Encoding Video For HTML5 (Video) - http://bit.ly/iGYrzC #useful
(vor 1 Tag)
espiekermann: 2 cellos: a video without any dislikes on YouTube. http://t.co/qyqvCNc #cello
(vor 3 Tagen)
Flocke: Alle, die im Urlaub ihre Mails lesen "müssen" sollten das hier lesen: http://is.gd/YlClTl (I'm looking at you, @dc7590)
(vor 4 Tagen)
The Financial Times Moves to a Web App for iOS
The Financial Times: We have launched a new, faster, more complete app for the iPad and iPhone which is available via your browser rather t…
mauritzl: Holy Shit, es gibt ein neues Album von Lamb http://t.co/FomvW7E #fb
(vor 5 Tagen)

Wochenlinks

2011-06-05T23:00:00Z

Netzfundstücke vom 30.05. bis zum 06.06.:

espiekermann: Before you build a website, check this: http://bit.ly/lBeY6x
(vor 3 Tagen)
markus_schlegel: Subtle Patterns und Creative Commons sind die: http://bit.ly/hdciFB
(vor 4 Tagen)
dasKerst: Na endlich: Folgen ohne Umwege – Twitter holt den Follow-Button für Webseiten raus: http://bit.ly/j2aoMa & http://bit.ly/m3jMhS #metatweet
(vor 5 Tagen)

Wochenlinks

2011-05-29T23:00:00Z

Netzfundstücke vom 23.05. bis zum 30.05.:

iA: Guess what: iA Writer for Mac is... AVAILABLE NOW! http://www.informationarchitects.jp/en/ia-writer-for-mac/
(vor 2 Tagen)
redtoadmedia: DESIGN: Things to consider when designing web for a content management system http://bit.ly/8ZqVcS v @smashingmag
(vor 2 Tagen)

Essentielle WordPress-Plugins für Nicht-Blogs (update)

2011-05-27T12:27:36Z

Dass man mit WordPress nicht nur Blogs, sondern auch kleine bis mittelgroße Websites umsetzen kann, hat sich inzwischen herumgesprochen. Ich habe das auch schon gemacht, obwohl ich ja nicht unbedingt ein uneingeschränkter Fan des Systems bin.

Wie dem auch sei – ich habe in den letzten Jahren eine Liste von wirklich wichtigen Plugins zusammengetragen, die bei fast keiner Installation fehlen dürfen. Selbstverständlich ist mir bewusst, dass Ihr noch eine Million Ergänzungen habt. Und dass ich eh keine Ahnung habe und so. Dazu ist die Kommentarfunktion selbstverständlich freigegeben :-)

RB Internal Links

Wer innerhalb einer Seite eine andere Seite verlinken möchte, sollte dies nicht manuell über die URL machen, sondern selbstverständlich mit der Datenbank-ID agieren. RB Internal Links hilft mit einem netten Navigationsmenü bei der Suche nach gewünschter ID und fügt die Verlinkungs-Syntax automatisch ein.

wpTypography

Korrigiert typografische Tippfehler wie Trennstriche, Mal-Zeichen und Anführungszeichen, schafft CSS-Klassen für bestimmte Zeichen wie &, verhindert Hurenkinder und kann sogar Silben-Trennung. Ein mächtiges Tool, das mit etwas typografischem Sachverstand konfiguriert werden muss, sonst richtet es Unheil an.

WordPress Database Backup

Macht Datenbank-Backups von den Core-WP-Tabellen, auf Wunsch auch von Third-Party-Tabellen. Entweder »on the fly« oder auch regelmäßig. Verschickt die Dumps sogar per Mail, was hyperinteressant ist in Kombination mit einem GMail-Account.

CMS Tree Page View

Für jede anständige Website mit mehr als 10 Unterseiten ist die »Seiten«-Übersicht im WordPress-Backend eine Zumutung. Abhilfe schafft »CMS Tree Page View« und spendiert dem System eine ajaxfizierte Aufklapp-Baumstruktur mit Drag und Drop zum Umsortieren und anderen Späßen. Unverzichtbar für komplexere hierarchische Strukturen.

Permalink-Titel in deutsch

Kein richtiges Plugin, sondern eine Datei, die man einfach locker in den »languages«-Ordner schmeißt. Dort verrichtet sie stumm ihren Dienst und ersetzt bei der automatischen Generierung vom Permalinks Umlaute und Esszett-Zeichen zu sinnvollen Alternativen.

TinyMCE Advanced

Der Name ist irreführend: ich verwende das Plugin eigentlich selten zum Erweitern des visuellen Editors, sondern eher zum Simplifizieren. Aber man kann natürlich auch das eine oder andere sinnvolle Tool damit freischalten, wie zum Beispiel die Überschriften-Ebenen, damit die Redakteure nicht ständig Absätze als <strong> auszeichnen und denken, sie hätten damit eine Überschrift gesetzt.

Custom Fields Template

Custom Fields sind eine Super-Sache, wenn die Handhabung nicht so fummelig für den Redakteur wäre. Dieses Plugin nutzt die ganz normalen Custom Fields von WordPress, doch der Webentwickler kann schöne Eingabemasken mit Erläuterungen und verschiedenen Content-Typen erstellen, die den Redakteur führen und das Eingeben von komplexeren Datensätzen einfach machen.

Relative Image URLs

Beim Einfügen von Bildern in den Textbereich werden relative statt absolute URLs erzeugt. Sieht übersichtlicher aus und erleichtert enorm das Umziehen zu anderen Servern!

W3 Total Cache

Im Gegensatz zum schrottigen WP SuperCache lässt sich W3 Total Cache ziemlich problemlos zum Laufen bekommen. W3TC setzt an sehr vielen unterschiedlichen Stellen an, um die Seitenaufrufe für Besucher der Website zu beschleunigen und den Server zu schonen. Viele der Features lassen sich zwar nur mit Root-Zugriff auf den Server nutzen, aber auch für Billighoster-Nutzer ist genug Funktionalität dabei, um von 2 Sekunden auf 0,2 Sekunden zu kommen ;-)

Simply Show IDs

Für Entwickler während der Entwicklund nützlich: Dieses kleine Tool fügt in jeder Artikel-, Seiten- und Kategorie-Auflistung eine Spalte hinzu, in der die Datenbank-ID der entsprechenden Ressource angezeigt wird.

Adminimize

Mit ein paar gezielten Klicks lässt sich hiermit das Backend von WordPress vereinfachen. Feingranuliert nach Benutzertyp kann man alle möglichen Dinge ausblenden, die den Redakteur stören könnten!

WPML

Inzwischen kostenpflichtig, aber trotzdem (oder deswegen?) das einzige ernstzunehmende Mehrsprachen-Plugin für WordPress. Arbeitet sauber und zuverlässig und wird auch aktiv weiterentwickelt. Ich habe die 79 Euro bisher nicht bereut! Wer zahlt, darf meckern – das kann auch mal sinnvoll sein!

Blick über die Schulter: ein Moodscreen

2011-05-26T10:22:18Z

Die meisten meiner Kunden hatten bereits Websites, bevor sie meine Kunden wurden. Es geht also oft um Relaunches. Dinge wie Firmenname, Logo und Farbwelt stehen da bereits fest.

Manchmal gibt es aber auch die Chance, bei der Gründung einer neuen Firma mitzuwirken, und die Website quasi als Mutter des Corporate Designs zu bestimmen, aus der sich andere Kommunikationsmittel ableiten. Manchmal ist nicht einmal der Name ganz klar, sondern befindet sich in der Schwebe.

Um Tatsachen zu schaffen und eine Diskussionsgrundlage aufzumachen, erstelle ich manchmal freie Moodscreens, die zwar Ähnlichkeit mit echten Screendesigns haben, jedoch eher eine grundsätzliche Farb-, Form- und Typosprache vermitteln sollen. So geschehen bei »Performance Flow«. Firma und Website sehen inzwischen komplett anders aus, aber dennoch mag es interessant sein, mir über die Schulter zu gucken, wie ich in einer Stunde einen kompletten Moodscreen zusammenbastele – hier als Zeitraffer in einem 5-Minuten-Video – viel Spaß:

Wochenlinks

2011-05-22T23:00:00Z

Netzfundstücke vom 16.05. bis zum 23.05.:

Flocke: Die Chrome Developer-Tools haben es ja echt drauf: http://is.gd/2lj41P In 40 Jahren schafft Microsoft sowas auch :-)
(vor 5 Tagen)