Componentes Índice de páginas
Botones
Esta es la descripción del componente
Anatomía #
Por lo general están compuestos por una etiqueta que única la acción que se realiza y pueden mostrar un icono de apoyo a izquierda o derecha del texto. También se casos excepcionales se puede usar un botón únicamente con icono, sin etiqueta de texto visible.
Recomendaciones generales #
- La etiqueta debe describir de manera clara y concisa la acción que se llevará a cabo al pulsarlo.
- Ser recomienda no usar más de dos palabras en la etiqueta, por ejemplo “Ver documento” “Firmar solicitud”
- Cuando se usen verbos se recomienda el uso de infinitivos “Eliminar”, “Continuar”
- En caso de acciones que sean tengan que reforzar el caracter de individualidad o pertenencia del la persona usuaria, se pueden emplear verbos en primera person o otras formular que refuercen el caracter personale de la acción. por ejemplo: Mi perfil, Mis datos o Indentificarme.
Tipos de botones #
Botones por defecto #
El botón por defecto es el botón estándar para la mayoría de los casos de uso. El estilo delineado pone menos énfasis en estos botones, pudiendo usar varios por página o grupo de botones.
Botones primarios #
Estos botones son los que tienen más énfasis. En caso de usarlo en una página no se recomienda que se use más de una vez.
Nunca deben duplicarse situándose uno al lado del otro. Se utiliza cuando una acción es claramente más importante que las otras acciones y se necesita llamar la atención sobre ella.
No todas las funciones necesitan tener acciones primarias.
Botones transparentes #
El botón transparente debe utilizarse para las acciones menos importantes. Este botón se utiliza en contenido secundario, para evitar competencia con las llamadas a acción principales. Lo ideal es que el usuario vea el botón principal y luego (si no es relevante) lo omita en el transparente. Por ejemplo, se utiliza para acciones como deshacer, volver, etc...
Botones de alerta #
Los botones de alerta se deben emplear, en casos muy concretos, especialmente para acciones destructivas o que no se puedan deshacer.
Iconos #
Se puede usar iconos en botones, siempre que sea de manera puntual y porque se quiere destacar la acciones especialmente sobre otros botones o que sea necesario un apoyo visual para entender mejor la acción del botón. por ejemplo en botones de descarga.
Por lo general no se recomienda usar botones sin etiqueta y únicamente con icono, pero se pueden emplear en casos en los que el espacio sea muy reducido y sea imposible incluir la etiqueta y siempre que la acción que representa el icono sea inequívoca y clara.