PI - Pisos e InmueblesDeclaración de accesibilidad
PI - Pisos e Inmuebles se ha comprometido a hacer accesible su sitio web de conformidad con las Pautas de Accesibilidad para el Contenido Web (WCAG 2.1) del W3C y la normativa europea vigente (Directiva UE 2016/2102 y Directiva UE 2019/882), garantizando el acceso a la información a todas las personas con independencia de sus capacidades visuales, auditivas, motoras o cognitivas y del dispositivo empleado.
1. Etiquetado semántico de las páginas
Todas las páginas del sitio web se han construido siguiendo el estándar HTML5 mediante etiquetas semánticas que describen el propósito de cada bloque y aseguran un orden de lectura lógico y lineal incluso cuando se desactivan las hojas de estilo:
<header>,<nav>,<main>,<section>,<article>y<footer>para estructurar las regiones de cada documento.- Jerarquía coherente de encabezados (
<h1>a<h3>) para facilitar la navegación mediante lectores de pantalla. - Formularios accesibles agrupados con
<fieldset>y<legend>, con cada control vinculado explícitamente a su etiqueta<label for="...">. - Tablas de datos estructuradas con título
<caption>y cabeceras identificadas mediante el atributoscope="col"yscope="row".
2. Texto alternativo en imágenes e iconos
Se ha cuidado que ningún contenido visual quede sin equivalente textual para usuarios de lectores de pantalla o navegadores con imágenes desactivadas:
- Las fotografías de los inmuebles incluyen descripciones significativas en su atributo
alty leyendas descriptivas mediante<figure>y<figcaption>. - Los iconos informativos de la barra de navegación y de los formularios incorporan los atributos
role="img"yaria-labeljunto con su etiqueta textual visible. - Los elementos puramente decorativos, como el isotipo de la cabecera, incluyen
alt=""yaria-hidden="true"para no generar ruido en los lectores de pantalla.
3. Uso correcto de los colores y el contraste
La paleta de colores se ha diseñado evitando transmitir información importante únicamente a través del color:
- Los campos obligatorios de los formularios se indican explícitamente con el símbolo
(*)dentro de su etiqueta además del atributorequired. - Los enlaces se distinguen del texto normal tanto por su color como por su subrayado permanente (
text-decoration: underline). - Se proporciona una hoja de estilo específica de Alto contraste que supera la relación de contraste 7:1 (nivel AAA de WCAG 2.1) empleando texto blanco y amarillo sobre fondo negro.
- Se incluye un estilo de Modo noche con tonos oscuros y texto blanco desaturado para reducir la fatiga visual en entornos de baja iluminación.
4. Cómo activar las hojas de estilo accesibles y alternativas
Este sitio web ofrece cinco presentaciones visuales para pantalla y una hoja de estilo automática para impresión, todas ellas seleccionables directamente desde el navegador sin modificar el código fuente:
| Nombre del estilo | Fichero CSS | Propósito y destinatarios |
|---|---|---|
| Estilo principal | style.css |
Diseño predeterminado adaptativo con paleta suave y alta legibilidad. |
| Modo noche | css/noche.css |
Esquema oscuro de bajo brillo con texto blanco desaturado para entornos con poca luz. |
| Alto contraste | css/contraste.css |
Fondo negro con texto blanco, títulos amarillos y enlaces cian (WCAG AAA) para personas con baja visión. |
| Texto grande | css/grande.css |
Aumenta el tamaño de letra un 25 %, amplía el interlineado y utiliza la fuente Atkinson Hyperlegible para baja visión y dislexia. |
| Alto contraste y texto grande | css/contrasteygrande.css |
Combina simultáneamente el esquema de alto contraste AAA y el tamaño de letra ampliado con fuente hiperlegible. |
| Versión impresa (automática) | css/impresion.css |
Se activa automáticamente al imprimir o guardar como PDF (formato A4, tipografía serif de 12pt, sin menús y con URLs visibles). |
Pasos para cambiar el estilo en Mozilla Firefox:
- Pulsa la tecla Alt en tu teclado para mostrar la barra de menús superior del navegador.
- Abre el menú Ver y selecciona la opción Estilo de página.
- Elige cualquiera de los estilos disponibles en la lista (Estilo principal, Modo noche, Alto contraste, Texto grande o Alto contraste y texto grande).
5. Otras características de accesibilidad implementadas
- Enlace de salto directo (Skip link): Al principio de todas las páginas existe el enlace oculto «Saltar al contenido principal», que se hace visible al pulsar la tecla Tab y permite saltar directamente al bloque
<main>sin recorrer todo el menú. - Indicador de foco visible: Todos los enlaces, botones y controles de formulario muestran un contorno de 3 píxeles claramente visible al navegar con el teclado (
:focus-visible). - Tipografía hiperlegible: Los estilos de letra grande emplean el tipo de letra Atkinson Hyperlegible (desarrollado por el Braille Institute), que diferencia claramente caracteres ambiguos como
1,i,I,l,0yO, y limitan el ancho de los párrafos a un máximo de 80 caracteres por línea (80ch). - Diseño adaptativo (Responsive) y unidades relativas: Todas las dimensiones tipográficas y de maquetación utilizan unidades relativas (
remyem), adaptándose desde pantallas móviles de 480px hasta monitores de 1920px o más.
6. Contacto y sugerencias sobre accesibilidad
Si encuentras alguna barrera de acceso o deseas realizar cualquier consulta o sugerencia sobre la accesibilidad de este portal, puedes ponerte en contacto con los responsables del sitio web a través del formulario de envío de mensajes.