Diferencia entre revisiones de «Plantilla:Actividad WCAG»

De WCAG Wiki
← Edición anterior
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
 
(No se muestran 35 ediciones intermedias del mismo usuario)
Línea 1: Línea 1:
<includeonly>
<includeonly>
''' Edición de la página como formulario'''
<div style="margin-top:1em;">
[{{FULLURL:{{FULLPAGENAME}}|action=formedit}} <span style="background:#007acc; color:#fff; padding:0.4em 0.8em; border-radius:4px;">Editar con formulario</span>]
</div>
<div style="margin-top:1em;">
[{{FULLURL:{{FULLPAGENAME}}|action=formedit&form=ActividadWCAG}}
<span style="background:#007acc; color:#fff; padding:0.4em 0.8em; border-radius:4px;">
Editar con formulario
</span>]
</div>
<div style="margin-top:1em;">
[{{FULLURL:{{FULLPAGENAME}}|action=formedit&form=ActividadWCAG}}
<span style="background:#007acc; color:#fff; padding:0.4em 0.8em; border-radius:4px;">Editar con formulario</span>]
</div>
<div class="wcag-actividad" style="border:1px solid #ccc; padding:1em; background:#fafafa; margin:1.5em 0;">
<div class="wcag-actividad" style="border:1px solid #ccc; padding:1em; background:#fafafa; margin:1.5em 0;">


Línea 6: Línea 25:
<!-- ===================================================== -->
<!-- ===================================================== -->
== 1. Información básica ==
== 1. Información básica ==
<div><b>Id del criterio:</b> {{{id|}}}</div>
<div><b>Id del criterio:</b> {{{id_criterio|}}}</div>
<div><b>Título del subcriterio:</b> {{{titulo|}}}</div>
<div><b>Título del subcriterio:</b> {{{id_subcriterio|}}}</div>
<div><b>Enlace al criterio:</b> {{{enlace|}}}</div>
<div><b>Enlace directo a la página del subcriterio en la wiki</b> {{{id_url|}}}
 
[[Categoría: {{{id_subcriterio|}}}]]


----
----
Línea 15: Línea 36:
<!-- 2. EJEMPLOS PRÁCTICOS -->
<!-- 2. EJEMPLOS PRÁCTICOS -->
<!-- ===================================================== -->
<!-- ===================================================== -->
== 2. Ejemplos prácticos ==
== 2. Ejemplos prácticos ==


=== 2.1. Ejemplo NO accesible ===
=== 2.1. Ejemplo NO accesible ===
<div class="accessibility-collapsible-group">
<div style="margin-left:1em;">


<!-- Imagen -->
<b>1. Evidencia en imagen:</b><br>
<div class="mw-collapsible mw-collapsed">
<h4>1. Imagen</h4>
<div class="mw-collapsible-content">
{{#if: {{{noa_barrera_evidencia_img|}}} |
{{#if: {{{noa_barrera_evidencia_img|}}} |
   <div><b>📷 Evidencia de imagen:</b><br>[[File:{{{noa_barrera_evidencia_img}}}|600px]]</div>
   [[File:{{{noa_barrera_evidencia_img}}}|600px]]
| <div><i>No se ha subido ninguna imagen.</i></div> }}
| <i>No se ha subido ninguna imagen.</i> }}
</div>
 
<br><br>
 
<b>2. Código HTML:</b>
{{#if: {{{noa_barrera_evidencia_html|}}} |<div class="wcag-codigo-html" padding:0.7em; border:1px solid #ddd;">
<code style="white-space: pre-wrap; font-family: monospace; background:none; border:none; color:white">
{{{noa_barrera_evidencia_html}}}
</code>
</div>
</div>
| <div><i>No se ha proporcionado código.</i></div> }}
<br>
TEXTO HTML
<pre><nowiki>{{{noa_barrera_evidencia_html}}}</nowiki></pre>


<!-- Código -->
<br>
<div class="mw-collapsible mw-collapsed">
<h4>2. Código HTML</h4>
<div class="mw-collapsible-content">
{{#if: {{{noa_barrera_evidencia_html|}}} |
  <pre style="background:#f9f9f9; padding:0.7em; border:1px solid #ddd;">{{{noa_barrera_evidencia_html}}}</pre>
| <div><i>No se ha proporcionado código.</i></div> }}
</div>
</div>


<!-- URL -->
<b>3. URL:</b>
<div class="mw-collapsible mw-collapsed">
<h4>3. URL</h4>
<div class="mw-collapsible-content">
{{#if: {{{noa_barrera_evidencia_url|}}} |
{{#if: {{{noa_barrera_evidencia_url|}}} |
  <div><b>🔗 URL:</b> [{{{noa_barrera_evidencia_url}}} Ver página]</div>
[{{{noa_barrera_evidencia_url}}} {{{noa_barrera_evidencia_url}}}]
| <div><i>No se ha indicado ninguna URL.</i></div> }}
|<i>No se ha indicado ninguna URL.</i> }}
</div>
 
</div>
<br><br>


<b>🧩 Explicación del problema detectado:</b><br>
<b> Explicación del problema detectado:</b><br>
{{{noa_barrera_explicacion|<i>No se ha incluido explicación.</i>}}}
{{{noa_barrera_explicacion|<i>No se ha incluido explicación.</i>}}}
<b> Indica a que personas con discapacidad afecta y explicación de las barreras que causa</b><br>
{{{noa_barrera_usuarios|<i>No se ha incluido explicación.</i>}}}


</div>
</div>
Línea 58: Línea 82:


=== 2.2. Ejemplo Accesible ===
=== 2.2. Ejemplo Accesible ===
<div class="accessibility-collapsible-group">
<div style="margin-left:1em;">


<!-- Imagen -->
<b>1. Evidencia de imagen:</b><br>
<div class="mw-collapsible mw-collapsed">
<h4>1. Imagen</h4>
<div class="mw-collapsible-content">
{{#if: {{{acc_barrera_evidencia_img|}}} |
{{#if: {{{acc_barrera_evidencia_img|}}} |
  <div><b>📷 Evidencia de imagen:</b><br>[[File:{{{acc_barrera_evidencia_img}}}|600px]]</div>
[[File:{{{acc_barrera_evidencia_img}}}|600px]]
| <div><i>No se ha subido ninguna imagen.</i></div> }}
| <i>No se ha subido ninguna imagen.</i> }}
</div>
 
</div>
<br><br>


<!-- Código -->
<b>2. Código HTML:</b>
<div class="mw-collapsible mw-collapsed">
<h4>2. Código HTML</h4>
<div class="mw-collapsible-content">
{{#if: {{{acc_barrera_evidencia_html|}}} |
{{#if: {{{acc_barrera_evidencia_html|}}} |
  <pre style="background:#eef; padding:0.7em; border:1px solid #ddd;">{{{acc_barrera_evidencia_html}}}</pre>
<div class="wcag-codigo-html" padding:0.7em; border:1px solid #ddd;">
<code style="white-space: pre-wrap; font-family: monospace; background:none; border:none; color:white">
{{{acc_barrera_evidencia_html}}}
</code>
</div>
| <div><i>No se ha proporcionado código.</i></div> }}
| <div><i>No se ha proporcionado código.</i></div> }}
</div>
<br>
</div>
TEXTO HTML
<pre><nowiki>{{{acc_barrera_evidencia_html}}}</nowiki></pre>
 
<br>
 


<!-- URL -->
<b>3. URL:</b>
<div class="mw-collapsible mw-collapsed">
<h4>3. URL</h4>
<div class="mw-collapsible-content">
{{#if: {{{acc_barrera_evidencia_url|}}} |
{{#if: {{{acc_barrera_evidencia_url|}}} |
  <div><b>🔗 URL:</b> [{{{acc_barrera_evidencia_url}}} Ver página]</div>
[{{{acc_barrera_evidencia_url}}} {{{acc_barrera_evidencia_url}}}]
| <div><i>No se ha indicado ninguna URL.</i></div> }}
|<i>No se ha indicado ninguna URL.</i> }}
</div>
 
</div>
<br><br>


<b>🧠 Explicación de la solución aplicada:</b><br>
<b>Explicación de la solución aplicada:</b><br>
{{{acc_barrera_explicacion|<i>No se ha incluido explicación.</i>}}}
{{{acc_barrera_explicacion|<i>No se ha incluido explicación.</i>}}}


Línea 101: Línea 124:
<!-- ===================================================== -->
<!-- ===================================================== -->
== 3. Aporte personal ==
== 3. Aporte personal ==
<b>Proceso de creación:</b><br>{{{proceso|}}}<br>
<div style="margin-left:1em;">
<b>Herramientas usadas:</b><br>{{{herramientas|}}}<br>
<b>Proceso de creación:</b><br>{{{proceso|}}}<br><br>
<b>Herramientas usadas:</b><br>{{{herramientas|}}}<br><br>
<b>Referencias complementarias:</b><br>{{{referencias|}}}
<b>Referencias complementarias:</b><br>{{{referencias|}}}
</div>


----
----
Línea 111: Línea 136:
<!-- ===================================================== -->
<!-- ===================================================== -->
== 4. Autoevaluación ==
== 4. Autoevaluación ==
<table class="wikitable" style="width:100%; background:#fff;">
<table class="wikitable" style="width:100%; background:#fff; margin-top:1em;">
<tr><th>Pregunta</th><th>Valor</th></tr>
<tr><th>Pregunta</th><th>Valor</th></tr>
<tr><td>Entendimiento</td><td>{{{eval_entendimiento|}}}</td></tr>
<tr><td>
<tr><td>Dificultad NOA</td><td>{{{eval_noa_dificultad|}}}</td></tr>
4.1. ¿Fue fácil o difícil entender el criterio? <br> (1 = No entendí casi nada | 5 = Lo comprendí con claridad)
<tr><td>Dificultad ACC</td><td>{{{eval_acc_dificultad|}}}</td></tr>
</td><td>{{{eval_entendimiento|}}}</td></tr>
<tr><td>Seguridad</td><td>{{{eval_seguridad|}}}</td></tr>
<tr><td>4.2. ¿Fue fácil o difícil crear el ejemplo no accesible (NOA)? <br> (1 = Muy fácil | 5 = Muy difícil)</td><td>{{{eval_noa_dificultad|}}}</td></tr>
<tr><td>Utilidad</td><td>{{{eval_utilidad|}}}</td></tr>
<tr><td>4.3. ¿Fue fácil o difícil crear el ejemplo accesible (ACC)?  <br> (1 = Muy fácil | 5 = Muy difícil) </td><td>{{{eval_acc_dificultad|}}}</td></tr>
<tr><td>Aplicación</td><td>{{{eval_aplicacion|}}}</td></tr>
<tr><td>4.4. ¿Qué seguridad tienes de que tus ejemplos son correctos? <br> (1 = No estoy seguro | 5 = Totalmente seguro)</td><td>{{{eval_seguridad|}}}</td></tr>
<tr><td>Explicación</td><td>{{{eval_explicacion|}}}</td></tr>
<tr><td>4.5. ¿En qué medida comprendes para qué sirve este criterio en la práctica? <br> (1 = No entiendo su utilidad | 5 = Puedo explicar claramente por qué es útil)</td><td>{{{eval_utilidad|}}}</td></tr>
<tr><td>Observaciones</td><td>{{{eval_observaciones|}}}</td></tr>
<tr><td>4.6. ¿Podrías aplicar este criterio en otro proyecto o web distinta? <br> (1 = No sabría hacerlo | 5 = Podría hacerlo sin ayuda)</td><td>{{{eval_aplicacion|}}}</td></tr>
</table>
</table>


<div style="margin-left:1em;">
<b>4.7. Explica este criterio a un compañero:</b><br>{{{eval_explicacion|}}}
<br><br>
<b>4.8. Observaciones personales:</b><br>
{{{eval_observaciones|}}}
</div>
</div>
</includeonly>
</includeonly>
Línea 128: Línea 158:
<noinclude>
<noinclude>
Plantilla para mostrar los datos del formulario [[Formulario:Actividad_WCAG]].   
Plantilla para mostrar los datos del formulario [[Formulario:Actividad_WCAG]].   
Incluye secciones desplegables para las evidencias de ejemplo (imagen, código, URL), la explicación, el aporte personal y la autoevaluación.
Muestra directamente toda la información en pantalla (sin secciones colapsables). 
Incluye evidencias, explicaciones, aporte personal y tabla de autoevaluación.
</noinclude>
</noinclude>

Revisión actual - 07:29 26 oct 2025


Plantilla para mostrar los datos del formulario Formulario:Actividad_WCAG. Muestra directamente toda la información en pantalla (sin secciones colapsables). Incluye evidencias, explicaciones, aporte personal y tabla de autoevaluación.

Obtenido de «https://wikiwcag.udl.cat/index.php?title=Plantilla:Actividad_WCAG&oldid=2214»