Grundlagen des Webdesigns Teil zwei: Benutzerfreundliches Design

Webdesign: So gestalten Sie eine benutzerfreundliche Website

Grundlagen des Webdesigns Teil zwei: Benutzerfreundliches Design

Nachdem sich ein erster Teil auf die Planung des Designs einer Webseite konzentriert hat, konzentriert sich dieser zweite Teil der Reihe, die dem Webdesign gewidmet ist, darauf, wie eine Webseite so gestaltet wird, dass sie für den Benutzer einfach zu verwenden ist.

Es gibt unzählige Möglichkeiten, eine Webseite zu gestalten, aber nicht alle Designs zeichnen sich durch einfache Navigation aus. Bei der Gestaltung eines Online-Projekts müssen die Standards berücksichtigt werden, die für die Struktur einer Website festgelegt wurden. Die korrekte Visualisierung einer Seite auf verschiedenen Bildschirmen hat auch einen entscheidenden Einfluss auf die Benutzererfahrung – es ist notwendig, die zunehmende Verwendung mobiler Geräte für den Zugriff auf das Internet zu berücksichtigen. Um Benutzern das Navigieren auf Ihrer Website zu erleichtern, sollten Sie diese grundlegenden Konzepte berücksichtigen.

Index
  1. Freundliches Design und Internetkonventionen
  2. 1. Das Layout
  3. 2. Navigation
  4. 3. Unvermeidbare technische Aspekte
  5. 4 Responsive Webdesign
  6. Die häufigsten Webdesign-Fehler

Freundliches Design und Internetkonventionen

Die Verwaltbarkeit einer Webseite ist Teil des sogenannten Usability Engineering oder Usability Engineering , einem Zweig des Webdesigns, der sich mit der Erleichterung der Benutzerfreundlichkeit für den Benutzer befasst. Eine Website gilt als? Freundlich? wenn es leicht zu verstehen und zu benutzen ist . Dabei sind bei der Gestaltung die technischen Aspekte ebenso wichtig wie die formalen.

Die Barrierefreiheit oder Englisch “Barrierefreiheit” spielt auch eine Schlüsselrolle für ein Web, das sich um die Bedürfnisse des Benutzers kümmert. Dies stellt sicher, dass eine Website so gestaltet ist, dass sie von jedem Benutzer unabhängig von seinen Einschränkungen verwendet werden kann – motorisch, kognitiv, visuell, technisch usw. Seine Prinzipien wurden vom World Wide Web Consortium (W3C) festgelegt und durch nationale Gesetze auf globaler Ebene gesammelt. Solche Richtlinien finden Sie auf der Seite des Nationalen Instituts für Technologie und Lehrerausbildung oder der INTEF des spanischen Bildungsministeriums.

1. Das Layout

Das Design einer Webseite hängt eng mit dem Sektor zusammen, in den sie fällt, oder mit dem Thema, mit dem sie sich befasst. Es gibt jedoch bestimmte allgemeine Trends und Stile . Während ein großes Unternehmen dazu neigt, auf das herkömmliche Portal mit den Navigationsregistern oben und den in Spalten angeordneten Inhalten zurückzugreifen, ist es in bescheideneren Projekten üblich, ein blogähnliches Design zu finden.

See also  CSS-Tricks: nützliche Schnipsel für Ihr Webprojekt

Die goldene Regel des Layouts ist Klarheit . Eine überladene Seite kann den Benutzer desorientieren. Daher ist es ratsam, sowohl auf eine ausgewogene Verteilung als auch auf eine strukturierte Darstellung des Inhalts zu achten, die präzise, ​​lesbar und nicht sehr lang sein sollte. Wenn ja, sollten die Texte Absätze und Untertitel haben . In Bezug auf Bilder und Videos ist es wichtig, dass ihre Einbeziehung sinnvoll ist und dass eine gewisse Homogenität in ihrem formalen Umfeld erhalten bleibt. Die Zeit, die ein Benutzer auf einer Website bleibt, ist direkt proportional zu seiner einfachen Orientierung auf dieser Website.

Im Laufe der Zeit wurden Konventionen festgelegt, die zeitgenössisches Webdesign definieren. So viele Websites übernehmen formale Elemente aus sozialen Netzwerken wie Facebook oder beliebten Blogs. Diese Ausrichtung auf etablierte Seiten ist insofern sinnvoll, als die meisten Benutzer ihre Struktur bereits kennen und mit ihr vertraut sind. Auf der anderen Seite haben Animationen, die vor einiger Zeit als modern galten, einem einfachen und übersichtlichen Erscheinungsbild Platz gemacht, das dem Benutzer einen schnellen Überblick gibt. Es ist ohne Zweifel immer noch wichtig, dass das Design einer Webseite immer eine persönliche Note hat.

2. Navigation

Klarheit und Einfachheit gelten auch für die Nutzung einer Website: Eine gute Navigation wird durch eine intuitive und schnelle Nutzung definiert, dh der Benutzer erkennt und versteht die Struktur der Menüs sofort. Eine einzelne Kategorieleiste ist in den meisten Fällen ausreichend und sollte nicht zu viele Unterteilungen enthalten, die die Navigation erschweren. Wenn ein Dropdown-Menü verwendet wird, sollte es nicht sehr lang sein. Eine klare und homogene Struktur erleichtert die Navigation und behält immer den Überblick.

Dazu sollten die Menükategorien als solche erkannt werden: Für die Gestaltung der Links können Sie Symbole oder den Hover-Effekt verwenden , wobei ein Link oder eine Kategorie ihr Aussehen ändert, wenn die Maus darüber fährt. Es ist auch wichtig, bei der Benennung von Kategorien oder Unterpunkten auf Nüchternheit zu achten: Je spezifischer, desto besser. Diese sollten auch enthalten, was sie versprechen.

3. Unvermeidbare technische Aspekte

Die technische Implementierung einer Webseite ist von entscheidender Bedeutung. Der einwandfreie Betrieb einer Website hängt von einer perfekten Anpassung des Inhalts ab. Sie müssen daher sicherstellen, dass Sie sie korrekt eingeben: Download- und Anzeigefehler bedeuten Unprofessionalität und enttäuschen den Benutzer. Dies ist beispielsweise der Fall, wenn das korrekte Herunterladen von Inhalten lange dauert, was zu einem langen und unangenehmen Warten führt . Das Verlassen auf die Geduld des Benutzers sollte unbedingt vermieden werden. Daher ist es ratsam, den Betrieb einer Website in dieser Hinsicht regelmäßig zu überprüfen.

See also  Selenium Tutorial: Verwendung des Browser Crossmatch Framework

Ein weiterer zu berücksichtigender Faktor sind die Anforderungen verschiedener Mobilgeräte. Heutzutage ist es wichtig, dass auf eine Seite von jedem Gerät mit Internetverbindung aus zugegriffen werden kann und dass sie den aktuellen technischen Standards entspricht, unabhängig von der verwendeten Plattform oder dem verwendeten Betriebssystem. Der Inhalt sollte mit der verfügbaren Software angezeigt werden können und keine höhere Leistung als üblich erfordern. Andernfalls wäre der Zugriff auf Benutzer mit kleineren Prozessoren beschränkt.

4 Responsive Webdesign

Aufgrund der extremen Ausweitung mobiler Geräte mit Internetzugang wird es immer wichtiger, dass eine Seite mit jedem Gerätetyp (Laptop, Tablet, Smartphone usw.) korrekt geöffnet und angezeigt werden kann. Früher war das häufigste ein statisches Layout , aber diese Art von Design reagiert nicht auf die unterschiedlichen Bildschirmgrößen auf dem Markt, sodass der Benutzer auf kleinen Bildschirmen wie Mobiltelefonen nur ein kleines Fragment des Bildschirms sehen kann .

Ein anpassungsfähiges Design ist flexibler, da es verschiedene Versionen für dieselbe Seite bietet, z. B. für Smartphones, Tablets oder Desktop-Computer. Diese Formate akzeptieren jedoch nur die gängigsten Bildschirmgrößen und nur bestimmte Modelle. Daher wird häufig Platz auf dem Bildschirm verschwendet, da nicht alle möglichen Formate angepasst werden können.

Auf der anderen Seite ist Responsive Design oder Responsive Web Design (RWD) viel flexibler, da sich die Konstruktion der Seite immer an die Art des Bildschirms anpasst, auf dem sie angezeigt wird: In diesem Fall handelt es sich um ein Design mit Reaktionskapazität. daher der Name, der den verfügbaren Platz optimal nutzt. So ist es zum Standard des aktuellen Webdesigns geworden.

Im Gegensatz zum statischen Design verwendet das flexible oder anpassungsfähige Design eine variable Netzstruktur ( Raster in Englisch), die sich nicht nur automatisch an das Bildschirmformat anpasst, sondern immer die wichtigsten Informationen und Elemente in den Vordergrund stellt. Navigation einer Seite, die die Benutzerfreundlichkeit der Seite unabhängig vom verwendeten Gerät beeinträchtigt.

See also  Website für einen Installations-, Wartungs- und Renovierungsservice

Die häufigsten Webdesign-Fehler

Sie lernen aus Fehlern, aber es gibt einige, die vermieden werden sollten, wenn Sie die Konkurrenz übertreffen möchten:

  • Popup-Fenster : Während sie vor relativ kurzer Zeit modern waren, werden die Fenster, die sich beim Klicken auf ein Element öffnen, heutzutage von den meisten Internetnutzern verabscheut, die sie dank Browsererweiterungen sogar blockieren können.
  • Kontaktinformationen nicht anzeigen : Lassen Sie sich von Ihren Besuchern kontaktieren, wenn sie dies wünschen. Jede Website sollte unterschiedliche Kontaktoptionen bieten. Diese sollten einfach und zugänglich sein.
  • Unterbrochene Links : Das Folgen eines Links, der nirgendwohin führt, ist irritierend und führt zum Verlust von Besuchen. Sobald Ihre Seite betriebsbereit ist, überprüfen Sie regelmäßig den guten Zustand der Links.
  • Veraltete Inhalte : Achten Sie auf die Aktualität Ihrer Inhalte, um immer neue Besuche zu gewährleisten und sicherzustellen, dass Ihre Inhalte geteilt werden.
  • Schlechte Navigation : Der Benutzer erwartet Internetgeschwindigkeit. Wenn Sie nicht schnell finden, wonach Sie suchen oder wo Sie es finden können, werden Sie woanders hingehen – wahrscheinlich bei Ihrer Konkurrenz. Um dies zu vermeiden, stellen Sie sicher, dass auf jeder Unterseite Ihrer Website eine Navigationsleiste vorhanden ist, um den Pfad des Benutzers zu vereinfachen.
  • Überdesign : Ein ziemlich häufiger Anfängerfehler ist die Verwendung vieler verschiedener Schriftgrößen und -farben. Aber weniger ist mehr: Das Erscheinungsbild einer Site muss harmonisch und homogen sein. Vermeiden Sie daher Exzesse und beschränken Sie sich so weit wie möglich auf drei Arten von Quellen, die sich gut miteinander kombinieren lassen. Und das Gleiche in Bezug auf Farben.

Durch die Vermeidung dieser typischen Fehler und die Einhaltung der von uns beschriebenen grundlegenden Usability-Regeln verfügt Ihre Website über eine solide Grundlage, um ein seriöses Projekt zu werden, das den aktuellen Standards entspricht. Im letzten Teil unserer Reihe zum Thema Webdesign erhalten Sie einen Überblick über die formalen Aspekte, die für die Fertigstellung eines Webprojekts erforderlich sind, wobei Sie sich auf die Auswirkungen konzentrieren, die bestimmte Designs und Farben auf den Benutzer haben.

administrator

Leave a Reply

Your email address will not be published. Required fields are marked *