GLATINA COMUNICACIÓN - BLOG

Artículo original: Basics of search engine optimisation
Autor: Roger Johansson
Fecha: 3 de febrero de 2005
Traducido por: Gabriel Porras

En nuestro día a día de vez en cuando nos contactan nuestros clientes para preguntarnos acerca del posicionamiento y la optimización en los buscadores. La mayoría de las veces, nuestro cliente ya ha sido abordado por un Consultor de SEO (Search Engine Optimisation / Optimización en Buscadores) quien trata de venderle, por mucho dinero, la optimización en los buscadores. La firma de SEO promete “garantía de estar en las primera posiciones” y la “adición a 500.000 buscadores y directorios”.

Muchos dueños de sitios son contactados regularmente por este tipo de compañías estafadoras, y es entendible que muchos piquen el anzuelo y comiencen a pagar por “las primeras posiciones y la adición a todo [buscador]”. Después de todo, ¿quién no quiere que su sitio esté bien posicionado en los buscadores?

En un intento de ayudar a algunos y evitar que paguen por una optimización innecesaria en los buscadores, me gustaría compartir lo que he hecho para lograr muy buenas posiciones en los buscadores, tanto para mi sitio como para los de mis clientes.

Primero, déjenme decir que no todos los consultores de SEO son estafadores –hay muchas firmas respetables en el negocio. Sin embargo, cualquiera que prometa “garantía de estar en las primera posiciones”, “adición a 500.000 buscadores y directorios”, “resultados instantáneos” o “primeras posiciones permanentes” es probablemente un estafador. No hay manera de que alguien garantice que tu sitio obtenga la posición número uno a menos de que esa persona controle los resultados del buscador, o que la primera posición sea por una palabra o frase que sólo exista en tu sitio, por supuesto.

Lo que me llama la atención, cada vez que pienso en lo que he hecho para obtener buenas posiciones en los motores de búsqueda, es lo mucho que el SEO tiene en común con la accesibilidad, usabilidad y un marcado [HTML] de alta calidad –los principios de los estándares Web. Esto lo hace aún mucho mejor: haciendo tu sitio más accesible y usable para las personas, y usando un marcado [HTML] válido y semántico [con significado], también lo hará más atractivo para los robots de los buscadores.

Considera las guías que describo aquí como un nivel básico de SEO –pruébalo primero y si aún no obtienes los resultados que quieres, entonces busca la ayuda de una firma acreditada en optimización para los buscadores. Si contactas a alguien para que optimice tu sitio, pregúntale qué es lo que le harán a tu sitio. Si te sugieren métodos sospechosos, se muy cuidadoso. Ellos pueden hacer que seas penalizado o aún peor, que seas sacado de los buscadores. De otro lado, si su sugerencia incluye lo que te estoy sugiriendo aquí, probablemente harán un buen trabajo.

1. No hay atajos
Comenzaré con las malas noticias, si lo que estás buscando es una forma rápida y fácil de obtener buenos resultados. No la hay. Por el contrario, te espera bastante trabajo, especialmente cuando se trata del contenido de tu sitio.

También necesitas paciencia. Los resultados no llegan de la noche a la mañana. Si estás trabajando en mejorar el posicionamiento en los buscadores del sitio de un cliente, probablemente deberías explicarle esto como primera medida.

2. Escribe buen contenido
Esta es probablemente la cosa más importante que necesitas hacer si quieres ser encontrado en la web. Aún, si tu sitio es técnicamente perfecto para los robots de los buscadores, éstos no harán nada a menos que esté lleno de buen contenido. ¡Si! Te lo aseguro.

Un buen contenido para mi es aquel texto que sea real y gramáticamente correcto, aunque esto no es necesariamente obligatorio para toda tipo de sitios. Y no importa de lo que sea tu sitio, el contenido necesita ser único y/o lo suficientemente específico como para ser atractivo a la gente. Más específicamente, necesita ser útil a la gente que quieres que encuentre tu sitio.

Con un buen contenido logras que tus visitantes vuelvan. Y aquellos a quienes les guste tu contenido eventualmente vincularán tu sitio, y el tener muchos vínculos que provengan de afuera es algo muy bueno para el posicionamiento en los buscadores, especialmente si esos vínculos son de sitios altamente posicionados.

Estrechamente relacionado con el buen contenido es el contenido reciente. El adicionar nuevo contenido regularmente, le da a tus visitantes una razón para volver. Los robots de los buscadores también visitarán tu sitio más a menudo una vez que se den cuenta que actualizas regularmente, lo que significa que cada nuevo contenido que adiciones será indexado más rápido.

Cuando se está trabajando para un cliente, el crear contenido de calidad es rara vez responsabilidad del diseñador web. A menudo, el cliente quiere escribir su propio “copy”, lo cual está bien si es bueno en eso y se dedica a adicionar nuevo contenido. En mi experiencia, es raro el caso que sea así. Si es posible, trata de que el cliente se de cuenta que deben contratar a alguien para que le ayude a escribir o al menos que les ayude a editar lo que han escrito. En todo caso, hazles saber claramente que no pueden esperar altos posicionamientos consistentemente sin un buen contenido.

3. Piensa en escribir correctamente [buena ortografía]
Si escribes en inglés [en nuestro caso español], probablemente eres consciente de las diferencias entre escribir en inglés norteamericano al británico [como las diferencias que pueden existir entre el español colombiano, el español (de España) o el mexicano].
[Como ejemplos de las diferencias entre los norteamericanos y los ingleses tenemos:] Colour vs. color, optimisation vs. optimization, etc. También hay muchas palabras que se escriben ortográficamente mal (y esto va para todos los idiomas).

No me gusta la idea de intencionalmente escribir mal las palabras, puesto que va contra mi definición de “buen contenido”. Si tienes dentro de tu contenido palabras que se puedan escribir de varias maneras [diferente ortografía] o que se escriben comúnmente mal, y son parte importante de tu contenido, es decir, que sean palabras claves, considera adicionar un glosario o algo similar en la página donde incluyas la mayoría de las variaciones de esas palabras.

4. Escribe títulos de página descriptivos
El hacer los títulos de las páginas sencillos, pero descriptivos y relevantes, haces que sea más fácil para los buscadores saber de qué se trata cada página, y que la gente mientras que mira en los resultados de sus búsquedas pueda determinar rápidamente si tu página contiene lo que están buscando. El título de la página también es usado para vincular tu sitio desde las páginas de resultados en los buscadores.

Debido a esto, el título es uno de los elementos más importantes de la página. Algunos argumentan que es el más importante.

Cuando se trata del orden del texto en el título, he encontrado que lo siguiente funciona bien:

Titulo del Documento | Nombre de la sección | Nombre del sitio o la compañía

Basada en esta discusión un tiempo atrás, este es probablemente uno de los mejores formatos para el texto en un titulo accesible. Nuevamente, la accesibilidad y el trabajo en SEO juntos.

No importa lo que hagas, no uses el mismo título para todos los documentos. Haciéndolo harás el trabajo más difícil para los buscadores, para la gente que navega a través de los resultados en un buscador y para los visitantes para identificar de qué se tratan tus páginas.

5. Usa encabezados [headings] reales
Usa los elementos [HTML] h1 a h6 para los encabezados. El utilizar gráficas te permitirá usar el tipo de letra que quieras, pero los buscadores no les prestarán mucha atención. Aún si usas el atributo alt para especificar el texto alternativo para las imágenes (tal como debe ser), ese texto no será ni cerca tan importante como el texto real en un encabezado. En mi experiencia, esto es verdad aún si la imagen está dentro de los encabezados.

Si no puedes usar texto real, dale un vistazo a la variedad de técnicas de reemplazo con imágenes o flash disponibles. Ten cuidado que hay un pequeño riesgo al hacerlo. Debido a que estas técnicas de reemplazo involucran el esconder el texto, es teóricamente posible que los buscadores te penalicen. Actualmente ese riesgo parece ser muy pequeño, pero no digas que no te lo advertí si llega a pasar.

6. Usa URLs amigables para los buscadores
Evita URLs generados dinámicamente y que usen el “query string” para que el servidor sepa qué información traer de la base de datos [Ej: www.sitio.com/producto.asp?id=15]. Los robots de los buscadores posiblemente tengan dificultades con este tipo de URLs –Paran en el carácter de interrogación y ni siquiera miran el “query string”.

En lugar de eso, utiliza URLs amigables para los buscadores y legibles para las personas [Ej: www.sitio.com/productos/producto1.asp]. Ayudará tanto a tu posicionamiento como a tus usuarios. He visto increíbles mejoras en los resultados de los buscadores tan solo cambiando el esquema de los URLs del sitio.

Modificar y reescribir los URLs de un sitio puede ser un poco difícil, y algunos Sistemas Manejadores de Contenido (CMS – Content Managment Systems) hacen más difícil que otros su implementación. Sin embargo vale la pena. Este par de recursos te ayudarán a hacer mejor tus URLs:

• Generando URLs simples para los Buscadores (Generating Simple URLs for Search Engines)
• mod_rewrite: Una Guía para Principiantes para la re-escritura de URLs (A Beginner’s Guide to URL Rewriting)

7. Haz que te vinculen
No hay manera fácil ni sostenible para resolver esto excepto por –lo adivinaste- proveer buen contenido. Los vínculos entrantes son muy, muy importantes para el SEO. Esto es posiblemente la parte más dura de implementar en SEO.

Sin embargo, de acuerdo a mi experiencia, los vínculos entrantes son menos importantes entre más específico y único sea el contenido. Por ejemplo, un par de clientes están en lo que podrías llamar un nicho de mercado. No tienen muchos sitios vinculándolos, y aún así comenzaron a posicionarse muy bien en los buscadores una vez les apliqué a sus sitios el conocimiento que estoy compartiendo aquí.

8. Usa un marcado [HTML] válido, semántico, ligero y accesible
La mayoría de los navegadores tienen funcionalidades avanzadas para descifrar la confusa sopa de tags que es usada en la mayoría de los sitios actuales. No puedes esperar que los robots de los buscadores hagan lo mismo. Valida tu HTML y evita el marcado [HTML] de presentación –usa un marcado [HTML] tan ligero y limpio como sea posible.
Incrementa la proporción de contenido en HTML [en lugar de gráficas], hará tu sitio más rápido y más atractivo para los buscadores.

Un marcado [HTML] de alta calidad te ayudará a aumentar tus posiciones.

La accesibilidad también es algo muy importante. El hacer tu sitio más accesible para personas con problemas visuales también te ayudará a que los robots de los buscadores se ubiquen más fácilmente. Recuerda, Google es ciego, así que aun cuando no te interese que la gente ciega use tu sitio (aunque deberías) aún quieres que sea accesible. Esto significa que deberías usar encabezados reales [h1 a h6], párrafos [p] y listas [ul, ol y li], y evitar el usar cualquier otra cosa que interfiera con los robots de los buscadores.

Flash y Javascript están bien, siempre y cuando no se requieran para navegar tu sitio y acceder información vital. No escondas tu contenido dentro de archivos de Flash o detrás de un suntuoso menú en Javascript. Prueba tu sitio con Lynx [Aquí puedes descargar este y otros navegadores para discapacitados. También hay disponibles algunos simuladores de Lynx]. Navégalo apagando las gráficas, los CSS, el Javascript y el Flash. Si te da problemas, probablemente le causará problemas a los robots de los buscadores.

9. Agrega con cuidado tu sitio a los buscadores
A menudo, aunque valorado excesivamente, el agregar un sitio a los directorios y buscadores puede ser útil, especialmente si el sitio es nuevo y no ha sido captado por Google y otros buscadores. Sigue adelante y agrégalo a Google. No te dolerá, pero casi es seguro que Google te encontrará de todas maneras.

Dos directorios que pueden ser importantes para agregar son el Directorio de Yahoo y el Open Directory Project. Se paciente -probablemente tomará varias semanas para que tu solicitud sea procesada, a menos que les pagues para que te listen.

10. No trates de engañar a los buscadores
No uses camuflaje (cloaking), granjas de vínculos (link farms), rellenado de palabras claves (keyword stuffing), texto alternativo con spam (alt text spamming) u otras métodos engañosos. Funcionarán por un corto tiempo si estás con suerte, pero corres el riesgo de ser penalizado o lo que es peor, prohibido en los buscadores, que es precisamente lo que no quieres.

Los buscadores quieren que sus resultados sean acertados, y no les gusta cuando la gente trata de engañarlos. Así que no lo hagas.

11. Evita usar marcos (frames)
Aunque es posible suministrar soluciones alternas que permitan a los robots de los buscadores avanzar lentamente en los sitios basados en marcos, éstos pueden causar problemas a la gente que encuentra tu sitio en los buscadores.

Cuando alguien sigue un vínculo de la página de resultados de un buscador a un sitio basado en marcos, llegará a un documento huérfano, fuera de su conjunto de marcos padre (frameset). Muy probablemente esto causará confusión, ya que en muchos casos partes vitales del sitio, como los vínculos de navegación, estarán ausentes.

Algunos sitios usan JavaScript o código del lado del servidor para redireccionar, a cualquiera que intente cargar un documento fuera de su conjunto de marcos, a la página inicial del sitio. Trabaja sin marcos. En todo caso son malos para la usabilidad.

12. Ten cuidado con la detección de navegadores
Si necesitas usar algún tipo de detección de navegadores, asegúrate que funcione cuando un robot de un buscador (o cualquier otro agente) llegue. Si los robots no pueden entrar, no serás encontrado. He visto que esto suceda en sitios de muchas grandes compañías.

13. No pierdas el tiempo con los meta tags
La mayoría de los buscadores ya no le dan mucho valor al contenido de los meta tags. Estos han sido usados excesivamente por spammers. Te sugiero que uses el meta de descripción [meta description] y no más. Las palabras claves no duelen, pero rara vez ayudan, así que generalmente no valen la pena.

Algunos buscadores usan el contenido del meta de descripción para describir tu sitio en los resultados de sus búsquedas, así que si es posible, pon un contenido único y descriptivo para cada documento.

Ohh. Eso estuvo demasiado largo para leer
Así que entonces, la Guía Ultra - corta para SEO: adiciona regularmente contenido de calidad y asegúrate que tu sitio esté bien construido.

¿Qué sigue?
Como lo afirmé al comienzo de este artículo, estas son guías básicas para SEO. Hay mucho más que puede ser hecho para incrementar la visibilidad de tu sitio en los buscadores, pero siguiendo la advertencia que he dado aquí este es un buen comienzo, que en mi experiencia, te llevará lejos.

Si buscas más información, aquí hay un par de libros sobre el tema:
• Search Engine Visibility
• Search Engine Optimization for Dummies

Visto en Estándares y Accesibilidad

your ads here (468x60) - after 1st post.

Artículo original: 10 Usability Nightmares You Should Be Aware Of
Autores: Vitaly Friedman and Sven Lennartz
Traducido por: Gabriel Porras

Algunas veces tan solo quieres obtener la información que estás buscando, grabarla y seguir. Pero simplemente no puedes. Las pesadillas de la usabilidad – las que más bien son una rutina diaria en lugar de una excepción – aparecen de vez en cuando; usualmente cada vez que digitas tus búsquedas en Google.

En su artículo “¿Por qué los sitios galardonados son tan horribles?” Gerry McGovern apunta que “lo externo por brillante gana premios, pero lo realmente esencial gana clientes” y esto es absolutamente cierto. No importa el diseño que tengas ni la funcionalidad que estés ofreciendo – si tus visitantes no entienden cómo pueden ir del punto A al B no usarán tu sitio.

En casi cada diseño profesional (exceptuando los diseños especiales como los portafolios) necesitas ofrecerles a tus visitantes:
- una clara navegación autoexplicativa,
- textos claros,
- un buscador y
- una estructura bien pensada y visible.

Y eso significa que simplemente debes seguir las reglas básicas de la usabilidad y del sentido común. Lo que quieres es comunicarte con tus visitantes, no espantarlos, ¿verdad?

En este artículo damos un vistazo a algunas de las pesadillas de la usabilidad que debes evitar si deseas diseñar sitios funcionales y usables. Al final del artículo también encontrarás ocho puntos que deberías tener muy en cuenta.

1. Esconder el vínculo de Login

Backpack, una de las herramientas más usables de administración organizacional y de proyectos que 37signal tiene, explica exactamente para qué debe ser usada la herramienta, cómo puede usarse y que características ofrecer. Sin embargo, una vez que te has registrado, necesitarás unos cuantos minutos para averiguar qué deberías hacer para comenzar a usar la herramienta.

El vínculo del Login (pista: en la caja amarilla) debería tener un tamaño de fuente más grande – aunque también unos iconos podrían hacer el trabajo.

2. Usar pop-ups (ventanas emergentes) para presentar contenido

Casi todos los navegadores modernos tienen un bloqueador de pop-ups, para evitar este tipo de ventanas, los bloques de publicidad y algunos contenidos de sitios reconocidos como publicidad. Firefox, Safari, Opera e Internet Explorer hacen uso de estos bloqueadores – por lo tanto la idea de usar pop-ups para presentar el contenido principal no es probablemente la idea más brillante que un diseñador web debería tener.

Sin embargo, el equipo de desarrolladores de Adidas parece que consideró que los pop-ups eran una forma creativa de acercarse a su audiencia. No es claro de qué se trata ImpossibleStory.com – la mayoría de los usuarios nunca lo averiguarán, aunque desactiven su bloqueador de pop-ups.

3. Arrastrar en lugar de tener una navegación vertical

Actualmente, esta técnica – no totalmente una pesadilla por lo que no es tan usual – podrá convertirse en una tendencia en el futuro. La acción de arrastrar, como la usamos en los documentos PDFs, también puede ser adaptada a los sitios web. Fichey ofrece una solución basada en Flash. Un acercamiento interesante, sin embargo no puedes guardar en tus favoritos ninguna parte específica del sitio – un problema típico de los diseños basados en Flash.

Una caja con información introductoria en el home informa a sus visitantes de la nueva forma de navegar. La herramienta muestra algunos sitios que están de moda. A propósito, los vínculos que muestran no funcionan – aparentemente, la herramienta muestra las capturas de pantallas, las cuales son grabadas e incrustadas como imágenes.

4. Vínculos invisibles

Tus visitantes deben saber dónde están, dónde han estado y dónde pueden ir. Si los diseñadores no presentan esta información de una manera adecuada, seguro que tendrán graves problemas con la navegación del sitio. Real Placer ha estado usando un puñado de vínculos invisibles desde hace tiempo. Mira esta imagen y los labels abajo (originalmente creados por Trenton Moss) – ¿puedes ubicar los vínculos?

Los números 1, 3, 4, 6, 7 y 11 son vínculos, mientras que los 2, 5, 8, 9 y 10 no lo son.

5. Ruido visual

Con frecuencia menos es más. El ruido visual es probablemente uno de los problemas más típicos que deben afrontar los diseñadores de los grandes sitios. Y es extremadamente fácil hacerlo mal. Como lo hace Overstock.

Adicionalmente: Tampoco es completamente claro cuáles son los vínculos y cuáles no. Además Overstock usa un variado número de presentaciones para sus vínculos y efectos “hover”. ¿Vínculo o no vínculo? Te divertirás mucho adivinando.

6. Camino sin salida

Si tienes un nuevo servicio, puedes usar diferentes métodos para mostrárselo a tus visitantes. Scriblink le da la bienvenida a sus visitantes con un pop-up y un applet de java. Así que los visitantes tienen que digitar algunos datos para comenzar a navegar.

Nada ayuda:
- hacer clic en el Cancel no ayuda,
- el OK no ayuda,
- el modo full-screen no ayuda,
- hacer clic en cualquier otra parte no ayuda,
- cerrar el navegador no ayuda,
- hacer clic en el símbolo de pregunta para pedir ayuda no funciona.

Realmente es injusto. Nosotros sólo queremos ver qué es lo que hace la herramienta…

7. Bloques de contenido cubriéndose entre ellos

Este es un problema típico que siempre aparece si tienes películas grandes de Flash. La navegación del sitio queda escondida; no importa que tan dispuestos estén los usuarios a navegar – no pueden hacerlo.

El mismo problema en Yahoo.com.

8. Navegación dinámica

Lo que parece una navegación usable, pronto se muestra de lo peor. No importa a donde apuntes con el mouse – las imágenes van de abajo a arriba y se cambia el lugar del vínculo que has “clickeado”. En la imagen de abajo se le hizo clic al vínculo “history”– y se movió; y no, las imágenes que se deslizan no vinculan a la página que quieres visitar.

El efecto aparece en ambos lados de los menús de navegación. Los visitantes necesitan algo de tiempo para entender qué es lo que está pasando. Sin embargo, una vez se entiende, la navegación ya no es tan difícil de manejar.

Lo mismo pasa en Kabe243. Adicionalmente: otra muestra de lo que es el ruido visual.

9. Los menús drop-down

Estos menús son útiles para los desarrolladores web pero casi siempre ponen los nervios de punta a los usuarios. Si tu –como diseñador – escondes los ítems de tu menú detrás de un drop-down te ahorrarás mucho espacio vertical; sin embargo los usuarios tendrán que apuntar muy cuidadosamente el mouse para ir a la sección que quieren visitar. Esto no es usable.

Y puede ser peor. Si la distancia entre los niveles de navegación es muy grande (por ejemplo si algunos ítems del menú tienen más texto) los usuarios tendrán además que mover el mouse horizontalmente. Y si el foco del mouse cambia su posición vertical, los usuarios tendrán que comenzar de nuevo.

2Advanced y Brita.net son ejemplos excelentes a estas pesadillas de la usabilidad.

Nota: Nos tomó docenas de intentos poder sacar estos screenshots.

10. Imágenes parpadeantes

Algunas veces tan solo quieres leer el contenido del sitio web que estás visitando. Y no puedes. Toca pelear contra los banners de los anunciantes quienes usan publicidad animada – usualmente gifs animados o películas en flash. En ambos casos se vuelve demasiado difícil concentrarte en la lectura si estas imágenes están parpadeando alrededor de todo el contenido.

Digital Web Magazine, un excelente magazine online, el cual leemos regularmente, tiene un aviso publicitario animado a la izquierda de cada artículo y molesta mucho.

¿Futura pesadilla? Apuntar el mouse en lugar de hacer clic

Dontclick.it, un experimento interesante en diseño de interacción, explora un ambiente sin clics. Quieren investigar cómo y qué cambia para el usuario y la interface cuando no dependes del hábito de hacer clic.

Dentro de esta interface no encontrarás ningún botón. Más bien navegas el sitio de una manera diferente – apuntando el mouse a las áreas del sitio en las cuales estás interesado. Lo que suena como algo interesante, pronto se convierte en una pesadilla de la usabilidad – tan solo imagina los usuarios tratando de abrir vínculos en una ventana nueva; además es interesante ver cómo exactamente los usuarios serán capaces de, digamos, abrir una lista de vínculos en tabs del navegador.

8 puntos que debes tener muy en cuenta

1. No uses pop-ups
Los pop-ups interrumpen la navegación de los visitantes y requieren retroalimentación inmediata. Respeta a tus visitantes.

2. No cambies el tamaño de la ventana del navegador
El mismo argumento anterior. Algunos navegadores, por ejemplo Internet Explorer, guarda su tamaño y lo usa para las navegaciones futuras. Como comenta Ben Bodien, “simple y llanamente es desconsiderado asumir que conoces mejor que el usuario como debería estar configurado su propio ambiente”.

3. No uses fuentes muy pequeñas
Los párrafos largos son más difíciles de leer y para leer frases cortas los lectores necesitan más tiempo. También aplica para vínculos, botones, formularios, cajas de texto y otros elementos. Buenas noticias – en la Web 2.0 se presenta lo contrario.

4. Usa vínculos que sean claros
Los vínculos tienen que ser precisos y clarificar el destino al cual apuntan. Las descripciones de vínculos ambiguas deben ser evitadas.

5. No debes tener enlaces rotos
Hay muchos de ellos de todas maneras; ¿por qué querrías llevar a tus visitantes a un camino sin salida?

6. Debes tener como máximo una animación por página
Si las imágenes parpadeantes están regadas por todo el sitio, es extremadamente difícil enfocarse en un único elemento. Dale a tus visitantes la oportunidad de apreciar tu contenido. Si usas publicidad animada, no la coloques a lo largo de toda la página.

7. Haz que te puedan contactar fácilmente
Tal vez porque no sólo quieras ser contactado, si tus visitantes quieren ponerse en contacto contigo, pero no encuentran ninguna información de contacto, pierdes su interés y confianza. Lo que es desastroso para las tiendas on-line y es una oportunidad perdida para el resto.

8. Abre tus vínculos en la misma ventana del navegador
Los visitantes quieren tener el control sobre todo lo que pasa en su navegador. Si ellos quieren abrir un vínculo en una nueva ventana lo harán. Si no quieren, no. Si tus vínculos abren en una nueva ventana estás tomando una decisión que no es tuya.

Artículo visto en Estándares y Accesibilidad

Artículo Original: 10 Principles of Effective Web Design
Author: Smashing Magazine
Fecha: 31 de enero de 2008
Traducido rápidamente por: Gabriel Porras
Visita el artículo original para ver ejemplos de cada principio.

La Usabilidad y la utilidad, y no el diseño visual, son los que determinan el éxito o el fracaso de un sitio Web. Puesto que el visitante de una página es la única persona que hace clic en el mouse y, por consiguiente, decide lo que quiere hacer, el diseño centrado en el usuario se ha establecido como un método estándar hacia el diseño Web comercial y exitoso.

No vamos a discutir los detalles de implementación (por ejemplo dónde debe colocarse la caja de búsqueda), como ya lo hemos hecho en otros artículos, sino que nos centraremos en los principios, heurísticas y estrategias para un diseño web efectivo – métodos que, usados apropiadamente, pueden guiarnos a decisiones de diseño más sofisticadas y a simplificar el proceso de percepción de la información presentada.

¿CÓMO PIENSAN LOS USUARIOS?
Básicamente, los hábitos de los usuarios de un sitio Web son diferentes de los hábitos de los compradores de una tienda. Los visitantes dan un vistazo a cada nueva página, examinan rápidamente algo del texto y hacen clic en el primer vínculo que les llama su atención o se asemeja vagamente a los que están buscando. De hecho, hay muchas partes de la página que ni siquiera miran.

La mayoría de los usuarios buscan algo de su interés (o que les sea útil) y que tenga un vínculo. Tan pronto lo encuentran le hacen clic. Y si en la nueva página no encuentran lo que estaban buscando, hacen clic en el botón Atrás y el proceso de búsqueda continua.

• Los usuarios aprecian la calidad y la credibilidad. El contenido es más importante que el diseño. Es por eso que sitios con muy buen contenido y no tan bien diseños obtienen gran cantidad de tráfico.
• Los usuarios no leen, sino que ojean rápidamente. Buscan puntos fijos que los guíen hacia lo que están buscando.
• Los usuarios son impacientes y quieren resultados instantáneos. Un principio simple: Si un diseño no hace que el usuario encuentre lo que busca, el diseñador falla y hace perder dinero a la empresa. Entre más tenga que pensar el usuario y la navegación sea menos intuitiva, más fácil será que los usuarios busquen otras alternativas.
• Los usuarios no seleccionan lo más óptimo. No examinan la página linealmente ni van de sección en sección buscando lo que necesitan. Por el contrario buscan rápidamente y toman la primera opción que encuentren, en lugar de buscar la mejor de todas las opciones.
• Los usuarios siguen su intuición. La mayoría de las veces los usuarios se las arreglan como puedan, sin siquiera leer la información que el diseñador ha puesto.
• Los usuarios quieren tener el control. Sobre su navegador y esperan que todo el sitio sea consistente. Es por eso que no les gustan los pop-ups ni que el botón Atrás les deje de funcionar. Así que es una buena práctica nunca abrir vínculos en nuevas ventanas.

LOS PRINCIPIOS

1. No hagas pensar a los usuariosDe acuerdo a la primera ley de la usabilidad de Krug, la página web debe ser obvia y auto-explicativa. Tu trabajo al diseñar una página es que el usuario no tenga ninguna pregunta. Debes tener una navegación y una arquitectura intuitiva, una estructura clara, ayudas visuales moderadas y vínculos fácilmente identificables. El visitante debe entender qué hace la página, cómo funciona y cómo puede ir a otro lado. De eso se trata que no tenga ninguna pregunta.

   Una vez que tus visitantes entiendan de qué se trata tu sitio, les puedes explicar por qué es útil y cómo se pueden beneficiar de él.

2. No desperdicies el tiempo de los usuariosSi vas a ofrecer algún servicio o herramienta, trata de tener unos requisitos mínimos. Entre menos necesiten los usuarios para probar un servicio, más fácil lo harán. Ellos quieren “jugar” con él, en lugar de registrarse porque tal vez nunca vuelvan. Déjalos explorar y descubrir cuáles son tus servicios sin pedirles ni el correo.

   Un solo registro es suficiente para evitar que tus visitantes naveguen en tu sitio y reducir tu tráfico.

3. Haz que los usuarios enfoquen su atenciónAlgunas partes de la interfaz de usuario atraen la atención más que otras. Obviamente las imágenes son más atractivas que el texto y la negrita atrae más que el texto plano. El ojo humano no es para nada lineal y los usuarios pueden identificar instantáneamente bordes, patrones y movimiento.

   Así que enfocar la atención del usuario a áreas específicas del sitio mediante el uso moderado de elementos visuales puede ayudar a que fácilmente vaya de un lugar a otro sin siquiera pensarlo. Este visitante estará más orientado y desarrollará más confianza en el sitio, y por ende en la compañía que visita. Entre menos tenga que pensar el usuario, mejor será su experiencia.

4. Esfuérzate por mostrarteLos diseños Web modernos son normalmente criticados por guiar a sus usuarios con unos procesos 1-2-3 muy atrayentes y por tener botones grandes con efectos visuales Pero precisamente estas guías son extremadamente útiles, porque guían al usuario de una manera muy amigable y simple.

   Dejar ver al usuario claramente las funciones disponibles es un principio fundamental del diseño de interfaces de usuario. No importa cómo se logre, lo que importa es que el contenido sea entendible.

5. Haz uso de una buena escrituraComo la web es diferente de los medios impresos, es necesario ajustar el estilo de escritura a los gustos y hábitos de los usuarios.

   Evita nombres lindos, rebuscados, de mercadeo, específicos de la compañía, técnicos o no familiares. Si quieres que los usuarios creen una cuenta, usa “Regístrate” en lugar de “Comienza ahora”, que es aún mejor que “Explora nuestros servicios”.
   Una solución óptima para una escritura efectiva es:

   • Usa frases cortas y concisas.
   • Usa una diagramación que se ojee fácilmente (categoriza el contenido, usa múltiples niveles en los encabezados, usa elementos visuales y listas).
   • Usa un lenguaje objetivo y plano.
6. Esfuérzate por la simplicidadEl principio “Hazlo Simple” (KIS: Keep It Simple) debería ser el objetivo principal del diseño de un sitio. Los usuarios raramente visitan un sitio por su diseño. Lo que buscan es información o servicios.

   Desde el punto de vista del visitante el mejor diseño es uno en sólo texto, sin publicidades. Es por eso que una versión para imprimir de las páginas es esencial para una buena experiencia de usuario.

7. No le tengas miedo al espacio en blancoActualmente es difícil valorar la importancia de los espacios en blanco. No sólo ayudan a reducir la carga cognoscitiva, sino que también mejoran la percepción de la información. Cuando un visitante llega a una página lo primero que intenta hacer es examinar la página y dividirla en secciones y los espacios en blanco son esenciales en esta tarea.

   Las estructuras complejas son más difíciles de leer, examinar, analizar y de trabajar con ellas. Las estructuras jerárquicas reducen la complejidad (Ley de Simon): entre mejor logres que tus usuarios encuentren un sentido de jerarquía, tu contenido será más fácilmente percibido.

8. Comunícate efectivamente con un lenguaje visualEn sus artículos de comunicación visual efectiva, Aaron Marcus declara tres principios fundamentales [en] implicados en el llamado lenguaje visual:
   • Organiza: dale al usuario una estructura conceptual consistente y clara. Conceptos importantes dentro de la organización son: la consistencia, la diagramación, las relaciones y la navegación.
   • Ahorra: haz lo que más puedas con tus elementos visuales. Los cuatro puntos principales a tener en cuenta son: simplicidad (sólo incluye los elementos importantes), claridad (ningún elemento debería presentar ambigüedad), individualidad (debe ser distinguible lo que realmente importa) y énfasis (los elementos más importantes deben ser los que más fácilmente se perciban).
   • Comunica: La interfaz del usuario debe mantener un balance en legibilidad, tipografía, simbolismos, visualización y color, para poder comunicarse efectivamente. Usa máximo 3 tipos de letras en cómo máximo 3 tamaños y un máximo de 18 palabras o 50-80 caracteres por línea.
9. Las convenciones son nuestras amigasLas convenciones son muy útiles para reducir la curva de aprendizaje y el tener que pensar cómo funcionan las cosas. Imagínate cómo sería si todos los sitios usaran un icono diferente para sus RSSs. ¡Toda una pesadilla para la usabilidad!

   Con ellas ganas la confianza y credibilidad de tus usuarios. Entiende qué es lo que esperan los usuarios de la navegación de un sitio, de la estructura del texto, del lugar de la búsqueda, etc.

   Por ejemplo traduce tu página a otro lenguaje como el japonés y pon a prueba el sitio con algunos usuarios. Si las convenciones están bien aplicadas, aunque la página esté en otro idioma, estos usuarios podrán ubicarse en ella.

10. Prueba temprano, prueba a menudoEste principio llamado TETO (Test Early, Test Often) debería ser aplicado en todo proyecto, debido a que estas pruebas de usabilidad a menudo dan gran conocimiento sobre problemas y situaciones.

    Sólo podrás saber con certeza que un diseño es mejor que otro analizándolo desde un punto específico, es decir: probando con un usuario.

    Algunos puntos importantes para que tengas en cuenta:

    • De acuerdo a Steve Krug, probar con un solo usuario, es 100% mejor que probar con ninguno y probar con uno al principio del proyecto es mucho mejor que probar con 50 al final. De acuerdo a la primera ley de Boehm, los errores son más frecuentes en la etapa de requisitos y diseño y entre más se demoren en removerse serán más costosos.
    • Las pruebas son un proceso iterativo, lo que significa que cuando diseñas algo, lo pruebas, lo arreglas y lo vuelves a probar.
    • Las pruebas de usabilidad siempre producen resultados útiles. Ya sea porque encuentres problemas que tienes o para ver que no tienes grandes fallas en tu diseño.
    • De acuerdo a la ley de Weinberg, un desarrollador no es el apropiado para probar su propio código. Lo que aplica también para los diseñadores. Ya has trabajado mucho en un diseño, lo conoces, lo que hace que no tengas una perspectiva diferente sobre él. Ya sabes cómo se hizo y cómo funciona, así que busca otras personas para que lo prueben.

REFERENCIAS

• Designing Effective User Interfaces por Suzanne Martin
• Summary on Web Design
• UID presentation (Flash)
• Research-Based Web Design & Usability Guidelines
• “The psychology of computer programming” por Gerald Weinberg
• “Designing Web Usability” por Jakob Nielsen [JN / DWU]
• “Prioritizing Web Usability” por Jakob Nielsen
• “Don’t Make Me Think” por Steve Krug
• “Usability for the Web: Designing Web Sites that Work” por Tom Brinck, Darren Gergle, Scott Wood
• A Summary of Principles for User-Interface Design

Visto en Estándares y Accesibilidad

Jon Wiley, diseñador en Google Apps, resumió en la conferencia WritersUA los principales criterios a la hora de diseñar interfaces para Google:

1. Útil: centrarse en la gente - sus vidas, su trabajo, sus sueños.
2. Rápido: cada milisegundo cuenta.
3. Simple: la simplicidad es poderosa.
4. Atractivo: enganchar a los principiantes y atraer a los expertos.
5. Innovación: atreverse a ser innovador.
6. Universal: diseñar para el mundo.
7. Rentable: pensar en el negocio de hoy y de mañana.
8. Belleza: deleitar al ojo sin distraer la atención.
9. Credibilidad: merécete la confianza de la gente.
10. Personal: añade un toque humano.

Creo que estos principios son aplicables no solo para diseño sino para todo tipo de comunicación que llevemos adelante.

Visto en adseok.com

GLATINA COMUNICACIÓN es una agencia de publicidad dedicada a brindar soluciones integrales de comunicación. Nuestras propuestas son elaboradas en base a estrategias de comunicación claras, precisas y oportunas y que surgen luego de un diagnóstico de la empresa, la definición de “la visión” en el qué soy, qué creo que puedo ser y hacia dónde creo que realmente pueda ir, lo que nos lleva a presentar siempre “un traje a medida” para cada Cliente, dentro de un presupuesto posible.

Ese es nuestro verdadero desafío y compromiso. Nuestros clientes actuales son industrias, empresas comerciales como de servicio.

NUESTROS SERVICIOS

Proceso Creativo
:: Campañas de publicidad
:: Desarrollo de identidad corporativa
:: Desarrollo de marca
:: Volantes, Catálogos, Folletos y Libros
:: Material de punto de venta
:: Fotografía de producto.

Multimedia
:: Diseño de sitios web
:: Comercio Electrónico
:: Marketing Electrónico
:: Presentaciones multimedia

Diseño y producción de medios impresos
:: Folletería
:: Catálogos
:: Pósters
:: Prensa y revista
:: Cartelería
:: Papelería corporativa (tarjetas, facturas, hojas membretadas, sobres, etc.)

TV y Radio
:: Idea creativa y producción de spot de radio y televisión

Comercialización de medios
:: Representante comercial de la revista de abordo de GOL
:: Representante comercial de la revista in de la aerolínea LAN
:: Representante comercial de Latinoamérica Televisión

Contáctenos para intercambiar ideas.
Lic. Fabián Grauer
Tel. (598 2) 908 1327
Cel. (598 99) 276756
fabian.grauer@glatina.net
www.glatina.net