Checkbox

Permite seleccionar el valor que está escrito en su etiqueta de texto correspondiente. Puede seleccionar una o varias casillas, ya que las opciones entre ellas no son excluyentes.

Racional de aplicación

Utilizamos un Checkbox cuando necesitamos obtener una selección de respuestas disponibles sin límite de opciones. Se puede seleccionar varias casillas de verificación de un grupo al mismo tiempo. No es apropiado usar un Checkbox para preguntas con respuestas binarias o excluyentes.

Buenas prácticas

Uso correcto	Uso incorrecto
Las opciones seleccionadas pueden ser varias.	La opciones son excluyentes entre sí y no pueden seleccionarse a la vez.
Acompaña a la selección de opciones con una etiqueta identificativa.	No tiene etiqueta y la selección queda fuera de contexto.
El estado indeterminado indica que al menos una opción ha sido seleccionada.	El comportamiento del check general no es correcto.

Interacción

Este componente ha sido validado para cumplir con las pautas de accesibilidad WCAG 2.1 AA, sin embargo los cambios realizados por el propietario del contenido pueden afectar el cumplimiento de la accesibilidad. Hay que asegurarse de revisar y seguir las instrucciones de esta sección cuando se actualice o se agregue contenido nuevo a este componente.

Dispositivo	Interacción
Ratón	Se puede activar un Checkbox haciendo clic en cualquier lugar dentro de la casilla de verificación o la etiqueta.
Teclado	Se puede utilizar el tabulador para desplazarse por las opciones de forma secuencial y activar o desactivar con la barra espaciadora.

Anatomía y variabilidad

Anatomía del componente

Letra	Elemento	Descripción
A	Etiqueta de grupo	Se aconseja que los grupos de opciones vayan acompañados de una etiqueta identificativa que dé contexto a la selección.
B	Casilla de verificación	Indica si la opción está seleccionada (o en caso casilla de verificación de grupo, si alguna opción ha sido seleccionada).
C	Etiqueta	Describe la información de la opción.

Variabilidad de estados

Letra	Estado	Descripción
A	Unchecked	Estado por defecto.
B	Check	La opción ha sido seleccionada.
C	Indeterminate	Indica que al menos una opción del grupo ha sido seleccionada.
D	Disabled	La opción no está disponible para ser seleccionada.