Skip to content

Commit

Permalink
Merge pull request #279 from RichardReh/master
Browse files Browse the repository at this point in the history
Hochladen Teaserseite Reh Richard
  • Loading branch information
markusalterauge authored Jan 15, 2024
2 parents bb29ec9 + bc47873 commit ff50ca9
Show file tree
Hide file tree
Showing 2 changed files with 41 additions and 0 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
41 changes: 41 additions & 0 deletions _abschlussvortraege/2024-01-23/reh-richard.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
---
nachname: Reh
vorname: Richard
datum: 2024-01-23
uhrzeit: 9-30
raum: 3.216
betreuer: cn
thema: Optimale Wahl von Navigation-Pattern auf mobilen Webseiten
kooperationspartner: TH Köln
teaserimage: reh-richard-teaserimage.png
stichworte: Web, Navigation, UI, UX
hinweise:
weiterfuehrende-themen: Navigation-Pattern im Kontext von AR | Verwendung von KI zum analysieren und anzeigen von personalisierten Benutzerpräferenzen in einer Navigation | Eye-Tracking als alternative Bedienungsart für Navigation-Pattern als Beitrag zur Barrierefreiheit | Entwicklung einer beispielhaften Leitfaden-Webseite mit implementierten Navigation-Pattern und Erläuterung der besten Implementierungsansätze für Entwickler | Recherche weiterer Einflussfaktoren für die Wahl von Navigation-Pattern.
---

## Abstract

Egal ob Hamburger Menüs, Breadcrumbs, Akkordeons oder einfache horizontale Navigationsleisten: Jede Webseite braucht mindestens eine Form von Navigation, damit Nutzer ihre Inhalte schnell und leicht finden können. Bei der Entwicklung einer Webseite werden dafür sogenannte ,,Navigation-Pattern" als benutzerfreundliche Designlösungen verschiedener Arten von Navigations-Menüs benötigt, die zum Typ und Aufbau einer Webseite passen müssen.

Insbesondere kamen durch das Responsive Web Design eigene Designlösungen für Menüs, um trotz der begrenzten Bildschirmgröße auf mobilen Endgeräten eine benutzerfreundliche und effiziente Navigation zu gewährleisten. Für angehende Webentwickler, die an der mobilen Version ihrer Webprojekte arbeiten, ergeben sich daraus zwangsläufig die Fragen: Welche Navigationsart soll implementiert, und wie kann die Entscheidung für einen bestimmten Navigationstypen getroffen werden?

Das Praxisprojekt widmet sich diesen Fragen, damit Faktoren für die Wahl der Navigation-Pattern bestimmt werden können. Speziell werden in diesem Vortrag relevante Faktoren vorgestellt, die vom Typen des Inhalts und der Informationsarchitektur einer Webseite abhängen.

Dafür wurden aktuelle Navigation-Pattern, die auf mobilen Endgeräten verwendet werden, anhand verschiedener UI/UX-relevanter Kriterien bewertet. Diese Kriterien helfen dabei herauszustellen, für welchen Inhaltstyp einer Webseite die Verwendung bestimmter Navigation-Pattern lohnen würde. Nebenbei werden auch bewährte ,,best practices" für die Implementierung der Navigation-Pattern unter Beachtung der Limitationen mobiler Endgeräte erklärt, die dabei helfen ein benutzerfreundliches Design für die Navigation zu gewährleisten.

Die Informationsarchitektur bildet das Rückgrat aller Abschnitte und Inhalte einer Webseite und verbindet diese miteinander. Daher besteht ein weiterer Schwerpunkt dieser Arbeit darin zu zeigen, welche relevanten Eigenschaften einer Informationsarchitektur die Wahl eines Navigation-Patterns beeinflussen.

Ziel dieses Projekts ist die Aufarbeitung einer Entscheidungsgrundlage für Webentwickler, anhand welcher ein passendes Navigation-Pattern für eine mobile Webseite gewählt werden kann, sodass die Anforderungen der Webseite möglichst getroffen werden.

## Material & weiterführende Infos

**Navigation-Pattern:**
- https://ui-patterns.com/patterns/navigation/list
- https://www.nngroup.com/articles/mobile-subnavigation/

- **Einfluss des Responsive Web Designs auf mobile UI:**
- https://www.nngroup.com/articles/mobile-usability-update/

- **Informationsarchitektur:**
- https://www.usability.gov/what-and-why/information-architecture.html
- https://www.nngroup.com/articles/ia-vs-navigation/

0 comments on commit ff50ca9

Please sign in to comment.