Encargo 3 Análisis sitios web. Pt. 1

El encargo consistió en el análisis de 10 sitios web a partir de una pauta entregada con anteriodidad en clases y a través del blog de Taller. El criterio para la selección de los sitios se basó en: sitios de frecuente visita personal y sitios dentro del área de importancia vital (ministerios, bancos, salud, etc.).

He aquí el análisis en bruto (sólo texto y sin sintetizar):

1. GameSpot (http://www.gamespot.com/)
Descripción: Sitio web norteamericano dedicado en su totalidad a los videojuegos para todas las consolas, plataformas y géneros. Sirve de fuente noticiosa, desarrollo de análisis y revisiones de videojuegos, fechas de lanzamiento, recursos online y material multimedia.

a) Contenidos

– Coherencia del rotulado:
· Rotulados absolutamente coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y las imágenes asociadas. También es común encontrar el vínculo completo al artículo a partir de un rótulo adicional (REVIEW, READ, WATCH, FULL ARTICLE, SEE MORE).
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto se subrayan al poner el Mouse sobre ellos.

- Lógica de navegación:
· La enorme cantidad de secciones hace que cada página también tenga una enorme cantidad de links, lo que en este caso se hace necesario debido al tipo de información y su cantidad. Puede resultar abrumante y confuso, pero al mismo tiempo proporciona un acceso total a toda su info desde cualquier página y sección.
· La jerarquía de información va desde lo general hasta lo particular.
· Su navegación principalmente se hace a través de los encabezados, menús e im. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.

-Consistencia del contenido:
· Los vínculos hacia los contenidos son puntuales y precisos.
· Contenidos reales, no simplemente asociados.
· No existen links rotos ni abandonados. El sitio se actualiza cada 12 horas.
· Titulares y resúmenes relacionados directamente con el contenido.
· No posee un banco para búsqueda de títulos por lista y organizados alfabéticamente.

b) Diseño visual

- Estructura visual:
· El manejo de los espacios es notable, a pesar de la cantidad de información en pantalla.
· Existe una jerarquía de temas y secciones muy bien estructurada.
· El espaciado en los textos es adecuado para la lectura.
· Los colores, por lo general, no causan ninguna dificultad ni ruido en la lectura y visualización de la información. Puede ser que algunos colores no sean los adecuados para el concepto y contenidos que trata el sitio.
· Existe un gran contraste entre info de secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura
· Tipografía sans-serif (arial) con buena legibilidad y espacio interlínea.
· Coherencia visual entre homepage e interiores.
· Colores: Negro, gris, café-rojizo, para los fondos de párrafos el blanco.

Detalles:
· Se puede cambiar el tema (color de fondo).
· Ranking de los videojuegos del momento.


2. FontShop (http://www.fontshop.com/)
Descripción: Sitio web que parece sólo dedicarse a la venta de tipografías online. Sin embargo, también es una gran base de información para el diseño gráfico y tipográfico.

a) Contenidos

– Coherencia del rotulado:
· Rotulados coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Títulos de menús precisos y concisos.
· Existen gran cantidad de vínculos en imágenes, generalmente debido a las muestras de tipografías que se hacen en el sitio para que los vínculos sean atractivos y coherentes.
· Los vínculos de los artículos y noticias se hayan en los titulares, resúmenes e imágenes asociadas. También es común encontrar el vínculo completo al artículo y/o producto partir de un rótulo adicional (como el nombre de la tipografía, el diseñador, etc).
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Algunos vínculos de hipertexto se subrayan al poner el Mouse sobre ellos, mientras que otros cambian de color e incluso algunos títulos no muestran ningún cambio.

- Lógica de navegación:
· El sitio posee muchos menús y se encuentra muy seccionada. Carga con menús laterales (izq. y der.), superiores y extremo laterales. Puede resultar abrumante y confuso, pero al mismo tiempo proporciona un acceso total a toda su info desde cualquier página y sección.
· La jerarquía de información va desde lo general hasta lo particular. De nuevos anuncios a la venta de tipografías
· Su navegación principalmente se hace a través de los encabezados, menús e imágenes, siendo estos últimos de gran importancia ya que muchas veces simulan ser textos. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.


b) Diseño visual

- Estructura visual:
· Buen manejo de espacio a pesar de la cantidad de menús.
· Existe una jerarquía de temas y secciones bien estructurada.
· El espaciado en los textos es adecuado para la lectura.
· El cuerpo de los textos es pequeño y se resaltan en gran tamaño sólo las tipografías de muestra para su venta (imágenes).
· Los colores no causan ninguna dificultad ni ruido en la lectura y visualización de la información. El uso del amarillo como identidad visual diferencia a este sitio notablemente de los demás, tendiendo claro éxito en crear una identidad de marca.
· Existe un gran contraste entre secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura
· Tipografía sans-serif en pequeños cuerpos con buena legibilidad y espacio interlínea.
· Notable coherencia visual entre homepage e interiores.
· Colores: Amarillo,negro, gris, para los fondos de párrafos el blanco.

Detalles:
· Ranking de las tipografías más populares.


3. Falabella (http://www.falabella.com/)
Descripción: Sitio web de la tienda Falabella. Posee catálogo y compra en línea, además del manejo de cuentas por tarjeta de débito.

a) Contenidos

– Coherencia del rotulado:
· Los rotulados son coherentes con los contenidos y las imágenes. No existen vínculos rotos, abandonados o con destinos equivocados. Sin embargo, al entrar en algunas secciones estas no conservan un menú completo para acceder a otros catálogos relacionados.
· El botón Atrás del navegador con frecuencia es inútil para volver a la página anterior, teniendo que hacer dos click en éste para volver.
· Los vínculos de los artículos y secciones se hayan sólo en los títulos y los nombres de los productos.
· Los vínculos suelen ser poco precisos y están tratados de manera general llevando a otros menús utilizando demasiadas páginas de acceso.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto no presentan cambios al poner el Mouse sobre ellos.
· Mala descripción de algunos productos destacados o en catálogos, sin siquiera mostrar la marca de éstos.

- Lógica de navegación:
· La enorme cantidad de secciones hace que cada página también tenga una enorme cantidad de links, lo que en este caso se hace necesario debido al tipo de información y su cantidad. Se vuelve bastante confuso al tener 2 menús que dirigen prácticamente a los mismos departamentos.
· La jerarquía de información con frecuencia no es buena y muchos indicadores y paneles de info se repiten causando confusión.
· Su navegación principalmente se hace a través de los encabezados y menús.
· Es difícil predecir la lógica de navegación debido a la saturación de menús y títulos similares.

-Consistencia del contenido:
· La actualización de cuentas y créditos no es diaria, pero su creación y acceso es sencillo y claro.
· En el sitio no se muestran todos los productos y servicios que ofrece la tienda en su lugar físico.
· Las especificaciones de algunos productos es incompleta y confusa, se hacen falta vínculos
· Los vínculos hacia los contenidos con frecuencia no son puntuales ni precisos.
· Contenidos reales o simplemente asociados.
· No existen links rotos ni abandonados.
· Titulares y resúmenes relacionados directamente con el contenido.
· Vínculos de las imágenes algo pobres.

b) Diseño visual

- Estructura visual:
· A pesar de tener colores limpios, el ruido visual que provocan los anuncios y banner de productos destacados y ofertas, sobre tofo en el home, provoca un desorden en la información central.
· El manejo de los espacios es decente en la mayoría de las páginas, a pesar de la cantidad de información en pantalla.
· Exceso de banners que vinculan a secciones que ya están indicadas en el menú principal entorpece la navegación y causa confusión.
· Existe una jerarquía de temas y secciones que no están muy bien estructuradas. Faltan productos y variedad de información.
· El espaciado en los textos es adecuado para la lectura.
· Los colores no causan ninguna dificultad ni ruido en la lectura y visualización de la información.
· Existe contraste entre secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma tímida y sobria las separaciones entre los tópicos, secciones y paneles. Es común que algunas puedan pasar desapercibidas.
· Contraste de texto+fondo bien aplicado.
· Tipografía sans-serif (arial) de cuerpo muy pequeño.
· Coherencia visual entre homepage e interiores.
· Colores: Verde y blanco para los fondos.


4. El Mercurio Online (http://www.emol.cl/)
Descripción: Sitio web del diario El Mercurio.

a) Contenidos

– Coherencia del rotulado:
· Rotulados absolutamente coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y las imágenes asociadas. También es común encontrar el vínculo completo al artículo a partir de un rótulo adicional.
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto se subrayan y cambian de color al poner el Mouse sobre ellos.

- Lógica de navegación:
· A pesar de la gran cantidad de secciones el menú principal hace que la navegación se efectúe de manera rápida, cómoda y ordenada, gracias a su buena estructuración.
· La jerarquía de información va desde lo general hasta lo particular. Desde las noticias destacadas del día hasta noticias de menor índole.
· Su navegación principalmente se hace a través de los encabezados, menús e imágenes. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.
· El menú principal hace de conector entre todas las secciones y páginas del sitio.

-Consistencia del contenido:
· Los vínculos hacia los contenidos son puntuales y precisos.
· Los vínculos hacia las noticias son dirigidos a una página especial y completa para ella en html.
· Contenidos reales y directamente asociados.
· No existen links rotos ni abandonados. El sitio se actualiza a diario.
· Titulares y resúmenes relacionados directamente con el contenido.
· En los paneles de noticias de las secciones principales, hacen falta algunas imágenes para complementar la noticia y no se convierta en un panel de sólo texto.

b) Diseño visual

- Estructura visual:
· El sitio no se encuentra centrado.
· El título principal (marca) no compite con banners publicitarios.
· El manejo de los espacios es notable, a pesar de la cantidad de información en pantalla.
· Existe una jerarquía de temas y secciones muy bien estructurada.
· El espaciado en los textos es adecuado para la lectura.
· Los colores, por lo general, no causan ninguna dificultad ni ruido en la lectura y visualización de la información.
· Existe un gran contraste entre info de secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura
· Tipografía sans-serif de cuerpo regulable en los artículos para los párrafos, con buen interlineado, y con Serif de gran tamaño y de distinto color para los titulares. Esto produce una excelente legibilidad.
· Coherencia visual entre homepage e interiores.
· Colores: Azul, negro y blanco para los fondos.

Detalles:
· Además de las opciones de Imprimir y Enviar por e-mail, se puede regular el tamaño del texto en los párrafos de noticias.