Diferencia entre revisiones de «Principio 2/2.4 Navegable/2.4.2-A»

De WCAG Wiki
← Edición anterior
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
 
(No se muestran 2 ediciones intermedias del mismo usuario)
Línea 1: Línea 1:
== '''2.4.2-A. Título descriptivo de página''' ==
{{CriterioWCAG
|id_wcag_criterio=2.4.2
|id_wcag_subcriterio=2.4.2-A
|wcag_titulo_criterio=2.4.2-A. Título descriptivo de página
|wcag_nivel=A
|wcag_version=2.0
|wcag_principio=2_Operable
|wcag_principio_url=Principio_2
|wcag_pauta=2.4_Navegable
|wcag_pauta_url=Principio_2/2.4_Navegable
|wcag_grupo=Navegación
|wcag_subgrupo=Estructura
|wcag_subcriterio_url=Principio_2/2.4_Navegacion_clara/2.4.2-A
 
|wcag_discapacidades=
<li class="discapacidad-item">
  [[Archivo:Sinvision.png|20px|class=icon-discapacidad|alt=Discapacidad visual total]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad visual total|Visual total]]</span> –
  <span class="gravedad gravedad-grave">Barrera grave</span>
</li>
<li class="discapacidad-item">
  [[Archivo:sordoceguera.png|20px|class=icon-discapacidad|alt=Discapacidad sordoceguera]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad sordoceguera|Sordoceguera]]</span>
  –
  <span class="gravedad gravedad-grave">Barrera grave</span>
</li>
<li class="discapacidad-item">
  [[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad cognitiva|Cognitiva]]</span> –
  <span class="gravedad gravedad-moderada">Barrera moderada</span>
</li>
<li class="discapacidad-item">
  [[Archivo:Motriz.png|20px|class=icon-discapacidad|alt=Discapacidad motriz]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad motriz|Motriz]]</span> –
  <span class="gravedad gravedad-leve">Barrera leve</span>
</li>
 
 
|wcag_lista_discapacidades=
[[Categoría:Discapacidad visual total]]
[[Categoría:Discapacidad sordoceguera]]
[[Categoría:Discapacidad cognitiva]]
[[Categoría:Discapacidad motriz]]
 
|wcag_texto_criterioOAW=
La página web debe tener un título descriptivo mediante el elemento <code>&lt;title&gt;</code>.
 
|wcag_descripcion_resumida=
Cada página debe incluir un título claro, conciso y útil que describa su contenido o propósito.
 
|wcag_objetivo=
Ayudar a los usuarios a identificar rápidamente el propósito de la página, facilitar la navegación y la orientación dentro del sitio.
 
|wcag_importancia=
Los títulos permiten diferenciar páginas abiertas, entender su contenido antes de navegar y orientarse al cambiar entre pestañas o ventanas, especialmente con lectores de pantalla.
 
|wcag_referencias=
<ul>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/general/G88 G88: Providing descriptive titles for Web pages]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/html/H25 H25: Providing a title using the title element]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/failures/F25 F25: Failure due to the title of a Web page not identifying the content]</span></li>
</ul>
 
|wcag_recursos= Sin recursos
 
|wcag_tipo_evaluacion=Semiautomática
 
|wcag_pasos_evaluacion=
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span>
Comprobar el texto que se muestra como título de la pestaña activa; este texto se corresponde con el contenido del elemento <code>&lt;title&gt;</code> de la página.
</li>
 
<li><span class="paso-badge">Paso 2.</span>
Verificar que existe este título (si no, se mostraría la URL) y que describe de manera adecuada el cometido de la página.
</li>
</ol>
 
|wcag_resultado_evaluacion=
La página tiene un título descriptivo, único y relacionado con su contenido.
 
|wcag_ejemplo_evaluacion=
<div class="accessibility-card">
<pre class="wcag-codigo-html">
<head>
  <title>Contacto | Universidad de Ejemplo</title>
</head>
</pre>
</div>
 
|wcag_otras_herramientas_evaluacion=
<ul>
<li> <strong>Bookmarklet:</strong><br>


<!-- 
  Análisis interno:
  Este criterio impacta principalmente a: Personas con discapacidad cognitiva y visual 
  Problema grave: Sin título descriptivo, los usuarios no pueden identificar la página ni su contenido rápidamente, dificultando la orientación y navegación; barrera moderada a grave. 
-->
<html>
<html>
<!-- criterio 2.4.2-A -->
<div class="highlight-box">
<article class="wcag-card">
Arrastra este botón a tu barra de marcadores y podrás ejecutarlo y ver los títulos de otras páginas. <br>
  <section class="wcag-info">
 
    <ul>
<a class="bookmarklet-button"
      <li><span class="label">Nivel:</span><span class="value">A</span></li>
href="javascript:alert('Título de la ventana: \n' + document.title);">
      <li><span class="label">Versión:</span><span class="value">2.2</span></li>
Ver el titulo de la página
      <li><span class="label">Principio:</span><span class="value">2. Operable</span></li>
</a>
      <li><span class="label">Pauta:</span><span class="value">2.4 Proporcionar ayuda para navegar y buscar contenido</span></li>
</div>
      <li><span class="label">Categoría:</span><span class="value">Navegación</span></li>
      <li><span class="label">Subcategoría:</span><span class="value">Título de página</span></li>
    </ul>
  </section>
  <section class="wcag-users">
    <p>Usuarios más afectados</p>
    <ul>
      <li><img src="/images/4/4d/Sinvision.png" alt="Icono discapacidad visual total" class="icono-discapacidad" /> Personas con discapacidad visual total – <span class="gravedad">Barrera grave</span></li>
      <li><img src="/images/4/40/Cognitiva.png" alt="Icono discapacidad cognitiva" class="icono-discapacidad" /> Personas con discapacidad cognitiva – <span class="gravedad">Barrera moderada</span></li>
    </ul>
  </section>
</article>
</html>
</html>
</li>
<li>
'''Inspección del navegador''': comprobar en el código que existe un elemento <code>&lt;title&gt;</code> en la sección <code>&lt;head&gt;</code> y que su contenido es descriptivo y único para esa página.</li>
<li>'''Verificación en la pestaña del navegador''': revisar el título mostrado en la barra/pestaña y confirmar que refleja claramente el contenido o propósito de la página.</li>
<li>'''Lectores de pantalla''': (NVDA, JAWS, VoiceOver) iniciar la lectura de la página para confirmar que el título se anuncia correctamente.</li>
<li>'''Validadores''': usar herramientas como W3C HTML Validator o extensiones de accesibilidad para detectar ausencia o duplicación del elemento <code>&lt;title&gt;</code>.</li>
</ul>
}}

Revisión actual - 12:44 6 nov 2025

2.4.2-A. Título descriptivo de página

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

Enunciado del criterio (Observatorio de Accesibilidad Web)

  • La página web debe tener un título descriptivo mediante el elemento <title>.

Comprensión del criterio

Descripción resumida

Cada página debe incluir un título claro, conciso y útil que describa su contenido o propósito.

Objetivo

Ayudar a los usuarios a identificar rápidamente el propósito de la página, facilitar la navegación y la orientación dentro del sitio.

Importancia de cumplir el criterio

Los títulos permiten diferenciar páginas abiertas, entender su contenido antes de navegar y orientarse al cambiar entre pestañas o ventanas, especialmente con lectores de pantalla.

Referencias WCAG

Recursos de apoyo

Sin recursos

Evaluación del criterio

Tipo de evaluación

Evaluación Semiautomática

Procedimiento de evaluación

  1. Paso 1. Comprobar el texto que se muestra como título de la pestaña activa; este texto se corresponde con el contenido del elemento <title> de la página.
  2. Paso 2. Verificar que existe este título (si no, se mostraría la URL) y que describe de manera adecuada el cometido de la página.

Resultado esperado

La página tiene un título descriptivo, único y relacionado con su contenido.

Ejemplo

<head>
  <title>Contacto | Universidad de Ejemplo</title>
</head>

Otras herramientas de evaluación

  • Bookmarklet:
    Arrastra este botón a tu barra de marcadores y podrás ejecutarlo y ver los títulos de otras páginas.
    Ver el titulo de la página
  • Inspección del navegador: comprobar en el código que existe un elemento <title> en la sección <head> y que su contenido es descriptivo y único para esa página.
  • Verificación en la pestaña del navegador: revisar el título mostrado en la barra/pestaña y confirmar que refleja claramente el contenido o propósito de la página.
  • Lectores de pantalla: (NVDA, JAWS, VoiceOver) iniciar la lectura de la página para confirmar que el título se anuncia correctamente.
  • Validadores: usar herramientas como W3C HTML Validator o extensiones de accesibilidad para detectar ausencia o duplicación del elemento <title>.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 2.4.2-A. Título descriptivo de página

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_2/2.4_Navegable/2.4.2-A&oldid=3725»