Contenido

Informe

4.6
  • URI: http://www.google.com/ Página
  • Título: Google
  • Elementos: 97
  • Tamaño: 46.8 KB (47906 bytes)
  • Fecha/Hora: 05/10/2021 - 12:22 GMT
Los resultados de la validación (X)HTML no están incluidos. Código

Resultados generales de 16 pruebas:

Excelente: 5 pruebas

10 Todas las medidas en los atributos HTML están expresadas en valores relativos

G146: Usar diseño líquido

El propósito de esta técnica es poder presentar el contenido sin presentar barras de desplazamiento horizontal mediante el uso de técnicas de diseño que se adaptan al espacio horizontal disponible. Los diseños líquidos definen zonas de diseño que cambian de tamaño con el texto. Aunque así la disposición exacta varía, la relación de los elementos y el orden de lectura sigue siendo el mismo. Esta es una manera eficaz de crear diseños que se presentan bien en diferentes dispositivos y a los usuarios con diferentes preferencias de tamaño de fuente.

Cuando se brinda la posibilidad de ajustar el texto, se está permitiendo que el texto sea ampliado sin necesidad de efectuar desplazamientos laterales para ver todo el contenido. Cuando esto es posible se dice que el texto fluye y permite, a las personas con baja visión y con problemas cognitivos, incrementar el tamaño del texto sin sentirse desorientadas.

WCAG 2.0: G146 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.4.4 (Nivel AA) Comprender 1.4.4
  • Medidas expresadas con valores relativos en (X)HTML: 2 Examinar

10 Se identifica el idioma principal de la página con el código "en-AR"

H57: Usar atributos de idioma en el elemento html

El propósito de esta técnica es identificar el idioma predeterminado de un documento proporcionando el atributlo lang y/o xml:lang en el elemento html. Identificar el idioma del documento es importante para que las ayudas técnicas y las aplicaciones de usuario convencionales puedan procesar los textos con mayor fidelidad. Los lectores de pantalla pueden cargar las reglas de pronunciación adecuadas y los usuarios con discapacidad tendrán más posibilidades de entender el contenido. HTML sólo ofrece el uso del atributo lang mientras que XHTML 1.0 (como medida de transición) permite lang y xml:lang (ambos deben tener un mismo valor), y XHTML 1.1 sólo permite xml:lang.

WCAG 2.0: H57 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 3.1.1 (Nivel A) Comprender 3.1.1
  • Idioma principal de la página: en-AR

10 La página tiene un elemento title

H25: Proporcionar un título usando el elemento title

Todos los documentos HTML y XHTML, incluyendo aquellos en los marcos individuales de un frameset, tienen un elemento title en la sección head que define, en una frase simple, el propósito del documento. Esto ayuda a los usuarios a orientarse dentro del sitio de forma rápida y sin tener que buscar información en el cuerpo de la página. Tenga en cuenta que el elemento title (obligatorio), que sólo aparece una vez en un documento, es diferente del atributo title, que se puede aplicar a casi todos los elemento HTML y XHTML.

WCAG 2.0: H25 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 2.4.2 (Nivel A) Comprender 2.4.2
  • Título de la página: Google

10 Todas las medidas en las CSS están expresadas con valores relativos

C24: Usar porcentajes en los valores de la CSS para definir el tamaño de los contenedores

El propósito de esta técnica es que los usuarios puedan aumentar el tamaño del texto sin tener que desplazarse horizontalmente para leer una línea de texto. Para utilizar esta técnica, el autor debe especificar el ancho de los contenedores de texto usando valores de porcentaje.

Verifique que sea posible ampliar en un 200% los textos sin requerir el uso de las barras de desplazamiento horizontal para leer cualquier línea de texto.

Cuando se brinda la posibilidad de ajustar el texto se está permitiendo que el texto sea ampliado sin necesidad de efectuar desplazamientos laterales para ver todo el contenido. Cuando esto es posible se dice que el texto fluye y permite, a las personas con baja visión y con problemas cognitivos, incrementar el tamaño del texto sin sentirse desorientadas. Ejemplo:

div#container {width: 80%}

WCAG 2.0: C24 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.4.8 (Nivel AAA) Comprender 1.4.8
  • Medidas expresadas con valores relativos en CSS: 14 Examinar

10 Todos los formularios tienen un botón de envío

H32: Proporcionar botones de envío

El propósito de esta técnica es proporcionar un mecanismo que permita a los usuarios solicitar explícitamente cambios de contexto. El uso previsto de un botón de envío (input type="submit", input type="image" o button type="submit") es generar una petición HTTP que envía los datos introducidos en un formulario, por lo que es un control apropiado para provocar un cambio de contexto y es una práctica que no crea confusión entre los usuarios.

WCAG 2.0: H32 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 3.2.2 (Nivel A) Comprender 3.2.2
  • Formularios: 1 Examinar
  • Formularios sin botón de envío: 0

Regular: 4 pruebas

4 Hay 1 tabla sin celdas de encabezados

H51: Usar tablas para presentar información tabular

El propósito de esta técnica es presentar información tabular de una manera que preserve las relaciones dentro de la información, incluso cuando los usuarios no puedan ver la tabla o el formato de presentación es cambiado. La información se considera tabular cuando existen relaciones lógicas entre texto, números, imágenes u otros datos en dos dimensiones (vertical y horizontal). Estas relaciones son representadas en columnas y filas, y las columnas y las filas deben ser reconocibles a fin de que las relaciones lógicas puedan ser percibidas. Utilizando el elemento table con los elementos hijos tr, th y td hace que estas relaciones resulten perceptibles.

Técnicas tales como el uso de tabuladores para crear columnas o usar el elemento pre son puramente visuales y las relaciones lógicas implícitas visualmente se pierden si el usuario no puede ver la tabla o se cambia la presentación visual. Aunque las WCAG no prohíben el uso de tablas para maquetar, se recomienda usar diseños basados en CSS para conservar el sentido semántica del elemento table definido en HTML y XHTML, y para cumplir con la práctica de separar la presentación del contenido.

WCAG 2.0: H51 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.3.1 (Nivel A) Comprender 1.3.1
  • Tablas sin celdas de encabezados (por ejemplo, elementos th): 1 Examinar

5 Se usan 3 atributos para controlar la presentación visual

G140: Separar la información y la estructura en la presentación para permitir presentaciones diferentes

El propósito de esta técnica es facilitar la interacción de las ayudas técnicas con el contenido separando el contenido de su presentación. La codificación estructural es la indicación de elementos tales como títulos, párrafos, listas, tablas, etc. Por el contrario, la codificación de la presentación es la indicación de los efectos de formato como tipo de letra, color, tamaño, posición, bordes, etc.

Aunque las características de presentación implican visualmente una estructura -los usuarios pueden determinar los encabezados, párrafos, listas, etc., a partir de las convenciones de formato utilizadas- estas características no codifican la estructura de forma inequívoca para que las ayudas técnicas puedan interactuar con la página de forma eficaz. Proporcionar las capas de estructura, funcionalidad y presentación separadas permite que la semántica implícita en el formato pueda ser determinada por software a través de la capa de estructura.

WCAG 2.0: G140 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.3.1 (Nivel A) Comprender 1.3.1
  2. Criterio de conformidad 1.4.5 (Nivel AA) Comprender 1.4.5
  3. Criterio de conformidad 1.4.9 (Nivel AAA) Comprender 1.4.9
  • Atributos para controlar el estilo visual de la presentación: 3 Examinar

5 Se usa 1 elemento para controlar la presentación visual

G115: Usar elementos semánticos para marcar la estructura

El propósito de esta técnica es marcar la estructura del contenido de la página utilizando los elementos semánticos adecuados. En otras palabras, los elementos se utilizan de acuerdo con su significado, no por la forma en que aparecen visualmente. La intención es asegurar que la información y las relaciones implícitas en el formato visual se mantengan cuando cambie el formato de la presentación.

Aunque los elementos de presentación implican una estructura visual -los usuarios pueden determinar encabezados, párrafos, listas, etc., a partir de los formatos convencionales-, no codifican la estructura de forma inequívoca para que las ayudas técnicas puedan interactuar con la página de forma efectiva. Con el uso de los elementos semánticos adecuados se asegura que la estructura esté a disposición de las aplicaciones de usuario.

WCAG 2.0: G115 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.3.1 (Nivel A) Comprender 1.3.1
  • Elementos para controlar el estilo visual de la presentación: 1 Examinar

5 Hay 193 casos de reglas CSS que no especifican los colores de primer plano y fondo a la vez

F24: Fallo de los Criterios de Conformidad 1.4.3, 1.4.6 y 1.4.8 debido a que se han especificado colores del frente sin especificar colores de fondo o viceversa

Los usuarios con pérdida de visión o capacidad cognitiva, con problemas de lenguaje y de aprendizaje suelen preferir combinaciones específicas de colores de primer plano y de fondo que les facilitan ver la página. Muchas aplicaciones permiten a los usuarios elegir los colores de primer plano o de fondo que les gustaría ver cuando los colores no han sido especificados por el autor.

A menos que un autor especifique los colores de primer plano y de fondo no podrá garantizar que el usuario tendrá un contraste que cumpla con los requisitos de contraste. Si el autor especifica un color del texto en primer plano, entonces debería especificar también un color de fondo que tenga suficiente contraste con el primer plano y viceversa.

No es estrictamente necesario que ambos colores se encuentren definidos en la misma regla CSS, aunque es una práctica recomendable. Dado que las propiedades de color CSS se heredan de los elementos padres, es suficiente con que ambos colores se definan ya sea directamente o a través de la herencia. Ejemplo:

div {color: white; background-color: black;}

WCAG 2.0: F24 (en inglés)

Este fallo se relaciona con:

  1. Criterio de conformidad 1.4.3 (Nivel AA) Comprender 1.4.3
  2. Criterio de conformidad 1.4.6 (Nivel AAA) Comprender 1.4.6
  3. Criterio de conformidad 1.4.8 (Nivel AAA) Comprender 1.4.8
  • Reglas CSS que no especifican colores de fondo y primer plano a la vez: 193 Examinar

Mal: 5 pruebas

2 Hay 1 imagen sin alternativa textual

F65: Fallo del Criterio de Conformidad 1.1.1 debido a la omisión del atributo alt en elementos img, elementos area, y elementos input de tipo "image"

Este fallo describe una condición de error en las alternativas textuales. Si no hay una fuente de texto para proporcionar una alternativa para los elementos img, area e input type="image", las ayudas técnicas no son capaces de identificar estos elementos o transmitir sus propósitos al usuario. El atributo alt sigue siendo la manera preferida para proporcionar un texto alternativo.

El propósito es lograr que la información transmitida por medio de contenido no textual sea accesible mediante el uso de las alternativas textuales. Los textos alternativos son el principal medio para hacer accesible la información ya que se pueden interpretar a través de cualquier modalidad sensorial (visual, auditiva o táctil) que mejor satisfaga las necesidades del usuario.

WCAG 2.0: F65 (en inglés)

Este fallo se relaciona con:

  1. Criterio de conformidad 1.1.1 (Nivel A) Comprender 1.1.1
  • Imágenes: 2 Examinar
  • Imágenes sin alt: 1 Examinar

3 No se usan encabezados en la página

H42: Usar h1-h6 para identificar los títulos

El propósito de esta técnica es el uso de las marcas de encabezados en HTML y XHTML para proporcionar código semántico en los encabezados del contenido. Los elementos de encabezados (h1, h2, h3, h4, h5 y h6) permitirán a las ayudas técnicas presentar el encabezado de un texto a los usuarios. Un lector de pantalla puede reconocer el código y anunciar el texto como encabezado con su nivel y proporcionar algún otro indicador auditivo. Los lectores de pantalla también son capaces de navegar por las marcas de encabezados, algo que para los usuarios puede ser una manera eficaz de encontrar más rápidamente el contenido de interés. Las ayudas técnicas que alteran la presentación visual del autor también serán capaces de proporcionar una presentación visual alternativa para los encabezados.

WCAG 2.0: H42 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.3.1 (Nivel A) Comprender 1.3.1
  • Encabezados (h1~h6): 0

3 El primer enlace de la página no lleva al contenido principal de la página

G1: Agregar un enlace al principio de cada página que lleve directamente al área de contenido principal

El propósito de esta técnica es proporcionar un mecanismo para evitar bloques de material que se repiten en múltiples páginas saltando directamente al contenido principal de la página. El primer elemento interactivo de la página debe ser un enlace que, al activarlo, mueve el foco más allá de cualquier otro contenido hasta el contenido principal. Es preferible que los enlaces sean visibles en todo momento, sin embargo, el criterio también se cumple si los enlaces se hacen visibles cuando reciben el foco del teclado.

WCAG 2.0: G1 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 2.4.1 (Nivel A) Comprender 2.4.1
  • Enlaces: 13 Examinar
  • Enlace para saltar al contenido principal: 0

3 No existen enlaces para saltar bloques de contenido

G123: Agregar un enlace al principio de un bloque de contenido repetitivo que dirija al final del bloque

El propósito de esta técnica es proporcionar un mecanismo para eludir un bloque de contenido saltando al final del bloque. El primer enlace en el bloque o el enlace directamente anterior al bloque mueve el foco del teclado al contenido inmediatamente posterior al bloque. Cuando hay varios bloques para eludir, el usuario puede saltar de uno a otro usando estos enlaces. Los enlaces deben ser visibles siempre o cuando reciben el foco del teclado.

WCAG 2.0: G123 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 2.4.1 (Nivel A) Comprender 2.4.1
  • Enlaces: 13 Examinar
  • Enlaces para saltar bloques de contenido: 0

3 En 1 caso se especifica un espaciado entre líneas menor a 1.5

C21: Especificar el espaciado de línea mediante CSS

Muchas personas con algunos tipos de discapacidad cognitiva tienen dificultades para seguir las líneas de texto cuando en un bloque de texto las líneas están muy juntas debido a un espaciado de línea simple. Un espacio de entre 1,5 y 2 les permite iniciar una nueva línea con mayor facilidad una vez que han terminado la anterior. Los espacios adicionales entre líneas y párrafos le permiten a estas personas ubicar mejor la línea siguiente y reconocer cuando llegaron al final de cada párrafo. Para ellos es aún mejor si existen diferentes opciones, por ejemplo, un espacio y medio y doble espaciado entre líneas. Ejemplo:

p {line-height: 150%;}

WCAG 2.0: C21 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.4.8 (Nivel AAA) Comprender 1.4.8
  • Espaciado de líneas de texto incorrecto: 1 Examinar

Muy mal: 2 pruebas

1 En 22 casos se usan medidas absolutas para indicar el ancho de un elemento

G146: Usar diseño líquido

El propósito de esta técnica es poder presentar el contenido sin presentar barras de desplazamiento horizontal mediante el uso de técnicas de diseño que se adaptan al espacio horizontal disponible. Los diseños líquidos definen zonas de diseño que cambian de tamaño con el texto. Aunque así la disposición exacta varía, la relación de los elementos y el orden de lectura sigue siendo el mismo. Esta es una manera eficaz de crear diseños que se presentan bien en diferentes dispositivos y a los usuarios con diferentes preferencias de tamaño de fuente.

Cuando se brinda la posibilidad de ajustar el texto, se está permitiendo que el texto sea ampliado sin necesidad de efectuar desplazamientos laterales para ver todo el contenido. Cuando esto es posible se dice que el texto fluye y permite, a las personas con baja visión y con problemas cognitivos, incrementar el tamaño del texto sin sentirse desorientadas.

WCAG 2.0: G146 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.4.4 (Nivel AA) Comprender 1.4.4
  2. Criterio de conformidad 1.4.8 (Nivel AAA) Comprender 1.4.8
  • Elementos con un ancho definido en unidades absolutas: 22 Examinar

1 En 41 casos se especifican valores absolutos para el tamaño de las fuentes

C12: Usar porcentajes para definir el tamaño de las fuentes

El propósito de esta técnica es especificar el tamaño de fuente de texto proporcionalmente, de forma que las aplicaciones de usuario puedan escalar el contenido con eficacia. El aumento del tamaño del contenido es, en primer término, una responsabilidad de las aplicaciones de usuario pero la responsabilidad del autor es crear contenido web que no le impida a las aplicaciones de usuario escalar efectivamente el texto.

La intención es asegurar que el texto procesado visualmente, incluyendo los controles basados en texto, puedan ser aumentados de tamaño para que las personas con problemas visuales puedan leerlo sin necesidad de usar ayudas técnicas. Ejemplos:

strong {font-size: 120%}
strong {font-size: 1.2em}

WCAG 2.0: C12 (en inglés)

Esta técnica se relaciona con:

  1. Criterio de conformidad 1.4.4 (Nivel AA) Comprender 1.4.4
  • Tamaños de letra definidos con CSS: 45 Examinar
  • Tamaños de letra definidos con unidades absolutas: 41 Examinar

Tablero: 16 pruebas. Score 4.6

Lista completa de pruebas
# Situación N P N*P
1 En 22 casos se usan medidas absolutas para indicar el ancho de un elemento 1 2.2 2.2
2 En 41 casos se especifican valores absolutos para el tamaño de las fuentes 1 2 2
3 Hay 1 imagen sin alternativa textual 2 3 6
4 No se usan encabezados en la página 3 3.2 9.6
5 El primer enlace de la página no lleva al contenido principal de la página 3 2.88 8.6
6 No existen enlaces para saltar bloques de contenido 3 2.88 8.6
7 En 1 caso se especifica un espaciado entre líneas menor a 1.5 3 2.08 6.2
8 Hay 1 tabla sin celdas de encabezados 4 3.6 14.4
9 Se usan 3 atributos para controlar la presentación visual 5 2.88 14.4
10 Se usa 1 elemento para controlar la presentación visual 5 2.2 11
11 Hay 193 casos de reglas CSS que no especifican los colores de primer plano y fondo a la vez 5 1.08 5.4
12 Todas las medidas en los atributos HTML están expresadas en valores relativos 10 1.98 19.8
13 Se identifica el idioma principal de la página con el código "en-AR" 10 1.8 18
14 La página tiene un elemento title 10 1.62 16.2
15 Todas las medidas en las CSS están expresadas con valores relativos 10 1.6 16
16 Todos los formularios tienen un botón de envío 10 0.8 8
  2.238 10.400

Score ponderado = round( 10.400 / 2.238 ) = 4.6

Resultados por personas

  • Limitación total para ver: Score 5.3 (10 pruebas)
  • Limitación grave para ver: Score 4.8 (15 pruebas)
  • Limitación de los miembros superiores: Score 4.1 (10 pruebas)
  • Limitación para comprender: Score 3.6 (10 pruebas)
  • Limitaciones derivadas de la edad: Score 4.9 (15 pruebas)