Webdesign: Nutzungsentscheidungen vor der Optik

Webdesign beginnt mit Inhalten und Nutzungsszenarien

Wenn ein Webdesign-Briefing nur aus Logo, Farben und bevorzugten Websites besteht, treten im Projektverlauf neue Anforderungen auf. Zunächst muss beschrieben werden, warum Besucher auf die Website kommen: um eine technische Eigenschaft zu vergleichen, die Eignung einer Leistung für ihren Bedarf zu verstehen oder einen Vorgang abzuschließen. Für jedes Szenario werden Einstiegsseite, benötigte Informationen und der erwartete nächste Schritt festgehalten. Diese Arbeit bietet einen tragfähigeren Ausgangspunkt als der Versuch, alle Leistungen auf der Startseite unterzubringen.

Bei der Inhaltsinventur unterscheiden wir vorhandene Texte, fehlende Bilder, veraltete Dokumente und Begriffe, die nur innerhalb des Unternehmens bekannt sind. Es ist wichtig, Entwürfe mit den tatsächlichen Überschriftenlängen vorzubereiten: Karten, die mit kurzen Beispieltexten ausgewogen wirken, können mit echten Inhalten überlaufen. Auch die Auswahl der Seitentypen basiert auf dieser Bestandsaufnahme:

• Wenn Besucher anhand des Leistungsumfangs und von Projektbeispielen eine Bewertung vornehmen sollen, nutzen wir den Ansatz einer Unternehmenswebsite.
• Wenn auf die Produktauswahl Zahlung und Lieferung folgen, wird der Einkaufsprozess innerhalb unserer E-Commerce-Lösungen gesondert gestaltet.
• Bei Ansichten, die durch Berechtigungen, Geschäftsregeln oder Dateneingaben geprägt sind, wird der Umfang der individuellen Softwareentwicklung festgelegt.

Diese Unterscheidung beeinflusst auch das Designbudget. Inhaltsseiten mit demselben Erscheinungsbild und transaktionsbezogene Ansichten mit unterschiedlichem Verhalten verursachen nicht den gleichen Aufwand. Neben einer Seitenliste zu Projektbeginn auch eine Liste der Darstellungszustände anzulegen, verringert später auftretende Lücken im Design.

Darstellungs- und Interaktionsregeln für professionelle Oberflächen

Die Qualität einer Oberfläche lässt sich nicht anhand eines einzelnen Screenshots beurteilen. Auch bei einer langen Überschrift, einer langsamen Verbindung oder einem Besucher, der keine Maus bedienen kann, muss dasselbe Design weiterhin funktionieren. Deshalb betrachten wir Komponenten nicht nur mit idealen Inhalten, sondern auch in Grenzfällen.

Informationsprioritäten auf kleinen Bildschirmen

Es reicht nicht, die drei Spalten der Desktopansicht auf dem Smartphone untereinander anzuordnen. Auf mobilen Geräten werden die zuerst zu lesenden Informationen, die Position des aufklappbaren Menüs und das Verhältnis fest positionierter Buttons zum Inhalt neu bewertet. Für breite Tabellen kommen ein Hinweis auf horizontales Scrollen oder eine geeignete Zusammenfassung infrage. Touchflächen werden voneinander getrennt; Cookie-Hinweis, Support-Button und Formularversand dürfen sich nicht im selben Bereich überlagern. Vorab reservierter Platz für Bilder verringert außerdem das Verschieben von Text während des Ladens.

Verständliche Aktionen und Rückmeldungen

Die Beschriftung eines Buttons muss erklären, welche Aktion er ausführt. Ein Link zum Herunterladen einer Datei und ein Button zum Absenden eines Formulars dürfen nicht dasselbe Verhalten suggerieren. In Formularen werden Pflichtfelder, erwartete Formate und Fehlererklärungen in der Nähe des jeweiligen Felds angezeigt. Ein erfolgreicher Versand wird nicht nur durch einen Farbwechsel signalisiert: Nutzer sehen einen Text, der den Eingang ihrer Anfrage verständlich bestätigt. Auch im Messkonzept wird dieser abgeschlossene Vorgang von einem gewöhnlichen Button-Klick unterschieden.

Barrierefreies Komponentenverhalten

Überschriftenhierarchie, Linktext und sichtbarer Fokus sind keine Dekoration, sondern die Grundlage der Bedienbarkeit. Aufklappbare Menüs müssen per Tastatur erreichbar sein; Informationen, die über Icons vermittelt werden, sind bei Bedarf durch Text zu ergänzen. Kontraste werden nicht nur anhand der Markenfarbe auf weißem Hintergrund beurteilt. Auch Zustände wie deaktivierte Felder, Fehlermeldungen und ausgewählte Tabs werden geprüft. Das angestrebte Niveau der Barrierefreiheit wird im Leistungsumfang definiert; ein bestimmtes Zertifizierungsergebnis wird nicht vorab versprochen.

Wie Designentscheidungen mit der technischen SEO-Grundlage zusammenhängen

Eine für Suchmaschinen aufbereitete Seite gewinnt durch eine klare Informationsstruktur, nicht durch lange Texte, die vor Besuchern verborgen werden. In der Designphase bewerten wir Inhaltsüberschriften, Menütiefe und Links in Karten gemeinsam. Wenn eine wichtige Leistung nur als Text innerhalb eines Bildes erscheint oder ein Link durch ein nichtssagendes Icon dargestellt wird, kann dies sowohl die Zugänglichkeit als auch die Verständlichkeit beeinträchtigen.

• Seitenüberschriften werden unabhängig von ihrer visuellen Größe in eine sinnvolle HTML-Hierarchie eingeordnet.
• Titel- und Beschreibungsfelder bleiben in der Verwaltungsoberfläche für jede Seite einzeln bearbeitbar.
• Strukturierte Daten werden mit den tatsächlich angezeigten Inhalten abgeglichen; nicht vorhandene Bewertungen oder Preise werden nicht erzeugt.
• Entscheidungen zu URLs, Canonical-Angaben und Sprachversionen werden gemeinsam mit der Navigationsstruktur dokumentiert.
• Datenanforderungen und Einwilligungsverhalten für Analytics-Tags werden vor der Veröffentlichung geklärt.

Die Ergebnisse dieser Arbeiten bilden eine technische Ausgangsbasis. Welche Themen ausgebaut werden, die Bewertung konkurrierender Suchergebnisse und die regelmäßige Beobachtung von Suchanfragen gehören hingegen zum Umfang der SEO-Leistungen. Die Designübergabe mit dem Versprechen einer bestimmten Position bei einer bestimmten Suchanfrage zu verknüpfen, wäre nicht angemessen. Wie leicht Besucher Informationen erreichen und wie sich die Sichtbarkeit in Suchmaschinen entwickelt, muss getrennt bewertet werden.

Wie wägen wir individuelles Design und Theme-Auswahl ab?

Das Erscheinungsbild eines Themes kann Ihnen gefallen; entscheidend ist jedoch, ob Ihre Inhaltsstruktur dazu passt. Individuelles Design ist nicht in jedem Fall schneller oder wirtschaftlicher. Wir entscheiden anhand des Seitenverhaltens, der Anforderungen der Redaktion und der langfristig zu pflegenden Technologie. Beim Aufbau eines Designsystems werden wiederverwendete Buttons und Karten standardisiert; mit diesen Komponenten entsteht eine markenspezifische Seitenhierarchie.

In Projekten von HazırSoft geht es nicht darum, eine Vorlage umzubenennen, sondern die benötigten Ansichten zu definieren. Wir können zunächst die wichtigsten Nutzungspfade ausarbeiten und nachrangige Seiten mit derselben Komponentenfamilie für eine spätere Phase vorsehen. Wenn Sie das Erscheinungsbild unserer Referenzprojekte prüfen, berücksichtigen Sie auch Menü, Inhaltslänge und mobiles Layout; allein eine Abbildung der Startseite gibt nicht ausreichend Auskunft über den Umfang.

Website-Relaunch: Bestandsaufnahme für die Migration vor visueller Veränderung

Vor Beginn eines Relaunchs ermitteln wir, welche Teile der bestehenden Website gut funktionieren. Eine Seite, die Anfragen bringt, eine häufig heruntergeladene Datei oder eine URL mit externen Verlinkungen darf im neuen Design nicht verloren gehen. Falls Nutzerbeschwerden und vorhandene Analysedaten vorliegen, werden sie gemeinsam ausgewertet. Fehlen Messdaten, stellen wir beobachtungsbasierte Feststellungen nicht als datenbestätigte Ergebnisse dar.

• Inhalte, die im Menü nicht auffindbar sind, aber einen Nutzwert haben, werden erfasst.
• Fehlerhafte Bilder, überlaufende Tabellen und fehlende mobile Darstellungszustände werden anhand von Beispielen dokumentiert.
• Nicht verwaltbare Inhaltsbereiche werden in das neue Modell der Verwaltungsoberfläche überführt.
• Abhängigkeiten von alter Software und Serveranforderungen werden aufgelistet.
• Formularbenachrichtigungen und Downloadlinks werden in die Migrationsprüfung einbezogen.

Die URL-Zuordnungsdatei enthält jeweils die alte URL, ihr neues Gegenstück und die Migrationsentscheidung. Jede alte Seite auf die Startseite weiterzuleiten, ist keine sinnvolle Zuordnung. Vor der Veröffentlichung werden die Datensicherung und das Verfahren zur Rückkehr zum vorherigen Stand festgelegt; danach werden kritische Nutzungspfade und der Crawling-Status beobachtet. Dieser Plan soll das Risiko von Sichtbarkeitsverlusten verringern, garantiert aber nicht, Schwankungen vollständig zu verhindern.

Bewerten Sie Webdesign-Angebote anhand der vorgesehenen Ansichten

Beim Angebotsvergleich reicht die Seitenzahl allein nicht aus. Fragen Sie, mit welchen Zuständen Startseite, gefilterte Liste und Detailansicht geliefert werden. Auch eine Suche ohne Treffer, ein fehlendes Produktbild oder eine ungültige Formulareingabe können beispielsweise zum Designumfang gehören. Es muss klar sein, wann Änderungswünsche gesammelt werden und wie Änderungen der Inhaltsstruktur nach der Freigabe behandelt werden.

• Beispielansichten: Lassen Sie sich reales Verhalten wie ein mobiles Menü, lange Inhalte und Formularfehler zeigen.
• Übergabedateien: Klären Sie den Umfang der Design-Quelldateien, Bildlizenzen und technischen Einrichtungshinweise.
• Entwicklungsgrundlage: Prüfen Sie Serveranforderungen und die Voraussetzungen für eine Übernahme durch ein anderes Team.
• Abnahmekriterien: Nutzungspfade, Zuständigkeiten für Inhalte und Testgeräte sollten vorab festgelegt werden.

Bei unserer Webdesign-Übergabe erhalten Kunden Quellcode und Zugänge; die Zusammenarbeit erfolgt auf Vertragsbasis und mit Rechnungsstellung. Die Grenzen des einjährigen technischen Supports nach der Veröffentlichung werden im schriftlichen Leistungsumfang festgehalten, wobei Fehlerkorrekturen und neue Designwünsche voneinander getrennt werden. Diese Übergaberegelung soll die Abhängigkeit im Betrieb verringern; die Nutzungsbedingungen von Drittanbieterlizenzen gelten zusätzlich.

Wir arbeiten remote mit Unternehmen aus dem DACH-Raum und der Türkei zusammen. Präsentationen der Ansichten und Entscheidungsprotokolle werden unabhängig vom Standort nach demselben Arbeitsverfahren geführt. Zur Vorbereitung branchenspezifischer Inhalte können Sie die Themen unserer Branchenlösungen nutzen.