Mit der Neugestaltung von Handelsblatt.com schließt die economy.one nach den Relaunchs von Wiwo.de und Karriere.de die Verjüngungskur ihrer Webseiten ab. Wie auch schon bei den beiden genannten digitalen Titeln wurde auch der Auftritt des Handelsblatt von einem dreispaltigem zu einem zweispaltigen Aufbau umgestellt.
Ein Name
Dabei auffällig ist die Verringerung der Gesamtbreite von 875 auf gerade einmal noch 795 Pixeln. Hingegen das Logo im Header erfuhr eine deutliche Aufwertung. Statt klein in einem orangefarbenen Kasten untergebracht, formen nun riesige Lettern den Absender der Site, schwarz auf weiß. Die vertikale Linie vor dem Schriftzug entfällt. Die Wortmarke im Header ist nun analog der Printausgabe angelegt, denn auch hier ist der Zusatz “.com” um 90 Grad gedreht und sitzt rechts neben der Wortmarke. Zwei Medien, ein Titel und eine Marke. Eine Stringenz in der Markenführung, wie man sie immer noch recht selten wahrnimmt. Auf anderen Sites wie dem Handelsblatt-Aboservice bleibt die vorgestellte Linie übrigens erhalten. Auf Handelsblatt.com taucht sie lediglich noch als Schmuckelement in der Navigation und den Überschriften einiger Marginalspaltenmodule auf.
Lesekomfort
(Hell)Blau als Link-Farbe ist in Kombination mit der recht klein gesetzten Arial zu schwach. Auch sonst ist der Text aufgrund zu kleiner Größe nicht gerade lesefreundlich. Bei Wiwo.de sorgt die Verdana bei gleicher Größe zumindest für etwas mehr Lesekomfort. Bei Handelsblatt.com allerdings wirkt sich die geringe Gesamtbreite an dieser Stelle negativ aus, was umso mehr auf die Stimmung drückt, da sich der Auftritt nicht sauber per Textvergrößerung skalieren lässt. Er verharrt in seinem engen Rahmen. Die rechte Spalte bricht zudem nach unten weg. Gut hingegen gefällt mir persönlich die zusätzlichen kontextbezogenen Filter- bzw. Ergänzungsmöglichkeiten auf den Ausgabeseiten der Volltextsuche.
Fazit
Ein Relaunch, der auf die derzeit bewährten Mittel zurückgreift und bei dem vieles richtig gemacht wurde.
Partner für den Relaunch von Handelsblatt.com waren der Technikdienstleister Circ.it und die Agentur Denkwerk.
besser, besser, besser! Nach meinem persönlichen Geschmack finde ich drei Spalten in einer Website des öfteren einfach zu überladen. Lesen am Bildschirm ist ohnehin schon nicht komfortabel. Ich frage mich nur, warum man den gesamten Body links ausgerichtet hat. Welchen Nutzen hat das, dass rechts gähnende Leere herrscht. Auch wenn dort mal Anzeigen platziert werden sollten. Einzig die gestürzte Typo “.com” find ich doof.
Ich sehe nur Verbesserungen.
Schade allerdings, dass die Schriftgrößen nicht deutlich angepasst wurden: Die Artikel sehen weiterhin wie das Kleingedruckte auf Anzeigen aus. :(
Smile! Gerrit – Wir sprechen Online.
finde ich im großen und ganzen sehr gut, ein bisschen mehr abstand (5-10 px) vom linken rand wäre noch schön
Kann mir mal jemand sagen warum 1. alle Nachrichten-Sites immer ähnlicher werden und 2. immer schmaler (Pixelbreite)? Hat da irgendein Usability-Labor ne Studie zur optimalen Wahrnehmung einer News-Page rausgebracht? Oder will man nur viieeel Platz für Werbung haben?
vg
PS: Ansonsten die gleiche Leier: Wenigstens valides HTML hätte man produzieren können (und nicht 1392 Fahler). Ist doch nicht so schwer.
Jan, ich denke das Zurückrudern in der Breite hat viel mit neuen Zugangstechnologien (Handhelds, WebTV…) und der Erkenntnis zu tun, dass kaum jemand die verfügbare Auflösung seines Bildschirms auch tatsächlich fürs Browsen benutzt: 1680×1050, 1600×1200, 1280×768 … beim Bildschirm kann trotzdem 1000×1000 (oder weniger!) beim Browserfenster bedeuten.
Smile! Gerrit – Wir sprechen Online.
Ich finde erschreckend, dass hier im Designtagebuch kein Aufschrei gegen die fixed width erfolgt.
Im Internet kann man nicht beeinflussen wie groß der Bildschirm des Lesers ist.
Design darf nicht nur auf “Schönheit” aus sein, sondern muss auch Usability- und Interaction-Design sein. Im Zeitalter der massiven Breitbild-LCDs ist eine fixed-width Seite schlicht und ergreifend kathastrophal, egal wie durchgängig das Design ist.
Kann mich dem Fazit nur anschließen. Das geht in die richtige, moderne Richtung.
Die Veringerung der Breite ist den Skyscraper Werbbanner rechts geschuldet. Die Schriftgrößenaufteilung ist in Ordnung und gliedert die Wertigkeit der Texte ganz gut.
Wer argumentieren will, die Widescreens sind im Kommen, dem sei gesagt, das man mit zunehmender Auflösung mehr und mehr vom Vollbild Fenster wegkommen wird. Und als Gegenargument kommen immer mehr mobile Geräte ins Spiel (Mini-PCs, Handhelds, IPhones). Der Lesekomfort wird auch nicht gesteigert durch Fließtexte die Breiten von 500px übersteigen, das hat mit Lesegewohnheiten und der Art des Lesens in Sekaden generell zu tun.
Zwei Sachen sind allerdings kritisch:
– Das Hauptmenü kann dynamischer gehalten werden und die Submenüpunkte beim Rollover eines Punktes in der ersten Zeile freigeben
– Der Code ist Müll! Es geht nicht um die Zahl der Fehler, sondern um die Art der Fehler. XHTML transitional deklarieren und schon gleich bei den meta tags (nicht die größte Herausforderung) scheitern ist absolut unprofessionell
Alphager, diese Diskussion führt (aktuell) einfach nicht weiter: Die meisten (Web-)Designer hängen diesbezüglich leider in Ihrer (Print-)Welt fest. Und die HTML-Coder halten variable Layouts häufig für “zu kompliziert”. Nun ja…
Smile! Gerrit – Wir sprechen Online. (auch fix ;)
“Ich finde erschreckend, dass hier im Designtagebuch kein Aufschrei gegen die fixed width erfolgt.”
Ich finde das gerade lobenswert. Die fluid width bei XHTML (vor allem bei Content Seiten) kann man als gescheitert ansehen, ist hier im DT ja auch nicht anders. Gescheitert in dem Sinne, als am Publikum vorbei. Bei Flash verhält es sich anders. Aber hier beim Handelsblatt hatten Werbebanner hohe Priorität, mussten ein festen “Bezahlplatz” erhalten und eine Endlos-Zeile schreckt jeden Leser ab. Hier würde man sich wiedersprechen, wenn man einerseits auf große Screens hinweist, aber andererseits zu einer fluid width rät. Mit Zwang zu festgelegtem Konsum der Zeitung hat das wenig zu tun. Eher mit notwendigen Empfehlungen, die vom Nutzer durch Fenster anpassen und zoomen / Schriftgrad erhöhen in Maßen durchbrochen werden können.
Neuer Handelsblatt.com Webauftritt live…
Seit heute Nachmittag steht der neue Handelsblatt.com Webauftritt online. Infos zum Relaunch halten unter anderem W&V und Horizont bereit sowie unsere Pressemitteilung.
……
@alphager
auf fixe Größen ist das Layouten einfacher und vorhersehbarer wie das ganze aussieht. Eine Website bis zu 1000px Breite ist doch Benutzerfreundlich.
Das Handelsblatt selbst hat ein Schritt in die richtige Richtung gemacht aber die Umsetzung ist nicht besonders gelungen. Nichts Neues unmutig bis auf die Anzahl der HTML-Fehler ;) Die zu klein geratene Breite, die den Content unnötig in die Länge zieht, motiviert aufgrund der zu lang geratenen Scroll-akrobatik die Seite weg zu klicken.
Was mich an vielen Websites stört, dass trotz der CSS-Technik immer noch kein anständiges Gestaltungsraster erkennbar ist.
Was mich an vielen Websites stört, dass trotz der CSS-Technik immer noch kein anständiges Gestaltungsraster erkennbar ist.
Ich wundere mich immer wieder über das Unwissen bzgl. der Layoutbreiten, das bei jedem Newsportal-Relaunch hier in den Kommentaren aufkommt. Muss ich jetzt mal was zu sagen. Die Breiten beruhen ausschließlich auf einem Kriterium: Werbeplatzierung. Das hat nichts mit mobile Internet, Barrierefreiheit, Usability o.Ä. zu tun. Wiwo, Spiegel, Handelsblatt usw. sind alle nach den Bannerformaten gerastert, schließlich finanziert sich so ein großes Onlineangebot fast nur über die Werbung.
ganz schön aufstrebend, das “.com” neben dem Handelsblatt-Schriftzug.
Beauty is in the details ; )
Es ist schon gut, wenn die Seite nicht auf 100% Breite skaliert. Aber man kann es trotzdem intelligent lösen, indem es z.B. in einem bestimmten Breiten-Bereich (bis 1280 Px z.B.) skaliert. Oder einzelne Elemente skalieren in der Breite mehr, als andere. Ob die Seite dann trotzdem oben links kleben muss, sei mal eher zu klären.
Ansonsten finde ich die angesprochenen Änderungen auch lobenswert – obwohl ich kein Leser des Handelsblatts bin. Aber ich sehe große Defizite im Umgang mit dem Text. Die Schrift finde ich gar nicht mal zu klein, aber der Zeilenabstand, die Ränder und Abstände finde ich zu klein. Vor allem aber der Zeilenabstand. Das wirkt alles sehr gezwängt, obwohl nicht viel Inhalt dargestellt wird. Die Times in den Überschriften finde ich gar nicht gut – ja, ich weiß Haus-Type, aber trotzdem! Und Versalien auf den Buttons muss IMO auch nicht sein.
Fast alle Nachrichten-Websites haben nun das gleiche Grundlayout. Das ist unter Aspekten wie Design, Kreativität und Differenzierung ein bisschen schade. Für die Juser dürfte das durchaus einige Vorteile haben. Die müssen die Bedienung nicht auf jeder Nachrichten-Website neu lernen.
Die Einzigen, die zuletzt etwas Neues probiert haben, waren die Zoomer-Leute. Allerdings kann ich nicht sagen, das das besser war. Das Konzept erschließt sich mir immer noch nicht.
Die technische Umsetzung der Handelsblatt-Seite könnte nicht kaputter sein. So eine Umsetzung ist meines Erachtens auch betriebswirtschaftlich einfach dumm. Wenn man korrektes XHTML schreibt, kann man heute davon ausgehen, dass eigentlich alle Browser das auch korrekt umsetzen. Wenn man kaputtes HTML schreibt, ist man auf die Fehlerbehandlungsroutinen/eingebaute Toleranz der Browser angewiesen. Das ist kaum standardisiert. Was ein Browser mit dem kaputten HTML macht, ist nicht vorhersagbar. Und es gibt heute eben nicht mehr nur 2 Browser, sondern die Zahl der Browser/Clients explodiert förmlich. Durchtesten kann man das also auch nicht alles. Und wenn dann vielleicht bei 1-10% aller Benutzer das kapuute HTML auch kaputt gerendert wird, dann gehen einem eben auch Werbeeinnahmen in dieser Größenordnung durch die Lappen.
> Die müssen die Bedienung nicht auf jeder Nachrichten-Website neu lernen.
Naja, wie viele Nachrichten-Sites liest denn ‘der’ User so? Sobald ich mehr als eine regelmäßig lese, tu ich das doch sowieso über nen RSS-Reader, oder?
“Design darf nicht nur auf “Schönheit“ aus sein, sondern muss auch Usability- und Interaction-Design sein. Im Zeitalter der massiven Breitbild-LCDs”
Sehr gute idee, dann bauen wir doch nur noch Websiten, die sich auf die ganzen 1920px ausbreiten sollen. Hat dann zwar absolut nix mehr mit Usabillity und Readability zu tun aber egal, es kommt gut an bei anderen Programmierern.
Ich finde fixed width ist nicht unbedingt schön, vor allem weil der Inhalt dann links so verloren wirkt (für Werbung gibts ja AdBlock). Das Argument das ein Großteil der DAUs nur eine erbrämliche Auflösung nutzt hilft da auch nicht gerade viel (wenn man nichts ändert merken die nie, wozu es mittlerweile günstige 19″+ Displays gibt). Wenn schon fixed width dann zumindest zentral (wie hier).
Und wenn es darum geht das Webseiten auch auf anderen Bildschirmen als dem Standardmonitor zu lesen sein sollen dann finde ich das so eine “große” Seite wie das Handelsblatt auch eine Version anbieten sollte die für Mobilebrowser geeignet ist (mein Internet Tablet hat eine Ausflösung von 800×480 und MIDs haben noch mehr von daher können die ruhig die Standardversion rendern).
wie jerry oben schon sagt: die ganze diskussion um lesbarkeit, bildschirmausnutzung und clients über webbrowser hinaus geht schlicht and der realität vorbei – hier muss werbung plaziert werden!
superbanner und wallpaper ergeben die gesamtbreite, davon zieht man eine contextspalte in breite eines medium rectangle ab und schon hat man das gängige layout der newsseiten.
die inhalte der seite sind doch eh nur notwendiges übel, um ein umfeld zu schaffen, das leser anzieht – damit man werbung schalten kann. spiegel, wiwo, handelsblatt wollen niemanden informieren – die wollen in erster linie geld verdienen.
deshalb provozieren die reiter in der kontextspalte auf vielen dieser seiten auch einen kompletten reload – das wird als neue PI gezählt und die banner können einmal häufiger gewechselt werden. usability ist hier nicht das thema… nie gewesen, wird es nie sein.
Das Orange ist irgendwie schmutzig und die Art der Seite habe ich schon viel zu oft so gesehen. Alle kopieren nur noc die Konkurrenz und verschwimmen immer mehr.
Besser als vorher mag es sein, gut gefällt es mir aber nicht.
zugute halten muss man den machern aber, dass sie auf die herbe kritik im forum reagieren und immerhin schonmal die textfarben angepasst haben: aus textfarbe grau wurde schwarz und das hellblau ist sooo hell auch nicht mehr. und das immerhin schon 3 tage nach launch…
Ich finde es sehr solide gemacht, zeitgemäß und den Anforderungen gerecht werdend – Werbeplätze, gewohnte Optik der Printversion, nah anderen News-Portalen, denn eigentlich liest man mehr als eine “Zeitung” und als Otto-Normal-Verbraucher und Nicht-Geek keine Reader.
Programmiert ist die Seite allerdings mit ner heißen Nadel und oder wenig Budget fürs wichtige. Da kann das dedizierte CMS dahinter noch so tolle Features haben, der generierte Code ist weniger als gut. Auch das interessiert zuerst nur Geeks, sagt aber einiges darüber aus wieviel Know-How von beiden Seiten in diesem Geschäft vorhanden war.
sollte die festgelegte breite vieler websites tatsächlich einzig und allein und nur und überhaupt mit zu plazierender werbung zusammenhängen, habe ich heute endlich einen positiven aspekt der online-werbung kennengelernt. so ganz mag ich es noch nicht glauben, aber sei’s drum. das argument erscheint mir angesichts vielfältiger werbeformen und unendlich vieler werbefreier sites mit festgelegter breite ein wenig zu pauschal. in diesem zusammenhang muss ich mich immer wieder über den weit …ääh… verbreiteten vollbild-fetischismus wundern, den man doch eigentlich nur auf eine andere, gegenteilige standardisierung zurückführen kann: microsoft windows. alles gross und voll und möglichst bunt. das kann man schnell mit dem gefühl verwechseln, “alles auf einen blick” zu haben. naja.
die offline gesammelten lesegewohnheiten der masse mensch, definiert durch bücher, zeitungen und zeitschriften, widersprechen jedenfalls dem aufschrei, der unweigerlich erfolgt, sobald das fenster nicht mehr dem heillos überfüllten explorer o.ä. entspricht, das offensichtlich längst als normalfall bezeichnet wird. auf den “rückschritt” in puncto lesbarkeit und übersicht einer website mit festgelegter breite wird oft in kommentaren oder forenbeiträgen hingewiesen, bevorzugt ohne absatz, punkt und komma.
sehr rätselhaft, das ganze. ein wirkliches mysterium ist aber die alles entscheidende scroll-frage. klar, weder bücher, zeitungen, noch zeitschriften sind bis heute durch vertikale scrollbalken negativ aufgefallen. hier könnte also die sache mit der gewohnheit ziehen. nicht kopf runter, sondern balken runter. bildschirm hoch analog zu zeitung hoch bringt nichts. da kommt nichts, nur kabel. das ist echt neu und anders. aber wie, zum teufel, hat es der breitformatige flachbildschirm in so kurzer zeit geschafft, die maus mit scrollrad als standard-accessoire zu überholen? hier habe ich ein wenig die apple-user im verdacht ;o)
Ob Werbeplatzierung vorrangig ist oder nicht, das Tagebuch hier hat auch ein feste Breite. Warum? Weil die fluid width gescheitert ist, an den Lesegewohnheiten, am Auge selbst das lieber springen mag als endlos schweifen durch die Zeile.
Welche erfolgreiche Website bedient sich denn der fluid width??? Wo findet man dieses Prinzip – vornehmlich in CSS Anfänger / Fortgeschrittenen Büchern mit entsprechenden Ergebnissen. Kein erwachsenes Design, kein erwachsener Designer nutzt es (mehr), da er / sie sich mit dem Prinzip und der Psychologie des Lesens auseinandergesetzt hat (vgl. https://www.simplebits.com/ oder https://www.alistapart.com/ – nicht unbedingt “Anfänger” in diesen Fragen).
Der immer größer werdende Schirm verstärkt das Problem mit der fluid width, er ist eben KEIN Argument pro fluid width. Der immer größere Schirm schreit nach Nicht-Vollbild-Fenster für Webseiten.
Angst oder Ekel vor dem Scrollen kann man gleichsetzen mit der vor dem Blättern. Man kann auch Bücher doppelt so eng setzen, Spaß wird dadurch nicht generiert.
Ich glaube ich hätte dem Fleißtext einen Hauch mehr Zeilendurchschuß gegönnt. Aber ansonsten sieht es erheblich besser auch als vorher.
Ich habe an vielen großen Portalen (>= handelsblatt.com) mitgearbeitet. Einen 100% sauberen (X)HTML-Code zu bekommen ist ein Ding der Unmöglichkeit. An solche einem Portal arbeiten viele Dienstleister. Dazu wird auch noch dynamischer Content (inkl. HTML und CSS) von externen Dienstleistern geliefert. Das schlechte HTML und JavaScript der Adserver tut den Rest.
Ich habe die Seite gerade mal durch den Validator durchlaufen lassen. Eine Menge der Fehler sind Folgefehler. Da werden JavaScript bei XHTML nicht in ein CDATA gepackt. Somit wird der JS.Code validiert, wobei der Validator natürlich hinfällt. Da gibt es in den URLs unmaskierte “&”. Darüber stolpert der Validator bei XHTML ebenfalls.
Das diese paar Meta-Tags nicht abgeschlossen sind ist natürlich ein Witz, dass so etwas nicht gemacht wurde. Bei vielen Bildern genau das selbe.
Ich fühle mich so in die ecke gedrengt mit meinem 16:9 Monitor.
Die hälfte meines Bildschirmes ist weiß :-(
JavaScript muss nicht immer in ein CDATA gepackt werden, um zu validieren. Abgesehen von Ad-Server Daten sind die restlichen Fehler angefangen mit den meta-tags Belege für fehlendes Know-How und Not an beruflicher Weiterbildung. Ein Ding der Unmöglichkeit ist es nur für die nicht mehr Lernwilligen nicht mehr Lernfähigen.
16:9 Webseiten wird es so Gott will nie geben. 16:9 ist Film und Fernsehformat, teils auch TV-Format aber nicht Webseiten Format. Warum wohl sind Magazine und Bücher nicht in 16:9? Weil es dort eben nicht ergonomisch wäre. Bei größeren Schirmen sollte man sich echt von der Windows-Erbkrankheit Maximiertes-Fenster lösen.
Die Idee, Layout und Fonts ähneln doch sehr stark an der “Times” (https://www.timesonline.co.uk). Natürlich trotzdem viel besser als vorher!
Bis auf die Tatsache, dass die Systemschrift Times New Roman verwendet wurde ähnelt das nicht wirklich der Times.
Die Artikel sind anders dargestellt, das Layout ist linksbündig bzw. zentriert. Die “Idee” ist wohl eine News-Seite zu haben / zu erstellen und nicht wirklich einzigartig. Einen Sidebar rechts zu haben ist auch eher sinnvoll als bloß kopiert.
spiegel.de war hier eher ein Vater
[…] optische Unterscheidungsmerkmale und mehr strukturelle Vielfalt. Ich habe wirklich wenig Lust immer und immer wieder das Gleiche schreiben zu müssen. Ein Blick über den Tellerrand zeigt auf, dass es […]