Arquitectura WebUsabilidad

Gestión de contenidos WebTaller de búsquedas en Google

Conocer y aplicar los conceptos de usabilidad, gestión de contenidos Web y criterio de búsquedas en Google.

Objetivo

Wolfgang Staudt

Competencias

Conocidos estos conceptos, el estudiante estará en capacidad de realizar los ejercicios prácticos que inician desde la siguiente clase.

(Escritura Web, edición de audio, imágenes y video, relación con los usuarios)

Temario de hoy

1. Arquitectura Web (Continuación clase anterior)2. ¿Qué es usabilidad y cómo se mide?3.Gestión de Contenidos Web: Modelo Margarita4. ¿Cómo buscar mejor en Google?

Arquitectura Web

Elementos de la arquitectura Web

●Códigos de programación●Arquitectura de datos y base de datos en la Web●Acccesabilidad, usabilidad y navegabilidad●Requerimientos técnicos de los contenidos Web

Códigos de programación

Son lenguajes que permiten transmitir y recibir información a las computadoras. A través de los lenguajes de programación podemos interactuar con una página Web. El código de programación puede ser binario (compuesto solo por ceros y unos) o código fuente, que es interpretable por los seres humanos.

HTMLHTML es la sigla en inglés de Hypertext Markup Language o lenguaje de marcado hipertextual, y es el código creado primariamente para el desarrollo de páginasweb. En líneas generales, este código permite describir la estructura de un sitioen internet, dar formato al contenido, insertar imágenes y generar vínculos conotras páginas.

Algunos lenguajes son:

CSSEl código HTML permite dar formato al contenido, pero tiene muchas limitaciones. Con el desarrollo y la expansión de Internet comenzaron a requerirse tecnologías que permitieran ver el contenido de una página en distintos dispositivos, desde un monitor de PC –Personal Computer o computadora personal– hasta un teléfono celular.El código CSS –Cascading Style Sheets u hoja de estilo en cascada– se basa enreglas que determinan el estilo de uno o más elementos de una página web. Estecódigo podrá ser escrito dentro de la página web o en un archivo independienteagregando la referencia al mismo dentro de la página web.

JavascriptEsta tecnología permite crear contenidos dinámicos en páginas web, por ejemplo elementos con movimiento o que cambien de color. Permite desarrollar páginas interactivas con programas propios como calculadoras, formularios,agendas, tablas de cálculo, etc. Surge para ampliar las capacidades del código HTML .

Códigos de programación

Otros lenguajes: ASP, PHP

Servidores Web: la arquitectura de datos en la Web

Un servidor es una computadora con gran capacidad de almacenamiento y velocidad que está conectada las 24 horas del día, de modo que permite a los administradores de la página y a los usuarios acceder al sitio Web. Para que una computadora funcione como servidor es necesario instalarle un programa o software servidor. (Apache, por ejemplo)

Arquitectura de datos y base de datos Web

Una base de datos es una colección organizada de información. En el mundo, una agenda telefónica es una base de datos. En el mundo digital, es un sistema de archivos electrónicos organizados. Sin una estructura lógica adecuada sería imposible el intercambio de datos entre una página web y un servidor.

Las bases de datos se organizan en tres categorías: campos, registros y archivos.

Accesibilidad, navegabilidad y usabilidad

La accesibilidad de una página se refiere a la posibilidad de acceso a la misma para todas las personas, sin importar sus características físicas individuales o las características del contexto de uso (tecnologías disponibles).

Ejemplos, Cuando los videos de una página web poseen subtítulos estamos permitiendo el acceso a personas hipoacúsicas y a personas que no tienen audio en su PC; cuando la tipografía de una página web es clara y puede modificarse su tamaño estamos permitiendo que personas con problemas visuales lean la información de la página; cuando el tamaño de los botones o de las áreas activas es adecuado puede facilitar su uso a aquellos que no pueden controlar el mouse con precisión, etcétera.Existe un grupo de trabajo llamado Iniciativa para la accesibilidad Web (WAI, del inglés Web Accessibility Initiative), que se encarga de promover el desarrollo de páginas web con mayores niveles de accesibilidad.

Accesibilidad, navegabilidad y usabilidad

La navegabilidad de una página web se refiere a la facilidad con que un usuario puede desplazarse por ella. Si una página web es clara, sencilla, comprensible, ofrece al usuario una experiencia satisfactoria.La navegabilidad web puede determinarse a partir de tres principios:

La estructura del sitio: es la organización interna de una página web. Se refiere a cómo se categorizan los contenidos en niveles de importancia, en secciones y subsecciones, etc. Una organización y categorización simple, clara y estable facilita la búsqueda de información de los usuarios de un sitio.

La localización: cuando se trata de páginas complejas, es necesario que el usuario pueda identificar con facilidad en qué lugar de la página se encuentra.

El contexto: guiará en todo momento al visitante de una página web. El diseño de una página debe proveer a los usuarios referencias explícitas que ayuden a diferenciar una sección de otra. Para ello es necesario que cada sección de un sitio ofrezca un contexto específico, por ejemplo modificando la paleta de colores.

Accesibilidad, navegabilidad y usabilidad

Accesibilidad, navegabilidad y usabilidad

La usabilidad es el término que se utiliza para analizar la mejor forma de diseñar sitios web para que los usuarios puedan interactuar con ellos de la forma más fácil, cómoda e intuitiva posible.

La mejor manera de pensar en la usabilidad de una página web es a través de un diseño centrado en el usuario y sus necesidades, y no en un diseño centrado en la tecnología o en la creatividad u originalidad.

Accesibilidad, navegabilidad y usabilidad

Algunas preguntas:¿Cuáles son los objetivos del sitio web? La estructura general del sitio web ¿está orientada al usuario, al diseñocreativo o a la tecnología que se utilizó para el desarrollo de la página?¿Los enlaces son fácilmente reconocibles como tales? ¿Existen elementos de navegación que orienten al usuario acerca de dóndeestá y cómo deshacer su navegación?¿El tipo de fuente, ancho de línea y alineación empleados facilitan la lectura?¿Es compatible el sitio web con los diferentes navegadores? ¿Se visualizacorrectamente con diferentes resoluciones de pantalla? ¿Se ha controlado el tiempo de respuesta, o la velocidad del servidor?

Requerimientos de los contenidos Web

Cuando armamos una página web, además de seleccionar los contenidos más adecuados a los fines y objetivos del sitio, debemos tener en cuenta ciertas necesidades y requisitos técnicos que son fundamentales para la calidad y funcionamiento de la página. Las decisiones técnicas que debemos tomar con respecto al contenido son muchas:

estructuración de la información,

estructura de las carpetas en el servidor,

tipo de archivo y tamaño de las imágenes y fotografías

y vínculos para descargas de archivos imprimibles.

Ampliaremos esta información cuando armemos nuestros blogs

Usabilidad

Nielsen la define como “el atributo de calidad que mide la facilidad de las interfaces Web”. Para él no tiene importancia el diseño o lo genial que se vea un sitio web. Para él es más importante que ofrezca fácil manejo a los usuarios porque esa es la clave del éxito.

Si bien Nielsen ha sido nombrado como el “Guru de la usabilidad” y con su filosofía ha enseñado cómo hacer que una página web sea “usable” y amigable, también ha hecho comentarios fuertes:

Flash es 99% maloEstás compañías son de mente estrecha insular, y pobladas por condenados a cadena perpetua…(refiriéndose a compañías e industrias que no entienden de usabilidad)

Pero, su sitio ha sido criticado por poco atractivo:http://www.useit.com

Usabilidad

Algunas pautas para presentar un contenido atractivo ante los usuarios:

● Tamaño de la letra: un tamaño fácil de leer, un buen tamaño sería entre 9 y 16 píxeles.●Tipografía: los tipos de letras deben ser compatibles con los navegadores. Las más utilizadas son Verdana, Helvetica y Arial. Las fuentes “sans-serif” son las más utilizadas para la web.●Ancho del texto: que se encuentre entre los 500 a 700 pixeles.●Interlineado: que haya suficiente espacio para leer entre una línea y otra.●Formatos de lectura: hay usuarios que les gusta imprimir los manuales, tutoriales o artículos. No olvidarse de que hay quienes leen desde sus móviles.●Sidebars: son muy útiles para la navegación, para desplazarse de arriba a abajo o de un lado a otro en un sitio.● Contenido relacionado: enlaces de referencia dentro del contenido a otro contenido dentro del mismo sitio. Esto permite que el usuario tenga acceso a más contenido del sitio.

Usabilidad

Test de usabilidadUn test de usabilidad es una medida empírica de la usabilidad de una herramienta, sitio o aplicación, tomada a partir de la observación sistemática de usuarios llevando a cabo tareas reales.

El test de usabilidad permite:●Verificar la existencia de posibles problemas de usabilidad en el sitio.●Encontrar posibles soluciones para los problemas encontrados. ●Establecer una medida concreta inicial contra la cual comparar a los competidores,

futuros desarrollos de este mismo sitio o modificaciones al actual.

Para llevar a cabo un test, debe haber por lo menos 3 roles:· El participante o Usuario. · El facilitador o monitor. · Los observadores.

Etapas: Planificación Test: Prueba piloto, ajustes y test definitivo. Conclusión: análisis de los datos, elaboración del informe y recomendaciones.

Un test requiere entre 40 y 50 horas.

Tres herramientas gratuitas para evaluar la usabilidad de un diseño web● UserPlus: busca ser una herramienta para diseñadores y desarrolladores web,

especialistas en usabilidad y cualquier persona interesada en la creación de sitios web fáciles de usar.

● Usabilla: gracias a los cinco sencillos pasos que ofrece Usabilla, los usuarios pueden configurar fácilmente un test de usabilidad de forma gratuita. Usabilla proporciona a los usuarios acceso a las pruebas de feedback y análisis, incluyendo Heatmaps.

● Five Second Test: aporta valor añadido como el test de memoria: los usuarios cuentan con cinco segundos para visualizar el diseño y, después, son cuestionados sobre elementos específicos del mismo a fin de evaluar la capacidad del desarrollo para impactar al usuario.

Test de usabilidad

EjercicioComparemos páginas web:

● Semana.com● Elheraldo.co● Eltiempo.com● BBCmundo.com

Respondamos:

¿Es fácil de navegar? ¿Me ubico en las secciones? ¿Sé volver al inicio?

Gestión de contenido

El Modelo de Desarrollo y Gestión de Contenidos Digitales (en adelante “Modelo Margarita”) tiene como objetivo mostrar que en este ámbito, la sola creación de los contenidos no permite entender todos los elementos que son relevantes para el esfuerzo de crearlos ni tampoco para la organización de profesionales y técnicos que aparece tras ellos, y eso es necesario establecer el conjunto total de relaciones para comprender todos los aspectos a tener en cuenta al desarrollar un espacio digital.

Gestión de contenido

El Modelo Margarita se representa a través de siete elementos o áreas de trabajo, cada una de ellas con sus tareas y su contribución al área siguiente. Como se planteaba antes, se utilizó como nombre de trabajo el concepto de la fl or “margarita” debido a la necesidad de representarlo y por el hecho de que cada uno de sus elementos es una curva que nace desde los contenidos, crece y luegovuelve como retroalimentación hacia los mismo contenidos, de forma similar a como se dibujan los pétalos de esa flor.

Definir:Es la etapa inicial del ciclo abarcado por el modelo y es la que permite determinar cuáles son las características básicas del producto que se creará, a partir de los objetivos que se desea alcanzar con el mismo y de las necesidades que se haya detectado por parte de los usuarios, como también del contexto o de la plataforma utilizada, que desean ser cubiertas por el producto o proyecto a realizar.

Crear:Se refi ere a la búsqueda, detección, preparación e incorporación de nuevos contenidos al proyecto. En esta etapa se da inicio a la generación propiamente tal de los contenidos de diverso tipo y soporte que se incorporarán al mismo.

Gestión de contenido

Mediatizar:Consiste en las acciones que permiten recopilar, elaborar y preparar aquellos contenidos que se ofrecerán a través de medios diferentes al texto en la pantalla (por ejemplo: audio, video, sistemas interactivos, etc.) que se incorporarán en el proyecto digital. Junto a lo anterior se determinan las características de acceso de los contenidos con el fi n de cumplir las normas sobre accesibilidad para personas con capacidades diferentes.

Gestión de contenidoInteractivar:Es la etapa en que se defi ne la interacción5 que tendrá el producto que se construye y se elaboran las propuestas de acción que se ofrecerán a partir de los contenidos que se hayan generado en las etapas previas. Esto puede ser dentro de los contenidos (interacción propia de la aplicación construida) como a partir de ellos (interacción vía redes sociales).

Envasar:Cuando se han cumplido las etapas anteriores llega el momento de preparar técnicamente el contenido para ser publicado y por lo tanto, lo que se busca es el cumplimiento de los estándares defi nidos para la plataforma en que se esté trabajando.

Publicar:Corresponde al momento de la publicación y por lo tanto es la etapa en que se pone a disposición de los usuarios todo lo que se ha preparado a través de las etapas anteriores. Incluye el desarrollo de las diferentes pruebas orientadas a minimizar y abordar los errores que se pudieran producir en la operación.

Gestionar:Es la etapa fi nal del modelo y consiste en la revisión de lo realizado a la luz de las estadísticas de visitas que se producirán a partir del uso que le den los usuarios a lo publicado. La información que produzca permitirá infl uir concretamente en el proyecto que se desarrolla, debido a que a partir de ella se podrá repetir nuevamente la ejecución de las etapas anteriores del modelo, generando retroalimentación directa de aquello que está ocurriendo (o no se está consiguiendo) desde la plataforma digital.

Gestión de contenido

Un sistema de gestión de contenidos (en inglés Content Management System, abreviado CMS) es un programa que permite crear una estructura de soporte (framework) para la creación y administración de contenidos, principalmente en páginas web, por parte de los administradores, editores, participantes y demás roles.

Gestión de contenido (Software)

Existen sistemas desarrollados en software libre y no libre para gestionar el contenido de nuestro sitio.Algunos presentan plantillas disponibles que permiten una sencilla diagramación de la parte estética del sitio sin tener conocimientos de diseño. Ejemplo de ello es WordPress o Blogger, plataforma sobre la que está montada este blog. Hay una gran comunidad de desarrolladores de extensiones (llamados plugins) y plantilla (llamados temas).

Pasos a tener en cuenta1. Plantee un objetivo¿Qué es lo que usted busca lograr con la publicación de contenido nuevo? Más lectores, reconocmiento de marca, incremento de ventas, registros para su newsletter. Es importante que antes de empezar usted tenga esto muy claro.

2. Defina una audiencia:¿Cuál es el tipo de lector que desea atraer? ¿Se trata del consumidor final de sus productos o de proveedores y posibles empresas con las que usted desea establecer relaciones comerciales a futuro? Determine con claridad cuál es su audiencia, ya que esto es clave a la hora de escoger un tono en su escritura y elaborar un cronograma de publicación.

3. ¿Cuál es la falencia informativa?Ya que ha determinado cuál es su audiencia, trate de descubrir qué tipo de información es la que está buscando, qué necesidad informativa buscan satisfacer; trate de suplir esa necesidad con la publicación de guías y artículos relevantes, que den respuesta a esa demanda.

4. ¿Cuál es su valor diferencial?Saber con claridad que lo diferencia a usted de su competencia es muy importante. Use esta punto a su favor comunicándolo de manera sutil, con un carácter informativo asegurándose siempre de agregar algo de valor para el lector.

5. ¿Dónde está el contenido?Hoy en día es posible encontrar prácticamente cualquier tipo de información en Internet y los consumidores lo saben. Sin embargo al compilar en un solo lugar información de calidad sobre temas directamente relacionados con sus servicios usted estará transformando gradualmente su marca en una autoridad. Investigue qué fuentes o recursos pueden ser de utilidad para la creación de contenido útilpara su consumidor objetivo.

6. ¿Dónde están sus clientes?Saber en qué sitios en internet se encuentran sus clientes potenciales le dará un buen indicio sobre el tipo de contenido que consumen y le dará una visión más clara del tipo de contenido que puede les resultar más interesante.

Pasos a tener en cuenta

7. Escoja un plan de trabajo.Una vez tenga en claro la respuesta para cada uno de los puntos anteriores determine qué es mejor para su empresa: crear el contenido a través de un tercero o invertir en recursos internos para que se encarguen de esta labor.

8. Cree un cronograma de trabajo.Ponga cada uno de estos pasos con fechas claras en un calendario, esto le dará una visión más clara de los pasos a seguir.

9. Ejecute y haga seguimiento.Tome decisiones con base en los resultados, estudie cuáles han sido los beneficios de la estrategia en relación a la inversión hecha.

Pasos a tener en cuenta

Taller de búsqueda en Google

Taller de búsqueda en GoogleGoogle como el motor de búsqueda más consultado es una de las fuentes de información más valiosa que ofrece la Web.

Algunos tips:Escribamos la respuesta de lo que buscamos, en vez de la pregunta.

● Por ejemplo, el presidente Obama fue elegido en● Obama ganó la presidencia con el * por ciento

Usemos comillas para encontrar frases específicas y asterísticos para los datos que desconocemos.

Inurl:ambienteSite: .org, .gov, .edu, .com, .intCountry: .ug, .vn, .in, .keLanguage: englishFiletype: .doc, .ppt, .pdf

Más información en http://www.google.es/support/websearch/?hl=es