Diseña filtros para móvil

La búsqueda móvil debe hacer evidentes el estado actual, el número de resultados y la forma de volver a los resultados, sin obligar a los visitantes a atravesar una larga muralla de controles.

Prioriza los controles

Ordena las facetas por valor de decisión, no por el orden en que se crearon los campos. Coloca primero los dos o tres filtros con más probabilidades de reducir el conjunto.

Prefiere:

  • Menú desplegable o Selección con búsqueda para listas planas largas;
  • Selector jerárquico cuando un árbol de términos deba permanecer compacto;
  • entradas numéricas explícitas cuando un control deslizante resultaría difícil de controlar con precisión;
  • el modo de envío Manual para un panel en el que normalmente se modifican varias opciones a la vez.

Crea un panel de filtros

Usa filas, columnas de Page Builder o un patrón de revelado responsivo adecuado para agrupar las facetas. Los elementos de Faceted Search siguen siendo responsables del estado de los filtros; el diseño circundante es responsable de mostrar y ocultar el panel.

Mantén estos elementos fuera del panel cuando sea práctico:

  • Faceted Search Counts;
  • Faceted Search Selections Count;
  • un control claro que abra los filtros;
  • las selecciones activas o una acción de restablecimiento.

El visitante debe poder notar que los filtros siguen activos después de cerrar el panel.

Configura la altura del mapa

Para una faceta de Mapa, define tanto la Altura como la Altura en móvil. Un mapa con altura de escritorio puede dominar una pantalla estrecha. Considera Gesture handling: Cooperative cuando el mapa esté dentro de una página con desplazamiento.

Prueba las interacciones reales

En el área de visualización más estrecha admitida, comprueba:

  1. que las etiquetas y los recuentos no se superpongan;
  2. que los controles de elección tengan objetivos táctiles cómodos;
  3. que las selecciones con búsqueda y el autocompletado permanezcan visibles por encima del teclado;
  4. que aplicar o restablecer los filtros devuelva la atención a una ubicación significativa;
  5. que la indicación de carga sea visible;
  6. que ningún panel fijo oculte el paginador o el último resultado;
  7. que la URL y el comportamiento del botón Atrás del navegador sigan funcionando.

Completa también las comprobaciones de teclado y nomenclatura de Build accessible faceted search.