Tamaño objetivo

Outcome: Complete the task with Tamaño objetivo (Target Size). User context: En una aplicación de medicina, cada pequeño ícono de recordatorio se coloca dentro de un botón de 32 por 32 píxeles CSS. El espacio entre los botones evita selecciones incorrectas. Al 200 % de zoom, los controles se mueven en lugar de superponerse, y los pines densos del mapa también tienen una lista. Recommended pattern: Tamaño objetivo (Target Size). Why it fits: Haz que los objetivos del puntero tengan al menos 24 por 24 píxeles CSS, o deja suficiente espacio alrededor de ellos. Prueba el tacto, el zoom y diferentes necesidades de movimiento. Do not use it when: No juzgues solo el ícono visible. Todo importa: el área de interacción completa, el espaciado, las excepciones en línea y otra ruta utilizable. Product requirements: Define the default, loading, empty, error, success, and recovery states. Keep user input. Give clear feedback after every action. Accessibility and resilience: Use semantic HTML, full keyboard access, and visible focus. Make the layout work when zoomed and support reduced motion. Follow the project’s current rules. Do not add a new UI library unless the project already uses it. Acceptance criteria: The main task works with keyboard only and at 320px width. Focus and status changes are announced. Check loading, failure, retry, cancel, and reduced-motion paths. Evidence and limits (evidence boundary): El estándar cubre únicamente el alcance listado. No elige el estilo visual, la decisión del producto ni el ejemplo de Vibulary. Unknowns to confirm: Product wording, data source, analytics events, supported devices and languages, and platform limits.