Relaunch-Time Technikwürze 64

Wenn ich mir angucke, die, die Süddeutsche Zeitung hat vor ein paar Wochen 'nen Relaunch hingelegt. Ich f-, ich finde, die Süddeutsche sollte die Agentur, die das macht, gemacht hat, verklagen. Das ist 'ne Frechheit.

Herzlich willkommen zur Technikwürze Nummer vierundsechzig vom Montag, den 18.3.2007. Mein Name ist David Matzeske und ich führe euch heute durch die Sendung. Der Jens Grochtdreis hat in Technikwürze einundsechzig gesagt, dass er diverse Relaunches von diversen Zeitungen 'ne Frechheit findet. Das habt ihr eben in der Intro gehört und darum geht es heute. Es geht um die Relaunches von der Focus, die Netzeitung, die Süddeutsche und die Welt. Der Artikel ist erschienen auf Jens' Blog.

Den Link dazu später in Technikwürze. Gleich kommen erst mal aber die News und dann der Artikel von Jens Grochtdreis. Viel Spaß.

Empfehlungen.

Web zwei null Tutorials und Inspiration. Auch an diesem Wochenende bieten wir euch interessante Links rund ums Web. Stefan Münzer erklärt in neuen Tutorials Mikroformate. Dreiundfünfzig CSS basierte Menüs präsentieren Vitali und Sven in einer neuen inspirierenden Sammlung auf Smashing Magazine. Wie wichtig sind semantische URLs? Diese Frage stellt sich Robert Nyman. Das Wasp Street Team möchte den Siegeszug der Webstandards auch lokal unterstützen.

Wer mitmachen möchte, kann sich in die Mailingliste eintragen. Eine Top-Ten-Liste der größten Usability-Fehler in Filmen hat Jacob Nielsen zusammengestellt. Und Church zwei null, Nico Wenig betrachtet die Kirche im Zeitalter des ni-- sozialen Web.

So, folgenden Text ist von Jens Grochtdreis erschienen auf grochtdreis Punkt de.

Der Kommentar.

In kurzen Abständen hintereinander haben wir vier Relaunches von großen Newsseiten zu verzeichnen. Süddeutsche Zeitung, Die Welt, Netzeitung und der Focus. Ich bin kein Grafiker, deshalb möchte ich mich nicht an den optischen Details aufhängen. Das machen andere eh viel kompetenter. Als normaler Nutzer dieser Seiten – okay, ich lese eigentlich nie den Focus – kann ich aber sagen, dass mir die optische Überarbeitung gefällt. Aber was steckt unter der hübschen Haube? Das ist mein Thema.

In Technik Würze einundsechzig nahm ich mich schon mal dieses Thema an und konzentrierte mich dabei vor allem auf die Süddeutsche. Schauen wir doch einmal bei allen vier Auftritten unter die Haube. Ein grober Blick bringt die erste erstaunliche Erkenntnis: Im Jahr 2007 haben die Süddeutsche Zeitung und die Netzeitung tatsächlich noch ein Tabellenlayout. Ich finde es unglaublich, dass es immer noch Agenturen gibt, die so was anbieten und Kunden, die so was akzeptieren und kaufen.

Sollte die Entschuldigung lauten, das CMS kann nicht anders ausgeben, so möchte ich dies erst mal einmal skeptisch bezweifeln. Zum anderen wäre dies ein Ansatzpunkt, das CMS zu wechseln oder auf den neuesten Stand zu bringen.

Der Focus. Der Focus hatte den Relaunch lange im Vorhinein angekündigt und ich entsinne mich, dass von einer Erneuerung sowohl des Aufbaus als auch der im Hintergrund arbeitenden Technik die Rede war. Da ich die Focus-Seite aus eigenem Erleben nicht gut genug kenne, kann ich über die angestrebte inhaltliche Neustrukturierung nix sagen. Optisch kommt der neue Auftritt auf alle Fälle frischer rüber und auch unter der Haube ist das Tabellenlayout verschwunden.

Doch besser und sinnvoller ist der Code deshalb noch lange nicht geworden. Es wurden schlicht alle Tabellen gegen Divs ausgetauscht, die zudem auch noch eine lustige Ansammlung von Klassen beherbergen. Dann wird dann vor lauter Begeisterung für die Divs auch schon mal ein solches in einen Absatz geschachtelt. Das ist nicht nur sinnlos, sondern auch nicht statthaft nach den Standards. Es werden Klassen gleich im Familienpack vergeben. P, class, c, gr, fs, pd, t5.

Diese Kombination vergibt eine grüne Farbe, eine Schriftformatierung, nur die Schriftarten und ein oberes Padding von fünf Pixeln. Warum in diesem Stylesheet nicht dem gesamten Dokument eine Basisschriftart vergeben wurde, stattdessen diese Definition auf elf Klassen verteilt wurde, die auch noch allgemein und für Links speziell definiert werden, ist ein sehr spezielles Geheimnis der Ersteller dieser Stylesheets. Die Styles sind unlogisch, das HTML aber noch viel mehr.

Von Semantik überhaupt keine Spur. Auch wenn ich nicht viel von der Diskussion um Divitis halte, hier wurde eindeutig über das Ziel hinausgeschossen. Man kann keine semantische Struktur erkennen. Stattdessen gibt es ein Wirrwarr an Divs, die teilweise schlecht verschachtelt sind. Dazwischen gibt es auch mal ein paar Überschriften, Absätze und Listen. Man merkt aber ganz eindeutig, dass sich nicht wirklich jemand Gedanken über die Semantik des Dokumentes gemacht hat.

"Wir bauen das jetzt alles modern, also alles Divs." So stelle ich mir die Stoßrichtung der Agentur vor.

Die Netzeitung. Auch die Netzeitung ist optisch angehübscht worden. Allerdings ist das Ergebnis nicht so interessant wie bei den anderen Kandidaten. Man kann mehr von einem Rebrush sprechen. Die Optik ist netter, aber nicht grundlegend anders als zuvor. Und der Code? Wir sollten eigentlich lieber den Mantel des Schweigens darüber decken. Wir haben 2007 und die Netzeitung baut noch auf ein Tabellenlayout. Und dieses Tabellenlayout kommt ebenso ohne eine wirkliche Semantik aus.

Es gibt auf der Startseite keinen einzigen Absatz. Aber inspizieren wir einmal aus dem Spaß die Top-Meldung. Sie befindet sich in einer Tabellenzelle. Die Meldung selber ist ein Div. Die Überschrift, halbwegs korrekt ein H3-Element, ist von einem Link umgeben, was nach den Standards logischerweise verboten ist. Es folgt eine einzeilige Tabelle, in der wiederum eine einzeilige Tabelle geschachtelt ist. In dieser inneren Zelle befindet sich ein kleines Bild. Dieser ist verlinkt.

Der Link führt zu einer Vergrößerung des Bildes. Es folgt ein Span-Element, das den Teaser-Text umfasst. Die Erfindung des Absatzes scheint an den Programmierern vorbeigegangen zu sein. Die unter dem Bild befindlichen beiden Links hat man als Liste erkannt und ausgezeichnet. Diese steckt aber in einer einzelligen Tabelle. Wenn ich solchen Code sehe, muss ich mich unwillkürlich schütteln. Was machen die Programmierer beruflich? Wo waren sie in den letzten Jahren?

Haben sie nie 'n Buch gelesen, von Weblogs gehört? Es ist mir unbegreiflich, wie man als Profi im Jahr 2007 noch einen solchen Code abliefern kann. Übrigens stellt sich auf der Artikelseite heraus, dass man bei der Netzeitung doch schon einmal von Absätzen gehört hat. Deren Sinn und Anwendungsweise ist aber offensichtlich nicht erkannt. So finden wir auch hier einen Absatz, in dem ein Div geschachtelt ist. Das Ergebnis ist eine Zwischenüberschrift. Warum eigentlich nicht H3 oder H4 nehmen?

Die Süddeutsche. Auch die Süddeutsche vertraute im Jahr 2007 dem Mittel des Jahres 1997, dem Tabellenlayout. Das Layout kommt durchaus erfrischend daher. Dumm nur, dass die Programmierer offenbar nicht ebenso auf der Höhe der Zeit waren wie die Grafiker. So finden sich auf der Startseite in dem Tabellenverhau zwar Absätze, diese sind aber eher an der Stelle von Listenelementen, denn sie werden zur Aufzählung von zur Nachricht passenden Links genutzt.

Oder es handelt sich eine Überschrift der seitlichen Boxen. Der Teaser-Text unter der Überschrift ist auch jedes Mal ein Überschriftenelement. Offenbar ist man bei der Süddeutschen bauernschlau, sind doch alle Überschriften der angeteaserten Nachrichten als H1 ausgezeichnet. Da vertraut man offenbar auf die Macht der Masse in Bezug auf Google. Viel Glück.

Bei der Süddeutschen ist man aber auch sparsam, denn bei der Artikelansicht über Beckenbauers Auslassung, ein Beispieltext, sieht man zwar fünf Absätze, im Code kommt man aber mit einem einzigen aus. Klasse, Glückwunsch. So habe ich 1998 auch meine Webseiten erstellt. Doch in der Zwischenzeit habe ich mich erstens weiterentwickelt und zweitens habe ich dies nicht für einen renommierten Auftraggeber getan, den dieser Auftrag sicherlich viel Geld gekostet hat.

Die Welt. Schauen wir nach all dem Grauen mal die Welt an. Die Welt verwendet im Kopfbanner und um der Umfrage in der rechten Spalte Layouttabellen. Die Seite selber ist ohne Layouttabellen gemacht. Auch hier gibt es Absätze, die nicht als Absätze, sondern als Span ausgezeichnet sind. Aber die Regel sind sie nicht. Ein Großteil der Seite ist semantisch sinnvoll ausgezeichnet.

Richtig zufriedenstellend ist aber auch hier das Ergebnis nicht, denn es ist nicht einsichtig, warum der eine Nachrichtencontainer einen korrekt ausgezeichneten Fließtext enthält und der nächste nicht. Meine Vermutung, aus der täglichen Praxis gespeist, ist, dass hier der Texteditor des CMS zur Fehlerbedienung einlädt. Alles in allem kann man aber den Verantwortlichen bei der Welt und den Programmierern ein Kompliment machen.

Die Seite ist von allen vier getesteten diejenigen mit dem besten Code. Man hat dabei nicht nur den Ballast der Vergangenheit hinter sich gelassen, sondern hat auch noch die Bedienung der Seite durchaus sinnvoll eingesetztes JavaScript zu einer Freude gemacht. Ich erwarte bei solchen Seiten keine hundertprozentige Validität. Es geht entweder durch schlechte CMS-Editoren flöten oder durch externe Werbung. Leider.

Jens Meier hat schon recht, wenn er dazu aufruft, endlich diese Werbeungetüme valid zu machen. Wenn wir schon immer von diesen gigantischen Bannern genervt werden sollen, dann sollten diese doch wenigstens technisch sauber sein.

Das Fazit: Viel Geld und viel Zeit wurde verbraucht, doch letztendlich haben alle drei von den vier Zeitungen versagt. Einzig die Welt legt einen sauberen und zudem noch in Optik und Konzept interessanten Relaunch hin. Alle anderen sollten ihre Agenturen in Regress nehmen, denn einen solchen Mist sollte man im Jahre 2007 nicht mehr abliefern. Ich weiß, ich lehne mich dadurch sehr weit ausm Fenster, aber es geht mir Qualitätsstandards in unserer Branche.

Überall werden diese als selbstverständlich angesehen. Unternehmen verpflichten sich zur Qualität. Im Netz scheint das in der Masse nicht zu gelten, selbst bei großen und renommierten Auftritten. Die Gründe können vielfältig sein. Zum einen sind die Auftraggeber selten vom Fach und wissen um die Möglichkeiten, können gut von schlecht unterscheiden. Zum anderen kann natürlich auch Geiz ist geil zurückschlagen. Wer die billigste Agentur haben will, kann auch billigen Schrott bekommen.

Sollte die Agentur nicht nur billig sein, so ist es vielleicht deren Personalpolitik. Wenn man den Angestellten wenig bezahlt und keine Fortbildung finanziert, dann kann man auch nicht ohne weiteres Qualität erwarten. Letzten Endes bleibt aber immer jeder Webworker selber für die Qualität seiner Arbeit verantwortlich. Man kann sich auch privat fortbilden. Das tut nicht weh und ist das Brot vieler Angestellter.

Ich kann mir zudem nicht vorstellen, dass der Projektleiter der Süddeutschen auf die Agentur zugegangen ist und gesagt hat: "Ich möchte aber einen Tabellenlayout haben. Diese ganzen Div und CSS Gedöns ist mir nicht geheuer." Also, liebe Kollegen, packt euch an die eigene Nase und bildet euch fort. Einen Ausgangspunkt können die Linkliste und die Adventskalender bei den Webkrauts sein. Wichtig ist aber vor allem die Grundeinstellung.

Neugier, Neugier, Neugier und niemals glauben an Wisse und könne alles. Dieser Artikel ist von Jens Grochtdreis, erschienen auf grochdreis.de. Diesen Artikel könnt ihr ebenfalls auf Webkrauts.de lesen und auch dort kommentieren. Technik Unser Hörer Ed hat uns darauf aufmerksam gemacht, dass der Feed von Technikwütze nicht erreichbar war. Die meisten Hörer von Technikwütze haben Technikwütze ebenfalls abonniert, und zwar über den Feed und dieser war eben nicht erreichbar.

Das hat mein Test heute gezeigt und tatsächlich zeigte die Statistik auch in den letzten vier Tagen einen leichten Einbruch bei den Zugriffen über das Feed. Ich habe heute mal ein bisschen dran rumgeschraubt an der Technikwütze Seite, sodass dieser Feed eigentlich jetzt wieder funktionieren sollte.

Für diejenigen von euch, die Technikwütze 63 oder die Folgen, die sie hören wollten, ältere Folgen vielleicht nicht gehört haben, falls es nicht geklappt haben sollte, ladet euch bitte jetzt über das Feed noch mal die Technikwütze Folge Nummer 63 runter. Wenn ihr diese Folge ganz normal gehört habt, dann sollte zumindest der Feed wieder auch funktionieren.

Für diejenigen, die noch kein Feed benutzen, probiert es doch bitte einmal aus und gebt mir auf jeden Fall Feedback auf echo@Technikwürze.de per E-Mail oder eben auf www.Technikwürze.de in den Kommentarbereich. Vielen Dank. Musik präsentiert von Podsave Music Network. So, auch dieses Mal sind wir wieder am Ende angelangt. Nach knapp, na noch nicht mal fünfzehn Minuten haben wir geschafft von dieser Sendung. Aber freut euch nicht zu früh.

Die nächsten Sendungen, die geplant sind, sind dann wieder etwas längere mit Experteninterviews. Für euch gibt es jetzt noch Jonathan Coulton aus dem Podsave Music Network mit dem Song Drinking With You. Bis nächste Woche Montag.

We work late and I pretend that I don't notice when you're next to me, but I do. I might be mistaken, but I sometimes get the feeling that you notice too. And I know this place that's near here. Quiet, dark and small. When we're finished here, I think that I may want a beer. How about you? It'd be nice to go out drinking with you. You would think that we've danced around each other long enough to know where to stand.

My heart stops in a panic when I think how it would feel to finally hold your hand. So we wait for this to happen or make it happen now. Either way, I think that we should start off with a drink. Maybe two. It'd be nice to go out drinking with you. No big deal. We can play it nice and cool and keep the pressure off. Invite our friends. We'll have a few too many. We'll discreetly share a cab home when evening ends. When we reach that awkward moment standing at your door.

We won't even know 'cause we'll just smile and let it go. Sail on through. It'd be nice to go out drinking with you.