los5enebros

28
Telefónica Soluciones Nivel de confidencialidad: 1-Sólo para uso interno XX-9999999-YY Edición: 1 Fecha: DD.MM.AA INFORMACIÓN PROPIEDAD DE TELEFONICA SOLUCIONES, S.A. Todos los derechos reservados Telefónica Soluciones S.A.

Transcript of los5enebros

Page 1: los5enebros

Telefónica Soluciones

Nivel de confidencialidad: 1-Sólo para uso interno

XX-9999999-YY Edición: 1 Fecha: DD.MM.AA

INFORMACIÓN PROPIEDAD DE TELEFONICA SOLUCIONES, S.A. Todos los derechos reservados

Telefónica Soluciones S.A.

Page 2: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 2 de 28

Fecha: DD.MM.AA Edición: 1

ÍNDICE

1 OBJETIVO GENERAL ............................................................................................... 3

1.1 Hotel-Spa Cinco Enebros .................................................................................................................. 4

1.2 Posicionamiento del negocio .......................................................................................................... 5

2 NAVEGACION WEB ................................................................................................. 6

2.1 Usabilidad de la página ..................................................................................................................... 6

2.2 Diseño Website .................................................................................................................................. 9

2.3 Recomendaciones .......................................................................................................................... 12

3 COMPARATIVA DEL SECTOR .............................................................................. 13

3.1 La Competencia .............................................................................................................................. 13

3.2 Análisis Subjetivo ............................................................................................................................ 15

4 ANÁLISIS TAW ....................................................................................................... 16

4.1 TAW 1.0 ............................................................................................................................................ 16

4.2 TAW 2.0 ............................................................................................................................................ 21

4.3 TAW 3.0 ............................................................................................................................................ 25

Page 3: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 3 de 28

Fecha: DD.MM.AA Edición: 1

1 OBJETIVO GENERAL

La función principal de este documento trata de mostrar un hecho en apariencia nimio, y que acostumbra a pasar desapercibido ante el consumo masivo por parte de los usuarios de la gran ventana que es Internet. Como en todo, a medida que el usuario acumula más tiempo consumiendo un producto, tiende a disminuir su capacidad de respuesta y síntesis, así como sus expectativas de cara a encontrar nuevas sorpresas.

Y es ahí donde reside uno de los mayores problemas a la hora de crear un website para nuestro negocio, ya se trate de una empresa nueva en auge como de una multinacional consolidada capaz de generar miles millones al día. Pala-bras como diseño, funcionabilidad, apariencia…etc. son apelativos que reflejaran de un modo intangible la aparien-cia y estado de nuestro negocio. Una web de difícil navegación transmitirá al usuario que este experimentándola una sensación negativa acerca de la misma, que inmediatamente se transmitirá a la propietaria y “culpable” de su crea-ción. Y todo este cúmulo de factores que parecen de sentido común, son vulnerados a diario en websites que buscan de entre todos los elementos una única propiedad, dando la espalda a las demás, por los motivos que sean. Este fac-tor, que condena a las empresas que se limitan a valerse de ella, no es otra que la funcionalidad.

Un negocio que busca diferenciarse de la competencia con un servicio mejorado, que promete al usuario una expe-riencia diferente a lo que ha vivido hasta ahora, que trata de responder a una necesidad que hasta nadie ha podido satisfacer, necesita transmitirlo tanto de forma implícita como explícitamente. Necesita demostrar que hay un trabajo detrás del servicio a la altura de lo que se promete, que no se han quedado en el mínimo esfuerzo, en el empleo de un único factor. Debe demostrar todo su potencial, y es en el website donde se enseñan todas las armas de que en apariencia dispone. Por qué no olvidemos, que es en la experiencia final del propio usuario donde debe residir la funcionalidad de un negocio.

Diseño, funcionabilidad, apariencia, velocidad, calidad…y hoy por hoy la capacidad de transportarse a un entorno de red social. Mientras que millones de consumidores son ya usuarios activos de estas nuevas tecnologías, pocas empresas tienen un claro conocimiento sobre las mismas, los beneficios que generan y cómo incorporarlas en sus estrategias de marketing y comunicación. Escuchar y, sobre todo, conversar y relacionarse con los clientes a través de las nuevas tecnologías supone una transformación total de la cultura corporativa de la empresa, lo que muchos consideran como una gran odisea.

Una sensación es pasajera, una experiencia es recordada para siempre. Se debe anteponer siempre al modelo de un negocio el motivo de nuestra empresa, que no es ni más ni menos que el bienestar del usuario. Una vez satisfecho, éste se multiplica automáticamente en muchos más futuribles usuarios. Convirtamos por lo tanto nuestra website en una experiencia complementaria a la que vivirán en el hotel.

Page 4: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 4 de 28

Fecha: DD.MM.AA Edición: 1

1.1 Hotel-Spa Cinco Enebros

La Web los5enebros.com ofrece la posibilidad de consultar y contratar los servicios del Hotel-Spa Los Cinco Enebros, así como del Restaurante Lavanda, que se encuentra en las mismas instalaciones. El Hotel se encuentra situado en la provincia de Robledo de Chavela, perteneciente a la Comunidad de Madrid

La website, pese a estar en construcción, y por ello incompleta, ofrece un acceso al usuario básico, sencillo e intuitivo. Atendiendo a los precios de las habitaciones, y al tratamiento en los textos que se dan de las instalaciones, entendemos que se trata de un emplazamiento exclusivo para un cliente selecto. Es por ello, que la website no está a la altura del producto que se vende. Me explico.

La página está enteramente diseñada en HTML. Hoy día el uso de un entorno Flash es un elemento característico que im-pulsa y diferencia a las empresas punteras y con más proyección del resto de la competencia. Un buen diseño, implica una fuerte inversión. Se trata de un sub-mensaje, pero que no pasa desapercibido para una persona dispuesta a gastarse 390 euros (sin IVA) en una habitación para irse a 60 km de Madrid. Una empresa dispuesta a mostrar su verdadero potencial necesita una ventana donde el cliente, al asomarse, sienta la necesidad de atravesarla. Un diseño atrevido, moderno, y sobre todo funcional tiene el 50% del trabajo ya hecho en vista a la captación de futuros clientes.

El website simula ser un Flash, pero no lo es y se descubre bastante rápido. Se echa de menos un desplegable en la barra de menú principal que ahorre tiempo al usuario a la hora de buscar accesos directos. Las escasas diapositivas, o van muy rápi-do (tarifas) o muy despacio (jardín) Lo suyo sería poder controlarlo a nuestro gusto (y que hubiese muchas más) Estos factores los analizaremos más adelante.

NOTA: no se puede reservar online. Esto obliga al usuario a tener que realizar un paso intermedio y hablar con un terce-ro. Un servicio de estas características, no se puede permitir perder clientes que prefieren la comodidad de reservar de for-ma online en sus hogares a tener que utilizar un teléfono. Si lo que se busca es la mayor satisfacción posible de un cliente, no hay que descuidar ningún factor que intervenga entre el periodo de tiempo que ambos (cliente-hotel) intercambien jun-tos.

Page 5: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 5 de 28

Fecha: DD.MM.AA Edición: 1

1.2 Posicionamiento del negocio

A la hora de localizar la website mediante el uso de los buscadores más convencionales (Google, Bing) encontramos dos resultados bastante dispares. La página presenta serias deficiencias de construcción (estructura HTML), que penalizan se-riamente su posicionamiento en buscadores.

Por un lado si intentamos localizarlo a través de la palabra clave HOTEL, se observa en la búsqueda que por delante del resultado correcto surgen páginas a modo de foros, que se dedican a puntuar y comentar hoteles, y ya hacia el final de la página de resultados aparece la adecuada. (Este factor está corrigiéndose de manera de progresiva)

En cambio, si la palabra clave que acompaña a “cinco enebros” es RESTAURANTE, la búsqueda nos muestra en primer lugar la página correcta.

Los resultados que se muestran en primera instancia en el caso primero apuntan a la página “Tripadvisor”, donde destaca un único comentario que califica al Hotel de “Inmejorable”, y apunta que lo mejor de todo es el Spa. Por lo menos queda el consuelo de si el usuario realiza una búsqueda por vez primera vez su impresión será bastante positiva.

A la hora de realizar esta búsqueda, hemos advertido que la fama del restaurante es igual o quizás mayor que la del propio Hotel. Este factor, queda desvirtuado al prestar atención a la tarjeta del propio Hotel, donde no se hace referencia a tal hecho, y una vez dentro de la propia página web, es difícil descubrir el nombre del restaurante “Lavanda”. Al trasladarnos a la sección del restaurante, vemos como el nombre que nos muestran es “Restaurante y Terraza Lavanda”, habiendo una notable separación entre las palabras Restaurante y Terraza lavanda. Esta separación entre caracteres puede generar confu-sión.

Estos son algunos de los numerosos métodos para posicionar páginas:

• Google premia contenidos nuevos, con actualizaciones frecuentes. Sería bueno añadir un blog a la página. Podrían publicarse eventos especiales, lugares de interés por la zona, actividades o noticias sobre el hotel.

• Para posicionar una página con unas determinadas palabras clave, la página debe tener una densidad alta de éstas. En nuestro caso, si quisiésemos su posicionamiento con las palabras clave “hotel cinco enebros”, convendría in-cluir dichas palabras en la alternativa (atributo alt) de las imágenes. Por ejemplo, en la fotografía de portada de la sección “el hotel” su alternativa debería ser “hotel_cinco_enebros_hall” (es importante aparte de añadir estas keywords, mantener una descripción de la foto para preservar la accesibilidad web).

• Otra recomendación es optimizar el código fuente, pasando los test W3C de HTML y CSS.

Page 6: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 6 de 28

Fecha: DD.MM.AA Edición: 1

2 NAVEGACION WEB

2.1 Usabilidad de la página

En términos de usabilidad, la página no refleja graves problemas dado que su estructura y profundidad de contenidos es reducida, aun así sería recomendable revisar el funcionamiento y la estructura de los contenidos:

Información comercial en la página de inicio:

• La página de inicio no presenta ningún contenido visible de carácter comercial, el cual sirve al usuario para hacerse

una idea de los servicios que se le están ofreciendo y le invitar a profundizar en el contenido de la página.

• Saltos de sección en la estructura de navegación.

• Existen algunos cambios bruscos en la navegación que pueden resultar desconcertantes para el usuario. En el apar-tado de “Contacto” se ha añadido un link a “Situación” en el menú secundario que envía a otra sección de la web, este enlace está disponible ya dentro del contenido de la página por lo que no se recomienda su inclusión en el submenú. Lo mismo ocurre en el apartado “El Spa” donde se ha añadido un enlace a “tarifas” que envía a la sec-ción “El hotel” donde además no se informa sobre las tarifas del Spa.

En lo referente a los textos, podrían estar justificados, para dotar de una mayor seriedad al contenido, y cuando se hable de horarios, utilizar una demarcación de 24h para evitar posibles confusiones.

“Abierto de 1,30 de la tarde a 4,30…”

Los textos al fondo de la página, así como la letra pequeña en torno a los precios, horarios y la política de cancelación, puede que sean excesivamente pequeños. Una letra pequeña recuerda siempre a una intención de engañar.

Balanceo de contenidos. El volumen de información se encuentra desequilibrado, apartados como “Sala de reuniones” (al encontrase en construcción desconocemos si tiene entidad propia para tener una sección propia aunque se intuye que no) y “Actividades” podrían englobarse dentro del apartado “El hotel” mejorando así el balanceo de contenidos.

La página no se visualiza correctamente a 1024px de resolución. Desgraciadamente la resolución de pantalla de 1024px de ancho es aún más habitual de lo que a los diseñadores nos gustaría, por lo que no se debe obviar a aquellos usuarios que aún la utilizan ya que se genera un incómodo Scroll horizontal que además de resultar antiestético penaliza seriamente la usabilidad de la misma.

Menú lateral. No es necesario el título del menú lateral, ya que ya aparece en el menú superior marcado de otro color (Restaurante, habitaciones…etc.)

Se necesita un apoyo visual (ej. Cambio de color), para remarcar que es un botón, y que cuando pasemos el ratón por encima sepamos que es un menú que podemos pulsar.

Footer. Repite elementos que ya se encuentran en el menú superior, por lo que no son necesarios. Se le podría añadir la dirección y el teléfono del hotel, para tenerlo a la vista y poder emplearlo en cualquier momento.

Ejemplo de menú desplegable

Page 7: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 7 de 28

Fecha: DD.MM.AA Edición: 1

Las Habitaciones, sección. Fichas de las habitaciones. En una ficha con diferentes tipos de información, se debe jerarquizar con distintos colores, tamaños y según la posición los elementos que queramos destacar más. Por ejemplo, no tiene la misma relevancia “ Precio por habitación por noche” que “Cama supletoria”, y esto debe reflejarse de algún modo. Para mostrar algunos elementos puede sernos útil algún icono.

La agrupación de contenidos está bien repartida. No se observa la sobrein-formación. La información que se da es la necesaria y la esperada por el usuario común, aunque el mapa que sitúa el Hotel podría ser notablemente mejor y mucho más aclarativo (no estaría de más un Cómo llegar, carrete-ras…etc.) La redacción es buena, quizás lo más destacable del website. No entorpece la visita, son textos que se leen rápido, informan y para nada aburren o hacen perder interés al visitante.

El diseño nos permite en todo momento saber dónde nos encontramos, sin perder de vista nuestro fin (informarnos y consultar) Las ayudas al usuario son las necesarias, y siempre se nos recuerda que para cualquier duda o cuestión se acuda al link de contacto.

La velocidad de carga de la página oscila entre 1 y 2,4 segundos, con un tiempo de carga total de 1,9 segundos. Testado aquí.

Ejemplos de funcionalidades que aportarían valor añadido a la página

Integrar una galería única de imágenes daría la posibilidad al usuario de tener una visión global del hotel sin necesidad de navegar a través de toda la página. Dicha galería debería estar agrupada por categorías (Restaurante, Sala de reuniones, habitaciones, etc.). Independientemente cada sección de la página donde se requiera (por ejemplo las fichas de las habita-ciones) podrían incorporar una galería especifica de dicha sección replicada de la galería general.

Cada vez más hoteles disponen de una galería 360º mediante la que podemos hacer un recorrido virtual por diferentes habitaciones y salas del hotel.

Ejemplos de fichas

Page 8: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 8 de 28

Fecha: DD.MM.AA Edición: 1

Redes sociales. • La integración de la web con las diferentes redes sociales (ejemplo: Facebook) en las que el hotel esta presente y la

actualización periódica de las publicaciones en las mismas favorecería el número de accesos y el retorno de usua-rios.

Mapa de navegación.

• Ayuda a los visitantes y a los buscadores a hallar las páginas de un sitio web tener un ma-pa completo de navegación, con un listado de las páginas y enlaces de una web, organi-zados de forma jerárquica.

• Adecuación terminal móvil.

• Adaptar la web a otros formatos permite ampliar su alcance. Cada vez son más las perso-nas que se conectan a internet mediante su teléfono móvil, y por tanto poder visualizar la página permitiría hacer reservas desde cualquier lugar.

Opinión de viajeros

• Al hacer reservas por internet, para el usuario es importante conocer las opiniones de otros huéspedes. Es aconse-jable crear una sección de opiniones de viajeros, donde puedan valorar su estancia y hacer comentarios. Estas opi-niones pueden ser categorizadas según el tipo de cliente, procedencia y motivo de su viaje, así como por los dife-rentes servicios que ofrece el hotel. Y que no ocurra como en este caso, al que accedemos a un comentario favo-rable de forma no deseada al haber sido fruto de un resultado no exitoso.

Mapa de Navegación

Page 9: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 9 de 28

Fecha: DD.MM.AA Edición: 1

2.2 Diseño Website

El diseño es agradable, e invita al usuario a quedarse un momento para curiosear, arma de gran ayuda para lograr captar al usuario y que este preste una mayor atención a los contenidos. Lamentablemente, pese a este “acierto” es en los contenidos y en poco acertado uso de la gama cromática donde el usuario puede mostrarse reacio a continuar su visita, al no haber sabido unir ambos elementos formando un único bloque de cohesión que mantenga el equilibrio que todo website necesi-ta. Los colores utilizados son suaves, y la mezcla de las tonalidades verde y marrón recalca el hecho de que el hotel se en-cuentra apartado de la ciudad, en un emplazamiento más silvestre. En líneas generales tanto el diseño como la elección de las tonalidades podría haber sido más acertado.

Logotipo y estilo

Sería necesaria una coherencia en el estilo en general, ya que el logotipo corresponde a una imagen de hotel más moderno y minimalista mientras que la web se basa en un concepto más tradicional, con letras más adornadas. También la decoración del hotel es más clásica y ornamental.

La Tipografía

La tipografía utilizada es “Adobe Jenson Regular” con un tamaño 12 para la barra princi-pal del website. En el caso de la carta del restaurante, la tipografía varia pero no se ha podido identificar. Para los textos informativos, la tipografía usada es la “Amor Sans Text”. El tamaño varía como ya he resaltado en la “letra pequeña” que advierte sobre las cancelaciones, etc. Como se aprecia, se ha desechado la idea de utilizar una única tipo-grafía que haga posible un mayor identificación con el nombre, que se vale de una tipo-grafía sencilla y de líneas modernas, menos recargadas que las empleadas en el resto de la página, y en especial para las cartas del Restaurante. El sombreado es un recurso que si se utiliza en exceso o de manera inadecuada puede ensuciar el aspecto de la página en lugar de enriquecerlo, además de ser una tendencia en desuso, lo que da a la página un aspecto anticuado (no confundir antiguo con clásico o elegante), es mejor un estilo sencillo empleando colores que creen contraste.

Los literales del menú principal poco legibles. La utilización del recurso de eliminar la separación entre palabras y separarlas visualmente mediante capitulares no es recomendable en la navegación ya que los enlaces deben ser claramente legibles.

Nota: el nombre de las fuentes así como de los tamaños empleados pueden variar en nombre o dimensiones, lo que no implica que sean diferentes

Page 10: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 10 de 28

Fecha: DD.MM.AA Edición: 1

La Fotografía

Las fotos son correctas, en la línea del website, pero debemos destacar una cosa por encima de todo. En ningún menú se muestra una sola fotografía del Hotel en sí, es decir, el usuario no puede saber si el exterior del hotel es un palacete, un castillo, o un cobertizo. El problema reside en que no se mantiene una unidad visual. Las fotografías deben ser coherentes con un mismo estilo, en sus dimensiones como en su estilo (sombreado, reflejo…) Al igual que ocurre en el texto, no es conveniente abusar de los sombreados. Las fotografías de los interiores, dan una sensación algo claustrofóbica, están to-madas de forma que cumplan su función informativa, sin dar la impresión de querer transmitir nada. La iluminación y los encuadres son adecuados. Se nota en falta un toque “humano”, es decir, gente disfrutando de las instalaciones o del propio hotel. Este elemento sí que se puede observar en las webs de la competencia.

Los Gráficos

En cuanto a los gráficos, lo ya mencionado. Escasos y el mapa para determinar la localización del Hotel así como para llegar a él es notablemente mejorable.

Espacios en blanco. Para que la información sea más clara y fácil de digerir hay que evitar el ruido. Muchas veces es nece-sario dar aire y meter más cantidad de espacios en blanco.

En el ejemplo de abajo, el texto sería más legible si le diésemos un doble espaciado.

Page 11: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 11 de 28

Fecha: DD.MM.AA Edición: 1

Disposición de los elementos

Los recuadros y elemento no alineados, dan al ojo una sensación de desorden. Por ello es importante la colocación de todos los elementos en relación con los que les rodean, tanto imágenes como texto en todas las secciones de la web.

La separación de los títulos de las secciones en dos zonas diferen-tes (menú lateral y zona central) dificulta su lectura continuada.

Uso de estándares HTML

El uso de estándares a la hora de maquetar el contenido favorece no solo la accesibilidad de la página (visualización correc-ta en todo tipo de dispositivos y acceso a personas con discapacidades físicas o cognitivas) sino también un mejor posicio-namiento orgánico en buscadores (SEO). Actualmente la página está maquetada utilizando tablas, método totalmente des-aconsejado por la W3C (World Wide Web Consortium) que evita que los contenidos tengan una estructura formal lógica evitando así su correcta indexación por parte de los buscadores, penalizando así un correcto posicionamiento.

Favicon

Como vemos en la pestaña del navegador, el Favicon tiene un fondo blanco que no resulta nada atractivo, ya que no forma parte del logotipo. Para poder solucionar este problema de forma sencilla con un fondo transparente, adjunto el siguiente enlace a un tutorial.

http://www.xeduced.com/2008/12/24/como-crear-un-favicon-con-transparencia/

Page 12: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 12 de 28

Fecha: DD.MM.AA Edición: 1

2.3 Recomendaciones

� Colores y texturas

La sensación general es que los colores elegidos no armonizan provocando un exceso de contraste figura-fondo, la textura elegida para los fondos de cabecera y pie ensucia más de lo que aporta. El color ocre empleado da un aspecto antiguo poco cuidado y poco acorde con el estilo elegante del hotel.

Se deben evitar los degradados muy pronunciados y las sombras muy marcadas ya que dificultan la lectura de el texto.

� Ejemplos

Esta es una propuesta de paleta de colores. Con colores característicos de la madera del enebro, así como de su hoja y su fruto en distintas tonalidades que incluso se podrían combinar con tonos amarillos para crear contraste.

DISEÑO ACTUAL

EJEMPLO

EJEMPLO

EJEMPLO

EJEMPLO

Page 13: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 13 de 28

Fecha: DD.MM.AA Edición: 1

3 COMPARATIVA DEL SECTOR

3.1 La Competencia

Hemos acudido a realizar una comparativa con distintas webs de hoteles que posean Spa dentro de su oferta, que se en-cuentren primero en la comunidad de Madrid, y en segundo lugar en el resto de España.

Antes de empezar, lo primero que resalta nada más entrar en las otras webs del sector, es la posibilidad de acceder al con-tenido íntegro en otro idioma, mayoritariamente el inglés, y en segundo lugar alemán o francés.

Senator España SPA, Madrid. Se trata de una página en apariencia bastante similar, que ofrece un website que simula estar construido en un entorno flash, pero que rápidamente se descubre que no es así. La diferencia reside en que ofrece la posi-bilidad de consultar un amplio álbum de fotos, que en este caso si está construido con flash.

Posee un canal RSS para estar al tanto de las ofertas. En el interior del hotel se encuentra un Teatro, “La Chocita del loro” La mayor diferencia sin duda alguna es la posibilidad de reservar de forma online, lo que evita la actuación de intermedia-rios, ya sean del propio Hotel o de agencias externas.

Page 14: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 14 de 28

Fecha: DD.MM.AA Edición: 1

Las Caldas Villa Termal, Asturias. Pagina enteramente construida en Flash, con un diseño y presentación enormemente atractivos. Sin duda la mejor de las tres, en el propio menú principal puedes consultar la disponibilidad de sus habitaciones, mientras ves un video promocional de sus instalaciones.

Otros diseños capaces de transmitir elegancia y seriedad que venden

Grand Hotel Central www.icprague.com

Page 15: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 15 de 28

Fecha: DD.MM.AA Edición: 1

3.2 Análisis Subjetivo

En líneas generales, podemos destacar que la sensación final tras la visita que realizamos a la página web, se define perfec-tamente con una palabra: ambigüedad. Y al final siempre, ante lo ambiguo, los clientes tenderán a acudir hacia lo seguro.

Nos encontramos ante un servicio que se anuncia como lujoso, pero cuya web y tratamientos no están a la altura. Se deno-ta un trabajo en la web al borde del suficiente. Parece un trabajo bien llevado a cabo, pero que dista mucho de poder com-pararse al servicio que se ofrece, mayor aun con los precios que requieren. Estamos hablando de habitaciones con un pre-cio (en el caso de las suites) muy superior al ofertado por el Hotel Ritz de Madrid, cuyas habitaciones Classic parten de un precio inicial de 345 euros. A donde quiero ir a parar, es que tras visitar la Website, no terminamos con la sensación de haber visto el hotel de nuestros sueños, y ni mucho menos aquel en que pasar nuestras escasas vacaciones y gastar todos nuestros ahorros.

Obviamente, este análisis no puede ser en ningún caso definitivo o resolutorio al no estar la página enteramente terminada. El Spa es siempre el gran aliciente de un Hotel, y su presentación está aún en construcción, así como la sala de reuniones. No hay que olvidar las actividades complementarias que se pueden realizar, a las cuales parece que el Hotel no desea pres-tarles gran atención, como son el golf, la pesca o el senderismo entre otras. Se limitan a hacer un breve descripción de una o dos líneas, sin acompañarlas con fotografías o emplazamientos.

Es en los detalles donde se logra la brillantez de un producto, una meta o cualquier cosa que nos propongamos. Mucho nos tememos que hemos sido incapaces de encontrar nada que emita algo de brilantez. Estas y otras “dejadeces” son las que convierten a este Hotel-Spa con pretensiones de Grand Class en poco más que una casa rural alejado de la urbe. Queda mucho trabajo que hacer (eso es apreciable) lo que no quita que la línea que se ha decidido seguir sea la conveniente, de la mano eso sí de una empresa líder y afianzada capaz de orientar correctamente cada nuevo paso que se decida dar.

Page 16: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 16 de 28

Fecha: DD.MM.AA Edición: 1

4 ANÁLISIS TAW

El sistema TAW analiza la página web, y genera un informe basado en el entorno analizado con información sobre el resultado del proceso de búsqueda de problemas. El proceso resultante del formulario es el documento resumen, que muestra el total de los problemas (son necesarias las correcciones), las advertencias (deben revisarse manual-mente) y los puntos no verificados (que requieren un análisis manual completo) y los organiza por cada principio (Perceptible, Operable, Comprensible y Robusto).

El objetivo de esta prueba es comprobar el nivel de accesibilidad alcanzado en el diseño y desarrollo de páginas web con el fin de permitir el acceso a todas las personas independientemente de sus características diferenciadoras.

Entendemos por accesibilidad el acceso a la información contenida en los sitios web sin limitación alguna por razón de deficiencia, minusvalía o tecnología utilizada. Cada vez en las páginas web, se mira más el nivel de accesibi-lidad alcanzado en el diseño y desarrollo con el fin de permitir el acceso a todas las personas.

Según el Test de Accesibilidad Web (TAW) este sitio web no supera el nivel básico de accesibilidad (A). Lo óptimo para una página web es que supere al menos el nivel AA. Para ello debemos comprobar sus errores y corregirlos. En el siguiente enlace simplemente con introducir la URL de la página web que se quiere analizar se muestran los pro-blemas encontrados categorizados según su prioridad.

http://www.tawdis.net/

4.1 TAW 1.0

La página analizada se muestra insertando iconos de alerta sobre los problemas de accesibilidad encontrados.

Estos problemas son los denominados automáticos, aquellos en los que la herramienta tiene la certeza de que in-cumplen las pautas (por ejemplo, una imagen sin texto alternativo).

Se muestran los problemas de accesibilidad encontrados, organizados por prioridad, indicando:

• Código del punto de verificación. • Descripción del problema. • Número de línea de la página analizada. • Etiqueta HTML que genera el problema de accesibilidad.

Una vez finalizada la descripción de problemas encontrados se resumen:

• Tiempo de análisis.. • Total de problemas encontrados en la página. • Si se realizó un análisis con anterioridad de la página y desde el mismo equipo en el que se está realizando

ahora, el resultado del anterior.

Un desarrollador de contenidos de páginas Web tiene que satisfacer este punto de verificación. De otra forma, uno o más grupos de usuarios encontrarán imposible acceder a la información del documento. Satisfaciendo este

punto de verificación es un requerimiento básico para que algunos grupos puedan usar estos documentos Web.

Page 17: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 17 de 28

Fecha: DD.MM.AA Edición: 1

Se han encontrado 6 problemas de tipo automático y 80 problemas que requieren revisión manual.

Asegúrese de que las páginas sigan siendo utilizables cuando se desconecten o no se soporten los scripts, applets u otros objetos programados. Si esto no es posible, proporcione información equivalente en una página alternativa accesible.

• Compruebe que los contenidos dinámicos son accesibles o proporcione una alternativa. (6) o Línea 325: <script type="text/javascript" src="/media/system/js/mootools.js"> o Línea 326: <script type="text/javascript" src="/media/system/js/caption.js"> o Línea 327: <script type="text/javascript" src="http://loscincoenebros.com/modules/mod_djimageslider/js/slider.js"> o Línea 328: <script type="text/javascript"> o Línea 340: <script type="text/javascript"> o Línea 678: <script type="text/javascript">

• No existe el elemento "noscript" con contenido alternativo para "scripts". Compruebe si es necesario para no perder funcionalidad o información. (6)

o Línea 325: <script type="text/javascript" src="/media/system/js/mootools.js"> o Línea 326: <script type="text/javascript" src="/media/system/js/caption.js"> o Línea 327: <script type="text/javascript" src="http://loscincoenebros.com/modules/mod_djimageslider/js/slider.js"> o Línea 328: <script type="text/javascript"> o Línea 340: <script type="text/javascript"> o Línea 678: <script type="text/javascript">

• Los siguiente enlaces no son funcionales sin tener javascript habilitado. (6) o Línea 479: <a href="javascript:void(0)" id="prev53" class="prev-button"> o Línea 480: <a href="javascript:void(0)" id="next53" class="next-button"> o Línea 572: <a href="javascript:void(0)" id="prev54" class="prev-button"> o Línea 573: <a href="javascript:void(0)" id="next54" class="next-button"> o Línea 627: <a href="javascript:void(0)" id="prev63" class="prev-button">

1. Proporcione un texto equivalente para todo elemento no textual (Por ejemplo, a través de "alt", "long-desc" o en el contenido del elemento). Esto incluye: imágenes, representaciones gráficas del texto, mapas de imagen, animaciones (Por ejemplo, GIFs animados), "applets" y objetos programados, "ASCII art", marcos, scripts, imágenes usadas como viñetas en las listas, espaciadores, botones gráficos, sonidos (eje-cutados con o sin interacción del usuario), archivos exclusivamente auditivos, banda sonora del vídeo y vídeos.

• Compruebe que los textos alternativos proporcionados son adecuados. • Si la imagen contiene información importante, utilice el atributo longdesc para enlazarla a un archivo html

que contenga su descripción. (23) • o Línea 376: <img src="/templates/los5enebrosP/images/logo1.png" alt="logotipo" align="left" /> o Línea 380: <img src="/templates/los5enebrosP/images/titulo1.png" alt="logotipo" align="left" /> o Línea 421: <img src="/images/stories/los5enebros/portada/hotel/hotel02.jpg" alt="Hotel 2" /> o Línea 440: <img src="/images/stories/los5enebros/portada/hotel/hotel05.jpg" alt="Hotel 4" /> o Línea 459: <img src="/images/stories/los5enebros/portada/hotel/hotel06.jpg" alt="Hotel 5" /> o Línea 479: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/up.png" alt="Previous" /> o Línea 480: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/down.png" alt="Próximo" /> o Línea 481: <img id="play53" class="play-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/play.png" alt="Play" /> o Línea 482: <img id="pause53" class="pause-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/pause.png" alt="Pause" /> o Línea 495: <img src="/images/stories/los5enebros/portada/restaurante/rest01.jpg" alt="Restaurante 1" /> o Línea 514: <img src="/images/stories/los5enebros/portada/restaurante/rest02.jpg" alt="Restaurante 2" /> o Línea 533: <img src="/images/stories/los5enebros/portada/restaurante/rest03.jpg" alt="Restaurante 3" /> o Línea 552: <img src="/images/stories/los5enebros/portada/restaurante/rest04.jpg" alt="Restaurante 4" /> o Línea 572: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/up.png" alt="Previous" /> o Línea 573: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/down.png" alt="Próximo" /> o Línea 574: <img id="play54" class="play-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/play.png" alt="Play" />

Page 18: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 18 de 28

Fecha: DD.MM.AA Edición: 1

o Línea 575: <img id="pause54" class="pause-button" src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/pause.png" alt="Pause" />

o Línea 588: <img src="/images/stories/los5enebros/portada/habitaciones/habit06.jpg" alt="Habitaciones inicial 1" /> o Línea 607: <img src="/images/stories/los5enebros/portada/habitaciones/habit07.jpg" alt="Habitaciones inicial 2" /> o Línea 627: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/up.png" alt="Previous" /> o Línea 628: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/down.png" alt="Próximo" /> o Línea 629: <img id="play63" class="play-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/play.png" alt="Play" /> o Línea 630: <img id="pause63" class="pause-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/pause.png" alt="Pause" />

2. Asegúrese de que toda la información transmitida a través de los colores también esté disponible sin color, por ejemplo mediante el contexto o por marcadores.

• Compruébelo en toda la página

3. Identifique claramente los cambios en el idioma del texto del documento y en cualquier texto equivalen-te (por ejemplo, leyendas).

• Compruébelo en toda la página

4. En las tablas de datos, identifique los encabezamientos de fila y columna.

• Esta tabla no contiene encabezados. Si es una tabla de datos son necesarios. (4) o Línea 367: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 386: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 408: <table class="contentpaneopen"> o Línea 725: <table width="100%" border="0" cellpadding="0" cellspacing="1">

5. Para las tablas de datos que tienen dos o más niveles lógicos de encabezamientos de fila o columna, utilice marcadores para asociar las celdas de encabezamiento y las celdas de datos.

• Compruebe que de entre las siguientes tablas, en aquellas que sean de datos y tengan varios niveles lógicos de encabezado, estén marcados todos los encabezados. (4)

• o Línea 367: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 386: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 408: <table class="contentpaneopen"> o Línea 725: <table width="100%" border="0" cellpadding="0" cellspacing="1">

6. Organice el documento de forma que pueda ser leído sin hoja de estilo. Por ejemplo, cuando un docu-mento HTML es interpretado sin asociarlo a una hoja de estilo, tiene que ser posible leerlo.

• Asegúrese de que este documento puede ser leído sin necesidad de utilizar hojas de estilo. (19) o Línea 37: <link rel="stylesheet" href="http://loscincoenebros.com/modules/mod_djimageslider/tmpl/style.css"

type="text/css" /> o Línea 38: <style type="text/css"> o ínea 334: <link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" /> o Línea 335: <link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" /> o Línea 336: <link rel="stylesheet" href="/templates/los5enebrosP/css/style.css" type="text/css" /> o Línea 431: <div style="clear: both"> o Línea 450: <div style="clear: both"> o Línea 469: <div style="clear: both"> o Línea 487: <div style="clear: both"> o Línea 505: <div style="clear: both"> o Línea 524: <div style="clear: both"> o Línea 543: <div style="clear: both"> o Línea 562: <div style="clear: both">

Page 19: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 19 de 28

Fecha: DD.MM.AA Edición: 1

o Línea 580: <div style="clear: both"> o Línea 598: <div style="clear: both"> o Línea 617: <div style="clear: both"> o Línea 635: <div style="clear: both"> o Línea 661: <span style="color: rgb(51, 102, 255);"> o Línea 661: <span style="font-size: small;">

6.1 Asegúrese de que los equivalentes de un contenido dinámico son actualizados cuando cambia el con-tenido dinámico.

• Este elemento podría estar generando contenido dinámico. (6) o Línea 325: <script type="text/javascript" src="/media/system/js/mootools.js"> o Línea 326: <script type="text/javascript" src="/media/system/js/caption.js"> o Línea 327: <script type="text/javascript" src="http://loscincoenebros.com/modules/mod_djimageslider/js/slider.js"> o Línea 328: <script type="text/javascript"> o Línea 340: <script type="text/javascript"> o Línea 678: <script type="text/javascript">

7. Hasta que las aplicaciones de usuario permitan controlarlo, evite provocar destellos en la pantalla.

• Compruébelo en toda la página

8.a Si la funcionalidad es importante y no se presenta en otro lugar, haga los elementos de programación, tales como scripts y applets, directamente accesibles o compatibles con las ayudas técnicas.

• Este elemento puede no ser accesible para todos los usuarios. Asegúrese de que existe una interfaz accesible para este objeto. (6)

o Línea 325: <script type="text/javascript" src="/media/system/js/mootools.js"> o Línea 326: <script type="text/javascript" src="/media/system/js/caption.js"> o Línea 327: <script type="text/javascript" src="http://loscincoenebros.com/modules/mod_djimageslider/js/slider.js"> o Línea 328: <script type="text/javascript"> o Línea 340: <script type="text/javascript"> o Línea 678: <script type="text/javascript">

9.4 Si, después de los mayores esfuerzos, no puede crear una página accesible, proporcione un vínculo a una página alternativa que use tecnologías W3C, sea accesible, tenga información (o funcionalidad) equi-valente y sea actualizada tan a menudo como la página (original) inaccesible.

• Compruébelo en toda la página

10. Utilice el lenguaje apropiado más claro y simple para el contenido de un sitio.

• Compruébelo en toda la página

Page 20: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 20 de 28

Fecha: DD.MM.AA Edición: 1

Page 21: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 21 de 28

Fecha: DD.MM.AA Edición: 1

4.2 TAW 2.0

Detalle: Donde, agrupados por cada uno de los principios básicos, se indican las comprobaciones atómicas realiza-das mostrando las líneas de código donde se detectan incidencias. A nivel informativo se muestran las técnicas rela-cionadas con cada una de las comprobaciones.

Listado: Es un resumen, agrupado por cada uno de los principios básicos, en formato de tabla que indica, a nivel de normativa, el resultado obtenido en las comprobaciones a nivel de pauta.

Se han encontrado 6 problemas de tipo automático y 67 problemas que requieren revisión manual.

1. Evite características desaconsejadas por las tecnologías W3C.

• Este elemento HTML utiliza atributos desaconsejados en HTML 4.01. (6) o Línea 367: <td nowrap="nowrap"> o Línea 376: <img src="/templates/los5enebrosP/images/logo1.png" alt="logotipo" align="left" /> o Línea 380: <img src="/templates/los5enebrosP/images/titulo1.png" alt="logotipo" align="left" /> o Línea 386: <td nowrap="nowrap"> o Línea 725: <td nowrap="nowrap"> o Línea 729: <div align="center">

2. Asegúrese de que los colores de fondo y primer plano en imágenes tengan suficiente contraste para que sean percibidas por personas con deficiencias de percepción de color o en pantallas en blanco y negro.

• Compruebe si existe visibilidad inadecuada entre el color del texto y de fondo de la imagen. (23) o Línea 376: <img src="/templates/los5enebrosP/images/logo1.png" alt="logotipo" align="left" /> o Línea 380: <img src="/templates/los5enebrosP/images/titulo1.png" alt="logotipo" align="left" /> o Línea 421: <img src="/images/stories/los5enebros/portada/hotel/hotel02.jpg" alt="Hotel 2" /> o Línea 440: <img src="/images/stories/los5enebros/portada/hotel/hotel05.jpg" alt="Hotel 4" /> o Línea 459: <img src="/images/stories/los5enebros/portada/hotel/hotel06.jpg" alt="Hotel 5" /> o Línea 479: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/up.png" alt="Previous" /> o Línea 480: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/down.png" alt="Próximo" /> o Línea 481: <img id="play53" class="play-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/play.png" alt="Play" /> o Línea 482: <img id="pause53" class="pause-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/pause.png" alt="Pause" /> o Línea 495: <img src="/images/stories/los5enebros/portada/restaurante/rest01.jpg" alt="Restaurante 1" /> o Línea 514: <img src="/images/stories/los5enebros/portada/restaurante/rest02.jpg" alt="Restaurante 2" /> o Línea 533: <img src="/images/stories/los5enebros/portada/restaurante/rest03.jpg" alt="Restaurante 3" /> o Línea 552: <img src="/images/stories/los5enebros/portada/restaurante/rest04.jpg" alt="Restaurante 4" /> o Línea 572: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/up.png" alt="Previous" /> o Línea 573: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/down.png" alt="Próximo" /> o Línea 574: <img id="play54" class="play-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/play.png" alt="Play" /> o Línea 575: <img id="pause54" class="pause-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/pause.png" alt="Pause" /> o Línea 588: <img src="/images/stories/los5enebros/portada/habitaciones/habit06.jpg" alt="Habitaciones inicial 1" /> o Línea 607: <img src="/images/stories/los5enebros/portada/habitaciones/habit07.jpg" alt="Habitaciones inicial 2" /> o Línea 627: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/up.png" alt="Previous" /> o Línea 628: <img src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/down.png" alt="Próximo" /> o Línea 629: <img id="play63" class="play-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/play.png" alt="Play" /> o Línea 630: <img id="pause63" class="pause-button"

src="http://loscincoenebros.com//modules/mod_djimageslider/tmpl/pause.png" alt="Pause" />

3. Cuando exista un marcador apropiado, use marcadores en vez de imágenes para transmitir la informa-ción.

Page 22: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 22 de 28

Fecha: DD.MM.AA Edición: 1

• Cuando exista un lenguaje de etiquetado adecuado, utilice etiquetas en lugar de imágenes para mostrar in-formación.

3.2 Cree documentos que estén validados por las gramáticas formales publicadas.

• Compruebe que la gramáticas del documento (HTML-XHTML, CSS) son válidas.

3.1 Utilice hojas de estilo para controlar la maquetación y la presentación.

• Convierta los elementos de presentación a hojas de estilo (Por ejemplo, los elementos "FONT"). (3) o Línea 367: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 386: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 725: <table width="100%" border="0" cellpadding="0" cellspacing="1">

3.2 Utilice unidades relativas en lugar de absolutas al especificar los valores en los atributos de los marca-dores de lenguaje y en los valores de las propiedades de las hojas de estilo.

• Compruebe que no se utilizan medidas absolutas en las hojas de estilo. (5) o Línea 37: <link rel="stylesheet" href="http://loscincoenebros.com/modules/mod_djimageslider/tmpl/style.css"

type="text/css" /> o Línea 38: <style type="text/css"> o Línea 334: <link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" /> o Línea 335: <link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" /> o Línea 336: <link rel="stylesheet" href="/templates/los5enebrosP/css/style.css" type="text/css" />

3.3 Utilice elementos de encabezamiento para transmitir la estructura lógica y utilícelos de acuerdo con la especificación.

• Compruebe que todos los encabezados están marcados (elementos "h1"-"h6").

3.4 Marque correctamente las listas y los ítem de las listas.

• Compruebe que todas las listas están marcadas (elementos "ul","ol","dl").

3.5 Marque las citas. No utilice el marcador de citas para efectos de formato tales como sangrías.

• Compruebe que ha marcado todas las citas correctamente (elementos "q","blockquote").

4. No utilice tablas para maquetar, a menos que la tabla tenga sentido cuando se lea línea a línea. Por otro lado, si la tabla no tiene sentido, proporcione una alternativa equivalente (la cual debe ser una versión ali-neada).

• Si son tablas utilizadas para dar formato deben tener sentido cuando se lean línea a línea. (4) o Línea 367: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 386: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 408: <table class="contentpaneopen"> o Línea 725: <table width="100%" border="0" cellpadding="0" cellspacing="1">

4.1 Para los scripts y applets, asegúrese de que los manejadores de evento sean entradas independientes del dispositivo.

• Para scripts y applets, asegúrese de que los manejadores de evento sean independientes del dispositivo. (6) o Línea 325: <script type="text/javascript" src="/media/system/js/mootools.js"> o Línea 326: <script type="text/javascript" src="/media/system/js/caption.js">

Page 23: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 23 de 28

Fecha: DD.MM.AA Edición: 1

o Línea 327: <script type="text/javascript" src="http://loscincoenebros.com/modules/mod_djimageslider/js/slider.js"> o Línea 328: <script type="text/javascript"> o Línea 340: <script type="text/javascript"> o Línea 678: <script type="text/javascript">

5. Hasta que las aplicaciones de usuario permitan controlarlo, evite el parpadeo del contenido (por ejem-plo, cambio de presentación en periodos regulares, así como el encendido y apagado).

• Compruebe que no existe parpadeo de contenido en la página.

6. Hasta que las aplicaciones de usuario permitan congelar el movimiento de los contenidos, evite los mo-vimientos en las páginas.

• Compruebe que no se existe movimiento en el contenido de la página o que existe un mecanismo que per-mita al usuario desactivarlo.

7. Haga los elementos de programación, tales como scripts y applets, directamente accesibles o compati-bles con las ayudas técnicas.

• Este elemento puede no ser accesible para todos los usuarios. Asegúrese de que existe una interfaz accesible para este objeto. (6)

o Línea 325: <script type="text/javascript" src="/media/system/js/mootools.js"> o Línea 326: <script type="text/javascript" src="/media/system/js/caption.js"> o Línea 327: <script type="text/javascript" src="http://loscincoenebros.com/modules/mod_djimageslider/js/slider.js"> o Línea 328: <script type="text/javascript"> o Línea 340: <script type="text/javascript"> o Línea 678: <script type="text/javascript">

8. Hasta que las aplicaciones de usuario permitan desconectar la apertura de nuevas ventanas, no provo-que apariciones repentinas de nuevas ventanas y no cambie la ventana actual sin informar al usuario.

• Este enlace abrirá una nueva ventana que puede desorientar a algunos usuarios. Compruebe que se ha in-formado al usuario. (6)

o Línea 651: <a target="_blank" href="http://www.dondecomer.org/restaurante.php?id=441"> o Línea 652: <a target="_blank" href="http://robledodechavela.olx.es/hotel-y-spa-los-cinco-enebros-iid-114506010"> o Línea 655: <a target="_blank" href="http://www.dmoz.org/"> o Línea 657: <a target="_blank" href="http://directorio.compartimos.net/"> o Línea 657: <a target="_blank" href="http://www.portal-seo.com/"> o Línea 661: <a target="_blank"

href="http://www.facebook.com/photo.php?id=132070850170582&amp;pid=181501#!/pages/Hotel-Los-Cinco-Enebros/132070850170582?v=wall">

9. Utilice las tecnologías W3C cuando estén disponibles y sean apropiadas para la tarea, y use las últimas versiones que sean soportadas.

• Compruébelo en toda la página

10. Identifique claramente el objetivo de cada vínculo.

• Asegúrese que cada enlace identifica claramente su objetivo. • Estos enlaces comparten el mismo texto pero están vinculados a recursos diferentes. (2)

o Línea 386: <a href="/index.php/inicio.html" class="mainlevel-nav" id="active_menu-nav">Inicio</a> o Línea 725: <a href="/" class="mainlevel-pie" >Inicio</a>

11. Proporcione metadatos para añadir información semántica a las páginas y sitios.

Page 24: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 24 de 28

Fecha: DD.MM.AA Edición: 1

• Compruébelo en toda la página

11.1 Proporcione información sobre la maquetación general de un sitio (por ejemplo, mapa del sitio o tabla de contenidos).

• Compruébelo en toda la página

Page 25: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 25 de 28

Fecha: DD.MM.AA Edición: 1

4.3 TAW 3.0

La aplicación permite analizar páginas individuales o sitios web completos. Se introduce una dirección URL que será la dirección inicial para realizar el análisis y se configura el ámbito del análisis y los puntos de verificación a compro-bar.

• Ámbito del análisis: se indican los parámetros de exploración consistentes en tipología de enlaces (seguir enlaces dentro de un directorio o un dominio, seguir todos los enlaces o no seguir ninguno), niveles a anali-zar y número máximo de páginas.

• Configuración de pautas: permite seleccionar qué puntos de verificación serán comprobados al realizar el análisis de las páginas. Se puede escoger un conjunto predefinido de puntos de verificación según los niveles de accesibilidad o crear un conjunto personalizado. También se permite la creación de comprobaciones per-sonalizadas introduciendo una expresión regular o utilizando un asistente.

En el resultado del análisis se muestra:

• Número de problemas encontrados durante el análisis para cada una de las páginas. • Detalle de los problemas detectados en cada página.

Se han encontrado 4 problemas de tipo automático y 42 problemas que requieren revisión manual.

1. Proporcione resúmenes de las tablas.

• La tabla no tiene resumen (atributo "summary") (4) o Línea 367: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 386: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 408: <table class="contentpaneopen"> o Línea 725: <table width="100%" border="0" cellpadding="0" cellspacing="1">

• Esta tabla no tiene un título (elemento "caption" o atributo "title") . (4) • o Línea 367: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 386: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 408: <table class="contentpaneopen"> o Línea 725: <table width="100%" border="0" cellpadding="0" cellspacing="1">

2. Asegúrese de que las combinaciones de los colores de fondo y primer plano del texto tengan suficiente contraste para que sean percibidas por personas con deficiencias de percepción de color o en pantallas en blanco y negro.

• Compruébelo en toda la página

3. Especifique la expansión de cada abreviatura o acrónimo cuando aparezcan por primera vez en el do-cumento.

• Indique el significado de abreviaturas y acrónimos mediante el atributo "title" la primera vez que aparezcan en un documento.

Page 26: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 26 de 28

Fecha: DD.MM.AA Edición: 1

4. Cree un orden lógico para navegar con el tabulador a través de vínculos, controles de formulario y obje-tos.

• Compruebe que el orden de tabulación a través de la página (enlaces, controles, etc) es lógico. Si es necesa-rio, modifíquelo mediante el atributo "tabindex".

5. Proporcione atajos de teclado para los vínculos más importantes (incluidos los de los mapas de imagen de cliente), los controles de formulario y los grupos de controles de formulario.

• No existen teclas de acceso rápido (atributo "accesskey") para ningún control ni enlace de este documento. Compruebe si son necesarias.

6. Hasta que las aplicaciones de usuario (incluidas las ayudas técnicas) interpreten correctamente los tex-tos contiguos, proporcione un texto lineal alternativo (en la misma página o en alguna otra) para todas las tablas que maquetan texto en paralelo, en columnas de palabras.

• Si son tablas utilizadas para dar formato deben tener sentido cuando se lean línea a línea. (4) o Línea 367: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 386: <table width="100%" border="0" cellpadding="0" cellspacing="1"> o Línea 408: <table class="contentpaneopen"> o Línea 725: <table width="100%" border="0" cellpadding="0" cellspacing="1">

7. Hasta que las aplicaciones de usuario (incluidas las ayudas técnicas) interpreten claramente los vínculos contiguos, incluya caracteres imprimibles (rodeados de espacios), que no sirvan como vínculo, entre los vínculos contiguos.

• Si estos enlaces contiguos no tienen caracteres de separación entre ellos. Incluya caracteres imprimibles (ro-deados de espacios), que no sirvan como vínculo, entre los vínculos contiguos (18)

o Línea 386: <a href="/index.php/elhotel.html" class="mainlevel-nav" > o Línea 386: <a href="/index.php/lashabitaciones.html" class="mainlevel-nav" > o Línea 386: <a href="/index.php/elrestaurante.html" class="mainlevel-nav" > o Línea 386: <a href="/index.php/elspa.html" class="mainlevel-nav" > o Línea 386: <a href="/index.php/saladereuniones.html" class="mainlevel-nav" > o Línea 386: <a href="/index.php/actividades.html" class="mainlevel-nav" > o Línea 480: <a href="javascript:void(0)" id="next53" class="next-button"> o Línea 573: <a href="javascript:void(0)" id="next54" class="next-button"> o Línea 628: <a href="javascript:void(0)" id="next63" class="next-button"> o Línea 657: <a target="_blank" href="http://www.portal-seo.com/"> o Línea 725: <a href="/index.php/elhotel.html" class="mainlevel-pie" > o Línea 725: <a href="/index.php/habitaciones.html" class="mainlevel-pie" > o Línea 725: <a href="/index.php/elrestaurante.html" class="mainlevel-pie" > o Línea 725: <a href="/index.php/spa.html" class="mainlevel-pie" > o Línea 725: <a href="/index.php/salareuniones.html" class="mainlevel-pie" > o Línea 725: <a href="/index.php/actividades.html" class="mainlevel-pie" > o Línea 725: <a href="/index.php/mapa-del-sitio.html" class="mainlevel-pie" > o Línea 725: <a href="/index.php/politica-de-cancelacion.html" class="mainlevel-pie" >

8. Proporcione la información de modo que los usuarios puedan recibir los documentos según sus prefe-rencias (por ejemplo, idioma, tipo de contenido, etc.).

• Compruébelo en toda la página

Page 27: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 27 de 28

Fecha: DD.MM.AA Edición: 1

9. Proporcione barras de navegación para destacar y dar acceso al mecanismo de navegación.

• Compruébelo en toda la página

10. Agrupe los vínculos relacionados, identifique el grupo (para las aplicaciones de usuario) y, hasta que las aplicaciones de usuario lo hagan, proporcione una manera de evitar el grupo.

• Compruébelo en toda la página

11. Localice la información destacada al principio de los encabezamientos, párrafos, listas, etc.

• Compruébelo en toda la página

12. Proporcione información sobre las colecciones de documentos (por ejemplo, los documentos que com-prendan múltiples páginas).

• Si la página forma de una colección de documentos compruebe que proporciona información sobre la co-lección.

13. Complemente el texto con presentaciones gráficas o auditivas cuando ello facilite la comprensión de la página.

• Compruébelo en toda la página

14. Cree un estilo de presentación que sea coherente en todas las páginas.

• Compruebe que la página mantiene un estilo de presentación coherente con el resto de páginas del sitio. (5) o Línea 37: <link rel="stylesheet" href="http://loscincoenebros.com/modules/mod_djimageslider/tmpl/style.css"

type="text/css" /> o Línea 38: <style type="text/css"> o Línea 334: <link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" /> o Línea 335: <link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" /> o Línea 336: <link rel="stylesheet" href="/templates/los5enebrosP/css/style.css" type="text/css" />

15. Proporcione un medio para saltar sobre un ASCII art de varias líneas.

• Compruebe que proporciona un medio para saltar sobre un gráfico basado en caracteres ASCII de varias lí-neas.

Page 28: los5enebros

Telefónica Soluciones

XX-9999999-YYY Título del Documento Página 28 de 28

Fecha: DD.MM.AA Edición: 1