Hoy hemos finalizado con la validación de ayer, ya que no dio tiempo a terminar, se han corregido la mayoría de pruebas ya que ayer aún dio tiempo a alguna y bueno, saqué un 8,5.
Por lo demás, hemos seguido con el monográfico y por fin hemos terminado, hicimos una prueba de impresión y ha quedado bastante bien, luego establecimos distintas animaciones para la presentación en la transición de una diapositiva a otra.
En diseño gráfico hemos terminado y expuesto los distintos logotipos.
Al parecer y como se ve en la prueba, voy sintetizando más y dejando de poner florituras innecesarias a la hora de expresarme, bueno lo estoy intentando al menos.
En esencia ha sido un día un tanto ajetreado pero fácil de llevar.

Hoy hemos tenido casi toda la mañana la prueba de validación, pero hicimos un parón para diseño gráfico, donde nos dedicamos a tener una lluvia de ideas y entre todos debatir cuál será el nombre de nuestra empresa antes de solicitar el dominio. De momento no nos hemos decidido pero creo que ya para mañana tendremos algo.
Esta vez en el ejercicio práctico del examen no hicimos nada de código, en su lugar, fue un informe sobre accesibilidad, usabilidad etc de infojardín.com
Aquí subo la prueba y mi informe.

<HTML><TITLE>Confección y publicación de páginas Web.</TITLE><BR />

<H1 <B>ALIGN=”CENTER”>PRUEBA DE VALIDACIÓN PERSONAL</B><H1>

<P>Fecha: Módulo: MF0950_2 Unidad Formativa: UF1303.3

Nombre:

</P>

<BODY>

<H2><U>INSTRUCCIONES:</U>Esta prueba de validación se compone de una parte escrita y una de elaboración. La prueba tiene un tiempo de duración determinado de ¿?¿?¿?¿ <b>NO MÁS DE 20 LÍNEAS POR PREGUNTA</b></H2>

1.- Explica qué significa que una web tenga el logotipo

y como ha llegado a conseguirlo.

2.- Qué es la web 2.0 y que novedades implementa frente a la 1.0

3.- Enumera todos los ejemplos que puedas de tipos de usuarios que tiene en cuenta la “accesibilidad web”,por ejemplo: Usuarios ciegos. Un dos tres, responda otra vez…

4.- Enumera los principales errores de prioridad A que son básicos para la accesibilidad, y pon un ejemplo de código de cada uno.

5.- Javascipt, flash, numerosos enlaces en la pantalla principal, ¿por qué no son “tecnologías accesibles”?. Explicación tecnológica.

6.- Cuando analizamos con herramientas de accesibilidad, hay errores automáticos y otros a revisar manualmente, por qué crees que esto es así y pon un ejemplo de código de cada.

7.- Qué es y como se llaman las plantillas que se adaptan al formato de la pantalla del usuario y en que principio tecnológico se basan.

8.- Enumera los pasos detallados que darías para hacer una validación en accesibilidad y usabilidad a un cliente. No más de 20 pasos.

8.- - Ejercicio en el PC: Navega y Analiza la web www.infojardin.com, efectúa un informe del sitio contestando todas las cuestiones siguientes:

Validarla con 3 sistemas en prioridad A
Hacer examen de seguridad y velocidad de acceso
¿Podemos encontrar fácilmente los contenidos?
¿Las secciones están bien definidas? Que sugerencias de cambio harías.
¿La página es amigable, confiable, navegable facilmente?
Nivel de rapidez de navegación entre contenidos de la web.
Imagen corporativa.
Propuestas de cambio y mejoras para mejorar la accesibilidad y usabilidad de este sitio.

Informe de validación

Estimado propietario del dominio www.infojardín.com:

Respondiendo a su petición, he analizado rigurosamente la accesibilidad que posee dicha página con distintas herramientas, las cuales han sido Total validator, W3C markup validation service y Hera. Tras sintetizar los resultados, le presento un resumen de lo obtenido, así como el por qué de su importancia. Le informo que me he centrado únicamente en aquellos de tipo A.

Error en la etiqueta “alt”: 113 incidencias, la carencia del texto alternativo “alt” no permite que los navegadores de texto interpreten aquello que pretende mostrar, por tanto ciertos usuarios no podrán navegar por su página satisfactoriamente.
Error en el atributo “title”: 1 incidencia, debería usar este atributo en aquellos casos en los que los controles del formulario usan principalmente diseño visual, lo cual no permitirá identificarlos ni acceder a ellos en algunos casos.
Error en frames e iframes: 1 incidencia, si no especifica una identificación, no será identificable
Error en descripción del enlace: 9 incidencias, si no especifica y define el propósito de un enlace, algún usuario podría no distinguirlo de otros enlaces.
Error en especificación de tabla: 27 instancias, proporcionar un <caption>, “title” o “resumen” a una tabla es primordial para identificarla correctamente
Error presentación estética: 150 instancias, aquellas etiquetas que proporcionan una visión más estética de la página no posibilitarán el acceso adecuado a ciertos usuarios, tenga en consideración para solventarlo el usar maquetación mediante CSS.
Advertencia en etiqueta de lenguaje: 1 instancia, no está identificado correctamente el lenguaje en el cuál está escrita la página, lo que puede dar lugar a un problema de interpretación por los usuarios que utilicen navegadores de texto.
Advertencia en los enlaces de texto: 12 incidencias, si posee distintos enlaces con el mismo texto, puede dar pie a confusión por parte del usuario

Prosiguiendo con el informe, paso a comunicarle acerca de la velocidad de acceso a su página, para lo cuál, he realizado mi análisis usando la herramienta de Google developers, make me faster. Continúo entonces especificando dos plataformas.

Análisis de plataforma móvil:
- La velocidad de carga es relativamente lenta, lo que puede generar que los usuarios de móviles puedan perder la paciencia esperando y recurrir a otra página para solicitar información
Análisis de plataforma pc:
- La velocidad aquí es más aceptable que en la plataforma móvil

Dicha herramienta también proporcionó ciertas ideas en pro de la mejora de la usabilidad a las cuales yo añadiré alguna más:

Debería re dimensionar los textos y los botones táctiles dado que no permite su correcta visualización y uso
Debería configurar la ventana gráfica ya que no tiene ninguna especificada, lo que hace que los dispositivos móviles procesen su página como si apareciera en un navegador de escritorio, reduciéndola para que quepa en la pantalla del móvil
Plantéese la posibilidad de eliminar Java Script ya que bloquea la visualización y el CSS del contenido en la mitad superior de la página
Especifique la caché del navegador estableciendo una fecha de caducidad o una edad máxima en las cabeceras http de los recursos estáticos, lo cuál indica al navegador que cargue los recursos descargados previamente en el disco local en lugar de realizarlo en la red
Debería plantearse priorizar el contenido visible dado que su página requiere indicaciones completas de red adicionales para procesar el contenido destacado en la parte superior de la página. Para lograr un rendimiento óptimo, reduzca la cantidad de HTML necesario para procesar dicho contenido
Las imágenes ocuparían menos bytes y cargarían antes si las optimizara, puede lograrlo adecuando su tamaño, cantidad de colores o cambiando su formato
Su navegación es realmente mejorable, el menú está estructurado de manera extraña, dividido y es muy incómodo el existente en el margen derecho, podría ser más estético y estar mejor estructurado con un sub menú desplegable. La distribución existente del menú impide que encontremos adecuada y rápidamente los contenidos.
La excesiva extensión de links clicables hace que sea caótica y agobiante la navegación dado que cuesta encontrar artículos.
Hay un exceso de anuncios, no es que se trate de una desmedida cantidad no obstante es bastante molesto ya que incluso uno de ellos está en grande y centrado en media página. Ésto junto con los links para cada cosa, y el menú mal diseñado, parece que estamos en una página de anuncios, el usuario puede descartar rápidamente dicha página por estar recargada.
Hay demasiado espacio de márgenes y poquísimo interlineado y espaciado, las letras están comprimidas y escritas con un tamaño reducido, ésto dificulta la lectura cuando los márgenes podrían ser reducidos para aprovechar más el espacio para los artículos
Respecto a la imagen de empresa, el punto positivo es que el logo lleva a la página principal, no obstante no se encuentra fácilmente la página de contacto ya que en ocasiones hay que bajar demasiado hasta verlo. Tampoco hay nada que explique si es una entidad corporativa, tienda etc, básicamente hay logotipo, lo que indica que hay empresa, pero no hay nada que indique qué personas trabajan ahí ni qué hacen al igual que su ubicación. Esto no resulta confiable, el usuario no sentirá seguridad si desea comprar o contratar un servicio si lo hubiese.

Para finalizar, analicé su seguridad con la herramienta Sucuri y puedo decir que básicamente es adecuada, mas hay un problema con el firewall ya que sólo tiene protección media y esto podría causar problemas.

En esencia hay muchas cosas para cambiar o al menos para plantearse cambiar, bastantes en el campo de la usabilidad ya que la página no está estructurada de una forma práctica, mi consejo rápido para ello es estructurar un único menú en el cuál estén los artículos, suprimir toda la publicidad posible y en ningún caso situarla en mitad de la página. Hay muchos artículos que seguramente tengan información muy interesante, pero el usuario no puede saberlo si se satura con anuncios y una mala navegación.

Hasta aquí llega mi informe, espero sirva de ayuda para mejorar su web.

Un cordial saludo

Diario IFCD0110 Castro Urdiales

menu desplegable

jueves, 10 de julio de 2014

DIA VEINTISIETE 10/07/2014

DIA VEINTISEIS 09/07/2014

martes, 8 de julio de 2014

DIA VEINTICINCO 08/07/2014

DIA VEINTICUATRO 07/07/2014

Informe de validación

analytics