DESY

Sistema de Diseño del Gobierno de Aragón.

Bloques de datos

Son elementos de formulario estandarizados compuestos de varias entradas de texto agrupadas, las cuales comparten sentido semántico.

Consulta más agrupaciones habituales en patrones de formularios.

Índice de apartados de esta página

Bloque fecha

Incluye tres campos para introducir carácteres numéricos de día, mes y año respectivamente.

Fecha de nacimiento

Por ejemplo, 9/1/1997

Buenas prácticas para el bloque fecha

  • El campo para introducir el año debe ajustarse al tamaño de un dato de cuatro cifras, mientras que el campo de día y mes se deben ajustar a un input de dos cifras.
  • Debido a los problemas de accesibilidad que enfentan los componentes de calendario, recomendamos utilizar esta alternativa.
  • La validación debe permitir que los días o meses se introduzcan con o sin 0, Por ejemplo tanto 01 02 2024 como 1 2 2024 tienen que ser aceptados.
  • Si el campo requiere introducir los datos dentro de un rango concreto, indícalo claramente en el hint y en el mensaje de error. Por ejemplo: la fecha tiene que ser anterior al día actual, error: La fecha introducida tiene que ser anterior a el día actual.

Bloque hora

Incluye dos campos para la inserción de caracteres numéricos de hora y minutos respectivamente, separados por ‘:’.

Hora de publicación

Por ejemplo, 14:30

Buenas prácticas para el bloque hora

  • El tamaño de los inputs se ajusta para introducir únicamente dos cifras.
  • La validación debe permitir que se introduzcan los valores con o sin 0. Por ejemplo, tanto 01:02 como 1:2 tienen que ser aceptados
  • Si el campo requiere introducir horas en un rango concreto, indícalo claramente en el hint y en el mensaje de error. Por ejemplo: la hora debe ser entre las 10:00 y las 14:00,error: la hora debe ser entre las 10:00 y las 14:00.

Bloque ID

Incluye un selector para escoger el tipo de identificación y un campo para insertar los caracteres correspondientes a la identificación.

Documento de identidad

Buenas prácticas para el bloque ID

    Intenta dar pistas a través del placeholder del formato de información que requiere el campo. Por ejemplo: cuántos caracteres debe introducir, si son solo números o números y letras, etc.

    Bloque datos personales

    Incluye un campo reservado a introducir el nombre, otro campo para introducir los apellidos y opcionalmente un selector para introducir información opcional.

    Datos del solicitante

    Buenas prácticas para el bloque datos personales

    Recomendamos que, siempre que no sea estrictamente necesario, solo haya un campo para ambos apellidos.