NOR_USABILIDAD v01r00

Ámbito de aplicación de la norma

Esta norma se aplica tanto a nuevos desarrollos como a mantenimientos que incluyan la creación o modificación de sitios o portales web dirigidos a la ciudadanía.

Las directrices de usabilidad y diseño que contiene la norma son independientes de la pila tecnológica o el framework de desarrollo que se utilice (ej. React, Angular, Vue, Java, PHP, etc.). La calidad y las características de la experiencia de usuario (UX) no están supeditadas a la tecnología de implementación.

Por tanto, al desarrollar o modificar una interfaz web, hay que cumplir con:

• Las normas y estándares de usabilidad, accesibilidad y diseño referidos en esta página.
• Otras normas particulares de diseño de interacción o estilo visual establecidas para la tecnología o plataforma específica.

Diseño de página

Coherencia visual y sistema de diseño

DIR_01 Sistema de diseño

OBLIGATORIO El sitio debe seguir el sistema de diseño oficial en colores, tipografías, estructura y componentes.  

Cuando el servicio esté dentro del alcance del uso obligatorio del sistema de diseño, solo se deben usar los estilos autorizados (como fuentes y colores específicos), evitando cualquier elemento visual no aprobado. En otro caso, se recomienda igualmente seguir el sistema de diseño. 

Profesionalidad y orientación al usuario

DIR_02 Consistencia visual y estructural

RECOMENDADO El sitio debería mantener una estructura consistente y sin elementos innecesarios.

El logo debería ocupar el mismo lugar en todas las páginas y enlazar correctamente. La navegación debería estar libre de errores y los textos e imágenes deberían tener calidad profesional, evitando el uso excesivo de formatos de texto que generen ruido visual (parpadeo, texto deslizante, abuso de negrita, …), así como errores tipográficos y ortográficos.

DIR_03 Uso intuitivo

RECOMENDADO El sitio debería permitir que un usuario nuevo complete tareas comunes sin errores, en pocos pasos y sin asistencia.

La ruta para realizar cualquier tarea debería ser razonable (entre 2 y 5 clics). Esto garantiza una experiencia fluida incluso para quienes acceden por primera vez. 

Compatibilidad y utilidad funcional

DIR_04 Impresión y guardado

RECOMENDADO El sitio debería estar preparado para su uso en distintos contextos, incluyendo la impresión y el guardado.

Las páginas deberían poder imprimirse adecuadamente o contar con una versión específica y conservar la información con fidelidad en descargas desde el navegador

DIR_05 Evitar diseños desnormalizados

RECOMENDADO Se deberían evitar estructuras desnormalizadas y el abuso de páginas de aterrizaje.

No deberían emplearse diseños que rompan la consistencia del sitio, ni páginas de aterrizaje con estilos que no respeten el sistema de diseño.

Diseño de la página principal

DIR_06 Funcionalidad, accesibilidad y coherencia de la página principal

OBLIGATORIO La página principal debe ser funcional, accesible y coherente.  

Debe permitir búsquedas en todo el sitio, enlazar a los contenidos más visitados y mostrar novedades actualizadas. Además, debe reflejar una orientación clara al público objetivo y evitar artificios como “tapones de desplazamiento  ”, que son elementos que crean la ilusión de que los usuarios han llegado a la parte inferior de la página cuando no es así, como pueden ser: banner o imagen grande que ocupa todo el ancho, bloques con colores oscuros, enlaces, o información tipo pie de página a mitad de la página, áreas vacías muy grandes que dan la sensación de haber llegado al final, elementos fijos tipo banner de suscripción o de cookies que tapan la parte inferior.

DIR_07 Experiencia en la página principal

RECOMENDADO La página principal debería ofrecer una experiencia informativa, visualmente profesional y centrada en el usuario.

Se debería presentar de forma clara los servicios y contenidos del sitio, usando imágenes de calidad, sin elementos institucionales innecesarios ni contenido de dudosa utilidad. La página principal debería actualizarse periódicamente y priorizar tareas y accesos relevantes para el usuario.

Estructura y navegación

Una estructura bien organizada y una navegación clara son claves para que el usuario se oriente con facilidad dentro del sitio, comprenda la jerarquía del contenido y acceda rápidamente a la información que necesita. 

Menú de navegación y orientación

DIR_08 Menú de navegación

OBLIGATORIO El menú de navegación debe ser visible, coherente y resaltar la ubicación del usuario.

Debe situarse en el mismo lugar en todas las páginas, con etiquetas claras y breves (máximo tres palabras), un máximo de nueve elementos de primer nivel y comportamiento uniforme. Debe destacar visualmente la sección activa.

Estructura jerárquica del sitio

DIR_09 Modelo conceptual claro y profundidad jerárquica mínima

RECOMENDADO El sitio debería seguir un modelo conceptual claro y sin niveles innecesarios.

Se debería organizar el contenido de forma lógica y sencilla, sin estructuras profundas que dificulten la navegación.

DIR_10 Título y rastro de migas

RECOMENDADO Las páginas deberían incluir un título visible y un rastro de migas funcional.

Cada página debería indicar claramente su contenido principal mediante un <h1> destacado, e incluir una ruta jerárquica que facilite al usuario saber dónde se encuentra y cómo retroceder.

DIR_11 Estado de sesión

RECOMENDADO El sitio debería mostrar de forma coherente el estado de la sesión del usuario.

Cuando el usuario está autenticado, se debería visualizar su nombre y contar con un enlace claro para cerrar sesión, facilitando la gestión de su identidad dentro del sistema.

Identidad visual y consistencia global

DIR_12 Identidad

RECOMENDADO La identidad del sitio debería ser visible y coherente en todas las páginas.

El logotipo debería estar siempre en el mismo lugar, enlazando de forma lógica (por ejemplo, a la página de inicio o principal del sitio), y reflejar la marca institucional adecuadamente.

DIR_13 Pie de página

RECOMENDADO El pie de página debería estar presente en todas las páginas y contener información normativa.

Debería incluir enlaces a condiciones de uso, accesibilidad, privacidad y protección de datos de forma agrupada.

Mapa del sitio y enlaces

DIR_14 Enlaces

OBLIGATORIO Todos los enlaces deberían funcionar correctamente.   

No deberían existir enlaces rotos ni accesos inactivos que interrumpan la navegación.

DIR_15 Mapa del sitio

RECOMENDADO El sitio debería disponer de un mapa web completo accesible desde todas las páginas.

Este debería ofrecer una visión global del contenido disponible y estar actualizado para facilitar el rastreo tanto por usuarios como por buscadores.

Comportamiento de navegación técnica

DIR_16 Botón "atrás" del navegador

RECOMENDADO El botón "Atrás" debería funcionar correctamente.

El sistema no debería interferir con el historial del navegador, garantizando una experiencia coherente, predecible y sin errores.

Contenido

El contenido debe ser accesible, comprensible y útil para todas las personas usuarias. Su redacción, estructura y presentación deben facilitar la lectura, el escaneo visual y la navegación intuitiva, sin sacrificar la calidad técnica ni la precisión del mensaje. 

Claridad, lenguaje y tono

DIR_17 Contenido

OBLIGATORIO El contenido debe ser claro, directo y cercano.

Se debe hacer uso de un lenguaje adecuado al público objetivo del sitio, haciendo uso de un estilo comprensible y ordenado, con frases breves, estructuras sencillas (sujeto + verbo + complementos) y un tono respetuoso. Se deben   evitar detalles innecesarios, para que no se pierda el foco.

DIR_18 Lenguaje inclusivo

OBLIGATORIO El lenguaje usado debe ser inclusivo.

Se debe usar el género femenino cuando corresponda (cargos y puestos administrativos ocupados por mujeres, profesiones y titulaciones: abogada, jueza, …). Se debe evitar el uso del masculino genérico, el uso de barras (ciudadanos/as) y/o arrobas (ciudadan@s) y evitar fórmulas impersonales (se rellenará, se enviará    , …).

DIR_19 Uso normalizado de personas gramaticales (tú, yo, nosotros)

RECOMENDADO Se debería hacer uso de las personas gramaticales de forma normalizada.

Se debería seguir la siguiente directriz:

• Primera persona del singular (yo): Se debería usar para referirse a la persona usuaria, especialmente para introducir información personalizada (mi cuenta, mis datos, mi solicitud...).
• Primera persona del plural (nosotros): Se debería usar para referirse al equipo prestador del servicio o a la Administración de la Junta de Andalucía al completo (te responderemos lo antes posible).
• Segunda persona del singular (tú): Se debería usar para apelar al usuario, como como si la interfaz le hablara directamente. Se debería usar "tú" en lugar de "usted"; este estilo conversacional es apropiado en la mayoría de las situaciones (p.ej. "introduce tu correo electrónico").

Control y accesibilidad de contenidos multimedia

DIR_20 Información técnica del contenido multimedia

OBLIGATORIO Se debe informar al usuario sobre las características técnicas del contenido multimedia.

Antes de reproducir o descargar música o vídeos, se debe mostrar información como el tamaño del archivo o su duración, permitiendo tomar decisiones informadas, especialmente en contextos de conectividad limitada.

DIR_21 Control del usuario sobre elementos multimedia

RECOMENDADO Los elementos multimedia deberían ofrecer control total al usuario y no reproducirse automáticamente.

La música y los vídeos no deberían comenzar sin acción del usuario y siempre deben incluir controles visibles para reproducir, pausar o detener el contenido, lo que evita interrupciones y mejora la accesibilidad. Otros contenidos (por ejemplo, animaciones Flash) que no se deseen, deberían poder ser detenidos y omitidos. 

Estructura visual y escaneo

DIR_22 Estructura de la información

RECOMENDADO La información debería estar jerárquicamente estructurada y ser fácil de escanear.

Se debería emplear la estructura de pirámide invertida, encabezados claros, listas, párrafos breves, y sin abusar del uso de mayúsculas ni recursos visuales simulados (como tablas para maquetar).

Accesibilidad y adaptabilidad del contenido

DIR_23 Legibilidad

RECOMENDADO El contenido debería ser legible en cualquier resolución, con scroll limitado y tamaño de letra ajustable.

El sitio debería adaptarse a distintos dispositivos redistribuyendo los componentes correctamente y limitando el scroll a lo imprescindible. No deberían usarse textos con tamaños menores a 15px.

Mantenimiento del contenido

DIR_24 Autoría, fecha de revisión y actualización del contenido

RECOMENDADO El contenido debería mantenerse actualizado.

Se debería incluir autoría y fecha de revisión del contenido y permitir mecanismos de contacto. 

Uso de acrónimos 

DIR_25  Acrónimos

RECOMENDADO: Los acrónimos solo deberían explicarse una vez. 

Debería explicarse el significado de los acrónimos la primera vez que se usan, pudiendo hacer uso directo de ellos posteriormente. 

Uso de números 

DIR_26  Uso de dígitos para cantidades (forma numeral)

RECOMENDADO Se deberían escribir números en lugar de usar la forma textual. 

En general, deberían escribirse números (14 menajes nuevos) en lugar de la forma textual (catorce mensajes nuevos) para facilitar la lectura y acortar los textos. Para cifras alta, se deberían combinar dígitos con texto (15 millones de euros en lugar de 15.000.000 €). 

Uso adecuado de imágenes y animaciones 

DIR_27 Calidad, relevancia y adecuación visual de las imágenes

RECOMENDADO Las imágenes deberían ser claras, relevantes y visualmente adecuadas. 

Deberían estar bien recortadas, tener resolución suficiente y transmitir el mensaje deseado sin ambigüedad, reforzando la calidad y comprensión del contenido. 

DIR_28 Imágenes y animaciones con valor funcional

RECOMENDADO Las imágenes y animaciones deberían aportar valor funcional al contenido. 

Se deberían evitar elementos meramente decorativos o animaciones cíclicas que distraigan al usuario. Toda animación debería tener un propósito claro que mejore la comprensión o interacción. 

Rendimiento y respuesta del sistema 

DIR_29 Tiempo de carga y notificación de espera

RECOMENDADO Las páginas deberían cargar rápidamente (5 segundos o menos) y notificar al usuario durante los tiempos de espera. 

Si la respuesta se retrasa, debería mostrarse un mensaje que indique que el sistema está procesando la acción, manteniendo al usuario informado.

Sistema de búsqueda 

El sistema de búsqueda del sitio web debe ser visible, fácil de utilizar y eficaz para que las personas usuarias puedan localizar rápidamente la información o los recursos que necesitan. Una buena experiencia de búsqueda mejora la usabilidad general del sitio, reduce la frustración y facilita el acceso a contenidos relevantes sin necesidad de navegación extensa. 

Accesibilidad e integración del buscador 

DIR_30 Buscador general

OBLIGATORIO El sitio debe contar con un buscador general accesible desde todas las páginas. 
Debe estar claramente identificado con texto e iconos estándar según el sistema de diseño, y permitir búsquedas sin necesidad de operadores o filtros complejos. 

Presentación y usabilidad de resultados 

DIR_31 Presentación clara y útil de los resultados de búsqueda

RECOMENDADO Los resultados deberían presentarse de forma clara, ordenada por relevancia y con información útil. 

Deberían incluir título, descripción, URL y metadatos relevantes (tipo de archivo, tamaño, etc.), e indicar el número total de resultados encontrados. 

Refinamiento y personalización de la búsqueda 

DIR_32 Refinamiento y búsqueda avanzada

RECOMENDADO La búsqueda debería permitir ajustes y mecanismos de refinamiento adecuados. 

El usuario debería poder modificar criterios, ajustar la cantidad de resultados por página y acceder a búsqueda avanzada general o por tipo de recurso. 

Asistencia y tolerancia a errores 

DIR_33 Asistencia, corrección de errores y tolerancia a fallos en la búsqueda

RECOMENDADO El buscador debería ofrecer ayuda en caso de fallo y admitir errores o términos similares. 

Debería corregir la ortografía automáticamente, sugerir alternativas en caso de cero resultados y reconocer plurales o sinónimos.

Sistema de ayuda 

El sistema de ayuda debe ser visible, accesible y estar integrado en la experiencia del usuario sin interferir con sus tareas. Su contenido debe ser claro, contextual, útil y mantenerse actualizado para responder eficazmente a dudas, errores o situaciones complejas dentro de la aplicación. 

Accesibilidad y localización 

DIR_34 Accesibilidad y localización consistente de la opción de ayuda

OBLIGATORIA: La opción de ayuda debe estar siempre disponible, en una ubicación visible y reconocible. 

El acceso a la ayuda debe seguir un patrón estándar en todas las páginas y permitir al usuario regresar fácilmente a la zona de trabajo. 

Integración con la tarea del usuario 

DIR_35 Ayuda no intrusiva e integrada con la tarea

RECOMENDADO La ayuda no debería interrumpir la tarea del usuario ni requerir navegación compleja. 

Si se abre fuera del área principal, debería permitir moverse entre ventanas sin perder el contexto. 

Contenido de ayuda claro y actualizado 

DIR_36 Redacción clara, ejemplos y actualización del contenido de ayuda

RECOMENDADO La ayuda debería estar redactada en lenguaje claro, incluir ejemplos y mantenerse al día. 

Debería contener preguntas frecuentes, instrucciones comprensibles, y estar alineada con la versión actual de la aplicación. 

Ayuda contextual y mensajes informativos 

DIR_37  Ayuda contextual en tareas complejas

RECOMENDADO Se debería ofrecer ayuda contextual en tareas complejas. 

Los usuarios deberían poder resolver tareas comunes sin consultar manuales, y contar con ayudas contextuales para las tareas complejas (solicitudes, formulario de registros, etc.) 

DIR_38 Mensajes de estado

RECOMENDADO Se deberían ofrecer mensajes claros para informar del estado de la prestación del servicio. 

Los avisos pueden ser de cuatro tipos: éxito, información, advertencia o error. El contenido del mensaje debería tener el detalle suficiente, garantizar que están en español y que no incluyen información técnica irrelevante.

Formularios 

Los formularios deben diseñarse para ser eficientes, comprensibles y accesibles, reduciendo al mínimo el esfuerzo cognitivo y técnico de la persona usuaria. Su estructura, campos, botones y mensajes deben seguir criterios de claridad, consistencia, usabilidad y adecuación tecnológica. 

Información solicitada y flujo de uso 

DIR_39 Solicitud mínima de información y flujo de progreso

OBLIGATORIO Se debe solicitar solo la información necesaria y que no se repita lo ya conocido. 

El sistema debe inferir datos cuando sea posible, evitar límites de tiempo estrictos, y permitir al usuario ver su progreso y volver a pasos anteriores si es un proceso por fases. 

Textos e instrucciones 

DIR_40 Formularios

OBLIGATORIO Los formularios deben contar con títulos e instrucciones claras, breves y consistentes. 

Se debe evitar el uso de términos complejos, y mantener una nomenclatura familiar para mejorar la comprensión general.  

3.6.3.    Organización visual y estructura 

DIR_41 Organización visual, agrupación lógica y uso de columna única

OBLIGATORIO Los formularios deben estar organizados de forma clara, con campos agrupados lógicamente. 

Se debe usar una sola columna por defecto, con alineación coherente, fieldsets por grupo de campos, y diferenciación visual entre campos obligatorios, opcionales y deshabilitados. 

3.6.4.    Configuración de campos 

DIR_42 Adecuación del campo

RECOMENDADO Los campos deberían ser adecuados al tipo de dato, fáciles de usar y evitar errores. 

El tamaño visible de cada campo debería corresponderse con la longitud esperada del dato, permitiendo flexibilidad en la entrada. Deberían evitarse campos genéricos o combos innecesarios (como para país, región o fechas) y preferirse listas, radios o checkboxes   cuando sean apropiados. Cada campo debería tener el tipo   más adecuado al dato esperado (por ejemplo, numérico, fecha, moneda). 

DIR_43 Eficiencia y comprensión de campos

RECOMENDADO El diseño de los campos debería favorecer la eficiencia y la comprensión 

Cuando existan muchos campos, deberían agruparse visualmente o redistribuirse mediante pasos, pestañas o bloques temáticos. En combos y radio buttons debería seleccionarse por defecto la opción más frecuente, pero no deben usarse radios buttons si hay más de cuatro opciones. Además, no debe recargarse la página al interactuar con campos (como cambios en combos o checks). 

DIR_44 Ayuda visual para formatos especiales de campo

RECOMENDADO Los campos con formatos especiales deberían ir acompañados de ayuda visual clara. 

Si se requiere un formato o valor específico (p. ej., formato de fecha o código), debería indicarse de forma visible y referenciada en el input. Si no es posible mostrarlo directamente, se deberían usar los tooltips proporcionados según el sistema de diseño. 

Funcionamiento del formulario

DIR_45 Navegación por teclado y validación de datos

RECOMENDADO El formulario debería ser navegable por teclado y validar los datos de forma clara y uniforme. 

Se debería garantizar el acceso a los distintos campos mediante tabulador y la acción principal se debería activar con "Intro". Las reglas de validación se deberían aplicar por igual a todos los usuarios y países. 

Ayudas y campos obligatorios 

DIR_46 Indicación clara y validación de campos obligatorios

RECOMENDADO Los campos obligatorios deberían estar claramente indicados y ser validados automáticamente. 

Se deberían mostrar mensajes aclaratorios, gestionar el etiquetado con asteriscos y proporcionar ayudas útiles y visibles cuando sea necesario. 

DIR_47  Ayuda para completar campos

RECOMENDADO Deberían mostrarse ayudas breves y útiles para completar los campos. 

Las ayudas deberían estar visibles cuando sea necesario, sin sobrecargar el formulario. El sistema debería aplicar formateo automático a los datos (por ejemplo, símbolos de moneda, espacios, etc.), evitando que los usuarios tengan que introducir caracteres especiales. 

DIR_48  Introducción activa de valores y campos de solo lectura

RECOMENDADO Se debería forzar la introducción activa de valores por parte del usuario. 

El primer valor de una lista desplegable debería ser nulo para obligar al usuario a seleccionar manualmente, especialmente en campos obligatorios. En caso de mostrar campos de solo lectura, estos no deberían tener marca de obligatorio, aunque estén en formularios con campos requeridos. 

Botones y acciones   

DIR_49 Confirmación explícita en acciones críticas

OBLIGATORIO Las acciones críticas deben requerir confirmación explícita por parte del usuario antes de ejecutarse. 

Se debe mostrar al usuario un mensaje de confirmación antes de realizar acciones críticas como el envío definitivo de un formulario, la eliminación de datos o la modificación irreversible de contenido. Este mensaje debe informar de forma comprensible qué acción se va a realizar y dar al usuario la opción de cancelar o continuar. 

DIR_50 Botones

RECOMENDADO Todo formulario debería tener al menos un botón claramente etiquetado y correctamente ubicado. 

Las acciones primarias y secundarias deberían distinguirse y los botones deberían estar al final del formulario, con nombres relacionados con la acción concreta. Se deberían usar siempre los mismos términos para las mismas acciones. 

Gestión de errores y feedback 

DIR_51 Gestión de errores visible, comprensible y no destructiva

RECOMENDADO Los errores deberían ser visibles, comprensibles y no borrar la información ya introducida. 

El sistema debería resaltar los campos incorrectos, mostrar mensajes simples y mantener los datos válidos tras el fallo. 

DIR_52   Envío y estado del formulario

RECOMENDADO El sistema debería informar sobre el envío y estado del formulario. 

Se deberían incluir mensajes de envío ("procesando, enviando datos, ..."), notificaciones por canales externos (correo, SMS), y ayuda en caso de error o indisponibilidad. El sistema debería guiar sobre cómo actuar o con quién contactar.

Normativa 

El sitio debe garantizar el cumplimiento de la normativa aplicable y ofrecer una experiencia técnica fiable y clara. Se deben evitar barreras técnicas, proporcionar transparencia sobre los requisitos técnicos, y asegurar que las acciones del usuario, como imprimir o guardar información, se realicen de forma precisa. 

Información legal y requisitos técnicos 

DIR_53 Información legal

RECOMENDADO La información legal debería presentarse de forma clara y comprensible. 

Los textos sobre protección de datos, accesibilidad y aviso legal deberían evitar tecnicismos y estar redactados para que cualquier usuario los entienda fácilmente. 

DIR_54 Requisitos técnicos

RECOMENDADO El usuario debería ser informado de forma anticipada si necesita plugins, navegadores o resoluciones específicas. 

Debería ofrecerse un mensaje claro con instrucciones y un enlace directo para obtener lo necesario.