Pensamos en crear “literatura de calidad” (o al menos “el folleto de un producto”), cuando la realidad del usuario está mucho más próxima a la “cartelera publicitaria que pasa a 100 kilómetros por hora”.
Steve Krug

Según un estudio realizado por Jackob Nielsen, los usuarios no leen, sino que escanean la página para determinar si merece la pena examinar ese contenido. El usuario más común solo lee primeras palabras de cada frase, empezando por arriba y perdiendo interés a media que baja.

Como se puede ver en esta foto, el patrón de lectura que genera el test de usuario tiene forma de “F”.

Otro estudio nombrado por Jackob Nielsen indica que la mejora de los buscadores y la popularización de la banda ancha han modificado el comportamiento de los usuarios. En dicho estudio se indica que la mayoría de los visitantes de una web sólo leen entre 20% y un 28% del texto de la página y que un 17% están menos de 4 segundos antes de pasar a otra página. Esto nos da una idea bastante clara del carácter del usuario.

Las personas como depredadores de información

El uso corriente de Internet viene motivado por el deseo de ahorrar tiempo. El usuario sólo busca las partes que se ajustan a su interés. El resto de información es simplemente irrelevante. Hojear es la forma de encontrar las partes que nos interesan.

A este respecto, es muy interesante la teoría que desarrollaron a principios de los años 90, Peter Pirolli y Stuart Card. Según su teoría del rastreo o forrajeo de información (Information Foraging) , los usuarios se comportan como animales salvajes que rastrean su entorno en busca de comida. Tienen un objetivo claro y empiezan su búsqueda buscando rastros de lo que necesitan. Las personas utilizan el rastro de información para decidir en qué enlace hacen clic.

Cualquier rastro (enlace, texto, imagen) que les permita realizar un progreso hacia su objetivo será seguido. Si el rastro se mantiene constante (dando la sensación de dar rodeos sin llegar a ninguna parte) o disminuye, lo más probable es que abandone la página. Así pues, cualquier elemento que sea percibido como no relevante será ignorado.

De esta manera, si la información que busca una persona está en nuestra web, pero camino que lleva hasta ella tiene poco rastro de información, la persona probablemente lo busque en otro sitio.

Como mejorar el rastro de información de nuestras páginas:

• Indica la información más importante en los dos primeros párrafos de cada página: De esta manera es más probable que los usuarios lean el contenido que tu quieres que lean. Hay posibilidades de que los usuarios lean todo el material de tu web, pero ten por seguro que serán muy pocos.
• Busca las palabras más comunes respecto a la temática de tu web: Estas palabras llaman mucho la atención e incitan a hacer clic en los enlaces que las contienen.
• No entierres el contenido en documentos demasiado largos: Divide los textos en varios documentos enlazados o crea un índice que permita identificar y moverse por las secciones de cada documento.
• Realiza un estudio las estadísticas de tu página: Para conocer a los usuarios que entran en tu web y averiguar que información andan buscando. Saber de que enlaces vienen, te ayudará a hacer ajustes en las páginas para facilitarles el camino a lo que buscan.

En este artículo os enseñaremos y aprenderéis como conseguir un Diseño Web 100% Móvil, se explicará paso a paso las distintas estrategias para lograr el objetivo de; diseñar una Web totalmente válida para la gran mayoría de dispositivos móviles, usando las técnicas y tecnologías que podrás ir viendo a continuación.

Imaginemos que tenemos que encagarnos de crear un diseño de un sitio web para móviles. Es probable que, a menos que estemos diseñando para un solo dispositivo, rápidamente nos vamos a encontrar con un problema común que experimentan todos los diseñadores que trabajan con dispositivos móviles, averiguar cuales son realmente las proporciones de pantalla de un dispositivo móvil.

Por ejemplo:

• El iPhone es de 320 píxeles de ancho por 480 píxeles de alto.
• Muchos dispositivos de Nokia N-Series son 240 píxeles de ancho por 320 píxeles de alto.
• Los dispositivos más nuevos a menudo apoyan un modo apaisado donde la anchura y la altura se invierte de forma espontánea.
• Los dispositivos de Nokia más populares disponen de pantallas que van de 176 por 208 píxeles hasta 352 por 416 píxeles.
• Las resoluciones de pantalla Blackberry variar desde 160 x 160 píxeles hasta a 324 x 352 píxeles.

Este artículo se destina a ayudar a desarrollar el diseño de estrategias eficaces para orientarlo a una amplia gama de dispositivos móviles y tamaños de pantalla. Con este fin, comenzamos con un esquema de dos cuestiones clave que se encontrará en el diseño para las pequeñas pantallas: la diversidad en la pantalla y el tamaño del píxel.

Esperar y gestión de la diversidad

En este punto, probablemente te estarás preguntando “… ¿es realmente necesario para el diseño de todos estos tamaños diferentes de pantalla?”, o “… es lo que realmente necesitamos para crear un diseño para cada dispositivo?”. Dependiendo de los requerimientos de negocio del proyecto, puede ser totalmente factible diseñar sólo para un tamaño de pantalla o dispositivo. Sin embargo, si los requisitos determinan que debe ser utilizado por la mayoría de los dispositivos, vamos a tener que encontrar la manera de hacer frente a esta diversidad.

Las cosas pueden no ser tan malas como parecen. Al diseñar para la web móvil, podemos suponer que las páginas se desplazan hacia arriba y hacia abajo como lo hacen los navegadores. Esto, de alguna forma elimina la necesidad de preocuparse por la altura de la pantalla, lo que nos permite centrar nuestros esfuerzos principalmente en tratar con la diversidad en anchos de pantalla del dispositivo. Afortunadamente DeviceAtlas Explorer nos proporciona un medio rápido para comprobar que el ancho de la pantalla en “se rompe” a través de los miles de dispositivos móviles conocidos.

Los gráficos anteriores indican, que la gran mayoría de los dispositivos comparten sólo tres anchos de pantalla, 128, 240 y 176 píxeles con muchos de los valores restantes, 120, 130, 160, 208 y 220 píxeles, no demasiado divergentes de estos tres valores centrales. Esto nos deja con unos cuantos dispositivos, tanto en los extremos altos y bajos, con una anchura de 96, 101, 320 y 320 + píxeles. Mientras que los dispositivos con un ancho de pantalla de menos de 128 píxeles pueden parecer un pequeño porcentaje de la totalidad, cuando se combina (96, 120, 101 y 84 píxeles) que suman hasta 469 dispositivos!. Más de la mitad del número de dispositivos de 240 píxeles o alrededor del 10% de todos los dispositivos conocidos.

Tambien debemos señalar que en este momento, menos del 5% de los dispositivos tienen resoluciones superiores a 320 píxeles de ancho. Esperamos que esto cambie en los próximos años, ahora estamos viendo las resoluciones de pantalla más pequeña (128, 176, etc), y dando paso a las más grandes (240 +), como se ilustra en el gráfico siguiente:

Teniendo en cuenta que el tamaño de pantalla es importante, también hay un parámetro adicional a considerar: la dimensión física de la pantalla.

El problema de los Píxeles

Durante años, los diseñadores han realizado principalmente plantillas Web para monitores comunes. El tamaño de pantalla medio es de 1024 x 768 pixels, y aunque el tamaño físico de las pantallas varían, las dimensiones totales normalmente son como resultado una densidad de píxeles de alrededor de 85 ppp (píxeles por pulgada). Últimamente, sin embargo, el panorama ha empezado a mostrar el cambio, sobre todo con los nuevos dispositivos portátiles:

• Netbooks, como el Asus Eee PC 900 tienen un rango de 9 pulgadas en diagonal con una resolución en torno a 1024 x 600 píxeles dándoles la densidad de píxeles de alrededor de 133 ppp.
• El iPhone de Apple tiene una resolución de pantalla de 320 x 480 píxeles que al combinarse con sus 3.6″ de diagonal de pantalla los resultados nos llevan a, una densidad de píxeles de 160 ppp.
• El E60 de Nokia tiene una resolución de pantalla de 416 x 352 píxeles y un minúsculo 2,2″ de diagonal de pantalla dándole una densidad de píxeles de más de 240 ppp!

Cuando se combina con la necesidad de apoyar muchos dispositivos, esta gran variación en la densidad de píxeles introduce un nuevo problema, el impacto del tamaño de píxels en el diseño.

La siguiente ilustración simula la misma imagen de 100 x 100 píxeles en dispositivos con la densidad de píxeles de 72, 144 y 240 píxeles por pulgada. Observemos cómo el tipo y los detalles finos se pierden como se representa en las imágenes más pequeñas.

Esto significa que debemos de dar solución a una amplia gama de píxeles. Sin embargo, es importante tener en cuenta que no todos los píxeles son creados iguales, y cuando sea posible:

• Determinar la gama completa de densidades de píxeles, necesitará ser soportada.
• Revisa tus diseños para estos dispositivos, para garantizar su visualización en todos ellos.
• Diseñar y definir los elementos de la maquetación en unidades relativas, como el em y en porcentajes.

Con un desarrollo y estrategia teniendo en cuenta los tamaños de pantalla, conseguiremos construir sitios Web escalables para una amplia gama de dispositivos móviles.

A continuación definiremos las diferentes estrategias para conseguir una Web para múltiples pantallas. No solo para dispositivos móviles sino también para pantallas de escritorio:

Estrategias de diseño de sitios Web para móviles

Estrategia 1: Definición de grupos de dispositivos

Como hemos comentado antes, puede haber miles de modelos de dispositivos, la diversidad no es tan mala como parece a simple vista. De hecho, es completamente posible agrupar muchos dispositivos con un ancho de pantalla similar y acabar con cinco grupos con diferentes anchos de pantalla:

• tiny: 84px, 96px, 101px, 128px, 130px, 132px
• pequeña: 160px, 176px
• medio: 208px, 220px, 240px
• grande: 320px, 360px, 480px +
• escritorio: 800px +

Estas agrupaciones son, por supuesto, totalmente arbitrarias y los requisitos de un proyecto pueden dictar un conjunto totalmente diferente. Por ejemplo, 320 píxeles para el iPhone y, poco más de 240 píxeles para navegadores móviles más recientes y 128 píxeles para dispositivos más antiguos. Al final, la definición de las agrupaciones de dispositivos realmente se reduce a los objetivos y la necesidad del proyecto. Con este fin, es una buena idea visitar DeviceAtlas de forma regular con el fin de ver las estadísticas y volver a evaluar la relevancia de sus agrupaciones.

Tambien debemos tener en cuentas las capacidades de cada dispositivo no todos soportan CSS avanzado, manipulación del DOM y JavaScript. Antes de hacer las agrupaciones comentadas anteriormente, debemos asegurarnos que los dispositivos móviles son compatibles con las tecnologías que ofrecerá el proyecto Web.

Estrategia 2: Crear un diseño de referencia por defecto

Después de haber definido los grupos de dispositivos, ahora debemos seleccionar el dispositivo de referencia. Este es el dispositivo que se usara como base durante el proceso de diseño y en última instancia, dará lugar a la creación de un diseño de referencia. Dependiendo de las necesidades de negocio que desee, se diseñará una versión de referencia para un ancho medio de pantalal de (240px). Esto mantiene el diseño suficientemente simple para adaptarse a pantallas más pequeñas, permitiendo al mismo tiempo la libertad de crear un diseño que se adaptará a los dispositivos con pantallas más grandes. También alguna vez crearemos 2 diseños de referencia, pero solo cuando sea necesario. Todo esto nos permite lo siguiente:

• Progresivamente mejorar el diseño de los dispositivos más avanzados (por ejemplo: para aprovechar el GPS o el apoyo a CSS3).
• Adaptarse a los multiples dispositivos de contacto (móviles, PDA, etc).
• Ajustar el diseño para compensar las actuales limitaciones graves en los dispositivos más restringidos.

Estrategia 3: Definir las normas para el contenido y la adaptación de diseño

Una vez que hayamos completado un diseño de referencia, también debemos proporcionar una dirección específica para la adaptación de este diseño a otros tamaños de pantalla. Similares a los contenidos de un documento de diseño visual. Estas normas y directrices deben ayudar al equipo de maquetación Web a adaptar el diseño sacando partido al código XHTML y CSS. Por ejemplo:

• El logotipo del sitio debe estar adaptado para cada agrupación de dispositivos para garantizar la visualización de dicha imagen.
• Las cabeceras deberían estirarse al 100% del ancho de la pantalla utilizando una imagen de fondo repetitiva siempre que sea posible.
• Las imágenes de contenido no deben ser mayor de 200 píxeles de ancho para el grupo por defecto, (o el 80% de la anchura de la pantalla del dispositivo).
• Las imágenes de contenido debe ser automáticamente optimizadas para escalar, independientemente del ancho de pantalla.
• Siempre que sea posible, las listas de iconos o gráficos decorativos deben de ser eliminados, y así conseguir el mayor espacio disponible para el contenido.
• Una hoja de estilo dinámica se utilizará con el fin de establecer los valores para cada dispositivo.

Aunque no es una recomendación formal, resume las estrategias comunes para adaptar y mejorar el diseño, manteniendo los tamaños de archivos al mínimo. Siempre debemos tomar decisiones de diseño pensando en la mayoría de usuarios, y en lo objetivos del proyecto.

Estrategia 4: Opta por los estándares web y un diseño flexible

Con las normas del diseño de referencia y la adaptación en su lugar, la estrategia final se basa en la flexibilidad de marcado a través de la reutilización de un código genérico, basados en estándares XHTML y CSS. En la práctica significa, la creación de un código XHTML y CSS genérico, que podemos usar mayormente en cualquiera de los futuros proyectos para dispositivos móviles, esto nos aportará beneficio, tiempo y productividad en los siguientes proyectos. Dado el gran número de dispositivos móviles, este beneficio no puede ser subestimado, ya que garantiza que su contenido será accesible a un gran número de usuarios, sin complicar el trabajo a los desarrolladores. A continuación, se presenta una serie de indicaciones para aumentar progresivamente el diseño de las agrupaciones dispositivo diferentes, a través del uso de navegador y/o el dispositivo específico. CSS, gráficos y marcado HTML.

A medida que vamos leyendo aprendemos que realmente para conseguir un diseño accesible para cualquier dispositivo móvil es, crear diseños líquidos partiendo de un diseño de referencia y maximizar el uso de CSS y XHTML. Todo esto incluye tomar como referencia las siguientes inidicaciones:

• No especificar un ancho de documento específico, permitiendo así que el diseño pueda expandirse y contraerse, y así pueda llenar la pantalla del navegador del dispositivo.
• Aprovechar los elementos de bloque que también se expanden y se contraen de forma nativa.
• Usar la hoja de estilos para dsitribuir los elementos de contenido de forma accesible para el usuario.
• Especificar el tamaño de los elementos de diseño utilizando los porcentajes de modo que, naturalmente se expandan y se contraigan adaptandose al ancho de página.

Poniendo todo junto

Para minimizar al máximo el tiempo de carga de la página, debemos simplificar y agrupar el código a una sola línea. Tambien tenemos que cumplir con los estándares XHTML y CSS. Por ejemplo el marcado y diseño de la web de la BBC para móviles es bastante simple y con un contenido básico:

Como podemos comprobar es un diseño totalmente fluido y escalable, que ocupa todo el ancho de la pantalla, independientemente del dispositivo que se use. El resto de los estilos y contenidos son especialmente adaptados en la siguiente imagen, que satisfacen el producto o familia de dispositivos más usados actualmente:

• El logotipo cambia de tamaño o es sustituido para adaptarse a la anchura de la pantalla del dispositivo.
• La cabecera y otros elementos utilizan una textura como fondo y un color, en dispositivos más antiguos dicha textura no se muestra, perso si se muestra el color de fondo.
• La BBC, parerce que a optado por adaptar el contenido a diferentes grupos de dispositivos, como podemos comprobar en la imagen las diferencias que hay entre el iPhone y el resto de dispositivos. También podemos ver que en el iPhone se muestran más contenidos y gráficos aprovechando al máximo su gran pantalla.
• Las imágenes son escalables y se adaptan a cualquiera de los dispotivios.
• En los dispositivos más grandes, los iconos asociados a cada elemento de la lista se pueden ver. Mientras que en los dispositivos más pequeños se elimina para garantizar una longitud de línea cómoda, para la visualización correcta del contenido.

El sitio Web de la BBC, es un ejemplo ideal, ya que muestra de forma simple que se puede combinar un marcado y estilos para llevar a acabo la visualización correcta de un amplio grupo de dispotitivos móviles. Su diseño, adaptación, redacción y funcionalidad esta totalmente orientado a los múltiples dispositivos que usan los usuarios. Con una rápida carga del sitio, una buena optimización y equilibrio etre diseño y accesibilidad.

User Agent Switcher

Por último quiero incluir un práctico complemento para firefox, su nombre es User Agent Switcher, nos permite visualizar una Web en diferentes dispositivos. La extensión User Agent Switcher añade un menú y un botón de la barra de herramientas para cambiar el agente de usuario del navegador. Está diseñado para Firefox, Flock, Songbird y Thunderbird, y se ejecutarán en cualquier plataforma que soporte estos navegadores, incluyendo Windows, Mac OS X y Linux. Creo que es la herramienta más apropiada para testear nuestra maquetas en cualquier dispositivo. Tambien os añado un fichero xml para integrarlo en la herramienta, con el que nos añadira los agentes de usuario de los distintos dispositivos móviles más populares y usados actualmente:

Descargar pack de agentes de usuario

Concluyendo, espero que todo lo que hemos comentado os sirva de gran ayuda para vuestros proyectos para dispositivos móviles, ya que son el futuro de la Web.

Gracias a telegraph.co.uk, podemos hacer un viaje en el tiempo. ¿Recuerdas los tiempos en los que la palabra Google no existía?, ¿o cuando cada sitio parecía tener un icono de Netscape en él?, ¿o cuando Flash era solo la luz que emitían nuestras cámaras de fotos para iluminar mejor nuestras instantáneas?, ¿recuerdas los frames?. Estamos hablando de mediados de los años noventa, cuando a las páginas web eran muy rudimentarias y los desarrolladores web eran poco más que gurus cuyo conocimiento prohibido era pagado a precio de oro.

De Google a yahoo, de msn a Apple, así es como lucían algunos de los sitios más grandes de hoy en día los primeros días de su existencia.

1. yahoo.com – Publicada en 1994

   

2. msn.com – Publicada en 1995

   

3. amazon.com – Publicada en 1995

   

4. nytimes.com – Publicada en 1995

   

5. google.com – Publicada en 1996

   

6. apple.com – Publicada en 1987 (pantalla de 1996)

   

7. blogger.com – Publicada en 1999

   

8. wikipedia.org – Publicada en 2001

   

Guiones “dashes” (”-”) o guiones bajos “underscores” (”_”). Alguna vez, todos nos hemos preguntado cual de estas dos opciones es más útil utilizar en nuestras URLs, para mejorar su posicionamiento.

Primero vamos a ver como Google lee cada uno de ellos. Tenemos estas tres direcciones:

• http://www.circulodemaquetadores.com
• http://www.circulo-de-maquetadores.com
• http://www.circulo_de_maquetadores.com

En la mayoría de lenguajes de programación el (”-”), es un signo aritmético que separa nombres igual que lo haría un espacio en blanco (hablando en términos de compilación). Sin embargo, el (”_”), no es separador, así que no divide las palabras en dos. Siguiendo esta lógica, históricamente google siempre ha leído los guiones normales como separadores de palabras. Es decir, que en la opción 2 las keywords eran interpretadas correctamente por los algoritmos del buscador, mientras que la opción 3 era vista por el buscador como solo una palabra. Es decir la opción 1 y 3 tenían iguales efectos.

Esto hace pensar que aunque no exista ninguna penalización por parte de Google por usar guiones bajos, es preferible utilizar los guiones normales en URLs y enlaces internos. Si quieres saber más sobre como optimizar la estructura de nuestras URL para mejorar el posicionamiento de nuestros sitios, os remito a este magnifico artículo publicado en nuestro blog hace no mucho tiempo. Optimización Google – Parte 4: Estructura de las URL

Todo esto pareció cambiar hace un par de años, en la WordCamp 2007, Matt Cutts nos decía, que los ingenieros de Google habían decidido que el guión bajo, también fuera interpretado como separador de palabras. Esto significaba que las URLs con los dos tipos de guiones, serían interpretadas de la misma forma. Esta noticia provocó la euforia de muchos desarrolladores.

Posteriormente, el bueno de Matt rectificó sus palabras, pero añadió que si ya habías hecho su sitio web con guiones bajos, no valía la pena tratar de migrar todas sus URL a guiones medios.

En Septiembre de este año, Matt Cutts en el blog oficial para de Web masters de google, ha vuelto a hablar del tema, aquí os dejo el video en español:

En resumen:

• Si tienes guiones bajos (”_”) y todo funciona bien, no me molestaría en cambiar su arquitectura.
• Esto podría cambiar más adelante, pero es así como está ahora mismo.

Pues lo dicho, más claro que el agua, resulta que por ahora, sí hay diferencia entre usar guiones y guiones bajos.

Tanto si eres un administrador, un desarrollador Web, un miembro de un equipo de Marketing o de Comunicaciones, o quizá un Web Master Freelance, habrás leído de diversas fuentes sobre el interés en los estándares Web. Habrás comprendido que los estándares son beneficiosos para tu sitio Web en términos de ahorro de costes, facilidad de gestión y aprovechamiento, y por lo tanto has decidido cambiar y emplear estándares en tu sitio Web. Y así validar y mejorar tu sitio Web.

Desde Grupo de Trabajo de Aseguramiento de la Calidad del W3C. Dónde nos enseña un método que es válido para sitios Web de cualquier dimensión; satisfará tus necesidades tanto si gestionas un sitio Web personal, de un pequeño negocio o de una gran corporación.

Este documento nos guíará a través de pasos individuales, cada uno de los cuales serás capaz de completar individualmente, desde el análisis de tu sitio Web actual hasta la organización de tu nuevo sitio Web. Cada uno de estos pasos ha sido diseñado de forma separada, y puede ser emprendido en diferentes ocasiones, diferentes niveles o por diferentes personas, con independencia de su nivel de conocimientos, pero de acuerdo a un flujo de trabajo Ordenados en los siguientes pasos:

• Decide qué es lo que probarás
• Analiza tu sitio Web
• Organiza el trabajo
• ¿Cómo puedes mejorar tu sitio?
• Revisa
• Mantén el nivel de calidad

Este documento o artículo seguramente muchos sepan de estas cosas, pero aquí también nos explica como hacerlo de forma organizada y con detalle, os dejo con un enlace para leer el artículo completo:

Leer artículo completo W3C

Antes de presentar el artículo quiero daros una breve introducción sobre la persuabilidad y su uso en la Web

¿Qué es la persuabilidad?

Persuabilidad es el término usado para designar la capacidad de una presencia online de llevar a la acción al usuario y convertirlo en suscriptor, lead o cliente.

Aquí van 12 primeras ideas que nos hablan de que, más allá del testing multivariante debemos empezar a plantearnos para hacer nuestras webs más inteligentes:

• Palabras claves con textos dinámicos que utilizan las palabras claves de nuestras campañas o las búsquedas naturales de nuestros usuarios para contextualizar los mensajes?
• Contextualización de nuestra información según los datos geográficos del usuario. Por reconocimiento de IP podemos saber el país, región, ciudad, latitud y longitud desde la que navega el usuario. Deberíamos utilizar este recurso para adaptar nuestro discurso localmente.
• Proactividad comercial en nuestros buscadores internos. Los buscadores internos son cada vez más utilizados por nuestros impacientes usuarios. Estos buscadores deberían permitirnos introducir promociones y campañas que nos permitieran maximizar nuestras posibilidades de cerrar un trato con nuestros clientes.
• Reglas de negocio en función de criterios concretos (momento del día o del mes, situación del cliente, páginas visitadas,…). La tecnología ya nos permite hacer una microsegmentación en la que nadie del mundo del marketing nunca hubiera ni soñado.
• Capas y niveles de contenidos distintos en función del tiempo de visita o las páginas visitas por nuestros usuarios. El comportamiento mismo del usuario nos permite condicionar los contenidos que mostramos y cómo debemos mostrarlos.
• Creación de precios dinámicos en función de los niveles de venta, los ratios de conversión o las promociones que estemos desarrollando.
• Customización de mensajes en función del comportamiento actual o histórico de nuestros usuarios. El behavioral targeting se está aplicando en redes publicitarias con muy buenos resultados y en muy poco tiempo será nuestro pan de cada día ya que las posibilidades de customizar mensajes en función de criterios de comportamiento son infinitas (al mismo tiempo que sumamente efectivas).
• Ofertas de última hora para aquellos usuarios que estén abandonando nuestro site. Puede sonar un tanto agresivo, pero en determinados casos sumamente efectivo para darnos una última oportunidad para enganchar con el usuario que no está abandonando.
• Envíos automatizados de mails según comportamiento en el site (p.e. abandono del site con producto en el carrito de compra). Hasta la fecha, hemos pensando demasiado en términos de página web y poco en el encaje inteligente y automatizado que debe tener el correo electrónico para desarrollar una relación más cercanas con nuestros usuarios. No nos referimos al tipíco newsletter con informaciones que el usuario no quiere leer con periodicidad establecida y ofertas que no siempre generan el interés que nos gustaría. Nos referimos a ponerle inteligencia push en determinados momentos: por ejemplo, enviando un recordatorio o promoción cuando nos hemos materializado una compra a pesar de haber introducido productos en nuestro carrito de la compra o cuando hemos realizado una búsqueda (de un vuelo o de un producto) y no hemos acabado realizando la compra y pasados unos días tenemos mejores condiciones o producto que al usuario podrían interesarle.
• Personalización y configuración a medida de nuestros productos deseados. La creación de propuestas dinámicas (venta cruzada, condiciones especiales,…) en función de la personalización que el usuario esté realizando de nuestro producto puede también tener mucho sentido.
• Relleno de campos automatizados para clientes reincidentes. La simplificación de pasos o trabajo parece ya de obligado cumplimiento para evitar abandonos por el camino.
• Activación de chats proactivos en determinados momentos. La integración de una atención personalizada de manera proactiva cuando todo apunta que el usuario se ha quedado atascado podría ser sumamente rentable en determinadas páginas de nuestra presencia online.

Por último quiero dejaros con una ponencia de Ester Pallarès, experta en persuablidad Web. En la que nos muestra como funciona esto de la persuabilidad y como convertir a nuestros usuarios en clientes.

Ver ponencia Persuabilidad: convierte usuarios en clientes

Simpático artículo de Fuckowski en el que nos resume a su manera en que consiste la mil veces nombrada web 2.0

Esta es la defición de los servicios más usados actualmente:

Blogger: Es como Geocities pero para incompetentes tecnológicos; basta escribir un texto y pulsar un botón para darle la brasa al mundo. Paradójicamente, muchos de los usuarios que tuvieron que esperar a que la tecnología se hiciese más sencilla para poder tener páginas en internet, ahora se autodenominan expertos tecnólogos.

Gmail: Es básicamente un IRC, pero en modo offline: los usuarios charlan amigablemente en listas de correo y se ponen verdes por la espalda en mensajes privados.

Flickr: Sirve para que los usuarios de Blogger y Gmail publiquen fotos de sus pies y sus platos de comida.

Facebook: Una herramienta que sirve para saber si la persona con la que chateas tiene o no pareja y si está de buen ver.

Menéame: Un agregador de noticias donde, mediante complejos sistemas de votación y cálculo de karma, se seleccionan las noticias más interesantes y los comentarios más gilipollas.

Wikipedia: Un servicio de clasificación y almacenamiento de flame wars.

Twitter: Popular servicio de alarmas en tiempo real que nos avisa cuando se cae Gmail y cuando se levanta Enrique Dans.

Leer todo el artículo

Despues de la W3C haya publicado en Diciembre de 2008 las WCAG 2.0 se abren a los desarrolladores y promotores de sitios web la posibildiad de tener Webs tan accesibles como antes y al mismo tiempo más acorde con las nuevas tecnologías.

Para “alcanzar” el nivel de accesibilidad de los portales sobre la nueva recomendación de W3C, se desarrollado una nueva versión del analizador de accesibilidad TAW. Actualmente es una beta, pero funciona bastante bien

Su uso es mucho más sencillo, ya que el informe que genera la herramienta ofrece cuatro tipos de vistas: Resumen, Vista Marcada, Detalle y Listado. Lo mejor es instalarlo o usarlo a través de su Web para comprobar su funcionamiento y sus características.

Acceder a la herramienta TAW

También podemos descargar el complemento para Firefox que actualmente verifica las pautas WCAG 1.0, hasta que se lance la versión TAW con las 2.0 oficial.