Fecha de publicación: 16 de diciembre de 2024
En septiembre, te pedimos tus comentarios sobre la función experimental de selección personalizable. Los comentarios que enviaste incluían casos de uso (por ejemplo, sistemas de diseño, cuadros combinados), ideas sobre el modo de entrada de la API y comentarios sobre los estilos básicos. Entre las inquietudes, se incluyen la accesibilidad, la compatibilidad con navegadores, la necesidad de la función de búsqueda y el deseo de compatibilidad con la selección múltiple. Parece que tienes muchas ganas de usar la API en producción, pero tienes algunas reservas y solicitudes de funciones específicas.
Los ingenieros y administradores de Chrome utilizaron toda esta información para tomar decisiones fundamentadas sobre la función. En esta publicación, se comparten las conclusiones clave de cada una de las preguntas de la encuesta de selección personalizable.
¿Qué compilarías con esta nueva API?
Se compartieron varios casos de uso, que, en general, incluían lo siguiente:
- Compilación de componentes del sistema de diseño: Crea componentes seleccionados para sus sistemas de diseño, lo que garantiza la coherencia y la personalización en todos sus proyectos.
- Crear varios tipos de selectores, como selectores de idioma, selectores de país, selectores de permisos de usuario y mucho más
- Mejora los elementos seleccionados existentes: Mejora los elementos seleccionados existentes con funciones como imágenes, SVG y estilos más enriquecidos.
- Reemplazo de implementaciones de selección personalizadas: Reemplaza los componentes de selección creados a medida por una solución nativa estandarizada.
- Cómo crear cuadros combinados y selectores personalizados: Funciones más complejas, como cuadros combinados, selectores personalizados para números de teléfono, zonas horarias, monedas y otros tipos de datos.
- Mejora las IU de los formularios: Crea elementos de selección más atractivos y funcionales para mejorar los formularios.
Estas respuestas destacan la versatilidad de la nueva API y su potencial para mejorar la experiencia del usuario y la eficiencia del desarrollo para una amplia variedad de aplicaciones web.
¿Planeas usar esta API en producción una vez que esté disponible en el modelo de referencia?
¿Probaste la nueva API? Si es así, ¿pudiste crear lo que querías con él?
¿Qué opinas sobre el modo de entrada para la selección personalizable (appearance: base-select en el elemento <select> y ::picker(select))?
Los comentarios sobre este modo de entrada son variados:
- Algunos consideran que el enfoque es aceptable, razonable o incluso mejor que la situación actual. Lo ven como una forma “lógica” o “adecuada” de mejorar progresivamente el elemento
<select>. - Otros expresan confusión o consideran que la sintaxis es incómoda. El uso de dos propiedades (
appearance: base-selecty::picker(select)) se considera redundante o innecesario. Se plantean inquietudes sobre los nombres (base-selectpodría ser engañoso) y la posible confusión para los recién llegados que no estén familiarizados con los conceptos subyacentes. - Algunos encuestados sugieren enfoques alternativos, como usar una sola propiedad o selector, o evitar por completo la propiedad
appearance.
En general, si bien algunos encuestados se sienten cómodos con el modo de entrada actual, a otros les resulta confuso o sugieren mejoras para que sea más claro y sencillo. Estos comentarios destacan la importancia de la documentación y los ejemplos claros para guiar a los desarrolladores en el uso eficaz de la nueva API.
¿Tienes algún comentario sobre los estilos base (usuario-agente) existentes para la selección personalizable?
Algunos encuestados consideran que los estilos son aceptables o buenos, mientras que otros tienen críticas o sugerencias específicas. Estos son algunos de los comentarios:
- El ícono de la marca de verificación no es atractivo o podría ser más simple.
- No hay suficiente espacio para una marca de verificación junto a los elementos.
- Los estilos básicos se ven apretados, con el anillo de enfoque cortado y sin espacio entre el ícono de verificación y el texto.
- Los estilos podrían estar más cerca del estilo de la plataforma del SO o de un elemento
<dialog>. - La flecha predeterminada debe apuntar hacia abajo y girar hacia la parte superior cuando esté abierta.
- Es posible que se deba restablecer el dispositivo para quitar los estilos de usuario-agente básicos.
¿Tienes alguna pregunta, comentario o inquietud sobre esta función?
Recibimos una variedad de comentarios, preguntas y preocupaciones sobre la nueva API de Select personalizable. Estos son algunos de los temas clave:
- Accesibilidad: Varios encuestados expresaron inquietudes sobre la accesibilidad, en particular con los lectores de pantalla y la navegación con el teclado.
- Selección múltiple y cuadros combinados: Hay una gran demanda de la funcionalidad de selección múltiple y la compatibilidad con cuadros combinados.
- Funcionalidad de búsqueda: La capacidad de buscar dentro de las opciones seleccionadas es una función solicitada.
- Diseño y compatibilidad con el navegador: Se plantearon inquietudes sobre las opciones de diseño, la compatibilidad con el navegador y la necesidad de restablecer el CSS.
- Detalles de la implementación: Se hicieron preguntas sobre detalles específicos de la implementación, como el bloqueo de enfoque, el comportamiento de renderización y los elementos secundarios personalizados.
- Comentarios generales: Algunos encuestados compartieron comentarios generales, como el deseo de tener un modo de entrada a la API más simple y la capacidad de renderizar fuera del navegador Chrome.
En general, los comentarios destacan la necesidad de mejorar la accesibilidad, agregar funciones adicionales, como la selección múltiple y la búsqueda, y brindar una guía clara sobre el diseño y la compatibilidad con los navegadores.
¿Tienes algún otro comentario que quieras agregar?
Entre los temas clave de las ideas y sugerencias de los encuestados, se incluyen los siguientes:
- Deseo de funcionalidad de selección múltiple y cuadro combinado: Varios encuestados solicitan específicamente la adición de capacidades de selección múltiple y cuadro combinado.
- Importancia de la accesibilidad: Algunos encuestados enfatizan la necesidad de seguir enfocándose en las funciones de accesibilidad.
- Comentarios positivos y solicitudes de funciones: Algunos usuarios expresan entusiasmo por la API y ofrecen sugerencias, como una opción de búsqueda o la capacidad de detectar compatibilidad con
@supports. - Casos de uso específicos: Algunos encuestados mencionan casos de uso específicos que les gustaría ver compatibles, como la renderización fuera del cromo del navegador o permitir valores personalizados dentro del elemento
<select>. - Comentarios generales: Algunos ofrecen elogios generales o expresan el deseo de que la apariencia sea coherente en todos los navegadores.
En general, estos comentarios refuerzan la demanda de funciones de selección múltiple y cuadros combinados, destacan la importancia de la accesibilidad y proporcionan estadísticas adicionales sobre posibles casos de uso y áreas de mejora.
Una vez más, agradecemos a todos. Esperamos que este resumen de comentarios de la comunidad llegue a los implementadores y desarrolladores, y que les ayude a ofrecer una mejor experiencia de selección personalizable para usuarios y desarrolladores.