made in nature TYPO3 Agentur - Hilfsnavigation:

Übersicht:

Webdesign

Webdesign ist der Oberbegriff für die grafische Gestaltung, die Entwicklung einer Navigation/Benutzerführung und Festlegung der allgemeinen Struktur Ihrer Webseite.

Webdesign made in nature
TYPO3 Webdesign

Hier die einzelnen Komponenten, die wir beim Webdesign Ihrer Webseite entwickeln, im Detail und verständlich erläutert: 

Die Struktur Ihrer Webseite oder: das Haupterscheinungsbild

Das ist der Part, wo wir zusammen mit Ihnen die Struktur der Seite bestimmen. In der Regel müssen Sie hier nicht lange überlegen oder sich neue Ideen ausdenken, denn es macht sehr viel Sinn, sich für eine klassische Website-Struktur zu entscheiden. 

Wieso?  
Weil Internetuser an diese klassische Verteilung der Elemente einer Webseite gewöhnt sind. Das heißt, sie finden sich sofort zurecht.

 Für das Design hat das keinerlei Nachteile, denn die Kunst beim guten Webdesign ist, eine klassische Struktur - auch, wenn Sie auf Millionen anderen Webseiten ähnlich ist - ganz individuell zu gestalten.

Klassische Webdesign-Struktur - Beispielaufbau:

  • Kopfbereich mit Logo, Bildleiste und Hauptnavigation
  • Hauptinhaltsbereich in der Mitte
  • Fußbereich

Hier einige Beispiele:

Die Aufteilung beim Design von Webseiten

Über 50% aller User benutzen mittlerweile eine Bildschirmauflösung größer als 1024 Pixel (Breite). Diese Breite benennt die Breite des Bildschirmes der User, also den sichtbaren Bereich. 

Standard: 960 Pixel

Für das Webdesign spielt diese Breite eine wichtige Rolle. Damit der User nicht in der Breite (horizontal) scrollen muss, hat sich unter Internet-Entwicklern daher eine „Standard“-Breite von 960 Pixeln für den Hauptinhaltsbereich etabliert. Die oben verlinkten Websites sind zum Beispiel alle 960 Pixel breit.

Bei größerer/breiterer Bildschirmauflösung ist rechts und links dann einfach ein Rand mit dezent gestaltetem Hintergrund. Der eigentliche Inhalt zentriert sich dabei immer in der Mitte. Es hat sich gezeigt, dass das die benutzerfreundlichste Variante der globalen Layout-Darstellung ist.

Alternative: 100%

Alternativ kann man eine Webseite auch so gestalten, dass der sichtbare Inhalt immer 100% Breite einnimmt. Vergrößert oder verkleinert der User das Browserfenster, wächst oder schrumpft der Inhalt also mit.

Beispiel:

http://www.lernen-foerdern-ev.de 

Nachteil hier: Bei Usern mit hohen Bildschirmauflösungen wirken Textinhalte bei der Ansicht mit voller Bildschirmbreite auseinandergerissen.

Letztendlich überwiegen die Vorteile für eine feste Breite von 960 Pixeln. Entscheidend ist aber der Geschmack und Wunsch des Kunden. 

Benutzerführung & Navigation beim Webdesign

Die zentrale Fragestellung: Wo sollen die wichtigen Inhalte und Aussagen der Webseite platziert werden?

Diese Elemente sollten so positioniert sein, dass User diese auf den ersten Blick sehen. Die relevante Information sollte sich bei gutem Webdesign also sofort im Fokus des Users befinden.

Navigation
Möchte man seinen Besuchern nur wenige Seiten präsentieren, reicht eine zentrale Navigationsleiste in der Regel im Kopfbereich der Seite.

Flexibler ist man mit einer kontextintensiven Subnavigation. Übersetzt heißt das: Hat eine Seite Unterseiten, öffnet sich eine weitere Navigationsleiste, meisten rechts oder links vom Hauptinhalt.

Beispiele:

 

Weitere empfehlenswerte Navigationselemente:

  • Brotkrümelnavigation: "Sie sind hier: .../standort.html" - diese Zusatznavigation hat einen sehr hohen Stellenwert und wird von CMS automatisch generiert. Sie ist mittlerweile Standard auf guten Webseiten.
  • Fußnavigation: "Impressum", "Kontakt", "nach oben" - das werden Sie am Fuße von Webseiten schon häufiger gesehen haben. Es ist mittlerweile ebenfalls Standard und empfehlenswert.

Die Hauptnavigation:
Ob eine Navigationsleiste waagerecht oder senkrecht angelegt wird, entscheidet der Kunde nach seinem Geschmack. Eine Empfehlung oder Priorität im Sinne der Benutzerfreundlichkeit gibt es da nicht.

Struktur des Hauptinhaltsbereiches

Der Hauptinhalt kann ein-, zwei- oder mehrspaltig angelegt sein.

Beispiele:

Zweispaltiges Layout: www.rlft.de

Dreispaltiges Layout: www.freilichtspiele-tecklenburg.de

Bei einem modernen CMS wie TYPO3 können Sie das selber für jede Seite einstellen. Modernes Webdesign berücksichtigt diese verschiedenen Möglichkeiten der Aufteilung schon im grafischen Entwurf.

Benutzerfreundliches Webdesign

Bei der grafischen Gestaltung und Ausarbeitung sollte die Benutzerfreundlichkeit im Vordergrund stehen. Das gehört zum guten Ton des Webdesigns und ist quasi Standard geworden.

Benutzerfreundliches Screen-Design umfasst:

  • Ausreichende Kontraste für Textinhalte
  • Sofort sichtbare und durchschaubare Navigationsbereiche
  • Deutliche Gliederung der Inhaltsbereiche

Informationen zur Benutzerfreundlichkeit von Webseiten

Barrierefreies Webdesign

Bei gutem Webdesign werden die Aspekte der Barrierefreiheit in der Gestaltung mit berücksichtigt. Ist die Navigation auch für visuell eingeschränkte User benutzbar? Gibt es eine (unsichtbare) Navigation für Blinden-Vorlesegeräte (Screenreader) im Hintergrund der Seite?

Weitere Informationen: Barrierefreies Webdesign

Ist die Navigation überhaupt für jeden zugänglich? Gerade die Benutzbarkeit der Navigationselemente einer Webseite lässt auf vielen Webseiten noch zu wünschen übrig.

Beispielsweise sind die weit verbreiteten Drop-Down-Navigationen, bei denen die Links auf Unterseiten bei Mausberührung auf- und zuklappen, häufig für ältere Menschen nur schwer zugänglich.

Es mag sein, dass die schick und platzsparend sind, aber schlecht eingesetzt sind sie ein weit verbreitetes Negativbeispiel für Barrieren im Internet. Hier sollte Funktion ganz klar vor Design gehen.

Eine gute Navigation ist auf den ersten Blick erkennbar und durchschaubar.

Visuelle Aspekte beim Webdesign

Soll Ihr Webdesign frisch und hell sein, oder eher dunkel und stylisch? Wünschen Sie dezente Farbverläufe oder kräftigere Übergänge? Beim Webdesign werden Farbschemen entwickelt und getestet – zum Beispiel in Hinsicht auf genügend Kontraste.

made in nature - Full Service, so gehen wir beim Webdesign vor

Fazit: Webdesign ist eine Spezialdisziplin mit vielen Einzelaufgaben, die – sorgfältig konzipiert - für ein harmonisches, zielorientiertes und benutzerfreundliches Gesamtbild Ihre Webseite sorgt!

vorherige Seite -> Webdesign nächste Seite -> Webdesign mit TYPO3

Verwandte Themen:

Support:

zur Webseite: The TYPO3 Association (englisch)

CO2neutral:

Grafiklogo: Co2 neutrale Webseite, made in nature TYPO3 Agentur ist zertifiziert - Zertifikat anzeigen

Kontakt:

Stefan Grothus
Osnabrücker Str. 24
49545 Tecklenburg

+49 (0)5482 925480
+49 (0)172 2334408

 info(at)made-in-nature.de