Design Tagebuch

Design Tagebuch

Start / Themen / Relaunch / Duden reformiert Webauftritt

Duden reformiert Webauftritt

Duden Relaunch

Pünktlich zum 180. Geburtstag von Konrad Duden wurde dieser Tage die Webpräsenz duden.de auf einen neuen Aufbau und ein neues Design umgestellt. Den Nutzer erwartet nun auf der Startseite ein Interface im Look einer Bibliothek, welche Lust zur Interaktion machen soll.

Ich dachte in Bezug auf das Thema Metaphern spontan an das legendäre Stern.de-Cockpit aus den Anfängen des Internets. Vielleicht tue ich der neuen Duden-Lösung damit aber etwas unrecht. Die Startseite erscheint auf den ersten Blick modern und ansprechend. Vor allem der wärmere Gelbton wirkt einladender, als der Yellow-Wert im Vorgänger. Übrigens wurde kürzlich ja auch gelbeseiten.de auf einen augenfreundlicheren Farbwert umgestellt. So richtig mag mich das Produkt der Startseite nicht überzeugen. Es fehlen in den Aufklappmenüs die Rollover-Effekte, sodass das Interface-Design an dieser Stelle unfertig erscheint. Auch ist die Kombination aus einem virtuellen Raum, perspektivisch verzerrten Keyvisuals für die einzelnen Hauptgruppen gepaart mit einem dann doch eher klassischen, zweidimensionalen Aufklappmenü zumindest gewöhnungsbedürftig.

Wem diese Anwendung zu spielerisch erscheint, hat immer die Möglichkeit über die Hauptnavigation im Header einzusteigen. Kinder haben vielleicht mehr Spaß den Mauszeiger über die Bilder fahren zu lassen. Leider passiert in diesem Fall aber nichts, da nur die Begriffe selbst bei Rollover ein Menü erscheinen lassen. Wenn der virtuelle Raum eine jüngere Zielgruppe ansprechen soll, dann müsste/sollte sie nach meinem Dafürhalten wesentlich intuitiver angelegt sein. Das schmöckernde Mädchen auf dem Boden ließe sich ebenfalls mit dem Bereich “Kinderbücher” verlinken. Auch könnte es bei Rollover Winken oder eine ähnliche Aktion ausführen, wodurch die Interaktion verstärkt und das Gesamtkonzept erst so richtig zum Tragen käme.

Die Unterseiten sind weiterhin im dreispaltigen Aufbau angelegt. Hier wurde also lediglich das Design per CSS-Datei modifiziert. Abgesehen von den bis zu drei gleichzeitig animierten Bannern, die sich auf verschiedenen Seiten in den beiden äußeren Spalten dem Nutzer aufdrängen, ist der Auftritt sachlich und leicht zugänglich. Immer wieder fraglich sind Navigationsleisten, bei denen die Redundanz der Begriffe ein noch schnelleres Zurechtfinden im Wege steht. Wenn ein Oberbegriff “Unterrichtsmaterial” heißt, dann ist er im subsumierten Menü abkömmlich. Das verkürzt nicht nur die Menüleiste, die Seite wird auf diesem Wege auch von überflüssigen Begriffen entrümpelt. Der Nutzer muss weniger Lesen und kann so schneller Navigieren.

Für den Auftritt verantwortlich zeichnen die Agenturen Digitale Informationssysteme, dessen Firmenname man im Impressum kurioserweise unterschlagen hat sowie die glas ag.

Danke Lukas und Jennifer für die Tipps.

abgelegt in Relaunch, erstellt von Achim Schaffrinna am 06.01.2009 | 09:57
Stichwörter: , , ,

26 Kommentare zu 'Duden reformiert Webauftritt'

  1. am 06. Januar 2009 um 10:06 Uhr

    Äh der Link funktioniert nicht, bei anklicken kommt man auf die Seite von Karstadt.

  2. am 06. Januar 2009 um 10:19 Uhr

    Danke. Ist korrigiert.

  3. am 06. Januar 2009 um 10:29 Uhr

    Hellau.
    Ihr habt den externen Link am Ende des Artikels falsch verlinkt.

    Ansonsten finde ich den Auftritt im Gegensatz zur alten Seite wesentlich besser. Aufklappeffekte müssen eigentlich nicht immer sein….

  4. markus
    am 06. Januar 2009 um 10:48 Uhr

    Der Schlagschatten vom Header ist etwas übertrieben. Ansonsten ein schönes Ergebnis.

  5. stuessyO
    am 06. Januar 2009 um 10:58 Uhr

    Moijenz! Also nach gewissenhaftem Lesen habe ich mir die Seite mal angeschaut und kann dem Geschriebenen und Beschriebenem nur beiwohnen. Super zusammengefasst!!! *lob Für meine Belange ist dem nix zuzufügen. Ich hätte mir auch bei solch verspielter Erscheinung mehr Spaß am und beim navigieren gewünscht.

    Anyway, der kleine Linkteufel hat sich aber immer noch nicht ganz vertreiben lassen. Klickt man auf den Link “glas ag” erscheint folgende Seite: http://www.designtagebuch.de/duden-reformiert-webauftritt/www.glas-ag.com

    Nicht, dass ich nicht fähig war die Seite extern und selbständig zu öffnen… ;)

  6. stuessyO
    am 06. Januar 2009 um 10:59 Uhr

    PS: Auch die Namen der Firmen sind doch im Duden Impressum zu finden! =D

  7. am 06. Januar 2009 um 11:08 Uhr

    > Auch die Namen der Firmen sind doch im Duden Impressum zu finden!
    Bei mir sieht der erste Eintrag wie folgt aus. Ein Name ist hier nicht enthalten.

  8. am 06. Januar 2009 um 11:34 Uhr

    Erschreckend.

    Es ist beeindruckend, wie auf der neuen Seite mit der Bühne ein riesen Platz vollkommen ungenutzt bleibt. Die Navigation ist ja redundant und der einzige Mehrwert, den die Bühne bietet, sind die DropDown-Menüs, die bei der Hauptnavigation sinnvoller wären. Viel wichtiger wäre es, Besuchern der Website Direkeinstiege zu häufig besuchten Seiten zu geben, aktuelle Meldungen darzustellen oder schlichtweg zu verkaufen. Dementsprechend deplaziert ist das einzeln dastehende Duden-Buch, das unter der Bühne wie nachträglich eingefügt wirkt.

    Und dass Metaphern gar nicht oder nur in sehr begrenztem Rahmen funktionieren, ist nicht nur seit den 90ern bekannt, sondern wird hier wieder sehr schön demonstriert: Für keines der 6 Themen in der Bühne gibt es ein richtiges und eindeutiges Motiv.

    Bin gespannt, wieviel Monate sich die Seite halten wird.

  9. am 06. Januar 2009 um 11:44 Uhr

    Den Auftritt zu zentrieren, wäre wesentlich besser gewesen als ihn linksbündig auszurichten. Aber auch die Freistellung der Grafik des Duden-Exemplars auf der Startseite, ist alles andere als gelungen.

  10. am 06. Januar 2009 um 12:04 Uhr

    Der Herr links der den virtuellen Raum betritt greift ein Buch aus dem Poster was vor ihm hängt :))
    hehe.

  11. am 06. Januar 2009 um 12:11 Uhr

    Interessante Ansätze, aber schlecht umgesetzt.

    Ein regelrechter Schock dann auf der Hauptseite. Allein schon ein zentrieren, in Kombination mit einer über die vollen Breite gehenden Header-Hintergrundgrafik würde hier massive optische Verbesserungen bringen.

    So sieht das aus, als würde die Hälfte fehlen.

  12. am 06. Januar 2009 um 12:15 Uhr

    Je länger man da drauf schaut, um so mehr überkommt einen das Grauen. Die Elemente im Header wirken willkürlich platziert und ungeordnet, die Spalten hätte man mit identischer Breite versehen sollen, oder aber einen deutlichen Unterschied in der Breite einbringen müssen.

  13. am 06. Januar 2009 um 12:57 Uhr

    @_Sven (10): Ich denke mal, das soll die Sparte der eBooks näher hervorheben. Schließlich zieht er das Buch direkt aus einem Handy-Poster :)

  14. Gustav
    am 06. Januar 2009 um 12:58 Uhr

    Im Impressum steht diese digitale informationssystem GmbH (Firmenname mit Logo als Grafik, Adresse als Text) und die glas ag (als Text).

  15. am 06. Januar 2009 um 13:02 Uhr

    Ein paar kleine Änderungsvorschläge:

    http://huepenbecker-design.de/stuff/duden.png

  16. am 06. Januar 2009 um 13:04 Uhr

    Danke Gustav, da hatte mein Adblocker mir aufgrund der Bild-URL (…adview..). die Grafik vorenthalten.

  17. Till
    am 06. Januar 2009 um 13:18 Uhr

    Wurde eigentlich schon alles gesagt, die Idee finde ich ganz gut, die Umsetzung ist allerdings mehr als nicht gelungen. Auch so Kleinigkeiten wie in den Aufklappmenüs, einmal wird ein Foto verwendet, ein anderes mal eine Illustration. Schaut man sich mal die Websiten der verantwortlichen Agenturen an wundert ein das alles aber nicht mehr.

  18. tim
    am 06. Januar 2009 um 13:25 Uhr

    Ich will ja nicht behaupten das Layout ist

    Ka|cke, die; – [zu →kacken] (derb): 1. Kot. 2. schlechte, minderwertige Sache; unangenehme, Unwillen hervorrufende Angelegenheit: …

    Aber zwischen den Begriffen “herzlos” “mutlos” und “lieblos” hält es sich irgendwo auf.

  19. Razer
    am 06. Januar 2009 um 13:42 Uhr

    Man,

    ist es wirklich so schwer, eine Seite zu erstellen, die sich mit den 3 bekanntesten Browsern öffnen lässt, denn mit Safari sieht die Seite wirklich Ka|cke, die; – [zu →kacken] (derb): 1. Kot. 2. schlechte, minderwertige Sache; unangenehme, Unwillen hervorrufende Angelegenheit: … aus.

  20. am 06. Januar 2009 um 16:26 Uhr

    Die Seite wirkt noch etwas unfertig – die Mouseover-Zustände wirken wirr, da es viele unterschiedliche Versionen gibt – bei den Aufklappmenüs gibt es gar keine Mouseover-Zustände. Ich finde die Hauptnavigation hätte in jedem Fall auch ausfahrbare Untermenüs vertragen können…

    - der Inhalte hinter “Lerntherapie” sind unvollständig (zumindest im IE7)
    - die Suchfunktion im Header ist unharmonisch positioniert
    - die Webseite wäre besser zentral positioniert
    - grafisch insgesamt etwas unsauber

    Die Idee mit der Eingangsseite eine lebendige Welt zu schaffen finde ich gut. Bei “Duden” hätte ich bei der Umsetzung aber noch etwas mehr erwartet. Zum Schluss noch ein großes Plus: Die Systemauslastung ist trotz Flasheinsatzes echte klasse und auch eine uraltmaschine laggt nicht. Das sieht bei den meisten aktuellen Flashlösungen gänzlich anders aus …

    Viele Grüße
    Till

  21. pibo
    am 06. Januar 2009 um 18:01 Uhr

    Die gesamte Seite wirkt sehr leer und unstrukturiert.
    Es gibt keine klare Abgrenzung der Suchbegriffe untereinander und auch keine wirkliche Struktur der Produktinformationen.
    - Bei jemanden wie dem DUDEN hätte man mehr erwarten können?!

    Vielleicht hat es damit zutun (meine vermutung) das 2 unterschiedliche unternehmen an der Webseite gearbeitet haben. Im Impressum findet man zumindest die Trennung “Technik & Design”.

    Abgesehen davon mag ich den DUDEN ohnehin nicht, da die tatsächlich Geld zur Nutzung verlangen (3Monate 20Euro) – sollten die es doch einfach Kostenlos anbieten – wer das Buch kauft, kann ja zahlen, oder?!

    Ich jedenfalls werde es nicht nutzen!
    Gibt ja ohnehin genügend andere Möglichkeiten im Internet.

  22. subthing
    am 07. Januar 2009 um 09:48 Uhr

    die idee an sich gefällt mir eigntl. echt gut.aber die umsetzung könnte deutlich besser sein.
    zentriert wäre zudem sicher angenehmer, vor allem bei höheren auflösungen.
    und wie bereits erwähnt, der freigestellte duden lässt zu wünschen übrig, man will doch kein “zerknittertes” buch kaufen, dass einfach so im raum schwebt…
    da wäre ein “verkaufstisch” schon schick gewesen.

  23. Kay
    am 07. Januar 2009 um 15:02 Uhr

    Die Seite bietet einige nette Ansätze, jedoch mag ich das Flashbanner nicht.
    Die Personen bewegen sich, agieren aber in keinster Weise, weshalb mir die Version mit dem statischen Bild einfach besser gefällt. Ich habe nichts gegen Verspieltheit und optische Finesse, kann mich aber nur schwer damit anfreunden, wenn sich etwas auf einer Internetseite bewegt nur um der Bewegung willen. Besonders wenn es um etwas rein textliches wie den deutschen Duden geht.
    Naja, aber besser als die Version vorher ist es allemal.

  24. am 08. Januar 2009 um 00:25 Uhr

    diese Seite nicht zu zentrieren ist ein Verbrechen.

    der *verspielte* Bereich wirkt zu groß – so als ob Bücher trennen , denn verbinden.

    der Verlauf hinter dem Header Bereich hat fast dieselbe Farbe wie dieser und dshalb wirkt es nicht wie eine Trennung oder farbliche Abstufung, sondern wie der Versuch die fehlende Breite -(wegen fehlender Zentrierung) zu kaschieren.

    der Verlauf ist außerdem irgendwie zu komprimiert – zumindest sieht es so auf meinen Bildschirm aus.

    die nachfolgende Dreispaltigkeit in alter Aufteilung ist auch nicht so der Einfall

    ehrlich – so verrückt es klingt, der vorherige Auftritt war in sich stimmiger
    lg

  25. am 08. Januar 2009 um 13:07 Uhr

    Erschreckend finde ich wirklich, dass unter “Schulbücher” (dahinter verbrigt sich der Auftritt von http://www.duden-paetec.de/) immer noch mit Framesets hantiert wird. Ich dachte, dass Frames eigentlich schon auf dem Müllhaufen der Webdesign-Geschichte gelandet wären ;-)

  26. am 10. Januar 2009 um 10:39 Uhr

    [...] DUDEN mit neuem Webauftritt im Bibliothek-Look (via designtagebuch) [...]



Konstruktive Kommentare bevorzugt

Auch beim Kommentieren darf jeder gerne kreativ werden. Das wird in diesem Blog sogar ausgezeichnet.

Unterstützend können die folgenden HTML-Schnipsel verwendet werden.

fett <b>Text</b>
Link integrieren <a href="http://www.beispieldomain.de">Beispieltext</a>
Bild/Grafik einfügen <img src="http://www.beispieldomain.de/grafik.gif">


4 + = 11

Anzeige