Hier finden Sie den Scroll-Umfragebericht von 2021 sowie Informationen des Chrome-Teams dazu, wie sich dies auf Prioritäten und Pläne für Chromium und das Web auswirkt.
Im April hat das Chrome-Team eine Umfrage zu Scroll- und Touch-Aktionen veröffentlicht, die auf den am häufigsten gemeldeten Problemen aus dem MDN Web DNA Report 2019 basiert. Der Bericht zur Scroll-Umfrage 2021 ist fertig und das Chrome-Team möchte einige Gedanken und Maßnahmen, die wir aus den Umfrageergebnissen abgeleitet haben, mit Ihnen teilen. Wir hoffen, dass diese Ergebnisse Browseranbietern und Standardisierungsgremien helfen, das Scrollen im Web zu verbessern.
Bericht zur Scroll-Umfrage 2021 ansehen
Wichtige Ergebnisse
Bei der Umfrage wurden anonym 880 Antworten erfasst, wobei 366 Teilnehmer alle Fragen beantwortet haben.
Die ersten Schritte mit dem Scrollen sind zwar nur eine Zeile CSS, z. B. overflow-x:
scroll;, aber die Oberfläche der Scroll-APIs und -Optionen ist groß und umfasst JavaScript bis CSS. Die folgenden Ergebnisse verdeutlichen die Probleme, mit denen Webentwickler konfrontiert sind.
Allgemeine Zufriedenheit mit dem Scrollen im Web
Frage 27
45 %
sind eher oder äußerst unzufrieden
mit Web-Scrolling.
Diese Frage wurde bewusst erst am Ende der Umfrage gestellt, nachdem 26 Scroll-Anwendungsfälle und ‑Funktionen behandelt wurden. Aus der Antwort geht hervor, dass die Web-Community Probleme mit dem Scrollen hat. Fast die Hälfte der Befragten gibt an, insgesamt unzufrieden zu sein.
Wir sind der Meinung, dass die allgemeine Stimmung in Bezug auf die Arbeit mit Scrollen nicht so schlecht sein sollte. Dieser Messwert muss geändert werden. Er ist ein deutliches Signal dafür, dass etwas getan werden muss.
Schwierigkeiten beim Scrollen
Frage 2
43%
haben angegeben, dass die Arbeit mit dem Scrollen ziemlich oder
extrem schwierig ist.
Unsere Untersuchungen haben ergeben, dass diese Schwierigkeiten auf die Vielzahl der Anwendungsfälle für das Scrollen zurückzuführen sind. Wenn wir über Scrollen sprechen, kann das Folgendes umfassen: - Elemente in scrollbaren Bereichen positionieren - Unendliches Scrollen - Scroll-verknüpfte Animation - Karussells - Scrollview-Padding - Zyklisches Scrollen - Virtualisiertes Scrollen
Fehlende Browserfunktionen, komplexes JavaScript und die Notwendigkeit, Eingabemodi wie Touch, Tastatur und Gamepads zu unterstützen, erschweren all diese Dinge.
Bedeutung von Touch-Interaktionen
Frage 3
51%
Touch-Interaktionen als
sehr oder äußerst wichtig
für ihre Arbeit.
Da die Zahl der Nutzer des mobilen Webs in den Besuchsstatistiken weiter steigt, war es nicht überraschend, dass die Hälfte der Befragten angab, dass die Touch-Bedienung für ihre Arbeit im Web sehr wichtig ist. Das hat gezeigt, dass Webfunktionen wie CSS-Scroll-Snap und touch-action besondere Aufmerksamkeit erfordern, damit das Web hochwertige Touch-Interaktionen ermöglichen kann.
Schwierigkeiten bei der Tabulatortaste oder der Gamepad-Navigation
Frage 5a
44%
etwas oder extrem schwierig
mit Gamepad und Tab-Navigation.
Das Scrollen umfasst Navigationsmethoden wie Tastaturpfeile, Tabulatortasten, Leertastendrücke und Gamepads. Es kann schwierig sein, diese beim benutzerdefinierten Scrollen zu berücksichtigen. Fast die Hälfte der Befragten gab an, dass es etwas oder sehr schwierig ist, diese Eingaben zu berücksichtigen.
Lernen – touch-action
Frage 9
50 %
Bericht Lernen über
`touch-action: manipulation`
aus der Umfrage.
Bei einigen Umfragefragen ging es um die Verwendung bestimmter APIs. Die möglichen Antworten waren „Ja“, „Nein“ oder „Heute habe ich Folgendes gelernt“. Ein wichtiger Punkt war die Anzahl der Personen, die in der Umfrage angaben, dass sie touch-action kennengelernt haben. Das ist eine wichtige Eigenschaft beim Erstellen benutzerdefinierter Touch-Gesten, die mit dem Scrollen interagieren müssen.
Zyklisches Scrollen
Frage 27
58%
Bericht manchmal, oft oder bei jedem Projekt
mit zyklischem Scrollen.
nach 60 Sekunden beginnt er wieder bei 0.
Diese Zahlen sind für eine Scrollfunktion, die von der Webplattform nur wenig oder gar nicht unterstützt wird, hoch. Daher verursacht die Funktion oft hohe technische Schulden, da Duplikate oder JavaScript eingefügt werden, um den Effekt zu erzwingen. Sie wird häufig für Produktkarussells verwendet und wenn die Zeit in Sekunden oder Minuten ausgewählt wird, um zyklisches Scrollen zu ermöglichen.
Sind scrollbare Bereiche wichtig?
Frage 2
55%
sehr oder
äußerst wichtig
16%
Bericht überhaupt nicht
oder geringfügig wichtig
Die Befragten betonten die Wichtigkeit scrollbarer Bereiche, was ein weiteres Signal dafür ist, wie schwierig es ist, hochwertiges Scrollen zu ermöglichen.
Karussells
Frage 20
87 %
Bilderkarussells verwendet haben.
24 %
einfach zu verwalten.
Fast alle Befragten verwenden Karussells in ihren Webprojekten, aber nur 25% finden sie einfach zu verwalten. Standardkarussells waren während unserer Studie beliebt, aber diese Statistik hat uns überrascht, da sie nicht sehr gelöst klingt.
Unendliches Scrollen
Frage 22
65 %
manchmal
bis jedes Projekt
60 %
etwas oder
äußerst schwierig.
Zwei Drittel der Befragten verwenden Infinite Scroll in ihrer Webarbeit und ebenso viele geben an, dass es schwierig zu implementieren ist. Ein weiteres Beispiel für eine hohe Nutzung in Verbindung mit einem hohen Schwierigkeitsgrad, was für uns ein Hinweis darauf ist, dass hier Handlungsbedarf besteht.
content-visibility und contain-intrinsic-size können zwar kombiniert werden, um die Rendering-Kosten für lange scrollbare Bereiche zu senken, aber das scheint nicht bei der UX für unendliches Scrollen mit „Mehr laden“ zu helfen.
Scrollgebundene oder scrollausgelöste Animationen
Frage 24
47 %
manchmal
bis jedes Projekt
56%
eher oder
äußerst schwierig
Fast die Hälfte aller Befragten nutzt scroll-orchestrated Animations und die Hälfte der Befragten findet sie schwierig. Auch hier gibt es also eine Verbindung zwischen hoher Nutzung und Schwierigkeit.
Mit integriertem Scrollen konkurrieren
Frage 26
32%
immer oder
meistens
50 %
manchmal
Die integrierten Scroll- und Touch-Interaktionen von Smartphone- und Tablet-Apps werden oft als ein klarer Bereich angeführt, in dem das Web aufholen kann. Zu den Funktionen gehören scrollgebundene Animationen, programmatische Schnittstellen, Sprachintegration, Scroll-Hinweise und Pull-to-Refresh-APIs.
Nur die Hälfte der Befragten war der Meinung, dass es nur manchmal möglich ist, das Scrollen wie bei integrierten Funktionen zu simulieren.
Allgemeine Zufriedenheit mit dem Erstellen von Scroll-Interaktionen im Web
Frage 27
Wichtige Erkenntnisse aus der Umfrage
Die Umfrageergebnisse sind in vier Kategorien unterteilt: Kompatibilität, Bildung, APIs und Funktionen.
Kompatibilität
Das Chrome-Team hat sich zum Ziel gesetzt, die Anzahl der Webkompatibilitätsprobleme, einschließlich der Scrollkompatibilitä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. Entfernen von Präfixen aus -webkit-scrollbar und Einhaltung des Standards.
Bildung
Die Umfrageergebnisse haben gezeigt, dass es mehr Aufklärung zu touch-action und logischen Eigenschaften geben muss. Der Browser ist führend im internationalen Layout, aber es ist offensichtlich, dass er unterfordert oder missverstanden wird.
Bereiche, auf die Sie sich konzentrieren sollten:
1. touch-action
1. Logische Eigenschaften
APIs
Die Verwendung von Scroll-Snapping nimmt zu und Entwickler haben darauf reagiert, dass sie Funktionen interoperabel mit beliebten Bibliotheken und Plug-ins verwenden möchten. Wenn diese Lücke zwischen CSS und Plug-in-Bibliotheken geschlossen wird, können Entwickler und Nutzer von Scroll-Snap-Funktionen zufriedener sein.
Wir konzentrieren uns bei der API-Entwicklung auf scroll-snap:
1. API-Verfügbarkeit und ‑Kompatibilität in verschiedenen Browsern.
1. Beginnen Sie mit der Entwicklung neuer CSS-APIs wie scroll-start.
1. Beginnen Sie mit der Arbeit an neuen JS-Ereignissen wie snapChanged().
Funktionen
Die Umfrageergebnisse haben gezeigt, dass Nutzer mit einigen bestimmten Arten von scrollbezogenen Komponenten im Web zu kämpfen haben, da die Plattform nicht die Primitiven bietet, die sie benötigen, um sie ohne Plug-ins oder großen Aufwand zu erstellen. Wir hoffen, dass wir uns in Zukunft noch intensiver mit diesem Thema beschäftigen können.
Die Funktionen, die Entwickler nur schwer erstellen können, sind: 1. Karussells 1. Virtueller Bildlauf 1. Unendliches Scrollen
Ressourcen
- Bericht zur Scroll-Umfrage
- Ankündigung der Umfrage
- Mozilla DNA Reports
- Compat2021: Fünf der größten Kompatibilitätsprobleme im Web beseitigen
Miniaturbild: Foto von Taylor Wilcox auf Unsplash.