<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Círculo de Maquetadores &#187; Usabilidad Web</title>
	<atom:link href="http://www.circulodemaquetadores.com/category/usabilidad/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.circulodemaquetadores.com</link>
	<description>Comunidad de Maquetadores Web</description>
	<lastBuildDate>Mon, 12 Mar 2012 13:02:45 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Técnicas para aumentar la velocidad de una web</title>
		<link>http://www.circulodemaquetadores.com/aumentar-la-velocidad-web-reducir-peso-web/</link>
		<comments>http://www.circulodemaquetadores.com/aumentar-la-velocidad-web-reducir-peso-web/#comments</comments>
		<pubDate>Sun, 25 Apr 2010 13:59:04 +0000</pubDate>
		<dc:creator>Jorge López</dc:creator>
				<category><![CDATA[HTML]]></category>
		<category><![CDATA[Posicionamiento Web]]></category>
		<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1413</guid>
		<description><![CDATA[<p>Según los <a href="http://yuiblog.com/blog/2006/11/28/performance-research-part-1/" title="Abre en nueva ventana" target="_blank">estudios realizados por Yahoo!</a> el 20% del tiempo de carga de un sitio web corresponde al servidor y el 80% restante es responsabilidad del cliente. Teniendo en cuenta este dato, es necesario reflexionar y cambiar nuestro modo de trabajo para intentar reducir lo máximo posible el peso de los archivos que generamos y de esta manera aumentar la velocidad de nuestra web.</p>
<p>En este artículo repasaremos tecnología por tecnología,  algunas de los mejores trucos y metodologías para reducir al máximo posible el peso de nuestros archivos.</p>
<p class="alignCenter">
<img src="http://ravenmedia.s3.amazonaws.com/blog/wp-content/uploads/2009/12/fastweb.jpg" alt="" style="width:400px" />]]></description>
			<content:encoded><![CDATA[<p>Según los <a href="http://yuiblog.com/blog/2006/11/28/performance-research-part-1/" title="Abre en nueva ventana" target="_blank">estudios realizados por Yahoo!</a> el 20% del tiempo de carga de un sitio web corresponde al servidor y el 80% restante es responsabilidad del cliente. Teniendo en cuenta este dato, es necesario reflexionar y cambiar nuestro modo de trabajo para intentar reducir lo máximo posible el peso de los archivos que generamos y de esta manera aumentar la velocidad de nuestra web.</p>
<p>En este artículo repasaremos tecnología por tecnología,  algunas de los mejores trucos y metodologías para reducir al máximo posible el peso de nuestros archivos.</p>
<p class="alignCenter">
<img src="http://ravenmedia.s3.amazonaws.com/blog/wp-content/uploads/2009/12/fastweb.jpg" alt="" style="width:400px" />
</p>
<h2>¿Porque es recomendable reducir el peso de nuestra web?</h2>
<ul>
<li>Todavía hay muchos hogares donde la conexiones a internet siguen siendo lentas y poco fiables.</li>
<li>La rapidez de un sitio web <strong>mejora la experiencia del usuario.</strong></li>
<li>Reduce los <a href="http://radar.oreilly.com/2009/07/velocity-making-your-site-fast.html" title="Abre en nueva ventana" target="_blank"><strong>costes operativos</strong></a> de tu sitio.</li>
<li>El número de páginas vista por sesión de usuario aumentará, al poder visualizar más páginas en el mismo tiempo.</li>
<li>Recientemente <a href="http://googlewebmaster-es.blogspot.com/2010/04/utilizacion-de-la-velocidad-del-sitio.html" title="Abre en nueva ventana" target="_blank">google ha reconocido</a> que ha incluido en su algoritmo de búsqueda el factor de velocidad de una sitio . Eso quiere decir que <strong>la velocidad de una web, será otro factor a tener el cuenta para mejorar el posicionamiento de una web</strong>.
<p>
<blockquote cite="http://googlewebmaster-es.blogspot.com/2010/04/utilizacion-de-la-velocidad-del-sitio.html">“hemos decidido tomar en cuenta la velocidad del sitio en la clasificación de los resultados de búsqueda. Usamos diferentes fuentes para determinar la velocidad de un sitio con respecto al resto de sitios.<br />Matt Cutts”</p></blockquote>
</li>
<li>En muchos casos, reducir el peso de un sitio no requiere cambios de importancia ni excesivamente caros.</li>
<li>Puede suponer un gran adelanto respecto a la competencia.</li>
</ul>
<h2><acronym lang="en" title="HyperText Markup Language">HTML</acronym></h2>
<ul>
<li>Maqueta tu web de acuerdo con el <span lang="en">web standard</span>.</li>
<li><strong>Olvídate de diseñar con tablas</strong>. Diseñar con divs nos ahorrará muchas líneas de código.</li>
<li><strong>Separa el diseño, el contenido y la funcionalidad</strong> en varias capas. Esto quiere decir que ni las hojas de estilo ni el javaScript deberían ir embebidos en tus html.</li>
<li>Elimina el código superfluo o redundante tanto en tus HTML como en <acronym lang="en" title="Cascading Style Sheets">CSS</acronym> y JavaScript.</li>
<li>Vigila la indentación, elimina tabulaciones, retornos de carro y espacios innecesarios.</li>
<li>La web no es un libro, inserta tus contenidos resumidos y utilizando <strong><a href="http://www.circulodemaquetadores.com/general/como-escribir-para-la-web/" title="Abre en nueva ventana" target="_blank">técnicas de redacción para la Web</a></strong>.</li>
<li><strong>Cuida la paginación de tu sitio</strong> para que no haya excesivo contenido en cada página. Si hay mucho contenido divídelo en varias secciones.</li>
<li>Evita los errores 404, ya que el tiempo de espera es mucho mayor. </li>
<li>Usa es  <a href="http://www.yook.de/webmaster/clean/" title="Abre en nueva ventana" target="_blank">HTML Code Cleaner</a> para aminorar el peso de tu html.</li>
</ul>
<h2>CSS</h2>
<ul>
<li><strong>Utiliza propiedades <span lang="en">shorthand</span></strong>.</li>
<li>Escribe las propiedades css en línea y  no en bloque.</li>
<li><strong>Enlaza las hojas de estilo externamente</strong> en vez de incluir los estilos en la propia página. </li>
<li>Intenta utilizar <span lang="en">sprites CSS</span> para reducir el número de imágenes a una única imagen. </li>
<li><strong>Combina si es posible todos los archivos CSS</strong> individuales en un único archivo CSS. , esto reducirá el número de peticiones HTTP.</li>
<li>Aunque muchas veces veces resulte imposible no utilizarlos, intenta utilizar lo menos posible expresiones (expression()) en las hojas de estilos. El navegador Internet Explorer revalúa continuamente el valor de las expresiones y puede penalizar el rendimiento de la página. </li>
<li>No utilizar los filtros de Internet Explorer, ya que algunos filtros como <a href="http://msdn.microsoft.com/en-us/library/ms532969%28VS.85%29.aspx" title="Abre en nueva ventana" target="_blank">AlphaImageLoader</a> bloquean la carga de la página hasta que no se descarga la imagen utilizada por el filtro. </li>
<li><a href="http://www.cleancss.com/" target="_blank" title="Abre en nueva ventana">Clean CSS</a>  es de los mejores compresores para CSS.</li>
</ul>
<h2>SWF</h2>
<ul>
<li><strong>Recurre al Flash solo cuando sea absolutamente necesario</strong>.</li>
<li>Si te es posible carga de secciones de manera externa. Es mejor tener varios SWF ligeros que uno solo con un peso enorme.</li>
<li>Antes de cargar cualquier objeto de manera externa, <strong>realiza una precarga</strong>.</li>
<li>No los insertes sonidos en la línea de tiempo, cargalos de manera externa o llámalos desde la biblioteca.</li>
<li><strong>Los videos cargalos en tiempo de ejecución</strong>. Nunca los incorpores en la línea de tiempo.</li>
<li>Elimina elementos innecesarios de la biblioteca.</li>
<li>Intenta minimizar el peso de las imágenes en tus diseños. Si su calidad te lo permite, comprímelas desde la biblioteca. Una compresión de menos de 50 hará que pierdan demasiada calidad y una superior a 80, hará que pesen demasiado.</li>
</ul>
<h2>JavaScript</h2>
<ul>
<li><strong>Combinar tus scripts en un único archivo</strong> para mejorar los tiempos de respuesta de la página, así solo necesitarás una sola conexión HTTP para descargar los scripts.</li>
<li>Elimina espacios, saltos de linea y tabulaciones y otros elementos innecesarios.</li>
<li>Comprime los archivos con gzip.</li>
<li>Reduce el Número de Elementos <acronym lang="en" title="Document Object Model">DOM</acronym>, de este modo navegador dedicará menos tiempo en la comparación con los CSS y por ende, con la apertura de la página.</li>
<li>Utiliza el <a href="http://code.google.com/intl/es/closure/compiler/" target="_blank" title="Abre en nueva ventana">Closure Compiler</a> o el <a href="http://alex.dojotoolkit.org/shrinksafe/" title="Abre en nueva ventana" target="_blank">ShrinkSafe</a> para aligerar el código Javascript.</li>
</ul>
<h2>Imágenes</h2>
<ul>
<li><strong>No incluyas  imágenes de gran tamaño</strong> en tu web. Si es muy grande, cambia su tamaño en un editor de imágenes y guardala a un tamaño menor.</li>
<li>Si aún así tienes que incluir una imagen de gran tamaño, puedes enlazar esa imagen a través de una versión en miniatura (<span lang="en">thumbnail</span>) de la misma, que servirá a modo de vista previa.</li>
<li>Utiliza el formato <acronym lang="en" title="Joint Photographic Experts Group">JPEG</acronym> para <span lang="en">bitmaps</span> con mucho color, como degradados o fotografías . Si es posible nunca sobrepases el 80% de compresión cuando la exportes.</li>
<li>Los formatos <acronym lang="en" title="Portable Network Graphics">PNG</acronym> 8 son ideales para iconos y logotipos con  pocos colores. Si quieres	 hacer transparencias simples, puedes utilizar también este formato.</li>
<li>No utilices el formato <acronym lang="en" title="Graphics Interchange Format">GIF</acronym>, además de ser propietario da peores resultados que el PNG</li>
<li><strong>Utiliza rutas relativas</strong> en vez de rutas absolutas, así el servidor no tendrá que volver a establecer una conexión para cada imagen en la página.</li>
</ul>
<h2>Herramientas</h2>
<ul>
<li><strong><a href="http://code.google.com/intl/es-ES/speed/page-speed/" target="_blank" title="Abre en nueva ventana">Page Speed</a></strong>: complemento de Firefox/Firebug que evalúa el rendimiento de sitios web y da sugerencias para mejorarlos.</li>
<li><strong><a href="http://developer.yahoo.com/yslow/" target="_blank" title="Abre en nueva ventana">YSlow</a></strong>: una herramienta gratuita de Yahoo! que sugiere formas de mejorar la velocidad de sitio web.</li>
<li><strong><a href="http://www.webpagetest.org/" target="_blank" title="Abre en nueva ventana">WebPagetest</a></strong>: muestra una vista en cascada del rendimiento de carga de tus páginas, además de una lista de optimización.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/aumentar-la-velocidad-web-reducir-peso-web/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Como escribir para la web</title>
		<link>http://www.circulodemaquetadores.com/como-escribir-para-la-web/</link>
		<comments>http://www.circulodemaquetadores.com/como-escribir-para-la-web/#comments</comments>
		<pubDate>Sun, 07 Mar 2010 19:47:21 +0000</pubDate>
		<dc:creator>Jorge López</dc:creator>
				<category><![CDATA[Recursos]]></category>
		<category><![CDATA[Semántica Web]]></category>
		<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1388</guid>
		<description><![CDATA[<p>La Web tiene características propias que determinan como se estructura cualquier texto y el modo en que el usuario accede a la información. No hay duda alguna que el modo en que está escrito un texto afecta de manera dramática la experiencia de los usuarios. Hace tiempo hablamos precisamente de esto cuando <a href="http://www.circulodemaquetadores.com/usabilidad/%C2%BFcomo-leen-en-la-web-los-usuarios/" title="Abre en nueva ventana" target="_blank">analizando el patrón de lectura de los usuarios de la web</a>. La conclusión fue que es un error escribir en la web de la misma manera que para un soporte impreso, puesto que los usuarios  se comportaban de manera diferente. </p>
	<p class="alignCenter">	
	<img src="http://www.equiposcreativos.com/posicionamiento-web/wp-content/uploads/2009/10/03.10-web-writing2.png" alt="Un boligrafo encima de un ordenador" style="width:300px;height=200px" />
	</p>
		<p>La intención de este artículo es introducir varias técnicas y metodología que optimizarón la calidad y legibilidad los textos de nuestras webs.</p>
]]></description>
			<content:encoded><![CDATA[<p>La Web tiene características propias que determinan como se estructura cualquier texto y el modo en que el usuario accede a la información. No hay duda alguna que el modo en que está escrito un texto afecta de manera dramática la experiencia de los usuarios. Hace tiempo hablamos precisamente de esto cuando <a title="Abre en nueva ventana" href="http://www.circulodemaquetadores.com/usabilidad/%C2%BFcomo-leen-en-la-web-los-usuarios/" target="_blank">analizando el patrón de lectura de los usuarios de la web</a>. La conclusión fue que es un error escribir en la web de la misma manera que para un soporte impreso, puesto que los usuarios  se comportaban de manera diferente.</p>
<p class="alignCenter"><img style="width: 300px;" src="http://www.equiposcreativos.com/posicionamiento-web/wp-content/uploads/2009/10/03.10-web-writing2.png" alt="Un boligrafo encima de un ordenador" /></p>
<p>La intención de este artículo es introducir varias técnicas y metodología que optimizarón la calidad y legibilidad los textos de nuestras webs.</p>
<p>En primer lugar vamos a explicar la diferencia entre un lector de material impreso y un usuario web. Hay que tener en cuenta varias consideraciones:</p>
<ul>
<li><strong>La lectura en un monitor es más incómoda</strong> que en un texto impreso.</li>
<li><strong>El usuario es impaciente y voraz</strong> , porque tiene a su disposición millones de alternativas a la tuya.</li>
</ul>
<h2>¿Por qué debo adaptar la redacción de mis textos para la web?</h2>
<ul>
<li><strong>En la web el contenido es lo más importante</strong>: recuerda que lo usuarios se mueven buscando información. Si no presentas tu contenido de forma legible y agradable no será leída por mucha gente, por muy buena y útil que esta información sea.</li>
<li><strong>Atraerás visitas</strong>: si tienes buenos contenidos, bien estructurados y fáciles de leer, será más probable que otros usuarios quieran compartirlos mediante enlaces a tu web o en redes sociales.</li>
<li><strong>Ayudará a mejorar tu posicionamiento</strong>: será más fácil para los robots de búsqueda rastrear tu contenido mejorando tu posicionamiento.</li>
<li><strong>Tu página será más accesible</strong>: esta manera de jerarquizar y escribir contenidos, hará que tu página sea más accesible para personas con discapacidad, aumentando tu número potencial de usuarios.</li>
</ul>
<h2>Técnicas  y estrategias</h2>
<p>Debemos entender que la forma de estructurar los textos en Internet está determinada más por razones funcionales que por simples razones estéticas, literarias o artísticas. Teniendo en cuenta esto, vamos a ver varias técnicas que pueden ayudar a los usuarios a retener mejor nuestros textos</p>
<ul>
<li><strong>Estilo de escritura en pirámide invertida</strong> : una manera de organizar nuestro contenido es jerarquizándolo de mayor a menor interés, esto es comenzar con las conclusiones. Este estilo es muy eficaz porque nos asegurará que el usuario lea la información más importante cuando abandone nuestro sitio.</li>
<li><strong>Mensajes clave:</strong> siguiendo la filosofía del punto anterior, el mensaje principal que quieras dar debe ser evidente desde el primer párrafo. La claridad y la concisión son fundamentales para redactar nuestros contenidos.</li>
<li><strong>Separación en trozos:</strong> los textos muy largos se deben dividir y agrupar el contenido en partes significativas, con su respectivos títulos descriptivos para mostrarlo en distintas páginas. Cada página se enlazará con el índice principal del artículo.</li>
</ul>
<h2>Como mejorar la legibilidad</h2>
<h3>En cuanto a la redacción:</h3>
<ul>
<li>Utiliza frases cortas que expresen una sola idea.</li>
<li><strong>Lenguaje simple e informal</strong>: es más adecuado que el elegante o formal, ya que la lectura es más rápida en el primero.</li>
<li><strong>Contenidos escaneables</strong>: para que puedan ser mejor visualizados, es necesario maquetar nuestros textos con distintos niveles de encabezados que describan el contenido de cada página, usa listas siempre que puedas.</li>
<li><strong>Jerga</strong>: Lo más probable es que el usuario no sepa nada del tema del que habla su web por ello elimine la jerga específica de su contenido, recuerde segundo primer punto de esta lista.</li>
<li><strong>Texto Abreviado</strong>: omite palabras y frases que no aporten contenido relevante.</li>
<li><strong>Propaganda</strong>: los usurarios detestan la publicidad y aprenden pronto a ignorar los mensajes publicitarios, incluso cuando intentan aparecer como información objetiva camuflada en el texto. Además, esta forma de redacción impone a los lectores una carga mental extra, que les obliga a filtrar las exageraciones para llegar a las cuestiones concretas. Esto hace lenta su lectura y finalmente los hace huir del Sitio. El usuario viene a tu sitio en busca de información útil, no de publicidad.</li>
<li><strong>Verbos expresivos</strong>: El uso de un verbo preciso comunica con mayor fuerza lo que usted desea expresar. También elimina redundancias y reduce la longitud del texto. Por ejemplo:
<ul>
<li>Tomar una decisión / decidir</li>
<li>Proporcionar apoyo / apoyar</li>
<li>Hacer uso de / usar</li>
<li>Sirve para explicar / explica</li>
<li>Efectuar un examen / examinar</li>
</ul>
</li>
<li><strong>Juegos de palabras y localismos</strong>: no aludas a referencias culturales o bromas de ámbito geográfico limitado. Lo que tu entiendes que puede ser gracioso para alguien de tu región, puede que no sea entendido por los usuarios de otra región distinta o en el peor de los casos, puede que sea ofensivo para ellos.</li>
<li><strong>Eufemismos</strong>: huye de ellos, muchas veces lo políticamente correcto no es más que una forma de esconder la verdad.</li>
</ul>
<h3>En cuanto al diseño:</h3>
<ul>
<li>Deja espacio alrededor de sus textos.</li>
<li>Minimiza la anchura de sus párrafos</li>
<li>Usa <strong>colores de alto contraste</strong> que diferencien bien el texto del fondo.</li>
<li>Usa fuentes grandes (preferiblemente 12 puntos) y si es posible sans-serif . Las fuentes pequeñas se deben dejar para el texto que poca gente lee. Por ejemplo, descargo de responsabilidad.</li>
<li><strong>Utiliza negritas</strong> para resaltar las partes más importantes de sus  textos. Además será un buen recurso de color para romper la uniformidad del texto. Utilizar la negrita en exceso puede ser contraproducente.</li>
<li>Es mejor evitar marcar párrafos enteros con cursivas o mayúsculas. No estamos acostumbrados a leer la letra impresa de esa manera.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/como-escribir-para-la-web/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>HTML y Flash, una visión actualizada</title>
		<link>http://www.circulodemaquetadores.com/html-y-flash-una-vision-actualizada/</link>
		<comments>http://www.circulodemaquetadores.com/html-y-flash-una-vision-actualizada/#comments</comments>
		<pubDate>Fri, 20 Nov 2009 17:50:29 +0000</pubDate>
		<dc:creator>Jorge López</dc:creator>
				<category><![CDATA[Diseño Web]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1189</guid>
		<description><![CDATA[<p>Mucho se ha discutido sobre la conveniencia de la utilización de elementos de una tecnología propietaria  como es flash dentro de <acronym lang="en" title="HyperText Markup Language">HTML</acronym>. Hace tiempo que existen agrios debates entre los defensores y detractares de Flash, avivados desde el ya célebre artículo de Jakob Nielsen <a href="http://www.useit.com/alertbox/20001029.html" target="_blank" title="Abre en nueva ventana">Flash: 99% Bad</a>, del año 2000. Pero desde el año 2002 y la versión MX, esta tecnología ha introducido mejoras en varios aspectos conflictivos que en su momento se le criticaron.  Por eso me hago la pregunta, ¿con la tecnología actual, es conveniente utilizar el formato flash en nuestras webs?, ¿Todos cambios introducidos han sido suficientes?, ¿Cómo se utiliza actualmente flash?</p>
<p>En este artículo veremos los avances de esta tecnología en varios puntos escabrosos y un pequeño estudio sobre su uso en las webs españolas más importantes:</p>
<p class="alignCenter">
<img src="http://www.dragynstudios.com/secondary_images/html.jpg" alt="Representación de la lucha entre HTML y flash" />
</p>]]></description>
			<content:encoded><![CDATA[<p>Mucho se ha discutido sobre la conveniencia de la utilización de elementos de una tecnología propietaria  como es flash dentro de <acronym lang="en" title="HyperText Markup Language">HTML</acronym>. Hace tiempo que existen agrios debates entre los defensores y detractares de Flash, avivados desde el ya célebre artículo de Jakob Nielsen <a href="http://www.useit.com/alertbox/20001029.html" target="_blank" title="Abre en nueva ventana">Flash: 99% Bad</a>, del año 2000. Pero desde el año 2002 y la versión MX, esta tecnología ha introducido mejoras en varios aspectos conflictivos que en su momento se le criticaron.  Por eso me hago la pregunta, ¿con la tecnología actual, es conveniente utilizar el formato flash en nuestras webs?, ¿Todos cambios introducidos han sido suficientes?, ¿Cómo se utiliza actualmente flash?</p>
<p>En este artículo veremos los avances de esta tecnología en varios puntos escabrosos y un pequeño estudio sobre su uso en las webs españolas más importantes:</p>
<p class="alignCenter">
<img src="http://www.dragynstudios.com/secondary_images/html.jpg" alt="Representación de la lucha entre HTML y flash" />
</p>
<h2>Puntos problemáticos y avances de flash para el desarrollo web:</h2>
<ul>
<li><strong>Accesibilidad</strong>: Con la introducción de la paleta de accesibilidad en la versión MX 2004, se mejoró notablemente la accesibilidad en los archivos flash. Ahora es posible que algunos lectores de pantallas puedan detectar ciertos elementos de una película swf, pero aún así la tecnología flash todavía no es completamente accesible para personas con discapacidad. </li>
<li><strong>Posicionamiento</strong>: También se han hecho avances en este sentido. Ahora los buscadores son capaces de procesar los archivos swf y leer las cadenas de texto que contienen. El problema radica en que si todo el sitio está desarrollado en un único flash, el peso de nuestras keywords se diluye, ya que los robots no reconocen que el flash se divide en diferentes secciones. Existen varias soluciones parciales a este problema, pero ninguna es mejor en cuanto a posicionamiento como disponer de un web realizada únicamente en HTML.</li>
<li><strong>Actualización</strong>: Una de las mayores criticas de Jakob Nielsen a las páginas desarrolladas en  Flash, era que resultaba difícil mantenerlas actualizadas. Es  necesario editar directamente el archivo fuente para realizar los cambios. Volcar contenido en <acronym lang="en" title="Extensible Markup Language">XML</acronym>, o la integración de Flash con fuentes de datos dinámicos usando <span lang="en">Flash Remoting</span> y <span lang="en">Web Services</span> también ha solucionado parcialmente este problema.</li>
<li><strong>Carga de contenidos</strong>: A pesar de varias optimizaciones que podremos someter a nuestras bibliotecas y archivos flash,  estos se cargarán más lentamente que los contenidos creados en HTML. Además, hay que tener en cuenta que la velocidad de fotogramas asignada a una película, casi nunca se cumple. Esto dependerá de factores como la cantidad de código a ejecutar, la complejidad de éste, la potencia del ordenador, los recursos del sistema operativo, etc.</li>
<li><strong>Estadísticas</strong>. Utilizando Flash <span lang="en">Remoting</span> podremos realizar estadísticas de visitas. El problema viene si desarrollamos toda la web en un único archivo. De esta manera sólo podremos saber cuántas personas visitaron la portada de la web, no sus secciones.</li>
</ul>
<h2>¿Actualmente como se utiliza Flash mayoritariamente?</h2>
<p>Por otro lado, leo en <a href="http://blog.wezstudio.com/flash-vs-html-la-eterna-guerra-un-estudio/" target="_blank" title="Abre en nueva ventana">wezstudio</a> un informe del año pasado sobre  la utilización de flash en las 20 páginas españolas más importantes. Estos son los resultados más relevantes que arroja dicho estudio:</p>
<ul>
<li>Aproximadamente el <strong>50% de los sitios analizados contienen algún elemento Flash</strong></li>
<li>Ninguna web esta totalmente desarrollada en Flash mientras que un <strong>45%  son completamente  HTML</strong>.</li>
<li>En las página analizadas solo se utiliza <strong>Flash como herramienta de publicidad</strong> o bien para mostrar vídeos. </li>
<li>Solo el 10% de la superficie total de la home utiliza elementos Flash</li>
<li>Sin embargo flash ocupa entorno al 60-80% del total de la publicidad</li>
</ul>
<h2>Conclusiones del informe</h2>
<p>Analizando estos datos podemos decir que actualmente <strong>Flash es una tecnología ampliamente extendida y utilizada como complemento del  HTML</strong>. Parece ser que su utilización para el desarrollo íntegro de una web está decayendo.</p>
<p>Según este estudio,  <strong>flash es utilizado principalmente para mostrar vídeos y publicidad</strong>. Si bien su utilización es muy común para el montaje de galerías y pases de diapositivas, podemos adivinar que el desarrollo y la utilización de <span lang="en">frameworks</span> para JavasScript, está haciendo que también decaiga su utilización para estas tareas.</p>
<p>Entonces,  si como indica este estudio flash se utiliza mayoritariamente para mostrar video, ¿Qué pasará con la tecnología Flash cuando tarde o temprano se normalice el uso de HTML 5 y su etiqueta video?</p>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/html-y-flash-una-vision-actualizada/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
		<item>
		<title>Test heurístico – parte 3: Los principios heurísticos básicos</title>
		<link>http://www.circulodemaquetadores.com/principios-heuristicos-basicos/</link>
		<comments>http://www.circulodemaquetadores.com/principios-heuristicos-basicos/#comments</comments>
		<pubDate>Sun, 15 Nov 2009 21:51:16 +0000</pubDate>
		<dc:creator>Jorge López</dc:creator>
				<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1179</guid>
		<description><![CDATA[<p>Recordemos que el <a href="http://www.circulodemaquetadores.com/usabilidad/test-heuristico-parte-1-%C2%BFque-es-y-para-que-sirve/" target="_blank" title="Abre en nueva ventana">primer artículo de nuestra serie</a> dijimos que el estudio <span lang="en">Jakob Nielsen</span> desarrolló 10 principios de usabilidad bautizados como <strong>principios heurísticos básicos</strong> o <strong>reglas generales</strong>. A partir de estos principios señalados, se desarrollaron los heurístics o evaluadores de usabilidad, que permitieron a los evaluadoes realizar sus informes para describir los problemas de usabilidad de los <span lang="en">site</span> analizados. Pues bien, en este artículo repasaremos cuales son dichos principios básicos.</p>]]></description>
			<content:encoded><![CDATA[<p>Recordemos que el <a href="http://www.circulodemaquetadores.com/usabilidad/test-heuristico-parte-1-%C2%BFque-es-y-para-que-sirve/" target="_blank" title="Abre en nueva ventana">primer artículo de nuestra serie</a> dijimos que el estudio <span lang="en">Jakob Nielsen</span> desarrolló 10 principios de usabilidad bautizados como <strong>principios heurísticos básicos</strong> o <strong>reglas generales</strong>. A partir de estos principios señalados, se desarrollaron los heurístics o evaluadores de usabilidad, que permitieron a los evaluadoes realizar sus informes para describir los problemas de usabilidad de los <span lang="en">site</span> analizados. Pues bien, en este artículo repasaremos cuales son dichos principios básicos.</p>
<p>Los principios definidos por <span lang="en">Nielsen</span> los puedes encontar en <a href="http://www.useit.com/papers/heuristic/heuristic_list.html" target="_blank" title="Abre en nueva ventana">www.useit.com</a> y son los siguientes:</p>
<ul>
<li><strong>¿Qué está pasando?</strong>: el sistema siempre debería mantener informados a los usuarios de lo que está ocurriendo, a través de un <span lang="en">feedback</span> apropiada dentro de un tiempo razonable.
<ul>
<li><strong>Ejemplo</strong>: presentar mensajes de espera cuando se está efectuando una transacción o o bien de confirmación o cuando se ha efectuado una operación solicitada por el usuario</li>
</ul>
</li>
<li><strong>Relaciona el sistema y el mundo real</strong>: el sistema debería hablar el lenguaje de los usuarios mediante frases y conceptos que sean familiares al usuario, más que con términos relacionados con el sistema. Seguir las convenciones del mundo real, haciendo que la información aparezca en un orden comprensible y lógico.</li>
<li><strong>Control y libertad del usuario</strong>: los usuarios frecuentemente hacen elecciones por error y deben contar con una &quot;salida de emergencia&quot; para dejar las cosas tal como estaban, sin contar con el botón &quot;back&quot; que cada <span lang="en">browser</span> incluye.
<ul>
<li><strong>Ejemplo</strong>: que el usuario sienta que tiene el control de la web es fundamental, por ello las animaciones que requieren plug-ins especiales y no tienen una forma de &quot;saltarlas&quot;, los pop-ups y las ventanas que se abren de repente, son muy nocivas para una buena experiencia.</li>
</ul>
</li>
<li><strong>Consistencia y estándares</strong>: nuestro sitio debe ser consistente en cuanto a los nombres de las secciones, botones y contenidos de las mismas.
<ul>
<li><strong>Ejemplo</strong>: un enlace a &quot;ayuda&quot; debe llevar a una página que se llame así y no &quot;preguntas frecuentes&quot;.</li>
</ul>
</li>
<li><strong>Prevención de errores</strong>: mcho mejor que los buenos mensajes de error, es un diseño cuidado que prevenga que ocurran éstos.</li>
<li><strong>Es mejor reconocer, que recordar</strong>: el usuario no debería recordar la información que se le da en una parte del proceso, para seguir adelante. Si bien es imposible tener todas las opciones a la vista en sitios demasiado extensos, al menos debería haber una categorización clara de los contenidos que indique el camino a seguir.</li>
<li><strong>Flexibilidad y eficiencia de uso</strong>: a pesar de que los aceleradores, no son muy utilizados por los usuarios más novatos, hay que tener en cuenta a los más avanzados que sí lo hacen. Nuestra página debe ser fácil de indexar en una lista de favoritos. Esto se logra evitando el uso intensivo de frames y utilizando nombres de ficheros que no caduquen.</li>
<li><strong>Diseño práctico y simple</strong>:  los diálogos no deben contener información irrelevante que distraiga o entorpezca la navegación. Es preferible que esta información esté enlazada para que quien la requiera pueda verla, pero que no moleste a los que no la necesitan. Si quieres más información sobre como es un patrón de lectura de los usuarios web, échale un vistazo a <a href="http://www.circulodemaquetadores.com/usabilidad/%C2%BFcomo-leen-en-la-web-los-usuarios/" target="_blank" title="Abre en nueva ventana">este artículo</a>. </li>
<li><strong>Ayuda, por favor</strong>: los mensajes de error se deben entregar en un lenguaje claro y simple, indicando en forma precisa el problema y sugerir una solución constructiva al problema.</li>
<li><strong>Compatibilidad</strong>: nuestra página debe ser compatible con distintas versiones de navegadores y sistemas operativos.</li>
</ul>
<p>En el siguiente artículo por fín comenzaremos a enumerar los evaluadores de usabilidad para que podamos empezar a utilizarlos en nuestros análisis.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/principios-heuristicos-basicos/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Estudio de patrón de lectura de usuarios web</title>
		<link>http://www.circulodemaquetadores.com/%c2%bfcomo-leen-en-la-web-los-usuarios/</link>
		<comments>http://www.circulodemaquetadores.com/%c2%bfcomo-leen-en-la-web-los-usuarios/#comments</comments>
		<pubDate>Mon, 19 Oct 2009 19:28:51 +0000</pubDate>
		<dc:creator>Jorge López</dc:creator>
				<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1115</guid>
		<description><![CDATA[<blockquote cite="http://www.managementconsultingnews.com/interviews/krug_interview.php">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".
<strong>Steve Krug</strong></blockquote>
<p>Según un <a href="http://www.useit.com/alertbox/reading_pattern.html" target="_blank" title="Abre en nueva página">estudio</a> realizado por Jackob Nielsen, <strong>los usuarios no leen, sino que escanean la página</strong> 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.</p>
<img style="width:600px" src="http://www.useit.com/alertbox/f_reading_pattern_eyetracking.jpg" alt="Patrón de lectura" />
<p>Como se puede ver en esta foto, el patrón de lectura que genera el test de usuario tiene forma de “F”.</p>]]></description>
			<content:encoded><![CDATA[<blockquote cite="http://www.managementconsultingnews.com/interviews/krug_interview.php"><p>Pensamos en crear &#8220;literatura de calidad&#8221; (o al menos &#8220;el folleto de un producto&#8221;), cuando la realidad del usuario está mucho más próxima a la &#8220;cartelera publicitaria que pasa a 100 kilómetros por hora&#8221;.<br />
<strong>Steve Krug</strong></p></blockquote>
<p>Según un <a href="http://www.useit.com/alertbox/reading_pattern.html" target="_blank" title="Abre en nueva página">estudio</a> realizado por Jackob Nielsen, <strong>los usuarios no leen, sino que escanean la página</strong> 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.</p>
<p><img style="width:600px" src="http://www.useit.com/alertbox/f_reading_pattern_eyetracking.jpg" alt="Patrón de lectura" /></p>
<p>Como se puede ver en esta foto, el patrón de lectura que genera el test de usuario tiene forma de “F”.</p>
<p><a href="http://www.useit.com/alertbox/percent-text-read.html" target="_blank" title="Abre en nueva página">Otro estudio</a> 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 <strong>un 17% están menos de 4 segundos antes de pasar a otra página</strong>. Esto nos da una idea bastante clara del carácter del usuario.</p>
<h2>Las personas como depredadores de información</h2>
<p>El uso corriente de Internet viene motivado por el deseo de ahorrar tiempo. <strong>El usuario sólo busca las partes que se ajustan a su interés</strong>. El resto de información es simplemente irrelevante. Hojear es la forma de encontrar las partes que nos interesan.</p>
<p>A este respecto, es muy interesante la teoría que desarrollaron a principios de los años 90,  <span lang="en"><strong>Peter Pirolli</strong> y <strong>Stuart Card</strong></span>. Según su <a href="http://www.pixelcharmer.com/essays/information-foraging.html" target="_blank" title="Abre en nueva página">teoría del rastreo o forrajeo de información</a> (<span lang="en">Information Foraging</span>) , 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.</p>
<p>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.</p>
<p>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.</p>
<h2>Como mejorar el rastro de información de nuestras páginas:</h2>
<ul>
<li><strong>Indica la información más importante en los dos primeros párrafos de cada página</strong>: 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.</li>
<li><strong>Busca las palabras más comunes respecto a la temática de tu web</strong>: Estas palabras llaman mucho la atención e incitan a hacer clic en los enlaces que las contienen.</li>
<li><strong>No entierres el contenido en documentos demasiado largos</strong>: Divide los textos en varios documentos enlazados o crea un índice que permita identificar y moverse por las secciones de cada documento.</li>
<li><strong>Realiza un estudio las estadísticas de tu página</strong>: 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.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/%c2%bfcomo-leen-en-la-web-los-usuarios/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Mejorar fácilmente tu sitio Web</title>
		<link>http://www.circulodemaquetadores.com/mejorar-web/</link>
		<comments>http://www.circulodemaquetadores.com/mejorar-web/#comments</comments>
		<pubDate>Fri, 09 Oct 2009 22:14:57 +0000</pubDate>
		<dc:creator>Álvaro Brito</dc:creator>
				<category><![CDATA[Accesibilidad Web]]></category>
		<category><![CDATA[Semántica Web]]></category>
		<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1064</guid>
		<description><![CDATA[<p>Tanto si eres un administrador, un desarrollador Web, un miembro de un equipo de <strong>Marketing</strong> o de Comunicaciones, o quizá un <strong>Web Master Freelance</strong>, 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í <strong>validar y mejorar tu sitio Web</strong>.</p>
<p class="alignCenter"><img src="/images/w3c.jpg" alt="W3C" /></p>
<p>Desde <a href="http://www.w3.org/QA/IG/" title="Abre en ventana nueva (en inglés)" hreflang="en" target="_blank">Grupo de Trabajo de Aseguramiento de la Calidad</a> del <strong>W3C</strong>. Dónde nos enseña un método que es válido para <strong>sitios Web</strong> 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.</p>]]></description>
			<content:encoded><![CDATA[<p>Tanto si eres un administrador, un desarrollador Web, un miembro de un equipo de <strong>Marketing</strong> o de Comunicaciones, o quizá un <strong>Web Master Freelance</strong>, 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í <strong>validar y mejorar tu sitio Web</strong>.</p>
<p>Desde <a href="http://www.w3.org/QA/IG/" title="Abre en ventana nueva (en inglés)" hreflang="en" target="_blank">Grupo de Trabajo de Aseguramiento de la Calidad</a> del <strong>W3C</strong>. Dónde nos enseña un método que es válido para <strong>sitios Web</strong> 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.</p>
<p class="alignCenter"><img src="/images/w3c.jpg" alt="W3C" /></p>
<p>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 <strong>flujo de trabajo</strong> Ordenados en los siguientes pasos:</p>
<ul>
<li>Decide qué es lo que probarás</li>
<li>Analiza tu sitio Web</li>
<li>Organiza el trabajo</li>
<li>¿Cómo puedes mejorar tu sitio?</li>
<li>Revisa</li>
<li>Mantén el nivel de calidad</li>
</ul>
<p>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:</p>
<p class="alignCenter"><a class="boton" href="http://www.w3.org/QA/2003/03/web-kit">Leer artículo completo W3C</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/mejorar-web/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Persuabilidad Web: convierte usuarios en clientes</title>
		<link>http://www.circulodemaquetadores.com/persuabilidad-web/</link>
		<comments>http://www.circulodemaquetadores.com/persuabilidad-web/#comments</comments>
		<pubDate>Thu, 08 Oct 2009 18:51:45 +0000</pubDate>
		<dc:creator>Álvaro Brito</dc:creator>
				<category><![CDATA[Posicionamiento Web]]></category>
		<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1053</guid>
		<description><![CDATA[<p>Antes de presentar el artículo quiero daros una breve introducción sobre la persuabilidad y su uso en la Web</p>
<h2>¿Qué es la persuabilidad?</h2>
<p>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.</p>
<p class="alignCenter"><img src="/images/persuabilidad.jpg" alt="Persuablidad Web" /></p>]]></description>
			<content:encoded><![CDATA[<p>Antes de presentar el artículo quiero daros una breve introducción sobre la persuabilidad y su uso en la Web</p>
<h2>¿Qué es la persuabilidad?</h2>
<p>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.</p>
<p class="alignCenter"><img src="/images/persuabilidad.jpg" alt="Persuablidad Web" /></p>
<p><strong>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:</strong></p>
<ul>
<li><strong>Palabras claves con textos dinámicos</strong> que utilizan las palabras claves de nuestras campañas o las búsquedas naturales de nuestros usuarios para contextualizar los mensajes?</li>
<li><strong>Contextualización de nuestra información</strong> 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.</li>
<li><strong>Proactividad comercial en nuestros buscadores internos</strong>. 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.</li>
<li><strong>Reglas de negocio en función de criterios concretos</strong> (momento del día o del mes, situación del cliente, páginas visitadas,&#8230;). La tecnología ya nos permite hacer una microsegmentación en la que nadie del mundo del marketing nunca hubiera ni soñado.</li>
<li><strong>Capas y niveles de contenidos distintos</strong> 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.</li>
<li><strong>Creación de precios dinámicos en función de los niveles de venta</strong>, los ratios de conversión o las promociones que estemos desarrollando.</li>
<li><strong>Customización de mensajes en función del comportamiento actual o histórico de nuestros usuarios</strong>. El <a href="http://es.wikipedia.org/wiki/Behavioral_targeting" target="_blank" title="Abre en ventana nueva">behavioral targeting</a> 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).</li>
<li><strong>Ofertas de última hora para aquellos usuarios que estén abandonando nuestro site</strong>. 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.</li>
<li><strong>Envíos automatizados de mails según comportamiento en el site</strong> (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.</li>
<li><strong>Personalización y configuración a medida de nuestros productos deseados</strong>. 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.</li>
<li><strong>Relleno de campos automatizados para clientes reincidentes</strong>. La simplificación de pasos o trabajo parece ya de obligado cumplimiento para evitar abandonos por el camino.</li>
<li><strong>Activación de chats proactivos en determinados momentos</strong>. 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.</li>
</ul>
<p>Por último quiero dejaros con una ponencia de <a href="http://comunicat.typepad.com/persuabilitat/" target="blank" title="Abre en ventana nueva">Ester Pallarès</a>, experta en <strong>persuablidad Web</strong>. En la que nos muestra como funciona esto de la persuabilidad y como convertir a nuestros usuarios en clientes.</p>
<p class="alignCenter"><a class="boton" href="http://www.slideshare.net/CongresodeWebMasters/persuabilida-esterpallares">Ver ponencia Persuabilidad: convierte usuarios en clientes</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/persuabilidad-web/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Test heurístico – parte 2: Como hacer un informe</title>
		<link>http://www.circulodemaquetadores.com/test-heuristico-como-hacer-un-informe/</link>
		<comments>http://www.circulodemaquetadores.com/test-heuristico-como-hacer-un-informe/#comments</comments>
		<pubDate>Wed, 30 Sep 2009 14:19:38 +0000</pubDate>
		<dc:creator>Jorge López</dc:creator>
				<category><![CDATA[Usabilidad Web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=1019</guid>
		<description><![CDATA[<p>En el primer artículo de esta serie, <a href="http://www.circulodemaquetadores.com/usabilidad/test-heuristico-parte-1-%C2%BFque-es-y-para-que-sirve/" target="_blank" title="Abre en nueva ventana">Test heurístico – parte 1: ¿Qué es y para que sirve?</a>, se explicó de manera general que era un test heurístico, para que servía y las ventajas que tenía respecto a otros test de usabilidad. Debemos recordar  que en la heurística, todo gira alrededor de <strong>los factores de evaluación, que son una lista de principios de usabilidad comúnmente aceptados</strong> que aplicaremos a nuestros análisis.</p>]]></description>
			<content:encoded><![CDATA[<p>En el primer artículo de esta serie, <a href="http://www.circulodemaquetadores.com/usabilidad/test-heuristico-parte-1-%C2%BFque-es-y-para-que-sirve/" target="_blank" title="Abre en nueva ventana">Test heurístico – parte 1: ¿Qué es y para que sirve?</a>, se explicó de manera general que era un test heurístico, para que servía y las ventajas que tenía respecto a otros test de usabilidad. Debemos recordar  que en la heurística, todo gira alrededor de <strong>los factores de evaluación, que son una lista de principios de usabilidad comúnmente aceptados</strong> que aplicaremos a nuestros análisis.</p>
<p>El resultado de un test heurístico,  es un <strong>informe emitido por el evaluador</strong> en el que describe el problema analizado, las reglas específicas que son afectadas por su comportamiento y cómo podría mejorar el cumplimiento de ellas con un cambio en la interfaz. Hay que añadir que si bien esto último no es posible, sí será importante que los problemas encontrados sean anotados con el fin de intentar hacer las modificaciones posibles para aportar a su solución.</p>
<p>Así pues, en este artículo veremos que aspectos debe incluir un buen informe de evaluación heurística. Dicho informe está dividido en varias secciones:</p>
<h2>Descripción del método a seguir: </h2>
<p>En esta parte de la evaluación se  debe hacer una breve descripción de las características del proceso realizado. Al fin y al cabo, el cliente tiene derecho a saber porque vale tanto el informe que le estamos confeccionando. Entre los elementos que hay que citar incluiremos los siguientes:</p>
<ul>
<li>Fecha y hora de la evaluación.</li>
<li>Tipo de conexión a Internet, para descartar problemas de velocidad y optimización.</li>
<li>Datos sobre la forma y la puntuación de la evaluación.</li>
<li>Justificación de los diferentes factores utilizados en nuestra lista de comprobación</li>
</ul>
<h2>Criterios de evaluación</h2>
<p>Es necesario que los analistas que la lleven a cabo el test, tengan un sistema de evaluación que permita interpretar y homologar los comentarios vertidos a cada factor evaluador.</p>
<p>Nuestra escala de evaluación irá a de 1 a 5:</p>
<ol>
<li><strong>No funciona:</strong> Existen graves defectos en la estructura y diseño de la página. No se muestran los contenidos correctamente. El evaluador debe recomendar rehacer todo el sitio.</li>
<li><strong>Funciona pero no sirve:</strong> A pesar de que los contenidos del sitio se muestran de manera aceptable, la experiencia general y navegación no son correctas. Se debe recomendar cambiar la mayor parte del sitio.</li>
<li><strong>Funciona pero debe mejorar: </strong>El contenido y su distribución es de relativa calidad, pero es susceptible a mejoras. Se deben  aportar mejoras al sitio.</li>
<li><strong>Cumple:</strong> El contenido evaluado es satisfactorio, a pesar de todo hay detalles que pueden mejorar. Se deben  aportar mejoras al sitio.</li>
<li><strong>Es lo que el usuario busca:</strong> El contenido cumple o excede la expectativa del usuario.</li>
</ol>
<p>Dichas notas deben ser puestas, tras analizar los factores de evaluación, que vamos creando alrededor de las diferentes áreas de un sitio web. Los factores se articulan alrededor de estas áreas:</p>
<ul>
<li>Generales</li>
<li>Identidad e información</li>
<li>Lenguaje y redacción</li>
<li>Rotulado</li>
<li>Estructura y navegación</li>
<li>Lay – out de la página</li>
<li>Búsqueda</li>
<li>Elementos multimedia</li>
<li>Ayuda</li>
<li>Accesibilidad</li>
<li>Control y retroalimentación</li>
</ul>
<h2>Desarrollo del Informe</h2>
<p>Puntuados los factores, el evaluador debe hacer un comentario que explique al usuario el estado real de su sitio, de está manera se podrán sacar conclusiones. Habrá que recopilar los aspectos positivos y negativos de cada factor evaluado. Con estos apuntes se hará más fácil la tarea de mejorar el sitio web.</p>
<h2>Conclusión Final</h2>
<p>En esta parte se entrega la recomendación final respecto de los problemas encontrados. En función de los resultados obtenidos con este informe, el cliente podrá decidir si es conveniente o no, hacer un análisis más detallado o cualquier otro tipo de inspección de usabilidad.</p>
<h2>Número de expertos</h2>
<p>Respecto del número de expertos que debe llevar a cabo dicho informe para que éste tenga validez, todo dependerá del costo-beneficio. Más evaluadores deberían ser usados en casos en que la usabilidad de una web sea crítica para la rentabilidad de la misma.</p>
<p>Con estos pequeños apuntes, nos podemos hacer una idea de cómo se hace un informe heurístico. En los siguientes artículos, veremos los principios heurísticos básicos que propuso Jakob Nielsen y confeccionaremos una detallada lista de factores para que podamos aplicarlos a nuestras propias páginas. </p>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/test-heuristico-como-hacer-un-informe/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Estudio de Usabilidad Móvil de Jacob Nielsen</title>
		<link>http://www.circulodemaquetadores.com/estudio-de-usabilidad-movil-nielsen/</link>
		<comments>http://www.circulodemaquetadores.com/estudio-de-usabilidad-movil-nielsen/#comments</comments>
		<pubDate>Thu, 17 Sep 2009 22:05:22 +0000</pubDate>
		<dc:creator>Álvaro Brito</dc:creator>
				<category><![CDATA[Usabilidad Web]]></category>
		<category><![CDATA[Web Móvil]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=969</guid>
		<description><![CDATA[<p><a href="http://es.wikipedia.org/wiki/Jakob_Nielsen" title="Abre en Ventana Nueva" target="_blank">Jacob Nielsen</a>, experto en estudios de usabilidad, ha realizado un <strong>estudio de usabilidad</strong> sobre el uso de la <strong>Web móvil</strong> en general, con 48 participantes en los EE.UU. y Reino Unido. Se realizó una revisión de diseño de 20 sitios Web, con 6 teléfonos: un teléfono móvil de pantalla táctil, tres teléfonos inteligentes (smartphones) diferentes, y dos teléfonos de contacto diferentes.</p>
<p class="alignCenter"><img src="/images/usabilidad-movil.jpg" alt="Usabilidad Web Móvil" /></p>
<p>El estudio revela que el uso de la Web en un teléfono móvil varía dependiendo de las <strong>características del dispositivo</strong> que se use. Como era de esperar, se descubrió que los sitios diseñados específicamente para su uso en un teléfono móvil rinde sustancialmente mejor, que los "sitios completos" y no adaptados para ello. Cosa que debemos tener muy en cuenta para nuestros proyectos Web.</p>]]></description>
			<content:encoded><![CDATA[<p><a href="http://es.wikipedia.org/wiki/Jakob_Nielsen" title="Abre en Ventana Nueva" target="_blank">Jacob Nielsen</a>, experto en estudios de usabilidad, ha realizado un <strong>estudio de usabilidad</strong> sobre el uso de la <strong>Web móvil</strong> en general, con 48 participantes en los EE.UU. y Reino Unido. Se realizó una revisión de diseño de 20 sitios Web, con 6 teléfonos: un teléfono móvil de pantalla táctil, tres teléfonos inteligentes (smartphones) diferentes, y dos teléfonos de contacto diferentes.</p>
<p class="alignCenter"><img src="/images/usabilidad-movil.jpg" alt="Usabilidad Web Móvil" /></p>
<p>El estudio revela que el uso de la Web en un teléfono móvil varía dependiendo de las <strong>características del dispositivo</strong> que se use. Como era de esperar, se descubrió que los sitios diseñados específicamente para su uso en un teléfono móvil rinde sustancialmente mejor, que los &#8220;sitios completos&#8221; y no adaptados para ello. Cosa que debemos tener muy en cuenta para nuestros proyectos Web.</p>
<p><strong>Nielsen</strong> también en comparación con un estudio del año 2000. Las mismas tareas que llevan más tiempo a hacer hoy, que los que lo  hicieron en el año 2000 en un <strong>teléfono WAP</strong>. Sugiere que la razón principal es que en aquel entonces, la <em>web móvil</em> era un &#8220;jardín cercado&#8221;, limitado, pero relativamente simple, mientras que hoy la Web es más abierta en los teléfonos móviles. Y la gente lo que necesita es ir a un <strong>motor de búsqueda</strong> y no perder tiempo en introducir y buscar una palabra, debido a los tiempos de carga para buscar una respuesta.</p>
<p>Como se ha comentado, con respecto al año 2000 la usabilidad Web en móviles <em>no ha progresado</em>, sobre todo en los tiempos de espera para ver los contenidos que buscas y teniendo en cuenta que las conexiones a Internet son mucho más rapidas que hace 9 años. Pero poco a poco se piensa mas en el <strong>diseño Web para Móvil</strong>, ya que es el futuro de la Web.</p>
<h2>Las pantallas grandes y la manipulación directa tiene un gran impacto en la usabilidad.</h2>
<p>Como era de esperar, entre más grande sea la pantalla, mejor será la <strong>experiencia del usuario</strong> al acceder a sitios Web. A continuación os dejo con el promedio de exito en estos dispositivo:</p>
<ul>
<li><strong>Teléfonos móviles de contacto</strong> 38%</li>
<li><strong lang="en">Smartphones</strong> 55%</li>
<li><strong>Teléfonos de pantalla táctil</strong> 75%</li>
</ul>
<p>Con estos números, el consejo para los consumidores es fácil: comprar un teléfono de contacto si los sitios Web que están utilizando son importantes para ellos.</p>
<p>El consejo para los <strong>Desarrolladores Web</strong> es más difícil. Los teléfonos de uso tienen una mejor facilidad de uso, pero <em>¿realmente se usa para navegar, lo suficiente como para tenerlos en cuenta?</em>. Otra posibilidad es centrarse en los usuarios de <strong>teléfonos smartphone y teléfonos táctiles</strong> que son más propensos a navegar por la Web.</p>
<p>Fuente: <a href="http://www.useit.com/alertbox/mobile-usability.html" hreflang="en" title="Ver artículo completo (en inglés)">Mobile Usability</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/estudio-de-usabilidad-movil-nielsen/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Test heurístico &#8211; parte 1: ¿Qué es y para que sirve?</title>
		<link>http://www.circulodemaquetadores.com/test-heuristico-parte-1-%c2%bfque-es-y-para-que-sirve/</link>
		<comments>http://www.circulodemaquetadores.com/test-heuristico-parte-1-%c2%bfque-es-y-para-que-sirve/#comments</comments>
		<pubDate>Sun, 30 Aug 2009 11:36:02 +0000</pubDate>
		<dc:creator>Jorge López</dc:creator>
				<category><![CDATA[Usabilidad Web]]></category>
		<category><![CDATA[heurística]]></category>
		<category><![CDATA[test heurístico]]></category>
		<category><![CDATA[usabilidad web]]></category>

		<guid isPermaLink="false">http://www.circulodemaquetadores.com/?p=726</guid>
		<description><![CDATA[<p>Existen diferentes técnicas de análisis de usabilidad de una web. El <strong>test heurístico</strong> es una técnica que nos puede resultar muy interesante por su eficacia, su relativa rapidez de utilización y su facilidad de uso.</p>
<p>Los <strong>heuristics  son una serie de factores</strong> de usabilidad que deben ser considerados a la hora de realizar un análisis de una web.
Estos factores sirven tanto para analizar un site antes de hacer una propuesta de diseño, como para auditar secciones ya finalizadas en la fase de producción.</p>]]></description>
			<content:encoded><![CDATA[<p>Existen diferentes técnicas de análisis de usabilidad de una web. El <strong>test heurístico</strong> es una técnica que nos puede resultar muy interesante por su eficacia, su relativa rapidez de utilización y su facilidad de uso.</p>
<p>Los <strong>heuristics son una serie de factores</strong> de usabilidad que deben ser considerados a la hora de realizar un análisis de una web.</p>
<p><span id="more-726"></span></p>
<p>Tras la aparición del web, la consultora <strong>Jakob Nielsen</strong> desarrolló varios estudios que describían la existencia de un conjunto de principios de medición de la usabilidad. El cumplimiento de éstos, permitiría asegurar la calidad de usable de una web. A estos criterios se les llamó <strong>principios heurísticos</strong> y suman diez.</p>
<p>A partir de los principios antes mencionados, se enunciaron varios heuristics. Nielsen propuso que un grupo de expertos pudiera revisar la usabilidad de un Sitio Web –ya fuera en estado operativo o en etapa de construcción- y contrastar su funcionamiento contra este nuevo grupo de heuristics. A dicha prueba se le conoce generalmente como &#8220;test heurístico&#8221;.</p>
<p>Se ha detectado que una evaluación heurística, detecta aproximadamente el 42% de los problemas graves de <em>diseño</em> y de <em>usabilidad</em> y el 32% de los problemas menores, dependiendo del número de factores que se le apliquen al site. Posteriormente se recomienda realizar un <strong>test de usuarios</strong> para completar la evaluación.</p>
<h2>Ventajas del test heurístico</h2>
<ul>
<li>La principal ventaja de la evaluación heurística es su <strong>bajo coste</strong> en relación a un test de usuarios.</li>
<li>En la evaluación heurística <strong>no es necesaria la interpretación externa</strong>, porque la información elaborada por los evaluadores, a partir de los factores de usabilidad, está contenida en sus informes.</li>
<li>Puede ser usado en fases tempranas del proceso de desarrollo.</li>
<li>Los evaluadores no requieren entrenamiento formal en usabilidad.</li>
</ul>
<h2>Desventajas del test heurístico</h2>
<ul>
<li>Los evaluadores individuales identifican un número relativamente pequeño de aspectos de usabilidad</li>
<li>El evaluador sólo simulará el comportamiento de un usuario. El feedback del usuario real sólo puede ser obtenido de un test de usuario</li>
<li>No siempre propone soluciones inmediatas a los aspectos de usabilidad que son identificados</li>
<li>Las evaluaciones heurísticas pueden ser propensas a reportar falsas alarmas- que los problemas detectados no sean problemas de usabilidad en la aplicación</li>
</ul>
<h2>Procedimiento</h2>
<ol>
<li>Es recomendable que el evaluador navegue por el site al menos dos veces, para familiarizarse con su estructura y antes de comenzar con la evaluación propiamente dicha.</li>
<li>A la hora de llevar a cabo un análisis heurístico, será importante contar con una lista de factores que pueda recoger los aspectos a evaluar. De esta manera, se evita que un evaluador olvide estudiar alguna faceta de la interfaz.</li>
<li>El análisis de cada problema detectado por el evaluador se ha de realizar por separado y no en conjunto.</li>
<li>En el caso de que se disponga de una site terminado, es aconsejable realizar la evaluación heurística antes de los test de usuario. Un test de usuario previo solo serviría para detectar problemas de usabilidad que en una evaluación heurística hubieran sido fácilmente detectadas por los expertos a un coste mucho menor.</li>
<li>Como nos dice <strong>Eduardo Manchón</strong> en su artículo <a title="Abre en nueva ventana" href="http://www.alzado.org/articulo.php?id_art=74" target="_blank">Evaluación heurística (o por expertos) de la usabilidad:</a><br />
<blockquote><p>La jerarquización de la gravedad de los problemas del sitio facilitará la aplicación posterior de políticas de rediseño del sitio web efectivas. La gravedad de los problemas de usabilidad es medida por tres factores <strong> la frecuencia</strong> con la que el problema ocurre, <strong>el impacto</strong> del problema cuando sucede y <strong>la persistencia</strong> del problema.</p></blockquote>
</li>
</ol>
<p>En los siguientes artículos, veremos como realizar un informe, los principios heurísticos básicos y comenzaremos a elaborar una lista de factores, (o lista de comprobación), lo más completa posible que nos permita elaborar un test heurístico eficiente.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.circulodemaquetadores.com/test-heuristico-parte-1-%c2%bfque-es-y-para-que-sirve/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

