Umfragebericht zum Scrollen 2021

Hier findest du den Bericht „Scroll Survey“ 2021 sowie ein paar Worte des Chrome-Teams dazu, wie sich dies auf Prioritäten und Pläne für Chromium und das Web auswirkt.

Adam Argyle

Sam Dutton

Im April veröffentlichte das Chrome-Team eine Umfrage zum Scrollen und Tippen, die auf den am häufigsten gemeldeten Problemen aus dem MDN Web DNA Report 2019 basiert. Der 2021 Scroll Survey Report ist fertig und das Chrome-Team möchte einige Gedanken und Maßnahmen teilen, die wir aus den Umfrageergebnissen abgeleitet haben. Wir hoffen, dass diese Ergebnisse Browseranbietern und Standardgruppen helfen zu verstehen, wie sie das Scrollen im Web verbessern können.

Sehen Sie sich den Scroll Survey Report 2021 an.

Nennenswerte Ergebnisse

Bei der Umfrage wurden anonym 880 Einsendungen eingereicht, von denen 366 jede Frage beantworteten.

Während Sie mit dem Scrollen beginnen, reicht eine CSS-Zeile, z. B. overflow-x: scroll;. Die Oberfläche von Scroll-APIs und -Optionen ist groß und reicht von JavaScript bis CSS. Die folgenden Ergebnisse helfen dabei, die Probleme aufzuzeigen, mit denen Webentwickler konfrontiert sind.

Gesamtzufriedenheit beim Scrollen im Web

Frage 27

Diese Frage wurde bewusst gegen Ende der Umfrage gestellt, nach Fragen zu 26 Scroll-Anwendungsfällen und -Funktionen. Aus der Antwort geht klar hervor, dass die Web-Community Probleme mit Scrollen hat. Fast die Hälfte der Befragten gab an, dass sie insgesamt unzufrieden waren.

Unserer Ansicht nach sollte die allgemeine Stimmung in Bezug auf die Arbeit mit Scrollen nicht so niedrig sein. Dieser Messwert muss geändert werden. Ein deutlicher Hinweis darauf, dass noch viel zu tun ist.

Schwierigkeiten beim Scrollen

Frage 2

Unsere Forschung hat ergeben, dass diese Schwierigkeiten auf die Vielzahl von Anwendungsfällen für das Scrollen zurückzuführen sind. Wenn wir vom Scrollen sprechen, kann das Folgendes umfassen: – Positionierung von Elementen innerhalb scrollbarer Bereiche – Unendliches Scrollen – Scrollen verknüpfte Animation – Karussells – Scrollview-Abstände – Zyklisches Scrollen – Virtualisiertes Scrollen

Fehlende Browserfunktionen, komplexes JavaScript und die Notwendigkeit, Eingabemodi wie Touchscreen, Tastatur und Gamepads zu unterstützen, erschweren all dies.

Bedeutung von Touch-Interaktionen

Frage 3

Da die Besucherzahlen des mobilen Webs immer noch ansteigen, war es nicht überraschend, zu sehen, dass die Hälfte der Befragten angibt, dass Berührung für ihre Arbeit im Web sehr wichtig ist. Das bedeutete, dass Webfunktionen wie CSS-Scroll-Snap und touch-action besondere Aufmerksamkeit erfordern, damit im Web eine hochwertige Touch-Interaktion erzielt werden kann.

Schwierigkeiten bei der Navigation mit der Tabulatortaste oder dem Gamepad

Frage 5a

Das Scrollen umfasst Navigationsmethoden wie Pfeile auf der Tastatur, Tabulatortaste, Drücken der Leertaste und Gamepads. Bei benutzerdefinierten Scrollvorgängen kann es schwierig sein, diese einzubetten. Fast die Hälfte der Befragten gab an, dass es eher oder extrem schwierig ist, diese Eingaben

touch-action lernen

Frage 9

In der Umfrage ging es um die Verwendung bestimmter APIs. Die Antwort „Ja“, „Nein“ oder „Heute habe ich gelernt“ lautete. Ein wichtiges Feedback war die Anzahl der Personen, die angegeben haben, dass sie durch die Umfrage mehr über touch-action erfahren haben. Dies ist eine wichtige Eigenschaft beim Erstellen benutzerdefinierter Touch-Gesten, die beim Scrollen interagieren müssen.

Zyklisches Scrollen

Frage 27

Diese Zahlen sind hoch für eine Scrollfunktion, die von der Webplattform wenig oder gar nicht unterstützt wird. Die Funktion verursacht häufig hohe technische Altlasten, da Duplikate oder JavaScript-Einfügungen eingeschleust werden, um den Effekt zu erzwingen. Sie ist beliebt für Produktkarussells und die Auswahl von Zeit in Sekunden oder Minuten für zyklisches Scrollen.

Sind scrollbare Bereiche wichtig?

Frage 2

Den Umfrageteilnehmern war wichtig, scrollbare Bereiche zu sehen, was ein weiteres Signal für die Schwierigkeiten war, die für ein qualitativ hochwertiges Scrollen erforderlich sind.

Karusselle

Frage 20

Nahezu alle Befragten verwenden in ihrer Onlinearbeit Karussells, während nur 25% sie als einfach zu verwalten empfinden. Standardkarussells waren bei unserer Forschung beliebt, aber diese Statistik hat uns überrascht, da sie nicht sehr gelöst klingt.

Unendliches Scrollen

Frage 22

Zwei Drittel der Befragten geben bei ihrer Arbeit unendliches Scrollen und geben an, dass dies schwierig ist. Ein weiteres Beispiel für eine hohe Auslastung in Verbindung mit einem hohen Schwierigkeitsgrad, das darauf hinweist, dass ein Bereich Aufmerksamkeit erfordert.

Obwohl content-visibility und contain-intrinsic-size kombiniert werden können, um die Renderingkosten für lange scrollbare Bereiche zu senken, scheint es beim „Mehr laden“-UX mit unendlichem Scrollen nicht zu helfen.

Durch Scrollen verknüpfte oder durch Scrollen ausgelöste Animationen

Frage 24

Fast die Hälfte der Befragten verwendet Animationen, die durch Scrollen orchestriert werden, und die Hälfte der Befragten empfindet es als schwierig, was wiederum eine hohe Nutzung als schwierig empfunden hat.

Mit dem integrierten Scrollen konkurrieren

Frage 26

Die integrierten Scroll- und Touch-Interaktionen von Smartphone- und Tablet-Apps werden oft als klarer Punkt angepriesen, an dem das Web aufholen kann. Zu den Funktionen gehören durch Scrollen verknüpfte Animationen, programmatische Schnittstellen, Sprachintegration, Scroll-Hinweise und zum Aktualisieren ziehende APIs.

Nur die Hälfte der Befragten war der Meinung, dass es nur manchmal möglich ist, das integrierte Scrollen zu erleben.

Gesamtzufriedenheit mit Scroll-Interaktionen im Web

Frage 27

Erkenntnisse aus Umfragen

Die Umfrageergebnisse sind in vier Kategorien unterteilt: Kompatibilität, Bildung, APIs und Funktionen.

Kompatibilität

Das Chrome-Team hat zum Ziel erklärt, die Anzahl der Probleme mit der Webkompatibilität, einschließlich Scroll-Kompatibilität, zu verringern.

Die ersten drei Kompatibilitätsprobleme, auf die Sie sich konzentrieren sollten: 1. Kompatibilität mit horizontalem Scrollen 1. overscroll-behavior browserübergreifend. 1. Präfixe aus -webkit-scrollbar werden entfernt und dem Standard folgen.

Bildung

Die Umfrageergebnisse zeigten, dass noch mehr über touch-action und logische Eigenschaften aufgeklärt werden muss. Der Browser spielt bei internationalen Layouts eine Vorreiterrolle und es ist offensichtlich, dass er nicht ausgelastet oder missverstanden wird.

Schwerpunkte: 1. touch-action 1. Logische Eigenschaften

APIs

Die Nutzung des Scroll-Snaps nimmt zu und Entwickler sind der Meinung, dass sie Funktionen in Kompatibilität mit gängigen Bibliotheken und Plug-ins verwenden möchten. Durch das Verkleinern der Lücke zwischen CSS- und Plug-in-Bibliotheken lassen sich Scroll-Snap-Entwickler und Nutzer zufriedenstellen.

Wir konzentrieren uns bei der API-Arbeit auf scroll-snap: 1. Verfügbarkeit und Kompatibilität von APIs in verschiedenen Browsern 1. Beginnen Sie mit der Arbeit an neuen CSS APIs wie scroll-start. 1. Beginne mit der Arbeit an neuen JS-Ereignissen wie snapChanged().

Funktionen

Die Umfrageergebnisse zeigten, dass Nutzer mit bestimmten Arten scrollbarer Komponenten im Web zu kämpfen haben, da die Plattform nicht die erforderlichen Primitiven zur Verfügung stellt, um sie ohne Plug-ins oder hohen Aufwand zu erstellen. Wir hoffen, diesen Bereich noch genauer unter die Lupe nehmen zu können.

Folgende Funktionen sind für Entwickler schwierig: 1. Karussells 1. Virtuelles Scrollen 1. Unendliches Scrollen

Ressourcen

• Scroll-Umfragebericht
• Ankündigung der Umfrage
• Mozilla DNA-Berichte
• Compat2021: Beseitigung der fünf wichtigsten Kompatibilitätsprobleme im Web

Miniaturansicht: Foto von Taylor Wilcox auf Unsplash.