Wednesday, February 20, 2008

Esos típicos errores

Desgraciadamente no siempre se hace el trabajo sin cometer errores, en mi trabajo he estado al lado de profesionales muy capaces, sin embargo, con el tiempo me he dado cuenta que los mismos errores se repiten una y otra vez, si pudieramos tener un postit al lado de nuestro monitor con un listado como este, creo que cometeríamos varios errores menos, se los dejo:

  1. No leer lo que publicas
    Eres diseñador, estamos claros, hay un periodista para hacer los contenidos, OK. Pero aún así, lee todo lo que colocas, no importa si no lo escribiste tú. Si hay errores evidentes, no dudarán en culparte (y en parte, tendrán razón).
  2. No leer los mails enteros
    Cuando te llegue un mail con requerimientos, leelo ENTERO (incluyendo los forwards), entiéndelo, si hay cosas que no entiendes pregúntalas inmediatamente, tu cliente estará gustoso de notar que su requerimiento es tomado en cuenta lo antes posible.
  3. No tomar los requerimientos
    Hazte cargo de lo que te piden, no dejes nunca cosas en el aire, si hay algo que no te corresponde hacer o te faltan materiales para hacerlo, hazlo saber a tu superior. No lo dejes volando.
  4. No revisarlo entero
    Revísalo TODO, no porque una botonera vincule bien, significa que todas vinculen bien, no porque tu sitio se vea bien en tu equipo significa que está listo, dedica tiempo a revisar tu trabajo.
  5. No usar lo que haces
    Me ha tocado ver a varios (me incluyo) diseñando cosas que nunca han probado, si diseñas una interfaz… ponte del lado del usuario, no pienses como diseñador, actúa como usuario, luego vuelve a pensar como diseñador.
  6. Ser creativo sólo por serlo
    La creatividad es una herramienta de la comunicación, establece tus objetivos y trabaja en función de conseguirlos, no porque seas un “creativo” debes hacerlo todo basado en metáforas. A veces con ser directo y simple, cumplirás tus objetivos.
  7. Ser desordenado
    Diseñar y producir implica tener una pasión por el orden, establecer metodologías y mecanismos de orden en tu trabajo te ayudará a simplificar tareas mecánicas y dedicarle tiempo a tareas creativas.
  8. Decir que algo está listo cuando aún no lo está
    He visto a varios responder a la pregunta ¿está listo el encargo? con un rotundo si. Aunque la verdad sea que aún faltan minutos para terminar ese trabajo. Sincera tus plazos, si algo no está listo, no lo está. Si hay algo que lo está demorando… manifiéstalo. Lo peor es decir que algo está listo cuando falta algo por hacer.
  9. No avisar cuando algo está listo
    Terminaste? lo revisaste? lo leiste? lo probaste?, OK entonces ahora avisa a quien corresponda que tu trabajo está listo, hazlo por un medio escrito para que quede registro de la entrega (fecha y hora) sólo en ese momento puedes empezar a olvidarte de ese encargo.

Fuente: http://www.digilicious.cl/2008/02/18/esos-tipicos-errores/

Wednesday, January 23, 2008

La Web 2.0, reñida con el diseño


Jakob Nielsen, gurú de la usabilidad, opina que la Web 2.0 hace que las empresas descuiden los principios del diseño.


La usabilidad y el diseño pensado en el usuario son conceptos que hay que tener siempre presentes, pero los sitios basados en el concepto de la Web 2.0 no tienen en cuenta estos principios. Al menos, esa es la opinión de Jakob Nielsen, experto en usabilidad y diseño.

Nielsen alerta sobre la moda del 2.0, que lleva a las empresas a descuidar los principos del diseño web desarrollados en la última década, del que él propio Nielsen ha sido fervoroso divulgador desde su página web. Llenar los sitios de herramientas personalizadas conlleva el riesgo de imitar los sitios "llamativos pero inútiles" que proliferaron en los momentos álgidos de la burbuja puntocom: sitios como el paradigmático Boo.com, de apariencia atractiva pero nula usabilidad.

Toda página web debe tener en cuenta cuando menos una serie de principios básicos: facilidad de uso, buenas herramientas de búsqueda, texto sin jergas, tests de usabilidad y tener en cuenta el diseño antes incluso de empezar a progamar. Desgraciadamente, Nielsen opina que la fiebre por sumarse al vagón 2.0 lleva a muchos a dejar de lado estos principios.

Para Nielsen, el problema no es el concepto en sí de la Web 2.0, es decir, la idea de comunidad, el contenido generado por los usaurios y las páginas más dinámicas y activas. El error está en colocar estos elementos por encima del diseño, otogarles el protagonismo cuando deberían ser elementos secundarios.

Por último, Nielsen se plantea incluso la utilidad de adoptar tecnologías 2.0, teniendo en cuenta que recientes estudios demuestran que el porcentaje de usuarios activos que contribuye con sus propios contenidos es mínimo: apenas el 10% (de los que sólo el 1% lo hace regularmente), frente al 90% que no aporta nada. Para la mayoría, Internet es una herramienta, no una meta. Por este motivo, Nielsen cree que es un error que las empresas diseñen para ese grupo minoritario, a costa de convertir la web en mucho menos usable para la gran mayoría.

Fuente: http://www.baquia.com/noticias.php?id=12366

El éxito de You Tube y los blogs prueba el valor de la simplicidad


Jakob Nielsen es uno de los hombres que más ha influido en la construcción de Internet tal y como la conocemos, pues ha marcado las tendencias de diseño seguidas por los principales sitios web.

Todas sus teorías giran en torno a la sencillez para lograr que el usuario pueda encontrar lo que busca de un vistazo, y sepa manejarse en el sitio desde el primer momento que accede a él. El éxito de los blogs y de sitios como YouTube, que han democratizado la publicación de contenidos en Internet, vienen a confirmar las teorías de Nielsen, quien impartirá el próximo 4 de noviembre una conferencia en Barcelona, organizada por su consultora especializada en usabilidad.

P:¿Qué tres errores debería evitar a toda costa cualquier página web?

R: Lo opuesto a las tres características que mencioné como ejemplo de buena usabilidad:

(a) Navegación difícil y una organización de la información confusa que se estructure de acuerdo con los criterios de la compañía en vez de pensar en el usuario. Esto dificulta encontrar cualquier cosa en un sitio web y hace que la gente desista rápidamente.

(b) Un contenido maketiniano (escrito en lenguaje de marketing, disfrazando las palabras y ensalzando al máximo las bondades de los productos) pero pobre en información específica que los clientes quieren. Por ejemplo, un sitio que no muestra el precio entre las primeras cosas.

(c) Transacciones complicadas que exigen al usuario seguir muchos pasos para conseguir sus objetivos. Por ejemplo, un sitio de comercio electrónico que requiere del usuario que se registre, elija un nombre y una contraseña antes de poder echar un vistazo. Imagina que la tienda de la esquina te pediera una contraseña antes de venderte un tomate.

P ¿Qué páginas web resaltaría usted como ejemplos de usabilidad a imitar?

R: Casi todos los grandes websites son buenos ejemplos de usabilidad: Google, Yahoo, eBay. Amazon.com, Craigslist. Se han visto forzados a ser buenos porque era la única forma en que podían hacer crecer su base de usuarios.

Desgraciadamente, hoy, no creo que Amazon.com sea un gran ejemplo de usabilidad. Insertan demasiadas características en sus páginas. Este diseño funciona bien para Amazon porque es una compañía conocida donde la gente ha comprado muchas veces en el pasado. Para Amazon es probablemente más importante ofrecer muchas opciones a usuarios experimentados que atraer a nuevos usuarios. Pero la mayoría de los websites sólo tiene una pequeña fracción de los clientes a los que potencialmente podrían dar servicio, por lo que deberían todavía dar aún mayor prioridad a la simplicidad para los nuevos usuarios.

P¿Sigue manteniendo que los usuarios leen un 25% más lentos en las pantallas de ordenador ahora que la mayoría ya usan los 1024 píxeles?

R: La lectura en las pantallas de los ordenadores ha mejorada alrededor un 8%, pero no es mucho teniendo en cuenta que los monitores son más grandes. El uso de monitores de pantalla plana y de la tecnología de fuente como ClearType en Windows XP y Vista que resaltan los caracteres han sido los principales motores de esta mejora.

Las pantallas más grandes tienen la ventaja de que los usuarios pueden explorar a través de más opciones sin hacer scrolling y esto acelera la interacción. Sin embargo, necesitamos monitores que sean mucho más grandes que 1024x768 píxeles para que en un pantallazo tengamos más información que una página de periódico.

En fin que todavía es más lento utilizar los ordenadores que el papel y de hecho, los usuarios prefieren no leer textos muy largos online.

P: Cada vez se usan más videos e imágenes en los sitios web. ¿Cree que esta tendencia contradice su teoría de la simplicidad?

R.: Es posible usar tanto fotos como vídeos y tener un sitio sencillo. Las pautas originales de la usabilidad en el entorno Web de 1994 son muy negativas en lo que se refiere al uso de gráficos y vídeos, en la medida que las imágenes grandes tienen un tiempo de descarga mayor y que los vídeos se visualizaban mal en ventanas del tamaño de un sello, que eran lo último hace un tiempo. Ahora un mayor ancho de banda y una mejor tecnología de vídeo permiten utilizar más este tipo de medios. Esto no cambia el hecho de que deberíamos utilizarlos de una forma razonable. Las páginas repletas de vídeos sólo funcionan para sitios específicos de vídeos y no para sitios web de instituciones públicas o de empresas.

P.: ¿Cree que las redes sociales, donde los usuarios son los propios creadores de contenido, deberían seguir las reglas de simplicidad?

R.: Es verdad que hay mucho contenido generado por los usuarios, y que el crecimiento de este contenido prueba definitivamente el valor de la simplicidad, porque la explosión de escribir en Internet tiene su origen cuando los servicios de los weblog se hicieron sencillos así como la explosión del vídeo se produjo cuando YouTube facilitó colgar vídeos en Internet. Todo esto fue posible en el pasado pero, con una menor usabilidad, de forma que muy poca gente contribuyó a su contenido.

Lo que es más cuestionable es cuánta gente utiliza el volumen de contenido generado por el usuario. La mayor parte de este contenido no genera en realidad mucho tráfico porque es demasiado caótico y no es lo suficientemente interesante para otros usuarios. Si alguien quiere generar tráfico a sus contenidos, entonces ellos tienen que seguir las pautas de la usabilidad, al igual que lo hace cualquier otro sitio web. Pero si te conformas con llegar a tus cinco mejores amigos, entonces, la usabilidad no es importante: ellos ya te conocen y entienden la información, incluso si no es comprensible para los nuevos usuarios.

P.: ¿Qué tendencias van a marcar el futuro de Internet?

R.El usuario móvil será importante. Admito que llevo diciendo esto desde hace varios años y el usuario móvil de servicios web es todavía una pequeña parte. La tecnología ya casi está, con las redes 3G suficientemente rápidas y algunos smartphones. Lo que faltan son los buenos servicios que hayan sido diseñados específicamente para los usuarios móviles. No podemos coger un sitio web ya establecido y acceder a él a través del teléfono; necesitamos versiones más reducidas de los sitios que sólo se centren en aquellos servicios que son más útiles para el usuario móvil.

Fuente: ElPais.com

Friday, January 18, 2008

No todos son iguales, pero hay que saber elegir

Clientes

En el camino de los negocios conocemos cantidad y diversidad de clientes, personas, proveedores, que como seres humanos y empresas, tienen diferente ideología. Nos encontramos con clientes buenos, y otros no tanto.

De una experiencia desagradable que tuvimos con una empresa, aprendimos varios puntos importantes que debemos tomar en cuenta antes de enredarnos en un contrato para prestar nuestros servicios.

1. Historial de la empresa: Es el punto más importante, hay que investigar el historial de la empresa para ver si es confiable, si ha tenido problemas con clientes pasados y que tal anda su “reputación” dentro de su giro. Si nos enteramos que tienen un historial no muy agradable o malo, pensemos realmente si nos traerá beneficios. En ocasiones es mejor alejarnos porque podremos perder mucho más.

2. El contrato: Es de vital importancia que nuestro contrato sea, concreto, claro y que tenga fechas en las cuales vamos a terminar de prestar los servicios, fechas de pago y por supuesto tener una taza de interés por pago atrasado, esto para “presionar” a la empresa a que pague a tiempo.

3. Las llamadas telefónicas: Es importante estar al tanto de las actividades de la empresa con regularidad, llamar una vez por semana para preguntarles que les ha parecido el servicio y cuando podemos pasar por el pago siguiente. Nunca confiar demasiado y dejar pasar hasta la fecha acordada. Puede ser que la empresa desaparezca de un momento a otro sin avisar.

4. Hacer citas: Para ir a recoger un cheque o el efectivo, es de gran importancia hacer citas, de no ser así podemos perder mucho tiempo y dinero en dar vueltas que no servirán de nada

5. Ser paciente: No desesperarnos si a la segunda llamada no nos han pagado, probablemente tuvieron problemas, pero si se atrasan 2 semanas entonces las cosas cambian, sin embargo es muy importante no perder la cordialidad, suele suceder que ya estamos artos de llamar y no recibir una respuesta válida, pero recordemos que la reputación y la imagen de nuestra empresa está en juego si perdemos la paciencia y les gritamos en la cara lo malos que han sido. Ahora que si pasan 3 meses y no hay respuestas, mejor llamamos a un abogado o un policía para que vayan con nosotros por el pago.(Es broma…pero podría ser)

6. Y la más importante. Retroalimentación: Al término del contrato, debemos evaluar si realmente queremos continuar prestando servicios a la empresa, si nos costó trabajo cobrar los cheques, si fueron amables, etc. Suele pasar que una empresa es muy mala con los pagos, y al término del contrato nos solicitan otros servicios nuevamente, y esta vez de una suma interesante, hay que pensar si realmente nos conviene continuar o mejor despedirnos cordialmente. Por lo general nunca cambian.

Conocimos a una de las empresas más irresponsables del estado, tuvimos la oportunidad de ver como empresas nacionales, les gritaban en la cara lo malos que eran. Con decirles que tardamos casi un mes en cobrar un saldo de $450.00 PESOS. Eso nos pasó por no investigar, pero aprendimos que los puntos ya mencionados son importantes al momento de hacer negocios con cualquier empresa.

No todo lo que brilla es oro.

Fuente: http://www.closip.com/blog/noticias/2008/01/17/no-todos-son-iguales-pero-hay-que-saber-elegir/

Contrato de diseño web

Si eres desarrollador web ¿cuantas veces has tenido la necesidad de hacer un contrato de desarrollo de sitio web? esto es algo muy necesario para evitar malos entendidos y formalizar la relación con el cliente. Yo antes cada contrato lo hacía diferente y sinceramente sin respaldo legal.

ley-en-linea.png

Existe un proyecto dentro del sitio de ley en línea llamado El Contrato de Desarrollo de Sitio Web este es un proyecto abierto que acepta opiniones para mejorarlo ya que cuenta con un wiki y está publicado con licencia Creative Commons Attribution-Noncommercial-No Derivative Works 2.5 Mexico License el autor de este contrato es Jorge Ringenbach sin duda este proyecto va ser de muchísima utilidad para muchos desarrolladores web.

Lo que no sé es si este contrato tenga validez completa en otro país que no sea México porque en la sección de resolución de controversias dice que se somete a la legislación vigente de la ciudad de México.

Descarga el contrato de Desarrollo de Sitio Web, visto en Maestros del Web

Descarga alternativa.

Fuente: http://www.carlosleopoldo.com/post/contrato-de-diseno-web/

Monday, January 14, 2008

Color, arquitectura y estados de ánimo


Descargar documento en formato pdf

1. Introducción

El color en las artes es el medio mas valioso para que una obra transmita las mismas sensaciones que el artista experimento frente a la escena o motivo original; usando el color con buen conocimiento de su naturaleza y efectos y adecuadamente será posible expresar lo alegre o triste, lo luminoso o sombrío, lo tranquilo o lo exaltado, etc.

Nada puede decir tanto ni tan bien de la personalidad de un artista, del carácter y cualidades de su mente creadora como el uso y distribución de sus colores, las tendencias de estos y sus contrastes y la música que en ellos se contiene.

El color en la arquitectura y decoración se desenvuelve de la misma manera que en el arte de la pintura, aunque en su actuación va mucho mas allá porque su fin es especialmente especifico, puede servir para favorecer, destacar, disimular y aun ocultar , para crear una sensación excitante o tranquila, para significar temperatura, tamaño, profundidad o peso y como la música, puede ser utilizada deliberadamente para despertar un sentimiento. El color es un mago que transforma, altera y lo embellece todo o que, cuando es mal utilizado, puede trastornar, desacordar y hasta anular la bella cualidad de los materiales mas ricos.

El color, como cualquier otra técnica, tiene también la suya, y esta sometido a ciertas leyes, que conociéndolas será posible dominar el arte de la armonización, conocer los medios útiles que sirven para evitar la monotonía en un combinación cromática, estimular la facultad del gusto selectivo y afirmar la sensibilidad.

El hogar de nuestros días no solo requiere color para embellecer y animar, sino color que resuelva las necesidades psicológicas de quienes vivan con el. La elección del color esta basada en factores estáticos y también en los psíquicos, culturales, sociales y económicos.

El nivel intelectual, el gusto de la comunidad, la localización y el clima también influyen en la elección del esquema y asimismo la finalidad o propósito de cada pieza. Pero entre todos estos factores del color, quizás sea el mas importante el psicológico, ¿por qué nos alegra, inquieta, tranquiliza o deprime un determinado conjunto o combinación cromática?

Un ejemplo: El color de un edificio es como el envase o presentación de un producto que actúa en estimulo de la atención y para crear una primera impresión, favorable o negativa.

Los colores del interior deben ser específicamente psicológicos, reposados o estimulantes porque el color influye sobre el espíritu y el cuerpo, sobre el carácter y el animo e incluso sobre los actos de nuestra vida; el cambio de un esquema de color afecta simultáneamente a nuestro temperamento y en consecuencia a nuestro comportamiento.

El color es luz, belleza, armonía y delicia de la vista, pero es sobre todo, equilibrio psíquico, confort y educacion

Resumen:

1. Introducción
2. El Color
3. Clasificacion de los colores
4. Armonización de los colores y su búsqueda
5. Contrastes-la interacción del color
6. El campo de los colores es tridimensional
7. Cualidades Tonales
8. Los elementos de la escala
9. Experimentación en niños en relación a la forma y el color
10. La significación del color: semiótica y teoría del color
11. Psicología del color
12. Cromoterapia
13. Esplendor de la naturaleza
14. La vista y los colores
15. Los colores como tratamiento
16. Cromoterapia Ambiental
17. Cromoterapia y elementos
18. Colores y personalidad
19. Test de los colores
20. Arcana simbología de los colores
21. Policromía arquitectónica: posturas teoricas de los siglos XIX y XX
22. Color y arquitectura
23. Selección del color
24. Ideas para esquemas
25. El Color En La Industria
26. El ambiente visual
27. El color en la clínica mira
28. El color: un componente de cualificación y significación del ambiente urbano
29. El color en el medio ambiente como código social popular
30. Propuesta
31. Bibliografía


Descargar documento en formato pdf

Fuente: http://www.monografias.com/trabajos5/colarq/colarq.shtml

El significado de los colores

  1. Introducción:

    Como ya hemos descrito en Los Colores, el color es una parte del espectro lumínico, y, al fín, es energía vibratoria. Círculo Estándar de Color

    Y esta energía afecta de diferente forma al ser humano, dependiendo de su longitud de onda (del color en concreto) produceindo diferentes sensaciones de las que normalmente no somos conscientes.

    Pero la gente que trabaja en agencias de marketing y publicidad, los asesores de imágen de empresa, los diseñadores industriales y de moda, etc., son bien conscientes de ello, y utilizan los colores para asociarlos coherentemente al tipo de producto que quieren hacer llegar.

    Y la cosa, como no podría ser de otra forma, funciona. Desde hace años se han hecho todo tipo de pruebas para analizar las sensaciones que sugieren los colores y hay bastante bibliografía al respecto.

    ¿Y qué es un sitio web sino un escaparate personal, de empresa, de comunidad, etc.? Además de muchas otras funciones que cada sitio pueda tener, ante todo intenta comunicar. Y lo hace con palabras, con imágenes y, en primera instancia, con colores.

    Y cuando un sitio web está diseñado por profesionales con sólidos conocimientos de diseño gráfico, normalmente las pautas seguidas con los colores no son aleatorias.

    Vamos a mostrar a continuación las propiedades de los colores básicos generalmente aceptadas. Puede haber discrepancias según autores, pero en lo fundamental, prácticamente todos están de acuerdo.

  2. El significado de los colores:

    Blanco:
    • El blanco se asocia a la luz, la bondad, la inocencia, la pureza y la virginidad. Se le considera el color de la perfección.

    • El blanco significa seguridad, pureza y limpieza. A diferencia del negro, el blanco por lo general tiene una connotación positiva. Puede representar un inicio afortunado.

    • En heráldica, el blanco representa fe y pureza.

    • En publicidad, al blanco se le asocia con la frescura y la limpieza porque es el color de nieve. En la promoción de productos de alta tecnología, el blanco puede utilizarse para comunicar simplicidad.

    • Es un color apropiado para organizaciones caritativas. Por asociación indirecta, a los ángeles se les suele representar como imagenes vestidas con ropas blancas.

    • El blanco se le asocia con hospitales, médicos y esterilidad. Puede usarse por tanto para sugerir para anunciar productos médicos o que estén directamente relacionados con la salud.

    • Es un color apropiado para organizaciones caritativas. Por asociación indirecta, a los ángeles se les suele representar como imagenes vestidas con ropas blancas.

    • A menudo se asocia a con la pérdida de peso, productos bajos en calorías y los productos lácteos.

    Amarillo:
    • El amarillo simboliza la luz del sol. Representa la alegría, la felicidad, la inteligencia y la energía.

    • El amarillo sugiere el efecto de entrar en calor, provoca alegría, estimula la actividad mental y genera energía muscular. Con frecuencia se le asocia a la comida.

    • El amarillo puro y brillante es un reclamo de atención, por lo que es frecuente que los taxis sean de este color en algunas ciudades. En exceso, puede tener un efecto perturbador, inquietante. Es conocido que los bebés lloran más en habitaciones amarillas.

    • En exceso, puede tener un efecto perturbador, inquietante. Es conocido que los bebés lloran más en habitaciones amarillas.

    • Cuando se sitúan varios colores en contraposición al negro, el amarillo es en el que primero se fija la atención. Por eso, la combinación amarillo y negro es usada para resaltar avisos o reclamos de atención.

    • En heráldica el amarillo representa honor y lealtad.

    • En los últimos tiempos al amarillo también se le asocia con la cobardía.

    • Es recomendable utilizar amarillo para provocar sensaciones agradables, alegres. Es muy adeecuado para promocionar productos para los niños y para el ocio.

    • Por su eficacia para atraer la atención, es muy útili para destacar los aspectos más importantes de una página web.

    • Los hombres normalmente encuentran el amarillo como muy desenfadado, por lo que no es muy recomendable para promocionar productos caros, prestigiosos o específicos para hombres. Ningún hombre de negocios compraría un reloj caro con correa amarilla.

    • El amarillo es un color espontáneo, variable, por lo que no es adecuado para sugerir seguridad o estabilidad.

    • El amarillo claro tiende a diluirse en el blanco, por lo que suele ser conveniente utilizar algún borde o motivo oscuro para resaltarlo. Sin embargo, no es recomendable utilizar una sombra porque lo hacen poco atrayente, pierden la alegría y lo convierten en sórdido.

      • El amarillo pálido es lúgubre y representa precaución, deterioro, enfermedad y envidia o celos.
      • amarillo claro representa inteligencia, originalidad y alegría.

    Naranja:
    • El naranja combina la energía del rojo con la felicidad del amarillo. Se le asocia a la alrgría, el sol brillante y el trópico.

    • Representa el entusiasmo, la felicidad, la atracción, la creatividad, la determinación, el éxito, el ánimo y el estímulo.

    • Es un color muy caliente, por lo que produce sensación de calor. Sin embargo, el naranja no es un color agresivo como el rojo.

    • La visión del color naranja produce la sensación de mayor aporte de oxígeno al cerebro, produciendo un efecto vigorizante y de estimulación de la actividad mental.

    • Es un color que encaja muy bien con la gente joven, por lo que es muy recomendable para comunicar con ellos.

    • Color cítrico, se asocia a la alimentación sana y al estímulo del apetito. Es muy ádecuado para promocionar productos alimenticios y juguetes

    • Es el color de la caída de la hoja y de la cosecha.

    • En heráldica el naranja representa la fortaleza y la resistencia.

    • El color naranja tiene una visibilidad muy alta, por lo que es muy útil para captar atención y subrayar los aspectos más destacables de una página web.

    • El naranja combina la energía del rojo con la felicidad del amarillo. Se le asocia a la alrgría, el sol brillante y el trópico.

      • El naranja oscuro puede sugerir engaño y desconfianza.
      • El naranja rojizo evoca deseo, pasión sexual , placer, dominio, deseo de acción y agresividad
      • El dorado produce sensación de prestigio. El dorado significa sabiduría, claridad de ideas, y riqueza. Con frecuencia el dorado representa alta calidad.
    Rojo:
    • El color rojo es el del fuego y el de la sangre, por lo que se le asocia al peligro, la guerra, la energía, la fortaleza, la determinación, así como a la pasión, al deseo y al amor.

    • Es un color muy intenso a nivel emocional. Mejora el metabolismo humano, aumenta el ritmo respiratorio y eleva la presión sanguínea.

    • Tiene una visibilidad muy alta, por lo que se suele utilizar en avisos importantes, prohibiciones y llamadas de precaución.

    • Trae el texto o las imagenes con este color a primer plano resaltándolas sobre el resto de colores. Es muy recomendable para connminar a las personas a tomar decisiones rápidas durante su estancia en un sitio web.

    • En publicidad se utiliza el rojo para provocar sentimientos eróticos. Símbolos como labios o uñas rojos, zapatos, vestidos, etc., son arquetipos en la comunicación visual sugerente.

    • El rojo es el color para indicar peligro por antonomasia.

    • Como está muy relacionado con la energía, es muy adecuado para anunciar coches motos, bebidas energéticas, juegos, deportes y actividades de riesgo.

    • En heráldica el rojo simboliza valor y coraje. Es un color muy utilizado en las banderas de muchos países

    • El color naranja tiene una visibilidad muy alta, por lo que es muy útil para captar atención y subrayar los aspectos más destacables de una página web.

    • El naranja combina la energía del rojo con la felicidad del amarillo. Se le asocia a la alrgría, el sol brillante y el trópico.

      • El rojo claro simboliza alegría, sensualidad, pasión, amor y sensibilidad.
      • El rosa evoca romance, amor y amistad. Representa cualidades femeninas y pasividad.
      • El rojo oscuro evoca energía, vigor, furia, fuerza de voluntad, cólera, ira, malicia, valor, capacidad de liderazgo. En otro sentido, también representa añoranza.
      • El marrón evoca estabilidad y representa cualidades masculinas.
      • El marrón rojizo se asocia a la caída de la hoja y a la cosecha.
    Púrpura:
    • El púrpura aporta la estabilidad del azul y la energía del rojo.

    • Se asocia a la realeza y simboliza poder, nobleza, lujo y ambición. Sugiere riqueza y extravagancia.

    • El color púrpura también está asociado con la sabiduría, la creatividad, la independencia, la dignidad.

    • Hay encuestas que indican que es el color preferido del 75% de los niños antes de la adolescencia. El púrpura representa la magia y el misterio.

    • Debido a que es un color muy poco frecuente en la naturaleza, hay quien opina que es un color artificial.

    • El púrpura brillante es un color ideal para diseños drigidos a la mujer. También es muy adecuado para promocionar artículos dirigidos a los niños.

      • El púrpura claro produce sentimientos nostálgicos y románticos.
      • El púrpura oscuro evoca melancolía y tristeza. Puede producir sensación de frustración.
    Azul:
    • El azul es el color del cielo y del mar, por lo que se suele asociar con la estabilidad y la profundidad.

    • Representa la lealtad, la confianza, la sabiduría, la inteligencia, la fe, la verdad y el cielo eterno.

    • Se le considera un color beneficioso tanto para el cuerpo como para la mente. Retarda el metabolismo y produce un efecto relajante. Es un color fuertemente ligado a la tranquilidad y la calma.

    • En heráldica el azul simboliza la sinceridad y la piedad.

    • Es muy adecuado para presentar productos relacionados con la limpieza (personal, hogar o industrial), y todo aquello relacionado directamente con:

      • El cielo (líneas aéreas, aeropuertos)
      • El aire (acondicionadores paracaidismo)
      • El mar (cruceros, vacaciones y deportes marítimos)
      • El agua (agua mineral, parques acuáticos, balnearios)
    • Es adecuado para promocionar productos de alta tecnología o de alta precisión.

    • Al contrario de los colores emocionalmente calientes como rojo, naranja y amarillo, el azul es un color frío ligado a la inteligencia y la consciencia.

    • El azul es un color típicamente masculino, muy bien aceptado por los hombres, por lo que en general será un buen color para asociar a productos para estos.

    • Sin embargo se debe evitar para productos alimenticios y relacionados con la cocina en general, porque es un supresor del apetito.

    • Cuando se usa junto a colores cálidos (amarillo, naranja), la mezcla suele ser llamativa. Puede ser recomendable para producir impacto, alteración.

      • El azul claro se asocia a la salud, la curación, el entendimiento, la suavidad y la tranquilidad.
      • El azul oscuro representa el conocimeinto, l integridad, la seriedad y el poder.

    Verde:
    • El verde es el color de la naturaleza por excelencia. Representa armonía, crecimiento, exuberancia, fertilidad y frescura.

    • Tiene una fuerte relación a nivel emocional con la seguridad. Por eso en contraposición al rojo (connotación de peligro), se utiliza en el sentido de "vía libre" en señalización.

    • El verde oscuro tiene también una correspondencia social con el dinero.

    • El color verde tiene un gran poder de curación. Es el color más relajante para el ojo humano y puede ayudar a mejorar la vista.

    • El verde sugiere estabilidad y resistencia.

    • En ocasiones se asiocia también a la falta de experiencia: "está muy verde" para describir a un novato, se utiliza en varios idiomas, no sólo en español.

    • En heráldica el verde representa el crecimiento y la esperanza.

    • Es recomendable utilizar el verde asociado a productos médicos o medicinas.

    • Por su asociación a la naturaleza es ideal para promocionar productos de jardinería, turismo rural, actividades al aire libre o productos ecológicos.

    • El verde apagado y oscuro, por su asociación al dinero, es ideal para promocionar productos financieros, banca y economía.:

      • El verde "Agua" se asocia con la protección y la curación emocional.
      • El verde amarillento se asocia con la enfermedad, la discordia, la cobardía y la envidia.
      • El verde oscuro se relaciona con la ambición, la codicia, la avaricia y la envidia.
      • El verde oliva es el color de la paz.

    Negro:
    • El negro representa el poder, la elegancia, la formalidad, la muerte y el misterio.

    • Es el color más enigmático y se asocia al miedo y a lo desconocido ("el futuro se presenta muy negro", "agujeros negros"...).

    • El negro representa también autoridad, fortaleza, intransigencia. También se asocia al prestigio y la seriedad.

    • En heráldica el negro representa el dolor y la pena.

    • En una página web puede dar imágen de elegancia, y aumenta la sensación de profundidad y perspectiva. Sin embargo, no es recomendable utilizarlo como fondo ya que disminuye la legibilidad.

    • Es conocido el efecto de hacer más delgado a las personas cuando visten ropa negra. Por la misma razón puede ayudar a disminuir el efecto de abigarramiento de areas de contenido, utilizado debidamente como fondo.

    • Es típico su uso en museos, galerías o colecciones de fotos on-line, debido a que hace resaltar mucho el resto de colores. Contrasta muy bien con colores brillantes.

    • Combinado con colores vivos y poderosos como el naranja o el rojo, produce un efecto agresivo y vigoroso.

  3. Tabla de propiedades de los colores

    En la siguiente tabla vamos a resumir, para los principales colores, qué simbolizan, así como su efecto psicológico o acción terapéutica, tanto en positivo, como en negativo:

  4. Tabla de sensaciones:
    Ahora vamos a plantear el ejercicio inverso: supongamos que estamos diseñando un nuevo sitio web. Y supongamos que en determinadas situaciones queremos sugerir, promover determinados sentimientos entre nuestros visitantes. En la siguiente tabla esquematizamos como:

Fuente: http://www.webusable.com/coloursMean.htm

¿Que quieres transmitir con tu web? Los colores te ayudarán

La programación web no es más que otra forma de vender un producto que has de hacer llegar a los ojos de los clientes y enamorarlos en la primera impresión. Por ello además de tener en cuenta una estructura idónea y adaptada al rango de usuarios a los que va dirigida es importante a la vez que interesante tener en cuenta los colores que vamos a usar en nuestros proyectos.

Los colores es lo segundo que nuestro cerebro capta despues de la estructura, por ese motivo hemos de pensar muy a conciencia que colores usar para vender nuestro producto. Al igual que colocamos en la parte superior el título de nuestra página para que sea lo primero que vea nuestro usuario, hemos de pensar en el conjunto y crear un estructura homogenea que transmita unos sentimientos al usuario.

additivecolormixing.png

Los colores nos afectan psicológicamente y producen ciertas sensaciones, y esas hemos de aprovecharnos de dichas sensaciones para conseguir nuestro objetivo, hemos de tener en cuenta que la asociación de colores es algo cultural, por lo tanto tenemos que tener cuidado con que elegímos, ya que podemos causar el efecto inverso al que queremos provocar. Por ese motivo hemos de conocer nuestro ratio de mercado y a quien vamos a dirigir nuestro sitio web.

Para empezar deberemos saber que cada color ejerce sobre una persona 3 efectos:

  1. Impresión: llamamos la atención del usuario.
  2. Expresión: conseguimos transmitir una emoción por lo comentado anteriormente.
  3. Construye: dotamos de significado, convertimos en un simboló.

Colores y sensaciones

Colores 2

  • Rojo: Culturalmente asociamos rojo con pasión ardiente, sexualidad, erotismo… aunque también con peligro, error. Hemos de tener cuidado con que tipo de rojo usar ya que producen efectos agresivos. Jugando con las tonalidades más claras de este color podemos aportar un toque sensual a nuestro sitio web.
  • Anaranajado: Representa la alegría, la juventud, el calor, el verano,… causa optimismo, seguridad y confianza. Ayuda a disminuir la fatiga, es ideal para lugares donde se ha de transmitir mucha información.
  • Amarillo: El color más luminoso, es el color de la luz del sol. Provoca buen humor y alegría, estimula la vista y el sistema nervioso. Está vinculado a la actividad mental y la inspiración creativa ya que despierta el intelecto, de ahi que se use para indicar alerta. (offtopic: ¿Nunca habeis probado a estudiar con una hoja amarilla debajo de los apuntes? Se queda todo más fácil :D).
  • Verde: Simboliza esperanza, es un color hipnótico, relajante, ayuda a controlar el insomnio, la fatiga,… Ideal para contrarestar los colores más cálidos.
  • Azul: Es el más sobrio de los colores fríos, transmite seriedad, confianza y tranquilidad. Se el atribuye el poder para desintegrar las energías negativas. Favorece la paciencia la amabilidad y serenidad, aunque la sobreexposición al mismo produce fatiga o depresión. También se aconseja para equilibrar el uso de los colores cálidos. Ideal para ambientes que inviten al reposo.
  • Púrpura: Asociado con el misterio, la intuición y la espiritualidad este color ayuda a disminuir la angustia, las fobias y el miedo.
  • Blanco: La pureza por excelencia, paz, alegría y pulcritud, aunque en los paises islámicos simboliza la muerte.

  • Negro: El color más oscuro solo puede transmitir dolor, tristeza, melancolía y irritabilidad. Denota poder, misterio y estilo.
  • Gris: Puede expresar elegancia, respeto, desconsuelo, vejez y aburrimiento, es un color neutro que no influye en los otros colores.
Conociendo ya el significado de los colores, solo nos queda unirlos de una forma equilibrada y homogenea para transmitir una sensación que el usuario perciba de forma inconsciente, de esta forma tendremos un punto más para conseguir que vuelva.

Fuente: http://www.anieto2k.com/2006/09/23/%c2%bfque-quieres-tranmitir-con-tu-web-los-colores-te-ayudaran/

Wednesday, December 12, 2007

¿Así que usas Flash?, entonces te odio

A lo largo del tiempo he notado como en ambientes profesionales relacionados a Internet (Dicese de donde no hay lusers alrededor) los desarrolladores de Flash somos lapidados sin piedad cada vez que entramos en tema de discusión.

Vamos a especificar un caso puntual; la comunidad del software libre.
Si alguno de ustedes es asiduo a sitios como barrapunto o slashdot (Donde los comentarios obtienen puntaje de -1 a 5 siendo los de 5 los que mas aporten a la noticia) verán que cuando se publica una noticia donde el titulo incluya Flash o Macromedia aparecen de 1 a 10 mensajes con puntaje 5 mencionando las razones de porque Flash debe desaparecer de la faz de la tierra; si bien, muchos comentarios mencionan cosas falsas, algunos se basan en lo que se ve en la web comúnmente.
Con esto no digo que todos sean malos, casi siempre hay un (1) comentario bueno resaltando las capacidades que tiene Flash; pero muy pocas personas, sobre todo de un mundo donde Flash no existe aun como entorno de desarrollo (Linux, BSDs excepto OSX, etc) conocen lo que realmente puede hacer si es bien empleado y lo juzgan por lo que se ve. (para la muestra, un comentario altamente punteado con algunas mentiras obvias)

Flash como tal empezó como simplemente un software de animación vectorial con algunas acciones básicas y se ha convertido en lo que es ahora, un entorno multimedia de desarrollo de todo tipo de trabajos que requieran integración de medios interactivos de fácil distribución multiplataforma; desde animaciones para televisión hasta Rich Internet Applications para Intranets o aplicaciones web (uff, si me acordara de esto cada vez que voy a iniciar un curso de Flash) y es precisamente eso; sus inicios, lo que lo tienen marcado de nacimiento.

Dame click, dame click, a mi a mi a mi

La mayoría de power users de cualquier sistema operativo tiene bastante experiencia con la web; alguna vez navegó con Internet Explorer y odia los popups emergentes y la publicidad intrusiva en un banner de 640x480 que te meten en la mitad del contenido de una pagina para que hagas click de manera mas efectiva
En que estará hecho este banner... ¿Como puedes hacer una súper animación que incluya todo tipo de efectos raros, sonido, bitmaps y la foto de tu perro, en menos de 30Kb? Si dijiste Flash, has acertado.

El odio a Flash inicia desde los banners, la gente no los quiere (Y no los querrá y se acabo) así que si hacemos el silogismo
    XXX odia los banners
    En FLASH están hechos los banners
    Por lo tanto XXX odia FLASH
No digo que sea malo hacer banners; digo que si es malo meter publicidad intrusiva y encima abusar de flash para ello

Neo: Ya se animar; Morpheus: Muéstrame

Si eres novato en Flash seguramente lo primero que aprenderás es animación, seguro que luego aprendes a publicar para la web y seguro que haces una megaINTRO para tu web con muchos bonitos colores y animaciones shape morph(Interpolación de forma) por montón; ahora claro, avanzas un poco mas, aprendes a hacer botones y mejoras la experiencia de tu usuario metiendo un botón Skip Intro

No lo hagas y de hecho, repite después de mi esta lista
  • Un intro es malo
  • Un intro es malo
  • Un intro es malo
Si tienes una animación de intro en tu web, repetirás estas tres sabias frases todas las noches antes de dormir.

Hace poco hablamos de eso en el foro y a partir del estudio encontramos que son los defensores del arte los que sostienen la utilidad, belleza y funcionalidad de estas animaciones.
El diseño no es un arte como tal (Si quieres arte, DeviantART) y tomando frases de un compañero del foro, un diseño debe ser funcional, usable y practico, ahora, si encima es bonito, pues tanto mejor, un buen diseño.
Las intro no aportan nada, son aburridas después de la primera vez, casi siempre (casi) son pesadas y te dejan como tonto pensando que esperaste todo eso para ver los bonitos colores animados y al fin entrar a la web; no te engañes, una intro solo sirve para aumentar ego de diseñador (Ahm todos la van a ver, MWAHAHAHA), pero no para que tus usuarios se queden un poco mas

¿Y el espacio que sobra?, pero si no sobra nada!

Popups y fullscreen son palabras que el colectivo de power users relaciona con Flash Developer; si no, solamente miren cualquier pagina web de la película de turno y verán que, después de una intro de 1Mb, te abre un popup con la información de la película

¿Es tan difícil hacer un fondo presentable para una web en Flash?; ¿Es necesario arruinar la experiencia del usuario con un intrusivo popup que te quita las barras de navegación?, ¿Tan poco éxito quieres tener con tu web?

El usuario no pidió que le abrieran una nueva ventana (una mas de tantas), esto es incomodo, ¿Y si el quería seguir navegando en la ventana donde estaba? O peor aun ¿Si usa un navegador de verdad y esta usando pestañas? Acabas de arruinar por completo su experiencia (Y la imagen de tu web de paso)

No solo eso, sino que le quitas al usuario dos elementos claves, la barra de dirección y las herramientas de navegación. ¿Qué de malo tiene que se vea la URL?, ¿Qué de malo tiene poder usar el botón Atrás?

Pero también tenemos la práctica mas maligna de todas... fullscreen

Imagina que estas trabajando en tu PC y de repente tu pantalla queda en blanco absoluto, pasan 35 segundos de desesperación donde, si eres un usuario común, ya oprimiste reset y si no, esperaste mientras intentabas con desesperación dar click en las esquinas tratando de cerrar, minimizar o lo que fuera
Al fin carga algo, parece una web (Una cuya imagen tu mente no olvidara, ya sabes, resentimiento) y sin importar lo que tenga adentro buscas algo similar a Cerrar; al fin, has podido recuperar el control de tu PC, pero esta experiencia te ha marcado toda la vida y solo recuerdas en una esquina un logo que decía Hecho en Flash

Espero que los amantes del arte de la web nos comprendan, NO A LOS POPUPS, no a los Fullscreen

¿Y si animo el logo? ¿Y si animo las noticias? ¿Y si animo la botonera?

Que el logo tiene una animacioncilla divertida, esta bien, siempre y cuando no sea fastidiosa a la vista y en lo posible no sea animada todo el tiempo
Que las noticias van animadas en un scroll ... ¿Quieres que se lean o que el usuario haga ejercicios oculares?
¿Qué has animado hasta la foto de tu jefe pasando de un lado a otro de la web?; es cierto que Flash es poderoso en la animación; pero no tienes que abusar; una web es una web, hecho en Flash no implica que todo deba ser animado; piensa en lo que te fastidiaría si no conocieras el contenido y quisieras leerlo, piensa en tu usuario, no en ti.


En las manos de los Flashers del mundo esta quitarnos la mala fama que tenemos; en tus manos esta difundir la palabra, en nuestras manos esta educar al newbie en el camino de la fuerza y no dejarlo tomar el sendero del lado oscuro

La web debe ser agradable para todos.

Fuente: http://www.cristalab.com/blog/1531/asi-que-usas-flash-entonces-te-odio

Monday, December 10, 2007

Posicionamiento y XHTML

Algo casi imprescindible hoy en día para mejorar nuestro posicionamiento en
buscadores
consiste en transformar nuestros viejos documentos HTML a XHTML.

Puede que parezca una tarea larga y tediosa y que nos de pereza por ello, pero vamos a ver a continuación que es bastante fácil. ¡A lo mejor tus páginas ya son casi XHTML y no te habías dado cuenta!

¡Ah! otra cosa más. Si todavía no dispones de ningún sitio web, entonces no tienes ninguna excusa. Para los nuevos sitios es casi una obligación empezar utilizando XHTML, ya que aseguraremos una mayor compatibilidad con todos los navegadores y mejoraremos las posibilidades de aparecer en las posiciones más altas de los buscadores.

¿Qué es el XHTML?
XHTML, al igual que HTML, es un estándar prupuesto por el W3C y basado en XML. Desde que nació el HTML ha habido una invención constante de nuevos elementos (etiquetas o atributos) para ser usados dentro de HTML, lo que ha provocado grandes problemas de compatibilidad entre las distintas plataformas. El XHTML es una "reformulación del estándar HTML" que pretende conseguir que todos los documentos web sean compatibles en cualquier navegador de cualquier dispositivo.

Pero... ¿por qué XHTML ayuda al posicionamiento web?
Pues la respuesta es sencilla. Utilizando XHTML conseguimos que el código de nuestras páginas web sea mucho más sencillo, limpio y claro para los robots de los buscadores.

Si además utilizamos hojas de estilo CSS para todo lo referente a la presentación, el código de nuestras páginas será todavía mucho más limpio, tendrá bastantes menos etiquetas y atributos con lo que habremos aumentado el porcentaje de palabras clave y habremos reducido, por tanto, el peso la páginas y el tiempo de carga.

Características del XHTML
  • Todos los nombres de etiquetas y sus atributos deben estar escritos en minúsculas.
  • Los valores de los atributos deben ir siempre entre comillas.
  • Todas las etiquetas de apertura y cierre tienen que estar anidadas correctamente.
  • Todas las etiquetas deben tener su correspondiente etiqueta de cierre. Los elementos que estén vacíos deben tener también etiqueta de cierre o terminar con />
  • Atributos como selected o checked tienen que escribirse de forma completa: selected="selected" y checked="checked" (Ya no se permiten este tipo de abrebiaturas).
  • Los documentos XHTML deben incluir obligatoriamente una declaración de tipo de documento justo antes del nodo raíz.
  • El elemento raíz será obligatoriamente y tendremos que declarar también obligatoriamente el namespace usando el atributo xmlns:

Y ahora que ya lo he modificado todo, ¿cómo compruebo que está bien?
Una vez que hayáis hecho los cambios pertinentes en el código de vuestras páginas, podéis validar el código en la siguiente URL que nos brinda el W3C: http://validator.w3.org/

Y cuando lo tengáis todo listo podéis añadir un icono en vuestra web como el que tenemos en esta (a la derecha, justo debajo de la barra lateral), para indicar a los visitantes que vuestro sitio cumple con el estándar XHTML 1.0 del W3C.

Fuente: http://www.locualo.net/programacion/posicionamiento-xhtml/00000017.aspx

Tuesday, December 04, 2007

La importancia creciente de la accesibilidad de sitios web


Resumen:
El numero de personas que acceden a servicios a través de internet crece cada día. Un porcentaje creciente de estas sufre limitaciones bien por su edad avanzada o por sufrir algún tipo de discapacidad para la realización de sus actividades cotidianas (oir, ver, hablar, valerse por sí mismo). Si al diseñar sitios web nos olvidamos de estas personas, las estamos discriminando. Por otra parte, el acceso a servicios de internet desde contextos y dispositivos variados (TVi, Wireless, PDAs), nos obliga a diseñar pensando en facilitar el acceso a la información de este público.


Limitaciones que podemos encontrar y su traslación al diseño web

Físicas:
Discapacidades visuales: (Ceguera total a parcial; daltonismo; visión borrosa...). Internet es un medio fundamentalmente visual y basado en texto e imagen. Ello no impide que personas con discapacidades visuales accedan a los contenidos de un sitio web mediante otro tipo de dispositivos, Voz, Braille.

Discapacidades motrices: (Parkinson, artritis, esclerosis múltiple, parálisis...) impiden el manejo de dispositivos estándar como teclados, ratones. No tienen porqué tener o ser capaces de usar un teclado o un ratón ya que existen otros tipos de dispositivos de acceso a la información como pueden ser los navegadores basados en voz.

Discapacidades auditivas: (sordera total, parcial) En algunos sitios web, es importante el sonido. Algunos tipos de sorderas impiden la audición de señales y pitidos del sistema.
Discapacidades cognitivas y de lenguaje: (Dislexia, dificultades para recordar, resolver problemas, limitaciones sensoriales, de comprensión del lenguaje)

Para estas personas, una maquetación compleja o un exceso de información en los sitios web puede causar un bloqueo mental, por ello es importante una presentación limpia y clara de la información a incluir en cada documento.

Discapacidades relacionadas con la edad: Desde pérdida de visión a deterioro de las capacidades auditivas, pasando por la pérdida de capacidades motoras y de coordinación debido a enfermedades como artritis, parkinson, etc.

De entorno: Al diseñar sitios web, no se está en el mismo entorno en el que será utilizada la aplicación en la que estamos trabajando, por ello, es importante ponerse en el lugar de nuestro usuario y su entorno de acceso ya que puede encontrarse en un entorno ruidoso, como un lugar público, o realizando otras tareas simultáneamente como atender un teléfono o conducir (en este último caso, que implica la seguridad de las personas, ponerse en este lugar del usuario es un punto crítico).

Técnicas:
Están relacionadas con el equipo con el que accede un usuario a internet. Dispositivos de acceso a la información:
- Navegadores antiguos
- Sistemas operativos diferentes Dispositivos de visualización
- pequeños (PDA, teléfono móvil)
- Pantalla en modo "sólo-texto" - Profunidad de color (VGA) - Resoluciones Conexión: - Mala conexión a Internet


Consecuencias de la NO ACCESIBILIDAD de un sitio web

Cuando afectan a las capacidades físicas, podrían resumirse en una sóla palabra: discriminación.
  • No acceso a información relacionada con el empleo: empleados minusválidos que no pueden realizar su trabajo en la empresa por tener una intranet inaccesible; aplicaciones de empresa.
  • No acceso a información sobre actividades cívicas y relacionadas con el ejercicio de los derechos ciudadanos.
  • No acceso a programas educativos.
  • No acceso al comercio en la red.
  • No acceso a información general de la Web.
  • Y en general, cierto estado de desconexión e incomunicación.
Para evitar esta situación, la Comisión Europea puso en marcha la iniciativa "eEurope - Una Sociedad de la Información para todos" (8 de diciembre de 1999). "Con la iniciativa eEurope se pretende que Europa pueda explotar sus puntos fuertes y superar los obstáculos que aún se oponen a la asimilación de las tecnologías digitales, a través de la consecución de tres objetivos clave:
Conseguir que todos los ciudadanos, hogares, escuelas, empresas y administraciones estén conectados a la red
Crear en Europa una cultura y un espíritu empresarial abierto a la cultura digital
Garantizar que la sociedad de la información no se traduzca en exclusión social."

En EE.UU. existe legislación federal que siguiendo las recomendaciones de la Web Accesibility Initiative (WAI), comisión de expertos del W3C, persigue la adopción de medidas de usabilidad y accesibilidad en el desarrollo de sitios web para facilitar el acceso a la información a todas las personas independientemente de sus capacidades físicas o dispositivos de acceso.

A través de la Sección 508 requiere a las Agencias Federales que desarrollen sus aplicaciones de forma que resulten accesibles para personas con discapacidades. Para ello, el Center for Information Technology Accommodation (CITA), de la Administración de EE.UU. ha sido encargado de la formación de los empleados federales para permitir el desarrollo de estas aplicaciones accesibles. Para lograr estos puntos, el WAI, como organismo dependiente del W3C, responsable de la instauración de estándares en la red, publica sus recomendaciones de estándares a adoptar por los profesionales del desarrollo web basándose en 5 puntos clave:

Tecnología
Guías y pautas
Herramientas
Educación
Investigación y desarrollo

Estos estándares se agrupan en:

Guías de Accesibilidad a Contenido Web 1.0: Dirigidas a la realización de sitios web accesibles para personas con discapacidades.

Guías de Accesibilidad para Herramientas de Publicación 1.0: sirven para guiar a los desarrolladores web en la utilización de herramientas de producción de contenidos para que estos sean accesibles.

Guías de Accesibilidad para Dispositivos de Acceso 1.0: Su utilidad es mostrar como hacer accesible la información a diferentes navegadores y reproductores multimedia y otros dispositivos de tipo asistivo.

El 5 de mayo de 1999, el W3C eleva formalmente Guías de Accesibilidad a Contenido Web 1.0 a recomendación, consistiendo en 14 pautas a seguir al desarrollar un sitio web:

I.- Ofrecer alternativas al contenido visual y auditivo
II.- No apoyarse únicamente en el color y comprobar que tanto textos como gráficos son comprensibles cuando se visualizan sin color.
III.- Utilización adecuada de hojas de estilo y marcadores Marcando los documentos con los elementos estructurales apropiados y controlando la presentación con hojas de estilo en vez de con elementos y atributos de presentación.
IV.- Identificar el lenguaje natural utilizado en cada documento, para facilitar la pronunciación o interpretación de texto abreviado o extranjero.
V.- Creación de tablas de contenido cuya transformación sea adecuada mediante marcadores que permitan su transformación a través denavegadores accesibles y otras aplicaciones de usuario.
VI.- Ofrecer medios alternativos a las últimas tecnologías Asegurar que los documentos son accesibles incluso cuando el dispositivo de acceso no soporta o tiene desactivadas las últimas tecnologías.
VII.- Permitir que el usuario controle las variaciones sobre contenidos basados en tiempo como animaciones, secuencias de diapositivas, etc. Este control se traduce en la posibilidad de detener, actualizar, dichos contenidos.
VIII.- Asegurar la accesibilidad del interfaz de usuario independientemente del dispositivo de acceso.
IX.- Diseñar con independencia del dispositivo utilizando características y estándares que permitan activar o desactivar elementos de la página a través de diversos dispositivos de entrada.
X.- Utilizar soluciones transitorias que permitan el acceso de dispositivos antiguos como navegadores de versiones antiguas y otras plataformas.
XI.- Apoyarse en tecnologías y pautas W3C o proporcionar versiones alternativas allí donde las pautas W3C no sean aplicables.
XII.- Proporcionar contexto y orientación a la información a través de elementos complementarios que permitan la comprensión de documentos complejos. (Títulos, navegación...)
XIII.- Ofrecer mecanismos claros y consistentes de navegación que apoyen al usuario en su tarea de encontrar información.
XIV.- Asegurar que los documentos sean claros y simples para una comprensión más fácil.

Conjuntamente a estas 14 pautas, el WAI ofrece unas reglas conjuntas que permiten la aplicación concreta de cada una de estas pautas y las agrupa en 3 niveles de prioridad.

Prioridad 1: Los desarrolladores de contenido web DEBEN satisfacer estos puntos o el contenido será inaccesible para algunos usuarios.

Prioridad 2: Los desarrolladores de contenido web DEBERIAN satisfacer estos puntos o el contenido podría resultar inaccesible para algunos usuarios.

Prioridad 3: Los desarrolladores de contenido web PUEDEN satisfacer estos puntos o el contenido puede presentar problemas de accesos para algunos usuarios.
Según el nivel de adhesión a estas prioridades, el WAI recognoce 3 niveles de conformidad para lo que permite la inclusión de un logotipo (no verificado por W3C en cuanto a su veracidad) indicando el nivel de conformidad alacanzado.

Nivel "A" (A): incluye los puntos de verificación de prioridad 1.
Nivel "Doble A" (AA): incluye las prioridades 1 y 2.
Nivel "Triple A" (AAA): incluye las prioridades 1, 2 y 3.

Cómo comprobar la accesibilidad de un sitio web

Servicios de validación automática de páginas web Se trata de servicios de acceso on line, que permiten el acceso a nuestro sitio web presentando el código validado según los estándares especificados. Bobby: desarrollado por CAST (Center for Applied Special Technology).

Aplicación que realiza un análisis en tiempo real de la página solicitada generando una nueva página donde se marcan de manera gráfica los fallos de accesibilidad y los elementos incorrectos o no estándar de HTML. Validador del WAI: Sirve para la detección automática de etiquetas no estándar de una página web para la versión seleccionada de HTML.

NetMechanic: Validador on line de código HTML. Verifica el código de un sitio web generando un reporte a través de email.

Listas de comprobación y autoevaluación (Checklists) Web Page Accessibility Self-Evaluation Test de la Diversity Management Directorate (Public Service Commission de Canadá), mediante este test de autoevaluación, se puntúa la accesibilidad de un sitio web basándose en las respuestas a un cuestionario acerca de los diferentes puntos de accesibilidad de la página.

HTML Author Checklist de la WAI.

Comprobación con varios navegadores y dispositivos Este punto es básico. Adicionalmente, la WAI y muchos otras organizaciones recomiendan la verificación de la accesibilidad de los sitios web mediante:

Navegador "sólo-texto" (Lynx o NetTamer) Ver a través de un emulador Lynx

Navegador basado en voz (PwWebSpeak)

Navegador estándar con:
Gráficos y multimedia desactivados
Sonido desactivado
Sin ratón
Resolución de pantalla en VGA
Distintos modelos y versiones de navegadores estándar como Explorer y Microsoft, Opera..., o incluso Mosaic

Fuente. http://www.alzado.org/comentarios.php?id_art=2
Autor:
Luis Villa
Esta obra fue publicada por su autor bajo Licencia Creative Commons

23 puntos a tener en cuenta en el diseño web

Y en muchas, pero que muchas ocasiones las decisiones adoptadas son contrarias a la orientación al usuario del sitio web.

Aquí tenéis 23 sugerencias que se pueden extraer del estudio que se han realizado con la técnica “eye-tracking” y que puedes utilizar para mejorar el diseño de tu página web. El artículo original, en inglés, esta publicado en Virtual Hosting.
  • El texto atrae la atención antes que los gráficos. Contrariamente a lo que podría imaginarse, lo primero que un usuario visita en un sitio web no son las imágenes. La mayoría de los usuarios que llegan a tu sitio lo hacen buscando información, y no imágenes, así que asegúrese de que tu sitio web está diseñado para que las partes más importantes de tu texto son lo más destacado.
  • El movimiento inicial de la mirada se centra en la esquina superior izquierda de la página. No debe sorprender que un usuario visite las páginas web de esta manera, ya que la mayoría de las aplicaciones están diseñadas con la parte superior izquierda como el foco principal. Puedes hacer un favor a tu sitio web al mantener este formato a la hora de crear el diseño. Recuerda, tienes que tener en cuenta lo hábitos de los lectores si quieres tener un sitio orientado al usuario.
  • Al inicio, los usuarios buscar en la parte superior izquierda y en la parte superior de la página antes de desplazarse hacia abajo y hacia la derecha. Los usuarios generalmente escanean las páginas web en forma de ‘F’. Asegúrate de que los elementos importantes de tu contenido se encuentran en estas áreas clave. Utiliza titulares, subtítulos, viñetas, y texto resaltado a lo largo de la página de manera que incites a los lectores a leer más.


  • Los lectores ignoran los banners. Los estudios han demostrado que los lectores en gran medida hacen caso omiso de los anuncios (banners). Si estás tratando de hacer dinero a través de anuncios, lo que necesitas es ser creativo en su ubicación o en los tipos de anuncios que coloques en tu sitio.
  • El diseño en el formato de las fuentes no se tiene en cuenta. ¿Por qué? Pues porque los usuarios suponen que son anuncios y que no tienen la información que necesitan. De hecho, los estudios demuestran que los usuarios tienen dificultades para encontrar la información en letras grandes de color con formato.
  • Mostrar los números como números. Lectores les resultará mucho más fácil de encontrar información en su sitio si utiliza números en lugar de escribirlos. Recuerda que estás escribiendo para los lectores que van a ser principalmente de exploración de su sitio, a fin de hacer que les resulte más fácil encontrar lo que necesitan y mantenerlos interesados.
  • El Tipo de tamaño de la letra influye en el comportamiento de la visualización. Las fuentes pequeñas aumentan la concentración de la lectura en el texto mientras que las fuentes más grandes animan al usuario a explorar por la página. Dependiendo de tus necesidades, elige un tipo de letra u otro.
  • Haz que tus usuarios puedan buscar en una parte específica del texto. No uses subtítulos como un formato particular, para ello asegúrate que sean pertinentes y de interés. También pueden ayudarte si incluyes palabras clave que ayuden a la idexación de la web.
  • Los usuarios, en general, exploran la parte inferior de la página. Puedes utilizar esto a tu favor dándoles información clave cuando los lectores están explorando la página. Resaltar algunas secciones o crear listas con viñetas ayuda a encontrar información y a leer la página.
  • Frases cortas mejor que párrafos largos. La información en tu página debe de estar diseñada para el corto tiempo de atención de la mayoría de los usuarios de Internet. Mantén los párrafos y las frases cortas a menos que el contexto lo requiera, por ejemplo las descripciones de los productos de un sitio de comercio electrónico.
  • Una columna es mejor que varias para conseguir atraer la atención de los usuarios. No abrumes a los visitantes de tu sitio con demasiada información. La simplificación es mejor en algunos casos. La utilización de múltiples columnas es probable que sean ignoradas por los usuarios.
  • Los anuncios en la parte superior y en la parte izquierda de una página recibirán la mayor atención. Si vas a publicar anuncios en tu sitio, intenta integrarlos en la parte superior izquierda de la página, dónde tendrás la mayor atención visual. Pero sólo porque los lectores los vean no significa que hagan clic sobre ellos, por lo tanto no sacrifiques el diseño sólo para ganar un poco de visibilidad.
  • Los anuncios colocados junto a los mejores contenidos son los más vistos. Si usted quiere que sus anuncios se vean y que hagan clic en él, incorpóralos en tu diseño de manera que se coloquen cerca de los elementos más interesantes de tu contenido. Los usuarios podrán encontrar lo que necesitan y además tendrás una óptima visualización de tu publicidad.
  • Los anuncios de texto son los más leídos. Como dijimos anteriormente, la media de usuarios de Internet, en general, no pierde mucho tiempo buscando en cosas que parecen ser de inmediato anuncios. Esa es la razón que sean mejores los anuncios de texto. No se trata de distraer y de mezclar con el resto del contenido de la página, pero son visualmente menos irritantes para el lector y, en definitiva, tienen más éxito.
  • Las imágenes grandes reciben más atención. Si vas a usar imágenes en tu página, cuanto más grandes mejor. La gente está más interesada en una imagen donde se pueden ver claramente los detalles y la información. Sólo asegúrate de que toda imagen que utilizas es particularmente pertinente a tu texto, de lo contrario es muy probable que sea ignorada.
  • Imágenes sencillas y limpias atraen más la atención. Si bien pueden funcionar bien con tu diseño, las imágenes artísticas no van a obtener mucha atención del lector. Si está usando fotos con gente, asegurarse de que son claras. Cabe señalar también que las fotos con el “verdadero” gente, y no con modelos, dan mejor resultado.
  • Utiliza titulares. Lo primero que leen los usuarios en una página son los titulares. Asegúrate que no bloquean otros temas de la página y que estos destacan lo suficiente para incitar al lector a seguir buscando.
  • Los usuarios pasan mucho tiempo mirando los botones y menús. Debido a esto, tendremos que dedicar algo de tiempo extra para asegurarnos que están bien diseñados. Después de todo, estos no sólo llaman mucho la atención de los ojos sino que son uno de los elementos más importantes de la página.
  • Las listas hacen que el lector mantenga la atención durante más tiempo. Una manera útil de para facilitar la lectura es la utilización de listas en lugar de párrafos largos. Utilice números o viñetas para resaltar la información importante dentro de su contenido. Esto hará tu sitio más escaneable y más fácil para los usuarios el poder encontrar la información que está buscando.
  • Evitar grandes bloques de texto. Los estudios han demostrado que los visitantes no se van a tomar el tiempo de estudiar grandes bloques de texto y no importa lo bien escrito que estén o la información que proporcionen. Debido a esto, es necesario romperlos en pequeños párrafos. Destaca áreas específicas, puede ayudar a mantener la atención del usuario.
  • Dar formato al texto puede llamar la atención. Para guiar al lector a los puntos más importantes del texto utilizar negrita, mayúsculas, cursiva, color, y texto subrayado. Pero con prudencia, si te excedes dificultará la lectura.
  • El espacio en blanco es bueno. Si bien se podría caer en la tentación de poner algo de texto en cada rincón de la página, es realmente mejor dejar algunos huecos. Los sitios con demasiado contenido tienden a abrumar a los usuarios y esto hace que hagan caso omiso de parte del mismo. Por lo tanto, deja espacios visuales limpios para no saturar al usuario.
  • Las herramientas de navegación funcionan mejor cuando se colocan en la parte superior de la página. No deseas que los lectores que llegan a tu web sólo busquen en la página inicial, querrán que naveguen por otras páginas y que localicen contenidos que puedan interesarles. Puedes ayudarles haciendo su navegación fácil, para ello coloca la barra de navegación en la parte superior de la página.


Fuente: Desarrollo Web

Informe de Carlos Guadián Orta*
URL: http://www.k-government.com/2007/11/17/23_puntos_a_tener_en_cuenta_en_el_diseo_web/

* Atención: Copyright. Este artículo no se puede reproducir sin la autorización expresa del autor.

Thursday, November 29, 2007

Crea un slide accesible

Si necesitas un slide para tu aplicación, no dudes en echarle un vistazo a este desarrollado de forma no obstructiva. Algo más que necesario para conseguir un aplicación accesible.[Demo][Descargar]

Fuente: frequency-decoder.com via anieto2k.com

Wednesday, November 28, 2007

Herramientas

CSS Formatter and Optimiser
http://www.cleancss.com/

CSS
53 CSS-Techniques You Couldn’t Live Without
http://www.smashingmagazine.com/2007/01/19/53-css-techniques-you-couldnt-live-without/

Para Diseñadores y Desarrolladores
http://www.estandaresyaccesibilidad.com/2005/12/herramientas-para-diseadores-y_27.html

Mas herramientas
http://metaware-inc.wiki.mailxmail.com/EnlacesWEB

Friday, November 23, 2007

Páginas útiles

Guía de Referencia CSS 2.1
http://www.w3c.es/Divulgacion/GuiasReferencia/CSS21/

Galeria de imagenes con CSS
http://www.grafikas.es/web_apuntes/galerias.htm#noir

Propiedades, atributos y equivalencias CSS
http://usuarios.lycos.es/dhtml_club/objetos/propiedades.htm

Librería javascript que permite agregar un tooltip a nuestra páginas web, esto con la posibilidad de personalizar el tooltip mediante CSS
http://www.dxpro.es/index.php?topic=458.msg887

Apuntes CSS - Posicionamiento
http://www.ignside.net/man/css/posicionamiento.php

Tidy para Windows
http://www.paehl.com/open_source/?HTML_Tidy_for_Windows

Bugs de Firefox
http://www.mclibre.org/consultar/amaya/otros/ot_bugs_mozilla.html

Web Page Speed Report
http://www.websiteoptimization.com/services/analyze/wso.php

Verificadores, Editores y Herramientas para JavaScript
http://www.programas-gratis.net/b/java-script

Recopilación de herramientas javascript
http://www.anieto2k.com/2007/03/29/recopilacion-de-herramientas-javascript/

JavaScript Code Improver 1.00
http://jcay.com/jscisetup.exe

Friday, November 16, 2007

Tiempos de respuesta

Tiempos de respuesta en la Web
El objetivo mínimo a alcanzar en la actualidad es un tiempo de respuesta de no más de 10 segundos, dado que este es el tiempo límite que las personas pueden prestar atención mientras esperan.

Según los expertos, los tiempos recomendados son los siguientes:
  • Una décima de segundo (0.1 sec) es el tiempo normal de respuesta para que el usuario sienta que el sistema esta reaccionando instantáneamente. En este punto no es necesario informar al usuario que algo esta siendo procesado o actualizado.
  • Un segundo (1 sec) es el tiempo limite para que el usuario se de cuenta de que hay una demora y que la misma no es una interrupción.
    En demoras de más de una décima y menos de un segundo no es necesario mostrar ningún mensaje especial, pero el usuario siente que ya no esta trabajando directamente sobre los datos.
    Mostrar una página en menos de un segundo le da al usuario la sensación de que esta accediendo a la información sin demoras.
  • Diez segundos (10 sec) es el tiempo máximo que un usuario puede permanecer atento a una tarea. Si el tiempo de respuesta es mayor, los usuarios tienden a ocupar su tiempo en otras cosas por lo que ya no están atentos a lo que la computadora esta haciendo.
Descargar y mostrar una página en menos de diez segundos permite que el usuario pueda concentrarse en reconocer la manera de desplazarse por el sitio.

Tiempo de respuesta del Servidor
Debido al dinamismo con el que son desarrolladas las páginas hoy en día, el tiempo de descarga de las mismas debe ser calculado sobre la marcha. Por lo que la demora de visualización no depende solamente del tiempo de descarga sino también del rendimiento del servidor o servidores involucrados.
En la actualidad, es muy común que los sitios Web interactúen con bases de datos, lo que hace que el proceso de descarga sea aún más lento.
Todas estas cuestiones técnicas no le interesan al usuario ya que a él no le interesa por que los tiempos de respuesta son lentos.
Lo único que ven y perciben los usuarios es que el sitio que están visitando no les esta dando un buen servicio.
Los tiempos de respuesta lentos se traducen directamente en un nivel de confianza menor.

Los factores que influyen en la velocidad de carga de una página son:
  • Rendimiento del Servidor
  • Conexión del Servidor con Internet
  • Internet
  • Conexión del Usuario con Internet
  • Velocidad del Navegador y de la Computadora del Usuario
Esto significa que cada uno de estos eslabones aporta su propia cuota de demora, y como las demoras son acumulativas, no se podrán conseguir buenos tiempos de respuesta mejorando solamente algunas de las partes.

Fuente: Jakob Nielsen - Usabilidad, Diseño de Sitios Web

Usabilidad web

1. Introducción
Con las facilidades existentes para la creación de sitios web, aumenta considerablemente la cantidad de llamados "webmasters" y una cantidad de "sitios" que proliferan de manera amateur, ayudados de hosting gratuitos y asistentes de creación de paginas, como los de geocities.

Lo malo es que estos softwares, no muestran como hacerlos correctamente. Existen muchas cosas más a tomar en cuenta que el solo hecho de mostrar nuestra información.

Un buen sitio Web debe ser como unos buenos padres, debes hacer sentir querido a tu usuario, si no quieres que se aleje del hogar, por otros que le ofrezcan amor y comprensión.
Hacerlo sentir querido no es decirle...

"Hola usuario, sabes, eres lo mejor que me ha pasado"

...sino, simplemente ponerle el campo para buscar donde él espera que esté.

Un usuario satisfecho es tu mejor publicidad y además gratis, más que cualquier banner publicitario.

Tu web ocasiona una interacción entre una persona y una computadora, de las cuales solo la persona razona, así que has tu sitio lo mas lógico que puedas, si sabemos que el usuario no le puede hacer preguntas a la PC, pues no las ocasionemos.


2. Encontrabilidad
Este es un término utilizado en la Usabilidad, el cual se refiere a la capacidad de "Encontrar"
¿Pero encontrar que?, encontrar lo que buscabas en el sitio al que entraste.
Supongamos que entras al home de Cristalab buscando los personajes del cómic ¿Cuanto tardas en hacerlo? Más de lo que esperabas supongo, pero que tal si entras buscando el ultimo cómic o las últimas entradas al blog ¿Fácil, no?
Has fácil de encontrar para lo que esta hecho tu sitio, no quiero decir que lo demás lo hagas difícil, también debe ser fácil, pero hay cosas que llevan prioridad.

"Que no se pasen la vida buscando lo que necesitan"

Un buen sabor de boca
Una buena sensación hace que ames un sitio Web, por ejemplo, me han tocado sitios donde lleno todo un gran formulario, doy Enviar y me marca error "Faltan datos requeridos" y me regresa a la página del formulario donde el campo requerido aparece con un asterisco en rojo, a lo que en otras ocasiones esto no lo hacen y tienes que llenar un campo y te marca el mismo error de nuevo, llenas otro y otro y otro y al final resulta que todos eran requeridos, lo peor, hay unos que te borran los datos y tienes que escribir todo de nuevo cada vez que te regresa.
Imagina lo que al usuario le gustaría e inclúyelo para el momento en que lo necesite. Por ejemplo, en una web grande, el campo "Buscar".

"Código Postal incorrecto, por favor, llene nuevamente los 25 datos del formulario"

3. Amarra al usuario
La mayoría de las veces el usuario recorre visualmente toda la pagina buscando inconcientemente que esta marque puntos claves e interesantes antes decidir leerla. Si no cuenta con esto, lo más probable es que se vaya o si tenemos suerte, la agregue a favoritos para un día que no tenga nada más importante que hacer (nadie sabe si ese día llegará).

"A ver, a ver, a ver... ¿que es eso de CristaLab los mejores tutoriales?"

Un sitio Feo
A nadie e gusta un sitio "feo"; la estética juega gran parte de nuestro triunfo, dale placer a los ojos del usuario, no lastimes su vista, refleja la imagen que el esperaba encontrar en tu web. Es posible hacer un sitio estético y usable, no tienes que elegir entre una de las dos.

4. Qué es la Usabilidad
ISO/IEC 9126:
"La usabilidad se refiere a la capacidad de un software de ser comprendido, aprendido, usado y ser atractivo para el usuario, en condiciones específicas de uso"

ISO/IEC 9241:
"Usabilidad es la eficiencia y satisfacción con la que un producto permite alcanzar objetivos específicos a usuarios específicos en un contexto de uso específico"

En otras palabras; que tan fácil se navega en tu web, que tan rápido se aprende a manejar, que amigable es, que capacidad tienen de gustar, que sea intuitiva y sobre todo, que sirva para lo que fue hecha.

[Press any Key] A esto llamo Usabilidad. ¿Porque no ser específicos?, presione la tecla "Enter". Por ejemplo

La usabilidad no se enfoca solamente a que una cosa se pueda utilizar correctamente, sino que deje una buena impresión o sensación al usuario, que le sea agradable usarla.

Según la ISO la Usabilidad se enfoca en la:
Facilidad de Aprendizaje: Que tan rápido aprenden a controlar el sitio. Que tan familiar, que tan predecible es. Flexibilidad: Sí se puede hacer algo de distintas formas, sí hay distintos caminos para llegar a nuestro objetivo. Diferentes opciones para realizar las tareas. Robustez: Que tanto ayudamos al usuario, que tan fácil le hacemos el trabajo, que tan rápido cumple sus objetivos, que tan completo esta el sitio.
Esto no se trata de diseñarle el sitio al usuario como un estúpido, sino de no hacerlo sentir como uno al no entender tu sitio Web.


5. Lo que no debes hacer (1)
Aquí listo algunas cosas que yo considero no deberías incluir en tus webs, claro que al final la decisión es de cada quien.
No cosas parpadeantes, constantes, muy llamativas, que no dejen concentrarte en lo que realmente necesitas. No uses colores muy brillantes que molesten o lastimen la vista del usuario.

"OK, ya entiendo como funciona esto, leo, descanso, leo, descanso..."
Cuidar el peso de las imágenes, solo las necesarias y la calidad necesaria. No fondos de página con diseño, es muy molesto que debajo de lo que estas leyendo o tratando de leer se encuentre una imagen (foto, fondo o peor aun, gif animado). Procura siempre debajo del texto un fondo sólido. No utilizar subrayados en palabras que parezcan links, esto confunde al usuario y es molesto darle clic y que no pase nada. No poner links que parpadean. No abusar de las precargas, es molesto estar esperando a que se carguen gran cantidad de cosas, y sobre todo cuando después de que se cargo la principal, tienes que ver otra precarga cada que quieres ver una sección. No dejar mucho a la imaginación del usuario, no ponerlo en una situación donde el no sepa que es lo que tiene que hacer a continuación, donde pierda 10 segundos en encontrar el botón para continuar o lo que necesita, hay que hacerle todo muy predecible.

¿Presiono Siguiente, continuar, o finalizar?

6. Lo que no debes hacer (2)
No cambies eltamaño de las imágenes en el HTML o con el DreamWeaver o en casos extremos con el FrontPage; crea las imágenes del tamaño que las vas a utilizar con tu editor de imágenes. No usar tecnicismos que nuestros usuarios no van a comprender, no te trates de lucir con palabras que solo los van a confundir, a todos nos gusta que nos hablen en nuestro idioma.

"Si diseñó un sitio para si mismo, ¿para que lo publica en Internet?"
Ya no hagas "intros" en flash para tu web, YA NO se usa, puedes hacer una presentación de tu sitio e incluirla dentro de él, y el que quiera verla, dará clic en el vínculo. Deja que el usuario entre directamente a la página principal, no pongas donde salga el botón "Entrar al sitio" y si le pones música, que inicie apagada, si el usuario quiere escucharla el dará play.

"¿Cree que tengo tiempo para ver una Intro?, y aun peor, esperar a que se cargue, haaa y cada vez que entro tener que presionar Saltar Intro, ¿no entienden que a mi lo que me interesa es la información?, no importa, creo que por aquí hay otro sitio no tan bueno, pero no tan molesto"
Muchos dicen que ¿Para que flash?, que para que imágenes, que para que colores, si lo que importa es la información, el chiste es saber combinar estas cosas sin excederse, se puede diseñar estético sin aumentar el peso a la Web, ¿De que sirve tener tanta información si a nadie le va a atraer leerla?

7. Lo que no debes hacer (3)
No repetir el "Title" (el texto que aparece cuando dejas el puntero sobre un link) lo mismo que dice tu hipervínculo, ya que esto es redundante, y lo que uno espera es una muy breve descripción de lo que hay detrás de este link. Repetirlo solo es bueno en un menú. No le cambies el botón cerrar por un circulo en lugar de la cruz. Las metáforas familiares proporcionanuna interfaz intuitiva. Y si lo pones arriba a la derecha que mejor. Siempre trata de hacer los sitios de modo que se adecuen a la gente, no que la gente se adecue al sitio. Si ya están acostumbrados a algo ¿para que cambiarlo?

"¡Claro que le se!, el otro día vi como la usaba mi nieto, ¿Qué puede cambiar?"
No abrir links en nuevas ventanas, eso lo debe decidir el usuario. No poner información basura, nada que al usuario no le sirva, nada que este de más, eso mejor agregarlo en otra sección en la cual el entre si es que desea conocer ese dato. Esta información puede estorbar en la estética o usabilidad al saturar al usuario de información. Los Combobox que actúan al momento de seleccionarlo. Se podrían aceptar los que lo hacen al momento que seleccionas un país, pero aun estos deben avistarte que actuaran al momento de cambiar la selección. Luego pasa que usas el scroll del Mouse, y la web se vuelve loca, esto debido a que tenías seleccionado el combo y al momento de hacer el scroll cambiaste por todas las opciones de este.

8. Algunos Consejos (1)
Determinar para quetipo de usuario vamos a diseñar, se debe saber que capacidad, experiencia, conocimientos o hasta las condiciones físicas va a tener el usuario que lo va a utilizar, su edad, y además, que el sitio sea ergonómico y que cargue rápido.

"Que bien, un sitio donde puedo navegar, y de seguro hasta tomó en cuenta que padezco sordera"
Siempre un vínculo a la pagina principal (home), no olvidar incluirlo también en el logotipo. Que pueda hacerlas tareas rápido, que no tarde en ninguna actividad, si ven que algo los va a hacer perder mucho tiempo, mejor lo dejan. Si tienes un link muy descriptivo y no sabes que poner en el ALT; puedes colocar la URL a donde serás dirigido. Siempre resume la información (no como este artículo ), has que a simple vista tu artículo no se vea pesado o aburrido antes de leerlo. La Web nos ofrece la gran ventaja del hipertexto: Texto dentro de texto, links. Dentro de tu información no tienes que explicar cada palabra técnica, puedes utilizar Vínculos a donde la expliques o el apoyo de CSS para meter dentro etiquetas especiales, una pequeña explicación, y lo mejor y más recomendable, solo deja a la vista lo mas esencial, solo deja tu resumen, un comúnmente llamado "en pocas palabras" y al final puedes dejar un link o vinculo "ver más a fondo". Importante recordar que no se debe de abusar de los links dentro de texto. Recomiendo un link por párrafo, máximo dos. Una forma para contactar al Webmaster y un buzón de sugerencias, dentro de la sección del quienes somos, la cual siempre debería de existir. Lostítulos en las ventanas, estar relacionados al contenido de la misma, recuerda que cuando está minimizada es lo único que ves, aparte de otras ventajas que esto ofrece, no pongas en todas solamente el titulo de tu web. Todos vemos siempre en el orden de izquierda a derecha y de arriba hacia abajo, así que esa puede ser la importancia del contenido de nuestra Web. Siempre es bueno un efecto rollover (mouseOver) en los menús o links, a los usuarios siempre les gusta saber que está o que no esta pasando.

9. Algunos Consejos (2)
Siempre debe ser el usuario el que inicie o active cualquier cosa que suceda en el sitio, todo lo demás son intrusiones. Además debe tener el poder de detener cualquier proceso o actividad. Recuerda que puedes usar imágenes en las opciones (menús, links, secciones), son más fáciles de recordar y reconocer a simple vista. Reducir la cantidad de Clicks que tiene que hacer el usuario al mínimo, cuentan también los clic que da cuando entra a una opción de menú buscando algo y no lo encuentra y tiene que regresar y dar mas clic, así que una forma de reducirlos puede ser estructurando bien la información para que siempre la encuentre a la primera. Un diseño estándar, igual en cada sección, que todo sea similar. Si el diseño de tu sitio es consistente, sera traducido en facilidad de aprendizaje y uso. Aprender a decir mucho con pocas palabras, para reducir la cantidad de texto. El usuario siempre debe ser informado de lo que sucede detrás de la página, es decir, siempre indicarle lo que esta sucediendo, como por ejemplo: cargando contenido, enviando correo, adjuntando archivo, realizando su búsqueda, etc. Brindarle Seguridad, de manera que el usuario esté seguro de lo que sucederá al momento de realizar determinada acción, como dar clic en un link, el debe estar seguro de lo que pasará y no tener que pensarla 2 veces antes de hacerlo. No poner links ni imágenes confusas como vínculo. Siempre dales todo lo que necesitan, hazles las cosas fáciles, no los hagas batallar.

"Por favor, maquíllese antes de entrar a la siguiente sección"
Por ultimo, especificar al momento de hacer el trato o contrato con el cliente, hasta donde él tomará parte, como decirle de buena manera y lo mas diplomático que se pueda, "Usted podrá decidir que contenido quiere que resalte, pero yo decidiré la forma de hacerlo resaltar", "usted dice que, pero yo decido como". "Usted es el experto en su área y yo en la mía". Claro que sobre logotipos y colores oficiales lo más que podemos hacer son propuestas para cambiarlos.


10. Beneficios
Hay que darle menos asistencia al usuario, sobre todo si manejamos un sistema Web. Reducción notable de errores, ya saben, cuando capturan mal, o donde no va, etc. El usuario realizará sus objetivos mucho más rápido, y eso es agradable para cualquiera.

"¡Amigo!... ni te imaginas el sitio que encontré, ya te mande la dirección por correo, nos ofrece lo mismo pero este es facilismo y sin complicaciones, olvídate de liaberinto.con.fun.de"
Mantenimiento al sitio mucho más rápido y sencillo, sobre todo si utilizamos CSS.
Gran cantidad de visitas y usuarios, ya solo resta meterle contenido interesante. Mucha mejor calidad del sitio.
Tenemos usuarios más tranquilos y felices de navegar por nuestra Web. Siempre dejaremos un muy buen sabor de boca en cualquiera de nuestros visitantes.

"Navegar en este sitio es tan rico como mi café"

11. Conclusión
Siempre debemos tener en cuenta qué es lo que esperamos de los usuarios y del sitio (Si vamos a hacer un sitio para una película de cine y solo quieres causar una buena impresión o uno para tu negocio al cual quieres que vuelvan y vuelvan).

Este artículo es solo para que sepan que todo tiene un porque, no se puede realizar una Web o un sistema como a uno se le antoje, siempre hay que ir mas allá, "voltear la tortilla" como decimos los mexicanos, ponte en lugar de el usuario final.

Imaginen un sitio con todas estas características, ¿No se sentirían amados por él?

Diseño Web centrado en el usuario: Esta es una corriente que enfoca más a la forma de estructurar la información dentro de nuestro sitio Web.

Autor: QUHO Quintero
Fuente: http://www.mailxmail.com/curso/informatica/usabilidadweb