Diseño Normalizado de Trámites Electrónicos

Inicio

Primeros pasos Primeros pasos

¿Qué es DINTEL?

Diseñadores

Desarrolladores

Recursos

Preguntas frecuentes

Fundamentos Fundamentos

Color

Tipografía

Elevaciones

Espaciado

Retícula

Borde

Radio

Iconografía

Ilustraciones

Animación

Accesibilidad

Tokens de diseño

Contenidos digitales

Visualización de datos

Elementos de interfaz Elementos de interfaz

Módulos

Plantillas

Componentes

Actualizaciones

Contacto

Elementos de interfaz

Componentes

Botón Ir Arriba

Botón ir arriba

El backtop es un botón que permite volver a la parte superior de la página de forma ágil.

Vista previa

Usos

Cuándo usar

Cuando el contenido de la página es muy extenso (aproximadamente cuatro pantallas).

Cuando necesitas volver a la parte superior de la página con frecuencia para ver los contenidos.

Colocamos el botón de backtop en la parte inferior derecha de la página, ya que es donde los usuarios esperan verlo.

Cuándo no usar

Cuando la página es relativamente corta, el botón de backtop sobra, puesto que el usuario puede hacer scroll sin esfuerzo, y no saturamos la interfaz.

No colocamos el botón en otra zona de la pantalla, en esos casos se suele ignorar.

No ponemos varios backtop en una página. Los usuarios los ignoran y resultan muy repetitivos.

Comportamiento

El componente backtop aparece cuando el contenido de una página es extenso. Aparece cuando los usuarios se desplazan hacia abajo, es decir, cuando es más probable que se necesite, sin interponerse en el contenido de la página y bajo el control del usuario.

Propiedades y variables

Visualización del componente botón ir a arriba en estado activo

Active

Hover

Visualización del componente botón ir a arriba en estado enfocad

Focus

Visualización del componente botón ir a arriba en estado presionado

Pressed

Accesibilidad

Este componente ha sido validado para cumplir con los requisitos de accesibilidad la UNE-EN 301549:2022 en la que se engloban los criterios de la WCAG 2.1 (AA), sin embargo, los cambios del contenido y estilos pueden afectar al cumplimiento de la accesibilidad. Debemos de asegurarnos de revisar y seguir las directrices de esta sección cuando actualice o añada nuevo contenido o estilo a este componente.

Este sitio web utiliza cookies propias y de terceros para ofrecer un mejor servicio. Si continúa navegando consideramos que acepta su uso.

Aviso legal

Accesibilidad

Política de Cookies

Contacto

Mapa web