Skip to content

Relaunch von Karlsruhe.de

Karlsruhe Relaunch

Karlsruhe Relaunch

Am 1. Mai 1996 ging das erste Stadtportal von Karlsruhe online, exakt 15 Jahre später erfolgt der erste Relaunch und er war längst überfällig. Das, womit sich die Bürger und Karlsruhe-Interessierte seitdem im Netz beschäftigen durften, stammt aus den Kindheitstagen des Internets. Nicht, dass alles Gestrige schlecht sein muss, aber die Kombination aus dynamischer Breite, blau unterstrichenen Links und der lieblos gestalteten Oberfläche erzeugte einen Webauftritt, der kein gutes Aushängeschild für eine Stadt darstellte, was der Gemeinderat auch bereits 2005 und wieder 2007 erkannt hatte, wie sich anhand der entsprechenden Protokolle ablesen lässt. Offenbar trafen die seinerzeit gestellten Anträge, den Relaunch des Stadtportals betreffend, erst im letzten Jahr auf breite Zustimmung. Bei dem im vergangenen Herbst durchgeführten Vergleich von Stadtportalen belegte Karlsruhe.de den vorletzten Platz. Nur Bochum.de erzielte in dem Vergleich der 25 größten deutschen Städte noch weniger Punkte. Schauen wir uns doch einmal an, ob das neue Stadtportal heute besser punktet.

Aufbau und Schriftbild

Der Auftritt verfügt nach wie vor über eine dynamische Breite. Allerdings lässt er sich nur noch bis zu einer Breite von 1180 Pixel im Browserfenster skalieren, ein guter Kompromiss, wie ich meine. Die überwiegende Mehrheit der Besucher wird diese 1180er-Breite vor Augen haben und somit in den Genuss eines Auftritts kommen, der aufgrund der großzügigen Dimensionen und dem gezeigten Schriftbild, das sich ausschließlich aus der Verdana generiert, durchaus über ein hohes Maß an Lesekomfort verfügt. Dass die Verdana sicherlich nicht zu den schönsten Schriften zählt und das Schriftbild dadurch recht trist und ideenlos erscheint, kann man kritisieren, soll an dieser Stelle auch geschehen, entscheidend ist allerdings, dass die unterschiedlichen Textklassen (Überschrift, Zwischenüberschrift, Dachzeile, Teaser, Modulüberschrift, Artikel, etc.) über grundsätzlich stimmige Größen und Abstände verfügen und somit ein lesefreundliches Ergebnis produziert wird. Am klassisch dreispaltigen Aufbau des Portals gibt es in dieser Form der Umsetzung nicht viel zu kritisieren. Die linke Navigationsspalte ist 360 Pixel und der Content ist 690 Pixel breit. Gut 100 Anschläge lassen sich auf einer Textzeile abbilden. Das ist zwar etwas mehr ist als üblich – 70–90 Anschläge sind hier das Maß, das am meisten Verbreitung findet –, allerdings ist die Länge einer Zeile noch kein Faktor, der das Lesen negativ beeinflusst. Ein höherer Zeilenabstand würde allerdings die Lesbarkeit noch einmal verbessern.

Struktur und Nutzerführung

Die wichtigste strukturelle Änderung ist die Festlegung auf nur noch 4 Hauptbereiche, die da wären: „Kultur und Tourismus“, „Wirtschaft und Wissen­­schaft“, „Leben und Arbeiten“ sowie „Stadt und Verwaltung“. Damit einhergehend wurde die Hauptnavigation von der linken Seite in den Kopfbereich verlegt, wo sie nun unterhalb des Header-Motivs horizontal angelegt ist. Die riesenhaften Schaltflächen sind mit einem Farbcode versehen, der das Zurechtfinden im Portal vereinfachen soll, was sich allerdings deshalb zuweilen schwierig gestaltet, da etwa auf der Tourismus-Auftritt der Stadt mit einem weiteren, unterschiedlichen Farbsystem arbeitet. Man sollte von Nutzern nicht erwarten, dass sie innerhalb nur eines Auftritts unterschiedliche Farbleitsysteme erlernen. Manchmal sind keine Farben besser als zu viele.

Nach wie vor problematisch ist die Verwendung des Begriffs „weiter“ in Zusammenhang mit externen Inhalten, auf die via Teaserlink verwiesen wird. Dieser Terminus ist gekoppelt mit dem Auftritt zugehörigen Inhalten. Nutzer erwarten, dass bei Klick auf „weiter“ eine Detailseite aufgerufen wird, auf der der angerissene Text weitergeführt wird. Aus Sicht der Nutzerführung wäre es besser, wenn externe Inhalte eindeutig als solche erkennbar sind, was auf Karlsruhe.de allerdings auch nach vollzogenem Relaunch nicht stringent genug praktiziert wird. Hierzu zählt auch der Umgang mit Linkpfeilen, die nicht immer korrekt gesetzt sind. Teilweise führen Klicks auf ein als interner Link gezeichneter Inhalt zu einem externen Angebot (z.B. „KiX“).

Wichtig ist, dass mit dem Relaunch nun Teaser-Bilder verlinkt sind, wodurch ein schnelleres Navigieren ermöglicht wird. Beim Navigieren ins Stocken gerät hingegen, wer man Stöbern durch die Hierarchieebenen den Sprung von der vierten zur fünften Ebene vollzieht. Dann nämlich wird in der linken Navigationsleiste die zweite Hierarchiebene ausgeblendet. Dem Brotkrumenpfad fällt an dieser Stelle eine essentielle Bedeutung zu, denn er alleine zweigt nun die Position im Auftritt an. Das Ausblenden der zweite Ebene geschieht für den Nutzer unerwartet. Es braucht eine Weile, bis man sich mit der neu bestückten Leiste zurecht findet. Natürlich ist das Ausblenden anderer als dem jeweils angewählten Bereich generell möglich und in vielen Fällen auch sinnvoll, aber entweder mal blendet konsequent aus, so wie es auf Mannheim.de oder z.B. auch auf Amazon.de erfolgt, dass heißt gleich mit dem ersten Hierarchiesprung, oder aber man bildet die Struktur zu ab, dass der Sprung für den Nutzer nachvollziebar ist. Was auf Karlsruhe.de fehlt, ist die Kenntlichmachung der Navigation, dass die zweite Ebene ausgeblendet ist.

Design

Grundsätzlich ist die Gestaltung minimalistisch, pragmatisch, zielführend, jedoch uninspiriert. Wer wie ich das Interface von Mannheim.de oder Wiesbaden.de schätzt, der wird Karlsruhe.de eher spröde finden. Vor dem Hintergrund des Vorgängers ist die neue Oberfläche allerdings ein Gewinn, was zweifelsfrei auch nicht sonderlich schwer war. Bedingt durch die Verschachtelung der Inhalte in weißen, mit einem Schattenwurf ausgestatteten Boxen, sehen Seiten mit wenig Inhalt nicht sonderlich elegant aus (siehe Beispiel). Auf der anderen Seite vereinfachen die Boxen (z.B. „Suche“, „Hotel buchen“, „Veranstaltungen“) das zurechtfinden, da die so aufbereiteten Informationenseinheiten sich besser von anderen Elementen absetzen. Die unterschiedlichen Inhalte wirken geordnet und zuweilen auch ansprechend. Einen kreativen Funken konnte ich auf keiner Seite entdecken.

Programmierung

Die Programmierung habe ich mir im Zuge der ersten Begehung nicht im Detail angeschaut, offensichtlich ist jedenfalls, das aufgrund der massiven Änderung der Verzeichnisstruktur die Anzahl von 404-Fehlern stark ansteigen wird. Allzu oft läuft man von Google kommend in Leere. Ebenfalls über den Einstieg per Suchmaschine wird ersichtlich, dass große Teile des bisherigen Auftritts weiterhin im alten Gewand vorgehalten werden. Alter und neuer Auftritt laufen parallel, vermutlich für einen längeren Zeitraum, sodass uns das 1996 gelaunchte Portal noch eine Weile weiter begleiten wird. Auch die aktuellen Meldung der „Stadtzeitung“ werden nach wie vor im alten Look angezeigt. Die Suche ist auch nicht nicht implementiert usw.

Fazit

Der Relaunch zum 01. Mai erscheint verfrüht. Offenbar wollte man unbedingt den Jubiläumstermin halten. Wenn große Teile des Auftritts allerdings noch nicht fertig sind, Nutzer ständig zwischen alter und neuer Umgebung wechseln müssen und fortwährend 404-Fehlerseite produziert werden, dann sollte man einen solchen Termin kippen, denn auch im Web gilt, für einen ersten Eindruck erhält man keine zweite Chance. Aber natürlich ist begrüßenswert, dass nach so langer Zeit überhaupt Bewegung in Karlsruhe.de kommt, zum Teil ja auch der skurrilen Art, wie der Radler beweist. Mit Blick auf die noch bevorstehenden, nicht wenigen Anpassungen kann man für die Bürger und Karlsruhe-Interessierten nur hoffen, dass die Verantwortlichen weiter fleißig in die Pedale treten.

HINKEL360 hat das Screendesign erstellt, Dv Electric ist für die technische Umsetzung verantwortlich.

Herzlichen Dank für die zahlreichen E-Mails zum Relaunch!

Dieser Beitrag hat 19 Kommentare

  1. Tja, was soll man sagen. Besser als der alte Auftritt? Klar, ist ja keine Kunst.
    Aber optisch mehr als nur „okay“? In irgendeinem Sinne inspiriert oder innovativ? Mutig und spannend? Nein, nein und nein. Biedere Minimalkost, Design auf dem Stand von 2004, irgendwie ziemlich langweilig Grau und alles in allem plump und eng. Macht leider keine Lust auf eine Reise in die schöne Stadt Karlsruhe, schade.

  2. Das Stadtlogo ist in der weißen Box nicht vertikal zentriert. Dadurch wirkt es auf mich unruhig und lieblos dahin geklatscht.

    Bei den Farbbalken in der Hauptnavigation dachte ich zuerst an einen CSS-Verarbeitungsfehler vom Browser da diese, wie die gesamten Links, nicht auf die volle Höhe der weißen Boxen skaliert wurden. Das sieht nicht nur komisch aus sondern verhindert auch dass die Link-Boxen vollflächig anklickbar sind.
    Beim Überfahren mit der Maus wird der Text weiß und die Box vollflächig in die entsprechenden Farben getaucht. Ist ein Link mit dem Attribut “active” versehen ändert sich lediglich die Schriftfarbe. Da die Designer jedoch erkannt haben dass sich Weiß und Gelb nicht sehr gut vertragen wenn es um die Lesbarkeit geht, haben sie dieses “Konzept” bei “Stadt & Verwaltung” einfach über den Haufen geworfen wodurch der Text schwarz bleibt und somit dieser Bereich gar nicht als aktiv gekennzeichnet wird.
    Warum die URLs der einzelnen Hauptbereiche “b1.de”, “b2.de”, “b3.de” und “b4.de” genannt wurden entzieht sich mir jeglicher Logik. Das “b” steht hier wohl für “Bereich”, wozu jedoch das “.de” dahinter? Suchmaschinen- und Benutzerfreundlich ist das nicht.

    Bei der Zusatznavigation (oben rechts) haben die Links eine Hover-Farbe was sonst kein anderer Link auf der Seite hat. Ein weiteres Beispiel dafür dass hier kein einheitliches Konzept durchgezogen wird.

    Die Unternavigation wirkt durch den farbigen Rahmen und den dicken Farbbalken mit Bereichsüberschrift sehr globig. Durch die farbliche Markierung ist der Bereich schon definiert, wozu also nochmal die Überschrift?
    Es stellt sich auch die Frage warum der linke Rahmen 1px, der untere 2px ist und rechts garkeiner ist. Hier könnte man die seitlichen Balken von der Hauptnavigation und den Box aufgreifen.

    Der losradelnde Radfahrer beim überfahren des Such-Buttons erinnert an die Anfänge des Internets als alles schön bunt geblinkt hat :) Wenn man Karl Drais unbedingt eine Erinnerungsstätte auf der Webseite widmen möchte dann sollte das in einer subtileren Form erfolgen (z.B. durch ein leichtes Wasserzeichen im Hintergrund der Seite oder sowas in der Art)

    Die Partner-Box im Footer hat keinen Schatten wie die anderen Elemente. Auch hier wieder kein durchgängiges Designkonzept.

    Die bereits besuchten Links unterscheiden sich optisch, wie schon auf der alten Seite, von anderen Links. Wie bereits im Stadtportale-Artikel angesprochen ist das wenig zeitgemäß und sieht nicht sonderlich schön aus da so z.B. auch Überschriften farblich abgewandelt werden.

    Eine gewisse Redundanz ist zwar gut, aber muss auf einer Fläche von 500×100 Pixeln der Bereich wirklich 4x erwähnt werden?

    Hier mal ein kleines Beispiel wie die Seite mit wenigen Handgriffen etwas attraktiver aussehen würde:

    Beim durchklicken wird man schnell feststellen das die alten Artikel nicht alle übernommen wurden und man somit sehr häufig noch auf der alten Seite landet. Das ist natürlich eher suboptimal. Warum geht man online wenn noch nicht alle Artikel übernommen wurden? Oder noch schlimmer: werden die alten Artikel gar nicht übernommen und bleiben so verlinkt?

    Alles in Allem ein guter Ansatz die Webseite zeitgemäß zu gestalten. Dabei bleibt es jedoch leider. Für eine Stadt wie Karlsruhe, gerade mit dem technischen Hintergrund, bleibt der Internetauftritt weiterhin mangelhaft.

    Btw: bei Bochum.de hat sich auch ein bisschen was getan nach dem Stadtportal-Vergleich. Ob es gelungen ist darüber kann sich jeder selbst ein Bild machen ;)

  3. Finde ich klasse, dass Du Dir soviel Zeit für Deine Beurteilung des Portals genommen hast, Debe! Herzlichen Dank. Ich teile viele Deiner Kritikpunkte.
    Bezüglich des Aktivzustandes von „Stadt & Verwaltung“ denke ich, dass dieser einfach verschwitzt wurde, denn in der linken Navi findet sich ja sehr wohl weiße Schrift auf gelben Grund, was als Aktivkennung auch durchaus in Ordnung ist.

  4. Endlich!

    Als Karlsruher und als Gestalter war mir die Stadtseite von jeher suspekt, sogar schon 1998 mit einem 56K Modem. Design und Content waren damals schon nicht zeitgemäß. Aber das über ein Jahrzehnt so aufrecht zu erhalten und händisch gecodetet, statische HTML-Seiten samt Tabellenlayout und Tag-Massaker von ambitionierten Beamten aktualisieren zu lassen ist schon einmalig.

    Verstärkt wird das Desaster noch durch den Umstand, das Karlsruhe sich selbst als die deutsche IT-Hauptstadt sieht dank Pionieren wie WEB.de, 1&1, KIT, ZKM, TPK und wie sie alle heißen.

    Somit kritisiere ich dieses mal am Relaunch gar nichts, denn im Vergleich dazu werden die berechtigten Optimierungsmöglichkeiten nichtig, ich kann nur applaudieren.

    Und das Stadtlogo bleibt halt eh gruselig, und der Claim erst “viel vor, viel dahinter”, aber das ist ein anderes Thema.

    Grüßle

  5. Die Kritik bezüglich der Logopositionierung kann ich nicht Teilen. So wie es ist wirkt es bodenständig und aufstrebend, eine vertikale Zentrierung dagegen eher losgelöst und isoliert.
    Was dagengen wirklich unruhig wirkt, dass vertikale Raster wird sehr oft durchbrochen. Beispiel: Die linke Kante des Logobereiches weicht um geschätzte 15px von der Kante der Navigation ab. Das hätte man wirklich vermeiden können.

    Ich habe an der grafischen und technischen Realisierung von 3 ähnlich umfangreichen Stadtwebseiten mitgewirkt und es ist da eine Kunst Wünsche, Informationsmenge und Layout gut unter einem Hut zu bringen. Bei Karlsruhe ist das optisch schon gelungen, besser geht natürlich immer.

    p.s.: Die Startseite ist bei 1024px Breite schon unschön, das ist die Standardauflösung eines Netbooks. Sollte man eigentlich noch unterstützen, gerade als Stadt.

  6. Wahnsinn wie bieder, langweilig und 1999 diese Seite aussieht. Das geht, auch barrierefrei, deutlich besser!

  7. Das Logo ist vertikal zentriert und die Schrift dann drunter gesetzt: finde ich sehr stimmig und besser als den Gegenvorschlag von debe.

    Ansonsten finde ich den Gesamteindruck ganz okay, von einem Stadtportal erwarte ich nix aufregendes. Und das biedere passt möglicherweise zu Karlsruhe?

    Es sind – wie schon erwähnt – eher die Kleinigkeiten, die das ganze ein wenig unrund wirken lassen: der Header der Navigation ist flacher als der Farbbalken vor der Überschrift im Inhalt direkt daneben, die Navigation ist breiter als das Logo, die einseitig eingerückte und bunt umrandete verschachtelte Navigationsliste sieht komisch aus, und bei der unterschiedlichen Wichtung durch Schriftgröße (Pfad, Footer etc.) ist sicher noch was machbar. Und der Weißraum kann noch etwas besser verteilt werden.

  8. Das Logo ist vertikal zentriert und die Schrift dann drunter gesetzt:

    Das „Logo“ besteht aus der Bildmarke + Wortmarke, insofern sollten diese auch als Einheit ausgerichtet werden. Weder die Bildmarke, noch das Logo sind in Bezug auf die Vertikale derzeit mittig ausgerichtet. Die Ausrichtung in der von debe erstellten Ansicht ist hingegen optisch ausgewogen.

  9. Das Design geht in Ordnung, der Relaunch war, wie du schon sagtest, längst überfällig.

    Allerdings ähneln die einzelnen Contentboxen stark denen des Standard-Template des OXID-Shops.

    Wenn ich mal “klugscheissern” darf:

    “[…] das aufgrund der massiven Änderung der Verzeichnisstruktur die Anzahl von 404-Fehlern stark ansteigen wird […]”

    404 ist kein Fehler, sondern lediglich ein HTTP-Statuscode :)

Kommentare sind geschlossen.

An den Anfang scrollen