Heidenheim Webauftritt

Heidenheim goes Modern UI

Heidenheim Webauftritt

Die Stadt Heidenheim hat vor wenigen Tagen ihr neues Stadtportal live gestellt. Angesichts des Interfaces fühlt man sich als Besucher spontan an Microsoft erinnert, die vor einigen Monaten all ihre Applikationen auf „Modern UI“ umgestellt haben. Ganz wie Microsoft versprechen sich die Projektverantwortlichen in Heidenheim offenbar von dem neuen Design, Desktop-Nutzer und Mobilanwender gleichermaßen ideal abzuholen. Und ebenso wie Microsoft scheitert auch Heidenheim daran.

Mittlerweile sollte sich herum gesprochen haben, das Modern UI, wie Microsofts Designsprache heißt, zwar ein ambitioniertes und gerade aus Designsicht überaus spannendes Konzept darstellt, in der Praxis allerdings neben vielen Chancen auch einige Pferdefüße beinhaltet. Die Vorstellung, mit dem auf Kacheln basierenden Interface fühlten sich sowohl Nutzer von Mobilgeräten wie Desktop-Anwender gleichermaßen angesprochen, scheint sich nicht bewahrheitet zu haben. Zu sehr ist die fröhlich-bunte, touch-freundliche Kacheloptik auf Mobilnutzer ausgerichtet, zu wenig entspricht sie dem Bedürfnis eines Desktop-Anwenders.

Konkret zeigen sich die Schwächen der Heidenheim’schen Modern-UI-Lösung unter anderem am folgenden Screenshot (Android/Galaxy SII) des Bereichs Bürgerservice.

Heidenheim Webauftritt – Screenshot unter Android

Die Kacheln, die in dieser Ansicht rein dekorativen Charakter besitzen, also in Bezug auf die Nutzerführung nutzlos sind, was nebenbei gesagt ein elementarer Unterschied zur echten Modern-UI-Umgebung darstellt, belegen rund zwei Drittel der Bildschirmfläche. Noch einmal: Zwei Drittel der gesamten Oberfläche sind damit nutzlos. Der einzige, auf dieser Seite befindliche relevante Inhalt befindet sich in einer winzigen Link-Box („Bürgerservice“) links unten. Besser wäre es, die vier hier aufgeführten Links zusätzlich im mittleren Bereich in Form von Teasern vorzuhalten, um auf diese Weise einen möglichst komfortablen Zugang zu ermöglichen. Stattdessen wird im Content-Bereich ein ebenfalls nutzloser Fülltext untergebracht.

Darüber hinaus beinhalte das neue Stadtportal weitere Schwächen:

1. Der Webauftritt ist nicht barrierearm, schon gar nicht barrierefrei. Alle Kacheln, auch die, in denen sich nur Text befindet, sind als Grafiken angelegt, wodurch der Zugriff mittels Tastatur eingeschränkt ist. Die geringen Kontrastverhältnisse von Text zu Hintergrund (z.B. weiß auf gelb) erschweren die Lesbarkeit, gerade auch auf Mobilgeräten! Auch die Verwendung des Schwarztons beeinträchtigt die Lesbarkeit, die besser wäre, wenn statt des reinen Schwarz ein dunkles Anthrazit gewählt worden wäre, um davor weißen Text zu platzieren.

2. Die Hauptnavigation ist zu behäbig, das animierte Erscheinen der Unterpunkte ist eine leider sehr weit verbreitete Unsitte. In dieser Form schränkt die Hauptnavigation die Nutzfähigkeit des Auftritts ein beziehungsweise erschwert sie den Zugriff zum Informationsangebot. Besonders störend ist die Animation der rechtsseitig angedockten Symbolleiste.

3. Die erste Hierarchieebene innerhalb der Hauptnavigation ist nicht verlinkt. Das damit einhergehende Fehlen von Übersichtsseiten innerhalb des Webauftritts ist Ausdruck der Defizite auf Seiten der Konzeption. Zweckdienlicher wäre anstelle einer effektvollen Hauptnavigation die Implementierung von Übersichtsseiten, so wie es gerade auch auf Stadtportalen üblich ist.

4. Auf Unterseiten ist das Stadtlogo nicht verlinkt, es fehlt also die Möglichkeit, zurück zur Startseite zu gelangen.

5. Auf der Nachrichtenseite sind weder Teaser-Überschriften noch Teaser-Bilder verlinkt – ein großes Defizit in Bezug auf die Nutzerführung.

Auf facebook.com/stadt.heidenheim bescheinigen einige Nutzer dem Webauftritt eine „jüngere, modernere“ Optik. Fraglos ist das so. Aber auch die Schwächen in Sachen Technik/Nutzerführung bleiben dort nicht unentdeckt. Über die Farbe-Bilder-Emotionen-Ebene kommt das Stadtportal leider nicht hinaus.

18 Kommentare zu “Heidenheim goes Modern UI

  1. Danke für den Artikel. Genau das war auch mein erster Eindruck, das unter der ganzen gewünschten „modernen“ Optik die eigentliche Aufgabe der Seite vergessen worden ist.

    Ich habe direkt nach dem Launch ebenfalls einen kleinen Blogpost geschrieben mit weiteren Kritikpunkten (teils behoben).
    http://blog.philippreiner.info/555/die-neue-heidenheim-de-homepage

    Nachtrag: Das Logo ist auch auf Unterseiten verlinkt. Nur ist der eigentliche Linkcontainer nicht exakt mit dem Bild abgestimmt. Screenshot:
    http://d.pr/i/YwFy

  2. Naja, nur weil Kacheln im Design verwendet wurden, hat es mit Modern UI noch lange nichts zu tun. Modern UI ist mehr…z.B. eine durchdachte Interaktion bzw. UX. Bestimmte Learnings, die Touch optimiert usw.

    Im Artikel werden Birnen mit Äpfel verglichen, die nur den Leser umso mehr verwirren.

    Für mich ist das Stadtportal eine stink normale Webseite mit paar Kacheln!

  3. Naja, nur weil Kacheln im Design verwendet wurden, hat es mit Modern UI noch lange nichts zu tun.

    Zwangsläufig nicht, nur ist es offensichtlich, zumindest ist es offensichtlich, wenn man die verlinkte Pressemeldung gelesen hat, das sich die Verantwortlichen von Modern UI inspiriert haben lassen.

    Im Artikel werden keine Äpfel mit Birnen verglichen, sondern es wird darauf hingewiesen, dass die Designsprache Microsoft einer gänzlich anderen Logik folgt, als das Interface von Heidenheim.de, bei dem die „Navigationskacheln“ auch dekorative Zwecken erfüllen sollen, womit jedoch die in der Modern-UI-Designsprache verankerten Regeln ausgehebelt werden.

  4. Hmm, beim ersten Blick ist mir auch aufgefallen, dass die Kacheln auch teils von der Benennung/inhaltlich sehr ähnlich sind. 4 Kacheln z.B. mit folgenden Inhalten:

    – Kunst & Museen
    – Theater & Kleinkunst
    – Musik & Konzerte
    – Kulturschiene

    Sind alles Unterpunkte von „Kunst und Kultur“. Für mich als Nutzer sind so „Deeplinks“, die gleich auf den Inhalt und nicht unbedingt erst auf die Oberrubrik verlinken gut, weil ich so unter Umständen schneller zu meinem speziell gesuchten Inhalt komme. Aber das scheitert hier, wie ich finde, daran, dass die einzelnen Punkte von der Namensgebung und auch inhaltlich nicht so klar voneinander abgegrenzt sind. Da bin ich also, wenn ich auf der Startseite bin, sehr verwirrt.

    „Wo genau muss ich jetzt hin? Was soll denn der Unterschied zwischen Kulturschiene und Kunst&Museen sein?“

    Da fehlt mir auch ein bisschen das inhaltliche Konzept dahinter.

  5. @lrrm

    Danke für den Beitrag. „Meckern auf hohem Niveau“ trifft es sehr gut. Heidenheim ist eine Kleinstadt mit 48.000 Einwohnern. Setzt man den neuen Internetauftritt in Relation mit unvergleichbar größeren Städten (DT berichtete hier mehrmal selbst) kann sich das Ergebniss mehr als sehen lassen. Eine gute Arbeit, die selbstverständlich auch davon zeugt, dass es in den südlichen Gefilden der Republik noch Kommunen gibt um die es finanziell gut bestellt ist :)

    p.s. dieses ewige Vergleichen nervt! Ja, man kann die Seite mit dem gegenwärtigen Interface von Windows 8 vergleichen. Man kann Tomaten mit Paprikas und Mäuse mit Ratten vergleichen. Bringts was?: Nein! Ähnlichkeiten sind natürlich immer auch einem aktuellen Zeitgeist, sprich Geschmack, zuzuordnen. Heute Glossy, morgen Plain, übermorgen Kacheln. Das nennt man wohl Mode. Wem das nicht passt, der kann ja sein Internet lahm legen.

  6. @clemens

    Danke für den Beitrag. “Meckern auf hohem Niveau” trifft es sehr gut. Heidenheim ist eine Kleinstadt mit 48.000 Einwohnern.

    Das entspricht doch einer Zielgruppe von mindestens 48.000 Usern. Ich finde, selbst wenn man nur von der Hälfte ausgeht, sollte man sich darüber im Klaren sein, dass man sich nicht mehr im „Kumpel ich brauch mal eine Webseite“-Bereich aufhält und dass jede Arbeit Kritik ausgesetzt ist.

    In diesem Fall muss ich den Author zustimmen, da es sich hier ganz klar nicht um „Eine gute Arbeit“ handelt. Auch sollte man darauf hinweisen, dass der Preis in keiner Relation zu der Qualität der Webseite steht.

    „essen & trinken“, „hotels“, „onlineshop“,“veranstaltungen“ usw. : Es fühlt sich an als wäre ein Brainstorming ohne Zwischenschritt umgesetzt worden.

    Zum Vergleich zu Windows8:
    Microsoft hat nun mal den ersten Schritt gemacht und auch wenn es „Kacheln“ auch schon vorher gegeben hat hat sie Windows8 nun mal „bekannt“ gemacht.
    So wird also alles kommende auch damit verglichen werden, wem das nicht passt, der kann ja sein Internet lahm legen.

    So funktioniert das nun mal! Wo wären wir wenn wir nichts vergleichen würden? Sachen in Relation zu sehen bringt Fortschritt.

  7. Dass im Zusammenhang mit dem Stadtportal Heidenheims von einem „hohem Niveau“ gesprochen bzw. der Artikel als „Meckern auf hohem Niveau“ eingestuft wird, wundert mich dann doch. Wer sich 5 Minuten Zeit nimmt, um einmal hinter die Fassade der staädtischen Kacheloptik zu schauen, dem werden die gravierenden Mängel in Bezug auf die Nutzerführung nicht entgehen. Die Verlinkung von Überschriften ist nun wahrlich nichts, was ausschließlich großen Stadtportalen vorbehalten bleiben sollte ;)

    Übrigens war Microsoft, wie es hin und wieder in den Medien durchklingt, keinesfalls „der Erfinder“ des Kacheldesigns. Der Nachrichten-Aggregator Newsmap ist seit fast 10 Jahren online und kann als eine Art Blaupause angesehen werden. Wenn Kacheldesign als Navigationsinstrument, dann bitte richtig.

  8. Also ich finde das Design auf den ersten Blick sehr ansprechend, wobei ich die angemerkten Schwachpunkte nachvollziehen kann.
    Allerdings kann ich die Kritik an der mobilen Darstellung absolut nicht nachvollziehen, bzw. weiß ich auch nicht wie der obere Screenshot zustande kommen kann – außer dass Android daran Schuld ist. ;)

    Ich zumindest erhalte diese mobile Darstellung und an der kann ich rein gar nichts aussetzen. :)

    Startseite:
    http://s7.directupload.net/images/130309/42ezer2k.jpg

    Rubrik:
    http://s1.directupload.net/images/130309/5xkiees3.jpg

    Content:
    http://s14.directupload.net/images/130309/o23tgruk.jpg

    Ist doch hübsch und benutzerfreundlich.

  9. Bei der Bedinebarkeit für mobile Geräte muss man hier wohl zwischen Android und iPhone unterscheiden.

    Auf iPhone lässt sie sich relativ gut bedienen. Die Kacheln machen sich ganz gut beim bedienen. Die rein dekorativen Elemente auf den Übersichtsseiten bei der Desktopversion erscheinen hier gar nicht erst. Die relevanten Menüpunkte erscheinen sogleich im oberen Bereich (wie auch Vorkommentator bereits festgestellt hat).

    Generell kann es für Kacheln unterschiedliche Funktionen geben. Zum einen kann man damit die Fläche zum Anklicken vergrößern was der Benutzung von Fingern die eine größere Auflagefläche benötigen entgegenkommt. Das ist ein wesentliches Merkmal für das GUI von Microsoft und wohl auch der Kernansatz.

    Desweiteren können sie auch dekorative Zwecke erfüllen wie es teilweise auf der Site Heidenheim umgesetzt wird. Sie stecken Inhalte in ein ästhetisches Raster und sorgen damit für eine optisches gleichmäßiges Erscheinbild von Inhalten. Es kann ein Gestaltungsprinzip sein.

    Mobiles Design ist natürlich mehr als nur das Anpassen an ein bestimmtes Format von Pixelbreite und Höhe und auch keine Frage von „Kacheln oder nicht“. Formatanpassungen erreicht man mit nahezu Nullaufwand bei Einsatz von entsprechenden aktuellen Frameworks.
    Konsequentes mobiles Design fragt nach dem entsprechenden Use Case: Welcher Nutzertyp fragt welche Informationen ab, und welches Interface steht ihm zu diesem Zeitpunkt zur Verfügung. Das erfordert eine ganz andere Strukturierung von Inhalten und genau das schafft die Site zumindestens schonmal in dem Punkt, dass die dekorativen Elemente auf der Desktopversion zu sehen sind und auf der mobilen Version nicht mehr.

  10. Es ist einfach prima, wie hier Microsoft ein Scheitern bezüglich der Modern UI bescheinigt wird. Ich gehe davon aus, dass Du, Achim, keinen ganzen Tag mit Windows 8 gearbeitet hast. Falls doch, zeige bitte etwas konkreter auf, inwiefern Microsoft mit Modern UI gescheitert ist.

    Die Website von Heidenheim hat gestalterisch nicht wirklich etwas mit der Modern UI zu tun. Schau Dir mal auf einem aktuellen Internet Explorer die Seite msn.de an. Ich denke, da gibt es schon noch einen Unterschied.

  11. Jonbert, wie gut kann ein Interface sein, das ein zweites benötigt (die klassische Umgebung), um alle vom Anwender angeforderten Aufgaben erledigen zu können?

    In den Sitzungen, die ich bislang unter Windows 8 gearbeitet habe – und da hast Du Recht, dass sich diese eher in Stunden denn in Tage bemessen lassen –, ist es mir nicht gelungen, alle Tätigkeiten ausschließlich in der neuen Umgebung zu bewältigen. Das Herumspringen zwischen zwei gänzlich unterschiedlichen Systemen empfinde ich als überaus verwirrend.

    Eine solche Windows-Welt, die auf zwei Systemen basiert, kann nur eine Übergangslösung sein. Mein Eindruck ist, dass Windows 8 eine Kompromisslösung darstellt. Microsoft war mutig, Modern UI einzuführen, offenbar aber nicht mutig genug, denn sonst würde man nicht die bisherige Umgebung mitschleifen.

    Wie ist Dein Eindruck von Windows 8?

  12. Das Internet zeigt bereits heute, dass für verschiedene Devices verschiedene Views über Media Query sinnvoll sind. Windows 8 hat aktuell zwei Views. Die App-View ist für Anwendungen, bei denen nicht präzise gearbeitet werden muss. Ganz im Gegenteil zur Desktop-View, hier wird gearbeitet.

    Die Frage ist, ob ein Interface für alle Anwendungen reicht.

    Es kann sein, dass Windows 8 für mich optimal ist, weil ich sehr viel mit Shortcuts arbeite. Die Shortcuts wurden deutlich erweitert und verbessert. Ich habe das klassische Startmenü schon unter Windows 7 nicht mehr benutzt. Windows-Taste drücken, „Fir“ tippen, „Enter“ und ich starte Firefox.

    Das „Mitschleifen“ der bisherigen Umgebung hat durchaus Vorteile. Ich kann mit einem x86er-Tablet und Windows 8 ohne Probleme einen Netzwerkdrucker installieren, eine CNC-Fräsmaschine ansteuern oder eine Apache-Server aufsetzen.

    Mein Rechner hier bootet in 4 bis 5 Sekunden. Das war mit Windows 7 nicht möglich.

    Ich denke, Software ist generell eine Kompromisslösung – nie ist sie fertig.

  13. @wünschedesign:
    Die Screens stammen von einem Windows Phone, nicht einem iPhone!

    @Windows 8:
    Ich kann immer wieder durchaus die Kritik an den zwei Oberflächen verstehen – im Ansatz – aber bin absolut bei Jonbert.
    Windows 8 bietet so viel mehr in einem(!) Betriebssystem. Klar, dafür sind zwei Oberflächen notwendig und wenn man so will, kann man es als zwei OS in eins betrachten… aber immerhin. Microsoft schafft es mit einem einzigen OS auf drei verschiedenen Plattformen zu bestehen (Tablet, Laptop, PC) und hat dazu ein Telefon-OS, dass super nah dran ist an diesen. Ich find es richtig stark was MS hier aufgebaut hat – mal abgesehen davon, dass Modern UI einfach super sexy ist!

    Aber hier gehts ja nicht um verschiedene OS, ich wollte es nur mal eben loswerden. :)

  14. Ohne jetzt im Detail auf die Heidenheim-Seite eingehen zu wollen muss ich feststellen, dass gerade die innovativeren Designs, die nicht dem absoluten Minimalismus und den altbackenen Standards der letzten 10 Jahre folgen, hier regelmäßig zerrissen werden.
    Design ist nicht nur der immer selbe, alte Käse mit einer anderen Typo. Design entwickelt sich – aktuell wohl schneller als jemals zuvor aufgrund der verschiedenen Devices. Hier entwickelt sich kaum etwas und viele Leser lassen sich davon beeinflussen… umso besser für die innovations-offeneren Designer ;)

    Ich persönlich sehe lieber auch mal etwas neues, was noch Ecken und Kanten hat, als diese perfekten Kopien von uralten Designs. Kreativität > Kopieren.

  15. Martin V, innovatives Design wird hier im dt keinesfalls regelmäßig zerrissen. Diese pauschale Aussage möchte ich, wenn Du erlaubst, zurückweisen. Dort, wo wirklich Innovatives vorgestellt wird, wird es auch dementsprechend honoriert, sowohl von mir wie auch von den Lesern.

    Das Kacheldesign ist ja nicht wirklich als innovativ zu bezeichnen. Sicher, innerhalb eines Stadtportals ist es vergleichsweise neu, allerdings ist das Raster etwa bei Mannheim.de eindeutig besser, da die Kacheln hier in sinnstiftender Weise eingesetzt werden.

    Den entscheidenden Fehler, den Du, lieber Martin, aus meiner Sicht machst, ist, Design von seiner Aufgabe, von seiner Funktion zu entkoppeln. Ich denke, man kann Design, egal ob es ein Interface oder einen Gegenstand betrifft, nicht losgelöst von den Funktionen betrachten und bewerten. Was nutzt einem denn eine schöne Bohrmaschine, wenn sie einem ständig aus der Hand rutscht und was nutzt einem ein schönes Interface, wenn es einen nicht darin unterstützt, die gewünschten Informationen zu finden?

    Auch ich finde ein Design, das gewisse Ecken und Kanten hat (im übertragenen Sinne) interessanter als weichgespülte 08/15-Lösungen, aber darum geht es hier überhaupt nicht. Ein Interface ist kein Selbstzweck. Aussehen reicht nicht, es muss auch funktionieren und praktikabel sein, aber genau hier hapert es bei Heidenheim.de. Wer sich die Mühe macht, unter die Oberfläche zu schauen, wird dies feststellen.

  16. Irgendwie habe ich das Gefühl, dass es sich bei der aktuellen Diskussion zu Windows 8 um ein Missverständnis handelt. Es ist ja keineswegs so, als ob MordernUI die „klassische“ Umgebung ersetzen sollte. Das lässt sich auch konzeptionell nicht erkennen. Vielmehr handelt es sich um eine neue Startumgebung (das ehemalige Startmenü), das im Vollbildmodus läuft und um einen Vollbild-Applauncher ergänzt wurde. Für konsumtive Nutzung ist das hinreichend (Web, Mail, Spiele, etc.). Als Arbeitsumgebung dient bei Windows 8 aber weiterhin die klassische Desktopumgebung. Microsoft hat hier nicht versagt, ModernUI zum Arbeiten zu optimieren. Vielmehr war ModernUI niemals dafür gedacht. Ich arbeite jetzt schon länger mit Windows 8 und die dahinterstehende Idee hat sich bei mir verinnerlicht: Ich arbeite auf dem Desktop und nutze ModernUI als Startmenü. Insofern finde ich die Umsetzung wirklich gelungen.

  17. „Wer im Netz vorwiegend mit Smartphone oder Tablet unterwegs ist, wird sich sofort zu Hause fühlen. Die Navigation besteht nämlich aus quadratischen Kacheln und ist so übersichtlich wie nie zuvor.“ (http://www.heidenheim.de/,Lde/Farbe_+Bilder_+Emotionen.html)

    Das hört sich für mich an, als hätte ein Laie wiedergegeben, was ihm ein vermeintlicher Experte erzählt hat.

    Mal abgesehen von der etwas unverständlichen URL und der fehlenden Information, wo ich mich gerade auf der Seite befinde (links sehe ich einen Button „News >“, der aber gar kein Button ist, da nicht verlinkt, in der Navigation, die so übersichtlich ist wie nie zuvor finde ich keinen Punkt „News“ – nur in einer Kachel auf der Startseite habe ich es zufällig gesehen, dort heißt es „Nachrichten“), kann ich absolut keine Optimierung für Smartphones erkennen. Mit meinem Android werde ich zwar auf http://mobil.heidenheim.de weitergeleitet, die sieht aber genauso aus wie die Desktop Website und wird vom Browser entsprechend winzig angezeigt.

Kommentar verfassen

Folgende HTML-Elemente können verwendet werden: <b> <i> <img src="meineurl"> <a> <blockquote>