it-swarm.com.de

Informationen zum Scrollen von Webseiten im Vollbildmodus

Es gibt in letzter Zeit viele Websites, die Vollbild-Bildlaufseiten verwenden, seit Apple hat mit dem iPhone 5C eine eigene gestartet. (Website nicht mehr verfügbar, aber eine Reproduktion finden Sie hier )

Einige andere Beispiele sind:

Gibt es eine Studie zu dieser Praxis aus UX-Sicht? Mehr als über das Scroll-Highjacking, über die Verwendung von Vollbildinhalten?

Es scheint mir, dass es eine einfache Möglichkeit ist, dem Benutzer Informationen zu präsentieren, wenn sie richtig und auf einfache Weise verwendet werden, genau wie eine gute Power Point-Präsentation. Eine Möglichkeit, dem Benutzer die wichtigsten Dinge auf schöne und intelligente Weise zu zeigen.

Ich sehe heutzutage viele Entwickler, die sich über diese Art von Websites beschweren, hauptsächlich wegen des scrollenden Highjack, aber es scheint mir, dass Benutzer im Allgemeinen ebenso wie Kunden wie sie.

Irgendwelche Gedanken dazu?

34
Steve

Die visuelle Attraktivität dieser Websites ist unbestreitbar. Sie haben jedoch ernsthafte Probleme in Bezug auf die Benutzerfreundlichkeit:

  • Alle Kontrolle wird dem Benutzer entzogen. Alle diese Websites zwingen jeden, eine mehrseitige Hochglanzanzeige anzuzeigen, ob er möchte oder nicht. Was ist, wenn ich nur Ihr Produkt kaufen möchte? Was ist, wenn ich Ihre Kontaktinformationen schnell erhalten möchte? Vergiss es. Dies wird für alle sehr ärgerlich sein, die von Ihrem Entwurf nicht begeistert sind.

  • Extrem niedrige Informationsdichte. Eine gute Site bietet alle wichtigen Informationen auf einen Blick oder zumindest mit einem Klick. Diese Websites verteilen Informationen im Wert von einer Seite auf mehrere Seiten. Benötige ich wirklich einen ganzen Bildschirm, um mir einen 10-Wort-Satz zu sagen?

  • Wo bin ich? Normalerweise gibt es keine Möglichkeit, zu dem zu navigieren, was Sie möchten, und auch keine Möglichkeit, zu sehen, wo Sie sich in Bezug auf andere Inhalte befinden. Solange der Benutzer in einer geraden Linie durch Ihre Website fährt, funktioniert dies einwandfrei. Aber alles, was nicht linear ist, wird zu einem echten Chaos. Wenn Sie im obigen Beispiel neues JUMO-Konzept-Beispiel auf eine der spezifischen Lampen klicken und dann auf die Lampe selbst klicken, ist unklar, wo Sie in Bezug auf die Struktur der Site gelandet sind. Sie müssen nur scrollen, bis Sie sich orientiert haben.

  • Unbekanntes Navigationsparadigma. Einige dieser Websites bieten eine Anleitung zum Scrollen auf der ersten Seite. Wenn ein Benutzer, dem Ihre Website präsentiert wird, die grundlegendste Navigation ohne Anweisungen nicht verstehen kann, ist dies nicht ein Zeichen für einen völligen UX-Fehler?

  • Kein Fallback, wenn die Site nicht auf einen Bildschirm passt . Sie müssen zu 100% sicher sein, dass Ihr Design auf Bildschirmen jeder Größe funktioniert, da der Benutzer sonst keine Möglichkeit hat, zu scrollen und den Inhalt anzuzeigen. Einige dieser Websites brechen ab, wenn Sie das Fenster verkleinern.

Ich persönlich würde mich von diesem Design fernhalten. Es ist lahm in Bezug auf die Benutzerfreundlichkeit. Es sieht cool aus, wenn es gut gemacht wird, aber ein großer Teil davon ist die Neuheit - die sich schnell abnutzen wird.

Update: Es gibt einige Rückschläge von einigen Leuten zu dieser Antwort. Diese Seiten können beeindruckend aussehen (wie bereits erwähnt) und in bestimmten Fällen in Ordnung sein. Ich denke jedoch, dass Designer die Gefahr haben, die Bedeutung eines schönen Designs zu überschätzen und die Bedeutung einer funktionalen Webseite zu unterschätzen.

Auch "Sie können mit diesem Design navigieren" scheint einer der Hauptgründe zu sein. Dies hilft ein wenig - aber keines der angegebenen Beispiele verfügt über eine Navigation, die bei weitem nicht so gut ist wie eine normale Website. Kleine Punkte auf der rechten Seite zählen kaum als Navigation. Das Top-Menü-Design ist besser, aber alles andere als ideal. Auf der Website MediaFire können Sie auf nicht intuitive Elemente wie "Vertrauenswürdig" klicken, um eine Seite ohne Inhalt anzuzeigen. Sie müssen auf "Mehr" klicken und dann zum Ende der Seite gehen, um echte Informationen über das Unternehmen, den Support usw. zu erhalten. Auf der Teppichseite ist nicht klar, wo Sie sich befinden. und es wird verwirrend, wenn Sie etwas nichtlineares tun. Vielleicht ist es möglich, die Navigation besser zu machen, aber ich würde zumindest gerne ein Beispiel sehen, in dem es gut gemacht wird.

52
user31143

Dieses Design verliert jede Neuheit, wenn sofort Sie erkennen, dass es sich um eine Diashow handelt.

Als Diashow gewinnt sie jedoch in folgenden Bereichen:

  • wenn Sie nur eine Richtung zum Wischen/Scrollen haben, können Sie leichter herausfinden, wohin ich von hier aus gehe als bei Prezi (wo die "nächste" Richtung überall sein kann, sogar innerhalb/außerhalb der Seite).
  • ein reibungsloser Übergang von einer Seite zur nächsten erleichtert es den Betrachtern (ohne die Schriftrolle zu steuern), zu sehen, in welche Richtung die Dinge gehen
  • abscheuliche Animationen und Geräusche, die in PowerPoint so leicht missbraucht werden können, sind in jQuery oder JavaScript geringfügig schwieriger zu erstellen, was zu einer höheren durchschnittlichen Präsentationsqualität führt
  • visuelle Fortschrittsanzeigen (z. B. Punkte entlang der Seite in der Mac Pro-Anzeige) können die Lesbarkeit verbessern und fehlen aus irgendeinem Grund normalerweise in Diashows.

Aber als Diashow verliert es in folgenden Bereichen:

  • ungewohntes Kontrollparadigma
  • sie kommen vielleicht zu einer Seite nicht, die eine Diashow erwartet, und gehen, ohne sie zu erleben, einfach weil Sie nicht gescrollt haben
  • das Anbringen einer Meldung "Scrollen, um mehr anzuzeigen" auf Ihrer Startseite ist amateurhaft und liegt vollständig an den beiden oben genannten Punkten
16
hoosierEE

dan1111 hat auf mögliche Probleme mit diesem Design hingewiesen, aber ich denke, dass es eine ziemlich robuste Idee ist, wenn es richtig ausgeführt wird.

Fallbeispiel ist die Mac Pro Einführungswebsite . Dies erregte viel Aufmerksamkeit, als es herauskam, und bot eine gute Möglichkeit, den Benutzern das neue Produkt vorzustellen.

Dinge, die sie gut gemacht haben:

1. Es sieht gut aus

Schwarzer Hintergrund, geeignete Schriftart und Farbauswahl, gute Grafiken usw.

2. Es hat eine Navigation

Bei schwebenden Punkten auf der Seite wird der Titel dieser Seite angezeigt. Auf diese Weise kann der Benutzer schnell steuern, wohin er möchte. Etwas langsamer als Text immer sichtbar, aber eleganter. Ihre Position in der Navigation wird auch durch den ausgefüllten Punkt angezeigt.

3. Ansichten haben reichhaltigen Inhalt

Im Mittelpunkt einer Grafik stehen recht detaillierte Spezifikationen, und bestimmte Teile werden mit Grafiken auf der Seite hervorgehoben. Jede Seite hat viel zu lesen, so dass der Animationsaufwand proportional gering ist. Nur E/A-Ansichten am Ende nähern sich dem Punkt "OK, mach mit der Show weiter".

4. "Responsive" Design

Sieht auf meinem HD-Bildschirm, meinem MacBook Pro-Bildschirm und meinem winzigen iPhone 4S-Bildschirm gut aus. Sieht nicht gut aus, wenn ich etwas Seltsames mache - Chrome Fälschung von Benutzeragenten, sehr dünnes Fenster auf dem Desktop usw. Ich bin mir nicht sicher, wie sie das machen, anscheinend schnüffeln Benutzeragenten, Aber es funktioniert - die Seite sieht für durchschnittliche Benutzer nicht kaputt aus.

5. Alternative Seite

Die Seite specs bietet effektiv eine Alternative für Benutzer. Wahrscheinlich für diejenigen mit alten Browsern oder für Leute, die es bereits gesehen haben und nur einen Teil der Informationen wollen.

Dies befriedigt die meisten Beschwerden mit Ausnahme der "unbekannten". Ich denke nicht, dass Unbekanntes ein Thema ist, da Technologie und Gesellschaft unweigerlich zu unbekannten Orten voranschreiten. Sie müssen lediglich die Benutzer schulen, z. "Scrollen Sie nach unten oder drücken Sie die Pfeile, um fortzufahren".

Ich denke, dieses Design ist eine anständige Erfahrung für Benutzer, es muss nur dort verwendet werden, wo es geeignet ist, und es muss natürlich gut ausgeführt werden, wie oben beschrieben.

6
andrewb

Diese einseitigen Apps waren im Trend, was zu einigen Frameworks führte, mit denen die ähnliche Ansicht besser erreicht werden kann.

Der Punkt ist, dass der Benutzer eine Menge Bildlauf verwenden muss, um entweder nach oben zu gelangen (es sei denn, der Link nach oben ist vorhanden) oder um nach unten zu scrollen, und er hat möglicherweise keine Ahnung von der Kategorie, die er durchläuft, außer zu sagen: "Über die." Produktseite'.

Um dies zu überwinden, können wir entweder links oder oben eine Navigation bereitstellen, die dem Benutzer hilft, auf der Seite, aber über die Kategorien des angezeigten Inhalts wie this zu navigieren

2
user3464111

Ich wollte dies als Kommentar zu Andrewbs Antwort posten, aber mir ging der Raum aus.

andrewb gab eine Reihe von guten Punkten über diese Websites.

Das Problem ist, dass ALLE diese guten Punkte auf eine Bildlaufseite ohne Vollbild angewendet werden können, OHNE die Nachteile, auf die dan1111 hingewiesen hat, und oft sogar noch besser.

Auf einer Bildlaufseite können Sie genau steuern, was ein Benutzer sieht und wann er es sieht. Dies ähnelt praktisch einer Präsentation oder einem Video. Dies bedeutet, dass es großartig ist, wenn Ihre Website einen Flow hat, dem der Benutzer folgen soll. Eine Bildlaufseite sollte verwendet werden, wenn Sie steuern möchten, was der Benutzer wann sieht, wie bei einer Produktankündigung (wie Ubisoft es für Assassin's Creed: Unity unter http://assassinscreed.ubi.com getan hat /en-us/games/assassins-creed-unity.aspx (Klicken Sie auf die Schaltflächen "Weitere Informationen" für die Vollbildseiten) oder Apple = für das iPhone 5C).

Sie möchten nicht, dass diese Seite die einzige Möglichkeit für den Benutzer ist, auf diese Informationen zuzugreifen, selbst wenn er sie über Dritte erhalten kann. Der Benutzer befindet sich möglicherweise nicht auf einem Gerät, das die Funktionen unterstützt, die Sie anzeigen möchten. Oder er sucht nach einem bestimmten Faktoid über Ihr Produkt und interessiert sich nicht für alle 643 anderen Faktoide, die ihm in Ihrer ach so schönen, aber ach so langsamen Präsentation vorausgehen. Oder er hat nicht die Zeit, durch Ihre gesamte Zeremonie zu scrollen. Sie sollten diesen Benutzern die Möglichkeit geben, Ihre Website ohne all diese zusätzlichen Verzierungen zu durchsuchen.

2
Nzall

Die Apple-Demo zeigt mir nur dreieinhalb Telefone , sonst nichts. Ich kann nicht einmal die Seite scrollen.

enter image description here

Jetzt können Sie mich einen Sonderfall nennen, weil ich einen Porträtmonitor verwende und Vimperator anstelle einer Maus verwende. Ich kenne jedoch einige Benutzer, die Bildschirmleser und andere nicht konventionelle Eingabe- und Ausgabegeräte verwenden.

Wenn Sie davon ausgehen können, dass 100% Ihrer Benutzer einen herkömmlichen Bildschirm und eine orientierte Landschaft verwenden und die Maus verwenden, können Sie eine solche Trickseite verwenden. Sonst nicht. Genug Leute können Ihre Webseite nicht benutzen.

0
dotancohen