Start Netzbewegung

Stadtportale: Die schönste Stadt Deutschlands – Teil 4

27

Stadtportale Serie Teil 4

Vierter Teil der Serie „Stadtportale: Die schönste Stadt Deutschlands“. Die Webauftritte der 25 größten Städte Deutschlands werden in den Kategorien Design, Nutzerführung, Programmierung und Information gesichtet und bewertet. Weitere Informationen zu den Kriterien finden sich hier.

10. Bremen

Bremen.de | Bremen ist Stadt und zugleich Bundesland. Diesem Umstand ist wohl geschuldet, dass man als Besucher von Bremen.de erst einmal die Hürde einer Tunnelseite nehmen muss. Ein guter erster Eindruck sieht anders aus.

Beim genauen Hinsehen wird man auf Bremen.de allerdings sehr wohl auch Vorbildliches entdecken, denn je länger man hinschaut und je mehr Websites man sich von der Stadt anschaut, umso mehr wird man die Kontinuität im städtischen Erscheinungsbild schätzen.

Stadtportal Bremen / Bremen.de

Design / 18 Punkte

Bremen ist wohl eine der bestgeführten städtischen Marken in Deutschland. Das Branding ist intelligent und findet sich in weitestgehend einheitlicher Form in allen Medienkanälen. Trotz unterschiedlicher Absender ist die Gemeinsamkeit in allen Logovarianten (Screenshot) jederzeit gegeben. Mit solch einem einheitlichen Auftritt können die wenigsten Städte aufwarten. Das Design des Portals ist dennoch vergleichsweise unauffällig aber durchaus sehr übersichtlich gehalten. Das weit verbreitete „umgekehrte L” (blauer Fond) prägt den Auftritt. Die Corporate-Farben Blau und Rot stellen die Konstanten in der Farbgebung. Anders als etwa auf Hannover.de, ist die partielle Bestückung des Headers mit Bildelementen jedoch gelungen. Schriftgrößen sind meist gut gewählt.

Nutzerführung / 15 Punkte

„Aktuelles“ erscheint auf der Startseite bereits vorausgewählt. Erst im scrollbaren Bereich werden die praktischen Direkteinstiege „für Bremen…“ und „Such-Tipps“ aufgeführt. Viele der unten aufgelisteten Boxen wären tatsächlich im direkt sichtbaren Bereich besser untergebracht. Die Hauptnavigation bildet in der Regel den Klickpfad gut ab. In einigen Fällen ist die Mehrfach-Hervorhebung (Screenshot) nicht eindeutig genug, zumal es keinen Brotkrumenpfad gibt. Klicks auf verschiedene sensitive Elemente führen seltsame, css-bedingte Ruckelbewegungen aus (siehe Screencapture-Video). Das ließe sich abstellen. Textlinks werden einheitlich blau und externe Verweise zusätzlich mit einem speziellen Symbol gekennzeichnet. Der Nutzer wird dies zu schätzen wissen. Gar nicht gut ist hingegen, dass man auf die Verlinkung der größtmöglichen, sensitiven Fläche verzichtet hat. Vorschaubilder sollten ebenso wie Teaser-Überschriften stets verlinkt sein. Die Links „Weitere Pressemitteilungen“ sind Sackgassen, in denen der Benutzer nicht weiter kommt. Zudem macht Bremen.de den gleichen Fehler wie Hannover: „mehr“-Verlinkungen führen den Besucher auf ein externes Angebot, das in einem neuen Tab geöffnet wird.

* Wer Bremen.de eingibt möchte auch Bremen.de sehen und nicht etwa Bremerhaven.de

Programmierung / 15 Punkte (HTML 10, CSS 3, SEO 2)

Von Heiko Stiegert | Die durchaus gelungene Strukturierung der Inhalte der Bremer Webseite besitzt im Vergleich zu den meisten anderen Stadtportalen kaum Optimierungsmöglichkeiten in Bezug auf verwendetes Bildmaterial oder den CSS-Code. Lediglich die Verwendung mehrerer Werbebanner im Flash-Format ist diesbezüglich nicht unbedingt die Ideallösung, da hierfür im Vergleich zum Bildmaterial auch ein Plugin seitens der Besucher benötigt wird und die Flashbanner zudem noch über iFrames implementiert werden. Optimierungsbedarf gäbe es allerdings in Bezug auf die bspw. 70 HTTP-Requests der Startseite. So könnte man die Anzahl der zahlreichen Social-Bookmarking-Icons und der Hintergrundgrafiken auf einen Request reduzieren, alle in einer Sprite-Grafik zusammengefasst werden und dann via CSS den entsprechenden Inhalten zugängig gemacht werden können. Ein weiterer aus SEO-Sicht optimierungsbedürftiger Aspekt ist der der Kennzeichnung des jeweiligen Seiten Titels, der durch den title-Tag abgebildet wird. So präsentiert das Portal der Hansestadt den Besuchern und den Suchmaschinen ein wenig aussagekräftigen Titel “Aktuelles”, wesentlich verständlicher wäre hier bspw. der Titel – “Aktuelles aus Bremen”.

Information / 14 Punkte

Wenn Werder die Champions League erreicht hat, erfährt man dies zwar auf Bremen.de, aber der Schwerpunkt der aktuellen Nachrichten liegt eher im Bereich Pressemitteilungen, die von der Senatspressestelle eingespielt werden. Noch dürftiger ist das Angebot im Bereich der Anträge, die man online ausfüllen kann. Das allseits beliebte Wunschkennzeichen ist dabei, die Anmeldung für Sperrmüll und die Bestellung von Umweltzonen-Plaketten. Alles andere erfolgt per PDF, die zwar zahlreich vorhanden sind, aber insgesamt ist der „Bürgerservice“ vergleichsweise überschaubar. Der Veranstaltungskalender ist dagegen schon umfangreicher. Auch im Namen der Stadt wird fleißig getwittert. Ein Sahnestück im Auftritt ist das Video-Angebot, das in dieser Form im Rahmen des Vergleichs herausragt. Stadtgeschichte wird ebenso vermittelt, wie das Angebot in Sachen Sehenswürdigkeiten oder auch die Vorzüge als Wirtschaftsstandort. Auch für Kreative ist etwas mit dabei.

Gesamtpunktzahl 62

9. Essen

Essen.de | Auch Essen.de wartet mit einer unrühmlichen Tunnelseite auf, die hier noch überflüssiger ist als auf Bremen.de und die es in dieser Form schon seit über 10 Jahren gibt. Die Sprachauswahl ließe sich wesentlich eleganter integrieren, dafür bedarf es keiner vorgeschalteten Seite.

Das Beste am Auftritt ist noch sein Quellcode, für den sich aber nur die Wenigsten wirklich interessieren. Schauen wir uns mal das Ergebnis dieses Quellcodes etwas genauer an.

Stadtportal Essen / Essen.de

Design / 8 Punkte

Das Interface kann nicht verschleiern, dass der Auftritt schon gut 9 Jahre in dieser Form auf dem Buckel hat. Er wirkt altbacken. Was vor allem fehlt, sind Kontrast und die Farbe Weiß. Was damals modern erschien, wirkt heute schwerfällig. Alle Seiten sind mit einem blassen Türkis hinterlegt, Tabellen sind noch einmal dunkler. Ungünstig ist, dass Fließtext blau dargestellt ist. Der Kontrast zum Hintergrund könnte größer sein; er sollte größer sein, vor allem unter dem Gesichtspunkt der Barrierefreiheit bzw. -armut. Hin und wieder kommt es zu Darstellungsproblemen, wie in diesem Beispiel zu sehen ist (Screencapture-Video).

Nutzerführung / 12 Punkte

Textlinks haben die gleiche Farbe wie Fließtext und sind lediglich mit einem Unterstrich ausgestattet. Das Navigieren ist damit zwar möglich, es könnte aber mit Hilfe unterschiedlicher Farben für Text und Links komfortabler sein. Vorschaubilder sind nicht, wie üblich und erwartet, mit einem Link zur Detailseite ausgestattet, sondern es öffnet sich jeweils eine vergrößerte Lightbox-Ansicht. Solch eine Funktionalität ist gut, allerdings ist sie in erster Linie für Detailseiten vorgesehen. Die Position im Auftritt lässt sich im allgemeinen gut ablesen, trotz fehlenden Brotkrumenpfades.

Programmierung / 15 Punkte (HTML 8, CSS 4, SEO 3)

Von Heiko Stiegert | Beim Blick auf den Quellcode der Startseite von Essen.de fragt man sich zwangsläufig, warum? Warum verwendet man Inline-Styles und dann noch in diesem Umfang? Die Elemente zur Strukturierung und Gestaltung der Inhalte besitzen allesamt Eigenschaften, die in bereits vorhandenen CSS-Dateien festgelegt werden. Warum werden die im HTML-Code befindlichen Inline-Styles nicht dort angelegt? Anpassungen des Layouts führen somit zu doppelter Arbeit, die man sich im wahrsten Sinne des Wortes hätte sparen können. Dieses Vorgehen führt dazu, dass man sich im weiteren Verlauf der Betrachtung des Codes über die häufig fehlende alternative Beschreibung des Bildmaterials nicht mehr wundert. Aber nicht nur in der Strukturierung der Inhalte besitzt der Auftritt Verbesserungspotenzial, sondern auch in der Optimierung des Bildmaterials. So können auf den meisten Unterseiten dieses Portals, nahezu 50% durch gezielte Komprimierung eingespart werden und somit zu einer Verbesserung des Ladeverhaltens beitragen.

Information / 12 Punkte

5-10 aktuelle Meldungen werden täglich über mehrere Quellen eingespielt und schauen auf der Startseite und den jeweiligen Themenseiten raus. In der kleinteiligen Darstellung gehen sie allerdings unter. Lediglich die Topthemen finden sich samt Bildern einigermaßen adäquat aufbereitet. Das RatsInformationsSystem bietet nicht nur Informationen, es verfügt auch über den erforderlichen Kontrast, den man sich auch im restlichen Auftritt wünscht. Die Qualität der Inhalte könnte besser sein. Auf der Gastronomie-Seite werden vier regionale Websites mit thematischem Bezug vorgestellt und anschließend eine Reihe allgemeiner Gastro-Portale. Das ist für eine Stadt zu wenig. Wo sich in Essen gut essen lässt, erfährt man andernorts. Statistische Daten finden sich ebenso wie zahlreiche PDF-Formulare.  eGovernment“ ist auf Essen.de noch nicht wirklich ein Thema. Die Suche nach diesem Begriff produziert lediglich 2 redaktionelle Treffer. Online-Anwendungen und -Anträge sucht man im Auftritt vergeblich. Nicht einmal das Wunschkennzeichen lässt sich online reservieren. Essen ist eine der wenigen Großstädte, wo dies nicht geht.

Gesamtpunktzahl 47

8. Düsseldorf

Duesseldorf.de | Düsseldorf ist NRWs Landeshauptstadt, zudem Kulturstadt und auch Sportstadt. So vielfarbig wie sein Sportstadt-Logo ist auch das Stadtportal, mit dem Unterschied, dass man dies erst nach einigen Klicks entdeckt.

Das Merkwürdige ist allerdings, dass für den Besucher nicht nachvollziehbar ist, weshalb sich die komplette Website mal rot, gelb, blau, türkis, rose, mint, und grau einfärbt. Eine „zusätzliche Orientierungshilfe“, wie es auf der Hilfe-Seite heißt, ist das verwirrende Farbspiel mitnichten.

Stadtportal Düsseldorf / Duesseldorf.de

Design / 12 Punkte

Aufbau, Abstände und Schriftgrößen genügen grundsätzlich den Anforderungen an einen gebrauchsfähigen Auftritt. Begeistern können sie nicht. Problematisch ist, dass nicht-verlinkte Zwischenüberschriften die gleiche Farbe haben, wie Textlinks. Die Zwischenüberschriften provozieren ebenso viele wirkungslose Klicks bzw. Mouse-Over-Bewegungen wie die Teaser-Bilder auf Übersichtsseiten, die nämlich nicht verlinkt sind – ärgerlicherweise. Die Vielzahl an unterschiedlichen Farbschemata stiftet Verwirrung. Nicht, wie üblich, erfolgt eine Zuordnung der Farben nach Themen, sondern ein Farbwechsel tritt ein, sobald der Nutzer den Zuständigkeitsbereich eines Amtes ansteuert. Das Sportamt ist Rot, das Gartenamt grün und so weiter. Die Crux ist nur, dass die Hauptnavigationsleiste aufgrund der thematischen Überschneidungen diese Farbwelten gar nicht im Stande ist abzubilden. Insofern erfolgt jeder Farbwechsel vollkommen überraschend für den Nutzer. Ein Leitsystem ist dies jedenfalls nicht.

Nutzerführung / 13 Punkte

Die Farbwelten sind weder ansprechend, noch dienen sie der Nutzerführung. Die Navigation ist zudem gewöhnungsbedürftig. In den 9 Jahren seit Launch dieses Portals haben sich die digitalen Medien weiterentwickelt. Der Auftritt ist zwar gewachsen aber im Grunde seitdem unverändert. In der rechten Spalte ist die erste Hierarchieebene untergebracht, Unterpunkte finden sich wiederum auf der linken Seite. Der Content wird regelrecht eingeklammert, wodurch das Auge weite Wege gehen muss. Gut sind hingegen unterschiedliche Ikonen, die einen internen, externen sowie einen Download-Link kennzeichnen. Auch die Direktauswahl auf der Startseite etwa zu den häufig genutzten Seiten dürften viele Nutzer als hilfreich ansehen. Ungünstig sind wiederum Ansammlung von Textlinks (Screenshot), die noch schlechter erfassbar und unmotivierter angeordnet sind als Wortwolken. Lust zum Stöbern will dabei nicht aufkommen.

Programmierung / 13 Punkte (HTML 8, CSS 3, SEO 2)

Von Heiko Stiegert | Die Rhein-Ruhr-Metropole Düsseldorf verfügt über ein Stadtportal, welches unnötigerweise zur Strukturierung des Webseiten-Layouts auf eine Tabelle zurückgreift, die ohne weiteres mit wenigen Zeilen CSS eingespart werden könnte. Von den knapp 500KB für die Startseite entfallen über 300KB auf das Bildmaterial, welches auf dieser Webseite unglaublich schlecht komprimiert wurde bzw. wird. Auf nahezu allen Seiten liegt das Optimierungspotential der Bilder bei weit über 60%, teilweise sogar 80%! Ein Wert, den man im Sinne der Besucher so nicht stehen lassen kann. Desweiteren ist bei der Betrachtung des Quellcodes auffällig, dass immer wieder auf Inline-Styles zurückgegriffen wird, wobei die entsprechenden HTML-Elemente bereits über Eigenschaften aus den CSS-Dateien verfügen. Diese Herangehensweise ist nicht nur nicht sonderlich kreativ, sondern sie führt auch dazu, dass etwaige Anpassungen oder Änderungen in diesen Bereichen sowohl im HTML- als auch im CSS-Code vorgenommen werden müssen.

Information / 19 Punkte

Im Veranstaltungskalender finden sich reichlich Termine, allerdings ist die Darstellung alles andere als übersichtlich. Dankbar ist man an dieser Stelle für die „Tipps der Redaktion“, da die Fülle an Informationen einen tendenziell erschlagen. Die Suche nach einem Stichwort hat einen Fehler (Screenshot) zur Folge. 5 Anfragen bzw. Anträge lassen sich bequem direkt per Browser erledigen. Für alle anderen Aufgaben heißt es zum Hörer greifen und das Fax anstellen. Gut, dass wenigstens die entsprechenden Telefonnummern der Ämter in wenigen Klicks auffindbar und zudem übersichtlich aufbereitet sind. Nicht so schön ist, dass die zahlreichen Meldungen des städtischen Pressedienstes jeweils nur als PDF vorgehalten werden. Ziemlich umfangreich ist auch das Tourismus-Angebot. Panorama-Bilder gibt es zudem von jeder sehenswerten Ecke der Stadt am Rhein.

Gesamtpunktzahl 57

27 Kommentare

  1. Bremen ist programmiertechnisch Duisburg? Und Düsseldorf wird wahrscheinlich auch nicht in der Hauptstadt des Freistaat Sachsens gecodet. Hier sind wohl einige Textbausteine durcheinandergeraten?

  2. Joa, seh ich auch so, die Programmierungs-Abschnitte sind durcheinander geraten:

    Bremen –> Duisburg,
    Düsseldorf –> Dresden,
    und den Abschnitt in Dortmund hab ich auch schon in einem der anderen Teile gelesen

  3. Zu Düsseldorf.de kann ich was sagen. Da habe ich 2002 dran mitgearbeitet (für Kohtes-Klewes, heute Pleon). Der Farbwechsel wurde 2003 eingebaut als sich Düsseldorf für die Olympischen Spiele 2012 beworben hat. Das Bewerbungslogo war auch sehr bunt und das wollte die Stadt Düsseldorf auch auf ihrer Internetseite haben. Bunt = Multikulti dachte sich die Stadt. Naja.
    Zur technischen Seite muss man wissen, das die Site damals von einem 2-Mann Team im Keller der Rathauses umgesetzt wurde. Redaktionell wurde sie von einer Frau betreut. Also keine riesige Mannschaft die täglich daran arbeitet.

  4. Ich komme bei Bremen nur auf 61 Punkte.

    Apropo Bremen:
    »Ein guter erster Eindruck sieht anders aus.«

    Wie hätte man es denn anders machen können als mit einer Vorauswahl, wenn man Bremen und Bremerhaven absolut gleich gewichten will?

  5. Danke Peter, im Artikel hatte ich bei der Nutzerführung einen Punkt unterschlagen. In der Tabelle war es, und ist es korrekt. Nun auch im Artikel.
    Und zu Deiner Frage: „absolut gleichgewichten“ tut mans ja eh nicht, denn während bremen.de als Einstieg eine Tunnelseite beinhaltet, zeigt bremerhaven.de gleich das Stadtportal. Abhilfe könnte eine neue Domain land-bremen.de sein, die zwar ebenfalls auf die beiden Stadtportale verwiese, der man diese Tunnelseiten-Funktion aber zubilligen würde.

    land-bremen.de = Portal des Landes
    bremen.de = Stadtportal Bremen
    bremerhaven.de = Stadtportal Bremerhaven

    Oder aber man subsumiert die Seiten des Landes Bremen einfach im Stadtportal (ähnlich Berlin.de) Ableitend von der Erwartungshaltung der Nutzer, sollte jedenfalls bremen.de gleich mit der Startseite des Stadtportals starten.

  6. Vielen Dank für die konstruktive Kritik! Wir freuen uns über das überwiegend positive Feedback vom Fachmann und über alle Verbesserungsvorschläge von außen.

    Ein paar von den angesprochenen Kritikpunkten stehen bereits auf unserer To-do-Liste. Das Download-Volumen der Startseite, das wirklich nicht besonders vorbildlich war, haben wir in der Zwischenzeit übrigens deutlich reduziert (aktuell < 500 kB). Einige weitere Updates und Verbesserungen, die oben angesprochen werden, wird es noch in diesem Jahr geben.

    Noch ein Frage: Ich weiß aus dem Kollegenkreis, dass mehrere Top-25-Städte zur Zeit hinter den Kulissen am Relaunch ihrer Portale arbeiten. Sind Aktualisierungen des Rankings geplant?

  7. Hallo Herr Glock,
    das Ranking bezieht sich auf diese Serie, insofern ist eine nachträgliche Aktualisierung nicht vorgesehen. Über kurz oder lang müssten ja alle Besprechungen gegen neue ausgetauscht werden, wodurch der Charakter einer Momentaufnahme verloren ginge. Ich denke aber, dass ich im Rahmen des Relaunchs eines der Portale – im Hintergrund wird ja derzeit an Karlsruhe.de gearbeitet –, auch auf das Ranking eingehen werde.
    Vielleicht gibt es ja in zwei, drei Jahren eine Neuauflage. Mal sehen, wie sich die Stadtportale weiter entwickeln.

  8. Hallo!

    Auch wir wollen uns für die konstruktive Kritik bedanken!
    Ich könnte jetzt Romane schreiben, warum es welche No-Gos nach essen.de (insb. Inline-Styles) geschafft haben – aber kurz gehalten: Die sind historisch entstanden. Das entschuldigt natürlich ihre fortwährende Existenz nicht, aber, wie der Kollege aus Dortmund schon schrieb, sind u.A. wir gerade in der finalisierenden Migrationsphase auf ein neues CMS (FirstSpirit).

    In diesem Zuge haben wir das überfrachtete CSS vollständig und das HTML fast komplett weggeworfen und neuentwickelt. Nach den bisherigen Planungen/Entwicklungen wird sich also sowohl optisch, als auch technisch viel ändern – und auch die Tunnelseite verschwindet (endlich). Abgsehen davon werden wegen verbesserter Workflows im CMS mittelfristig auch die fehlenden Bildtexte der Vergangenheit angehören.

    Von daher gibt es auch von hier den Wunsch bzw. die Frage nach einer sporadischen Aktualisierung des Rankings. Sonst bekommen wir leider selten Kritik – und auf eine so konstruktive und detailierte Form bin ich bisher noch nie gestoßen.

    Ob eine Art Dev-Blog Sinn macht? :)

  9. “Lediglich die Verwendung mehrerer Werbebanner im Flash-Format ist diesbezüglich nicht unbedingt die Ideallösung, da hierfür im Vergleich zum Bildmaterial auch ein Plugin seitens der Besucher benötigt wird”

    Blablabla… was ist schlimm daran, wenn ein Plugin benötigt wird, das so gut wie jeder installiert hat? Applenerds mal ausgenommen…

  10. Oldenburg belegt in der Liste deutscher Großstädte Platz 48. In dieser Serie werden die Portale der 25 größten Städte Deutschlands behandelt. Insofern muss ich Dir die Spannung leider nehmen. Auch Wolfsburg.de ist leider nicht Teil der Serie.

Kommentieren

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