Obtén el Informe de la encuesta de desplazamiento de 2021, además de palabras del equipo de Chrome sobre cómo esto afecta las prioridades y los planes para Chromium y la Web.
En abril, el equipo de Chrome lanzó una encuesta de desplazamiento y acción táctil basada en los principales problemas informados en el Informe de ADN de la Web de MDN de 2019. El Informe de la encuesta de desplazamiento de 2021 está listo y al equipo de Chrome desea compartir algunas ideas y elementos de acción que recopilamos de los resultados de la encuesta. Esperamos que estos resultados ayuden a los proveedores de navegadores y a los grupos de estándares a comprender cómo mejorar el desplazamiento web.
Consulta el Informe de la encuesta sobre desplazamiento de 2021.
Resultados destacados
En la encuesta, se recopilaron 880 envíos de forma anónima, de los cuales 366 respondieron cada pregunta.
Si bien comenzar a usar el desplazamiento es una línea de CSS, como overflow-x:
scroll;, el área de superficie de las APIs y opciones de desplazamiento es grande, y abarca de JavaScript a CSS. Los siguientes resultados ayudan a destacar los problemas que se encuentran los desarrolladores web.
Satisfacción general con el desplazamiento web
Pregunta 27
El 45%
están algo o sumamente insatisfecho
con el desplazamiento web
Esta pregunta se colocó cerca del final de la encuesta de forma intencional, después de preguntas sobre 26 casos de uso y funciones de desplazamiento. A partir de la respuesta, está claro que la comunidad web tiene dificultades con el desplazamiento. Casi la mitad de los encuestados informan un nivel de insatisfacción general.
Creemos que la opinión general sobre trabajar con desplazamiento no debería ser tan baja. Se debe cambiar esta métrica, ya que es un indicador claro de que hay trabajo por hacer.
Dificultad para trabajar con el desplazamiento
Pregunta 2
El 43%
informó que es algo o
sumamente difícil
trabajar con el desplazamiento.
A partir de nuestra investigación, estas dificultades surgen de la gran cantidad de casos de uso de desplazamiento. Cuando hablamos sobre el desplazamiento, podemos incluir lo siguiente: - Posicionamiento de elementos dentro de áreas desplazables - Desplazamiento infinito - Animación vinculada de desplazamiento - Carruseles - Padding de desplazamiento cíclico - Desplazamiento cíclico - Desplazamiento virtual
La falta de funciones del navegador, JavaScript complejo y la necesidad de admitir modos de entrada, como pantalla táctil, teclado y controles de juegos, dificultan todo esto.
La importancia de las interacciones táctiles
Pregunta 3
El 51%
informar interacciones táctiles como
muy o extremadamente importantes
para su trabajo
Dado que los usuarios de la Web móvil siguen en aumento en las estadísticas de visitas, no sorprendió ver que la mitad de los encuestados informaron que el contacto es muy importante para su trabajo en la Web. Esto indica que las funciones web, como el ajuste de desplazamiento de CSS y touch-action, requieren atención adicional para que la Web pueda ofrecer una interacción táctil de alta calidad.
Dificultad al navegar con la tecla Tab o el control de juegos
Pregunta 5a
El 44%
informa algo o sumamente difícil
realizar el control de juegos y la navegación de pestañas.
El desplazamiento incluye métodos de navegación, como flechas del teclado, teclas de tabulación, pulsaciones de la barra espaciadora y controles de juegos, y puede ser difícil incluirlos cuando se realizan trabajos de desplazamiento personalizados. Casi la mitad de los encuestados afirman que es algo o extremadamente difícil incluir estas entradas.
Aprendizaje touch-action
Pregunta 9
El 50%
Informa aprendizaje sobre
`acción-táctil: manipulación`
de la encuesta.
Algunas de las preguntas de la encuesta eran sobre el uso de ciertas APIs con una posible respuesta de Sí, No o “hoy aprendí”. Un dato destacado fue la cantidad de personas que informaron haber obtenido información sobre touch-action en la encuesta, ya que es una propiedad fundamental a la hora de compilar gestos táctiles personalizados que deben interactuar dentro del desplazamiento.
Desplazamiento cíclico
Pregunta 27
El 58%
genera informes a veces, con frecuencia o sobre todos los proyectos
mediante el desplazamiento cíclico.
Después de 60 segundos, vuelve a comenzar en 0.
Esos números son altos para una función de desplazamiento con poca o ninguna compatibilidad de la plataforma web. Por lo tanto, la función suele generar grandes deudas técnicas, con duplicación o inserción de JavaScript para forzar el efecto. Es popular para carruseles de productos y cuando se selecciona el tiempo en segundos o minutos para ofrecer desplazamiento cíclico.
¿Son importantes las áreas desplazables?
Pregunta 2
El 55%
muy importante o
sumamente importante
El 16%
informar que no es para nada
o un poco importante
Los encuestados expresaron firmemente la importancia de las áreas desplazables, lo que daba otro indicador sobre las dificultades que se necesitaban para brindar desplazamiento de alta calidad.
Carrusel
Pregunta 20
El 87%
usaron carruseles.
24%
informan que son
fáciles de administrar.
Casi todos los encuestados publican carruseles en su trabajo en la Web, mientras que solo el 25% consideran que son fáciles de administrar. Los carruseles listos para usar fueron populares durante nuestra investigación, pero esta estadística nos sorprendió, ya que no suena muy resuelto.
Desplazamiento infinito
Pregunta 22
El 65%
lo usan a veces
para todos los proyectos
El 60%
algo o
sumamente difícil.
Dos tercios de los encuestados entregan desplazamiento infinito en su trabajo en la Web, y es difícil generar un informe de igual cantidad. Este es otro ejemplo de uso elevado combinado con alta dificultad, que nos indica un área que requiere atención.
Si bien content-visibility y contain-intrinsic-size se pueden combinar para reducir los costos de renderización en áreas largas por las que es posible desplazarse, no parece estar ayudando con la UX de desplazamiento infinito para "cargar más".
Animaciones vinculadas a desplazamientos o que se activan mediante desplazamientos
Pregunta 24
El 47%
usarla a veces
en todos los proyectos
El 56%
informar algo o
sumamente difícil
Casi la mitad de los encuestados usa animaciones organizadas con desplazamiento y la mitad de los encuestados tienen dificultades, una vez más, vincular el uso elevado con la dificultad.
Compite con el desplazamiento integrado
Pregunta 26
El 32%
siempre o
la mayoría de las veces
El 50%
a veces
Las interacciones táctiles y de desplazamiento integradas de las aplicaciones para teléfonos y tablets a menudo se promocionan como un lugar claro donde la Web puede ponerse al día. Las funciones incluyen animaciones con vínculo de desplazamiento, interfaces programáticas, integración de voz, sugerencias de desplazamiento y APIs de "deslizar para actualizar".
Solo la mitad de los encuestados opinó que, a veces, solo era posible hacer coincidir la experiencia del desplazamiento integrado.
Satisfacción general de la creación de interacciones de desplazamiento en la Web
Pregunta 27
Conclusiones de la encuesta
Los resultados de la encuesta se segmentan en cuatro categorías: compatibilidad, educación, APIs y funciones.
Compatibilidad
El equipo de Chrome declaró un objetivo para reducir la cantidad de problemas de compatibilidad web, incluida la compatibilidad con el desplazamiento.
Estos son los primeros tres problemas de compatibilidad en los que debes enfocarte: 1. Compatibilidad con el desplazamiento horizontal
1. Navegador cruzado overscroll-behavior.
1. Quita los prefijos de -webkit-scrollbar y sigue el estándar.
Educación
Los resultados de la encuesta demostraron que es necesario obtener más información sobre touch-action y las propiedades lógicas. El navegador está en el primer plano del diseño internacional y es evidente que se usa poco o se malinterpreta.
Áreas en las que debes enfocarte:
1. touch-action
1. Propiedades lógicas
APIs
El uso del ajuste de desplazamiento está creciendo, y los desarrolladores indicaron que quieren usar funciones de manera interoperabilidad con bibliotecas y complementos populares. Reducir esta brecha entre las bibliotecas de CSS y de complementos ayudará a satisfacer la experiencia del usuario y los desarrolladores de ajustes de desplazamiento.
Nos enfocaremos en el trabajo de la API en scroll-snap:
1. Disponibilidad y compatibilidad de API entre navegadores
1. Comienza a trabajar en las nuevas APIs de CSS, como scroll-start.
1. Comienza a trabajar en nuevos eventos de JS, como snapChanged().
Funciones
Los resultados de la encuesta mostraron que los usuarios tienen dificultades con algunos tipos específicos de componentes relacionados con el desplazamiento en la Web, ya que la plataforma no proporciona las primitivas que necesitan para compilarlos sin complementos ni un alto nivel de esfuerzo. Esperamos explorar más a fondo esta área.
Entre las funciones que los desarrolladores tienen dificultades para crear, se incluyen las siguientes: 1. Carruseles 1. Desplazamiento virtual 1. Desplazamiento infinito
Recursos
- Desplazarse por el informe de la encuesta
- Anuncio de la encuesta
- Informes de ADN de Mozilla
- Compat2021: Eliminación de las cinco dificultades de compatibilidad principales en la Web
Imagen en miniatura: Foto de Taylor Wilcox en Unsplash.