Zapoznaj się z raportem z ankiety na temat przewijania w 2021 roku oraz słowami zespołu Chrome, które mówią o tym, jak wpływa to na priorytety i plany dotyczące Chromium i internetu.
W kwietniu zespół Chrome opublikował ankietę dotyczącą przewijania i działania dotykowego przedstawiającą najczęściej zgłaszane problemy z raportu MDN Web DNA z 2019 roku. Jest już gotowy raport z ankiety na temat przewijania w 2021 r.. Zespół Chrome podziel się z nami swoimi przemyśleniami i działaniami, które uzyskaliśmy na podstawie wyników ankiety. Mamy nadzieję, że te wyniki pomogą naszym dostawcom przeglądarek i grupom standardów zrozumieć, jak usprawnić przewijanie treści w internecie.
Wyświetl raport z ankiety na temat przewijania w 2021 r.
Wyniki godne uwagi
W ankiecie anonimowo zebraliśmy 880 odpowiedzi, a 366 odpowiedziało na wszystkie pytania.
Chociaż rozpoczęcie od przewijania to jeden wiersz kodu CSS, tak jak overflow-x:
scroll;, powierzchnia interfejsów API i opcji przewijania jest bardzo duża i obejmuje JavaScript po CSS. Poniższe wyniki pomagają zidentyfikować problemy, które napotykają programiści stron internetowych.
Ogólne zadowolenie z przewijania stron internetowych
Pytanie 27
45%
są częściowo lub bardzo niezadowolony(-a)
z przewijania stron internetowych.
Pytanie to zostało celowo umieszczone pod koniec ankiety, po odpowiedzi na pytania dotyczące 26 przypadków użycia i funkcji przewijania. Z odpowiedzi wynika, że społeczność internetowa ma problemy ze przewijaniem. Prawie połowa ankietowanych wskazuje poziom ogólnego niezadowolenia.
Uważamy, że ogólne nastawienie do korzystania z funkcji przewijania nie powinno być tak niskie. Te dane wymagają zmiany. To wyraźny znak, że jest jeszcze coś do zrobienia.
Trudności w pracy ze przewijaniem
Pytanie 2
43%
zostało zgłoszone jako częściowo lub
bardzo trudne
w pracy z przewijaniem.
Z naszych badań wynika, że trudności wynikają z wielu przypadków użycia przewijania. Gdy mówimy o przewijaniu, może to obejmować: – pozycjonowanie elementów w obszarach, które można przewijać, – przewijanie nieskończone, – przewijanie połączonej animacji, – Karuzele, – dopełnienie widoku przewijania, – przewijanie cykliczne – Wirtualizowane przewijanie.
Brak funkcji przeglądarki, złożony kod JavaScript i konieczność obsługi trybów wprowadzania, takich jak dotyk, klawiatura i pady do gier, utrudniają to wszystkie te działania.
Znaczenie interakcji dotyku
Pytanie 3
51%
zgłasza interakcje dotykowe jako
bardzo lub niezwykle ważne
dla ich pracy.
Użytkownicy internetu mobilnego wciąż rośnie w statystykach wizyt, więc nie było zaskoczeniem, że połowa respondentów twierdzi, że dotyk ma duże znaczenie dla ich pracy w internecie. Zasygnalizowało to, że takie funkcje internetowe jak przyciąganie użytkownika po przewinięciu strony i touch-action wymagają dodatkowej uwagi, aby można było dostarczać wysokiej jakości interakcje dotykowe.
Problemy z nawigacją po naciśnięciu klawisza Tab lub na padzie do gier
Pytanie 5a
44%
specjalnie lub bardzo trudno
z padem do gier i nawigacją po kartach.
Przewijanie obejmuje metody nawigacyjne, takie jak strzałki na klawiaturze, klawisze Tab, naciśnięcia spacji i pady do gier, i może być trudne do zastosowania podczas przewijania niestandardowego. Prawie połowa ankietowanych twierdzi, że wprowadzenie tych danych jest nieco lub bardzo trudne.
Nauka: touch-action
Pytanie 9
50%
raportu na temat informacji na temat:
`touch-action: manipulation`
z ankiety.
Pytania ankietowe dotyczące korzystania z określonych interfejsów API z możliwą odpowiedzią to Tak, Nie lub „Dzisiaj dowiedziałem się”. Ważną wskazówką była liczba osób, które dowiedziały się o funkcji touch-action z ankiety. Jest to kluczowa właściwość przy tworzeniu niestandardowych gestów dotykowych wymagających interakcji podczas przewijania.
Przewijanie cykliczne
Pytanie 27
58%
czasami, często lub w każdym projekcie
przy użyciu przewijania cyklicznego.
po 60 sekundach rozpoczyna się od 0.
Te liczby są wysokie w przypadku funkcji przewijania, której platforma internetowa nie zapewnia obsługi lub w ogóle nie jest obsługiwana. Ta funkcja często wiąże się z dużym zadłużeniem technicznym, a w celu realizacji skutków stosuje się duplikację lub wstrzyknięty JavaScript. Jest popularny w przypadku karuzel produktów oraz wyboru czasu wyrażonego w sekundach lub minutach w przypadku cyklicznego przewijania.
Czy obszary, które można przewijać, są ważne
Pytanie 2
55%
bardzo lub
bardzo ważne
16%
raport niezły
lub mało ważny
Respondenci byli bardzo zdania na temat znaczenia obszarów, które można przewijać, co stanowiło kolejny sygnał na temat trudności związanych z dostarczaniem wysokiej jakości przewijania.
Karuzele
Pytanie 20
87%
używają karuzel.
24%
że można je
łatwo zarządzać.
Niemal każdy ankietowany wyświetla karuzele w swojej pracy, a tylko 25% uważa, że zarządzanie nimi jest łatwe. W trakcie naszych badań popularne były standardowe karuzele, ale te dane nas zaskoczyły, bo nie brzmią zbyt owocnie.
Nieskończone przewijanie
Pytanie 22
65%
używaj go czasami
w każdym projekcie
60%
bardzo lub
bardzo trudne.
Dwie trzecie respondentów w swoich pracach internetowych odtwarza treści w nieskończoność, a w tej samej liczbie przypadków trudno jest to zrobić. Kolejny przykład wysokiego wykorzystania technologii w połączeniu z wysokim poziomem trudności, który wskazuje nam obszar wymagający uwagi.
Łączenie danych content-visibility i contain-intrinsic-size pozwala obniżyć koszty renderowania w przypadku obszarów, które można przewijać długo, ale nie pomaga to w „wczytaniu więcej” przewijania nieskończonego.
Animacje powiązane z przewijaniem lub przewijaniem
Pytanie 24
47%
używaj go czasami
w każdym projekcie
56%
zgłosić Raczej lub
bardzo trudne
Prawie połowa ankietowanych używa animacji z przewijaniem, a połowa respondentów uważa, że trudno im to osiągnąć, co ponownie łączy wysokie wykorzystanie z trudnością.
Rywalizuj z wbudowanym przewijaniem
Pytanie 26
32%
zawsze lub
przez większość czasu
50%
czasami
Wbudowane funkcje przewijania i dotyku działania aplikacji na telefony i tablety są często przedstawiane jako jasne miejsce, w którym można nadrobić braki w internecie. Jej funkcje obejmują animacje powiązane z przewijaniem, interfejsy automatyczne, integrację głosową, wskazówki dotyczące przewijania oraz interfejsy API typu „przeciągnij, aby odświeżyć”.
Zaledwie połowa respondentów uważała, że tylko czasami można dostosować się do potrzeb wbudowanego przewijania.
Ogólne zadowolenie z tworzenia interakcji z przewijaniem treści w internecie
Pytanie 27
Wyniki ankiety
Wyniki ankiety są podzielone na 4 kategorie: zgodność, edukacja, interfejsy API i funkcje.
Zgodność
Zespół Chrome zadeklarował, że celem jest zmniejszenie liczby problemów ze zgodnością stron internetowych, w tym z przewijaniem treści.
Pierwsze 3 problemy ze zgodnością, na których należy się skupić:
1. Zgodność z przewijaniem w poziomie.
1. overscroll-behavior w różnych przeglądarkach.
1. Usunięto prefiksy z -webkit-scrollbar i zapewniano zgodność ze standardem.
Edukacja
Wyniki ankiety wskazują, że trzeba poświęcić więcej czasu na temat touch-action i właściwości logicznych. Przeglądarka jest na pierwszym miejscu w układzie międzynarodowym i najwyraźniej jest niedostatecznie wykorzystywana lub niezrozumiała.
Obszary, na których należy się skupić:
1. touch-action
1. Właściwości logiczne
Interfejsy API
Coraz więcej osób korzysta z przyciągania na przewijanie, a deweloperzy odpowiedzieli, że chcą używać funkcji współdziałających z popularnymi bibliotekami i wtyczkami. Zmniejszenie tej luki między bibliotekami CSS i wtyczkami zwiększy zadowolenie programistów i użytkowników korzystających z funkcji przewijania snapów.
W tym obszarze skupimy się na scroll-snap:
1. Dostępność i zgodność interfejsu API w różnych przeglądarkach.
1. Zacznij pracę nad nowymi interfejsami API CSS, takimi jak scroll-start.
1. Rozpocznij pracę nad nowymi zdarzeniami JS takimi jak snapChanged().
Funkcje
Wyniki ankiety wykazały, że użytkownicy mają w internecie problemy z pewnymi typami komponentów związanych z przewijaniem, ponieważ platforma ta nie udostępnia podstawowych elementów niezbędnych do ich stworzenia bez wtyczek lub wymaga dużego nakładu pracy. Mamy nadzieję, że uda nam się bardziej szczegółowo zbadać tę kwestię.
Funkcje, których programiści mają trudności, to między innymi: 1. Karuzele 1. Wirtualne przewijanie 1. Nieskończone przewijanie
Zasoby
- Przewiń ankietę
- Ogłoszenie dotyczące ankiety
- Raporty Mozilla DNA
- Compat2021: wyeliminowanie 5 najważniejszych problemów ze zgodnością w internecie
Miniatura: fot. Taylor Wilcox, Unsplash.