diseño

You are currently browsing articles tagged diseño.

Los 10 principios del buen diseño de Dieter Rams aplicados al entorno web

20 julio 2011 in Diseño web by Ricardo Tayar | 4 comments

Dieter Rams es un diseñador industrial alemán, que aparte de su trabajo, sobre todo para la marca Braun, es muy conocido por haber elaborado 10 principios básicos o mandamientos sobre el diseño. Y digo diseño así, a secas, porque supongo que originalmente Dieter Rams los pensó para su propio escenario de trabajo, el diseño industrial, pero la verdad es que los pensó tan bien, que son aplicables en su práctica totalidad a cualquier tipo de diseño o escenario estético.

Los 10 mandamientos del buen diseño de Dieter Rams pueden aplicarse perfectamente a la web

Dieter Rams pensando en sus cosas

Dieter Rams, probablemente pensando en sus principios de diseño

Y de hecho, estos principios o mandamientos, aplicados a un sitio web, son, por lo menos en mi opinión, un buen termómetro de la calidad y utilidad de su diseño.

Estos famosos 1o mandamientos o principios son:

  1. El buen diseño es innovador.
  2. El buen diseño hace un producto útil.
  3. El buen diseño es estético.
  4. El buen diseño ayuda a un producto a ser entendido.
  5. El buen diseño es discreto.
  6. El buen diseño es honesto.
  7. El buen diseño es duradero.
  8. El buen diseño es constante hasta el último detalle.
  9. El buen diseño está concienciado con el medio ambiente.
  10. El buen diseño es tan poco diseño como sea posible.

Vale que no todos son 100% aplicables al diseño web si los interpretamos literalmente, pero desde luego un buen número sí lo son, y de hecho suponen una ayuda en la definición de un diseño web como un elemento de real utilidad y correctamente orientado. Es fácil comprobarlo de la siguiente forma, aplicando estos principios al diseño web: Sigue leyendo »

Tags: , ,

¡Me han copiado la web!, ¿por qué?, ¿qué mundo es este?, ¿nadie piensa en los niños?

10 mayo 2011 in General by Ricardo Tayar | 29 comments

“¡Me han copiado la web!”, esto es lo primero que te viene a la mente, lo digas o no, cuando ves cosas como estas, en lo que ya no se puede llamar inspiración, sino copia descarada. Ampliad la imagen y valorad vosotros mismos:

Copia de una web

A ver, una cosa es “inspirarse” en un diseño web y otra es copiarlo directamente, fusilarlo sin más

Yo, como la mayoría de la gente que trabaja en esto, me fijo, y mucho, en el trabajo de los demás, porque de ahí aprendo y de ahí saco ideas o adapto las ideas de otro, o si me gusta un layout o una disposición de elementos lo utilizo… pero lo adapto!!! Intento convertirlo en algo propio partiendo de un modelo que ya existe, y eso, señores, es una cosa, y esto, amigos de Campoamor formación, es otra muy distinta.

Desde aquí os invito a que trabajeis más vuestras propias propuestas, por supuesto aprendiendo de los demás, pero trabajando y esforzandoos, como hacemos o intentamos hacer otros. Pensad amigos de Campoamor, si todos hiciéramos los mismo, solo habría 4 o 5 diseños web en el mundo, porque todos copiaríamos literalmente al otro para enmascarar nuestra falta de imaginación y/o ideas. NO LO HAGAIS AMIGOS DE CAMPOAMOR! Pensad que si nosotros lo hemos hecho, vosotros también podeis (¿o no?), solo hay que trabajar un poquito y tener una pizca de ética. Ayudadnos a hacer de este mundo un lugar más bonito donde vivir y empecemos por aquí, por tener un sitio web realmente diseñado por ti. Además llevando la palabra “amor” en vuestro nombre, esto está muy feo. Vais a cabrear a Cupido. Sigue leyendo »

Tags: , , , ,

18 meses optimizando un ecommerce. Conversion Thursday Madrid

27 febrero 2011 in Analítica Web, Comercio electrónico, Diseño web, Eventos, cursos, ferias y congresos by Ricardo Tayar | 10 comments

Siempre hablamos de la optimización como algo fundamental para conseguir rendimiento, eficacia y rentabilidad en cualquier proyecto web. En un ecommerce, orientado a facturar, esto ni siquiera es una opción, es una obligación, así de claro.

La optimización generalmente se plantea tras el lanzamiento de un proyecto y cuando éste lleva un recorrido inicial que permite obtener una serie de datos (ventas, tiempos de visita, rebotes, fuentes de tráfico, etc) que a su vez hacen posible el analizar su rendimiento y, a partir de ahí, empezar a proponer acciones de mejora en el sitio web siempre buscando un mejor rendimiento en función del objetivo principal del sitio web.

Sobre estos temas, y en concreto de optimización de un ecommerce de servicios, hablamos largo y tendido en el Conversion Thursday de Madrid el pasado 17 de febrero

En concreto, en función del análisis de un proyecto de ecommerce de servicios durante un periodo de 18 meses se encontraron 10 puntos clave de optimización web, cuya mejora y el encontrar un modelo óptimo es necesario para alcanzar umbrales de rentabilidad.

Antes de detallar los 10 puntos de mejora claves en un ecommerce os dejo el vídeo de la exposición de este tema en el Conversion Thursday de Madrid:

Sobre los 10 puntos clave de optimización y mejora de un ecommerce, en este caso de servicios, que tratamos esa tarde, éstos son:

  1. El TPV. La pasarela de pago que empleemos es determinante en el éxito de las operaciones de venta. Hay TPVs con sistema CES (3D Secure), que son la mayoría, y que tienen sentido en el marco de la venta de bienes físicos. Quizás en el sector servicios tengan menos sentido, y, en general, debes tener un TPV adecuado a lo que vas a vender y que, en la medida de lo posible, permita integración con tus sistemas financieros, de pedidos y logística, etc. Sigue leyendo »

Tags: , , , , ,

Uso de navegadores de internet. Comparación primer trimestre de 2009 con el de 2010.

12 abril 2010 in Analítica Web, Diseño web by Ricardo Tayar | 7 comments

Una de las principales ventajas de la analítica web es que podemos conocer datos muy importantes sobre como navegan los usuarios por nuestros sitios web, y eso nos permite orientar las mejoras que queramos hacer hacia nuestros usuarios y pensando en el uso real que hacen de nuestro sistio web.

Desde el punto de vista del diseño web siempre me ha parecido fundamental controlar y medir que navegadores de internet utilizan los usuarios en los sitios web en los que trabajo y que resoluciones de pantalla, además de otros indicadores igualmente importantes.

La evolución de uso de los navegadores de internet en tan solo un año ha sido lo bastante significativa como para tenerla en cuenta a nivel de diseño web.

Es un dato muy importante sobre todo por asegurarnos de que el CSS va a funcionar igual en todos los navegadores empleados y también asegurarnos de que el sitio web se va a visualizar igual en cualquier navegador, sin hacer cosas raras si vemos la web en Firefox, Opera, Chrome o en Internet Explorer.

Estudiando recientemente la evolución del uso de navegadores de internet por parte de los usuarios en varios perfiles de Google Analytics que mido, en los que hay sitios web de temátcias muy diferentes, se aprecian cambios muy importantes en el uso de navegadores web por parte de los usuarios. Como muestra, esta comparación tipo (una media entre 5 sitios web de temáticas distintas) entre el uso de navegadores en el primer trimestre de 2009 y en el primer trimestre de 2010:

Comparativa de uso de navegadores de internet entre el primer trimestre de 2009 y el primer trimestre de 2010.

Comparativa de uso de navegadores de internet entre el primer trimestre de 2009 y el primer trimestre de 2010.

Podemos observar cosas bastante interesantes: Sigue leyendo »

Tags: , , , , , ,

La SERP de Google.es cambia de aspecto, ¿copiando a Bing?

5 abril 2010 in Diseño web, El loco loco mundo de internet, SEO - Posicionamiento Web by Ricardo Tayar | 12 comments

Hoy me he percatado al abrir en un navegador (Chrome) una sesión nueva en google.es que el aspecto de la página de resultados había cambiado y mucho. Habituado a ver todos los días las páginas de resultados de google.es, como otros tantos miles de mortales, el cambio me ha llamado la atención, y mucho.

La página de resultados de google.es (o SERP) que me he encontrado es muy muy parecida a la SERP de Bing

Pagina de resultados nueva de Google.es para la búsuqeda "alquilar coche"

Pagina de resultados nueva de Google.es para la búsqueda "alquilar coche" - Clic sobre la imagen para verla grande.

Por comparar y entrender el porque llama la atencion tanto este cambio, aquí podeis ver una página de resultados del buscador Bing:

Pagina de resultados del buscador Bing

Pagina de resultados del buscador Bing para la búsqueda "rent a car" - Clic sobre la imagen para verla grande.

Como puede verse a simple vista, la disposición de los elementos de la nueva página de resultados de Google es muy similar a la de Bing, sobre todo en lo referente al menú vertical de la parte izquierda, algo nuevo en google y que fue una apuesta de Bing. ¿Es este el futuro de la página de resultados de Google?

Sigue leyendo »

Tags: , , , , ,

¿Cuanto influye el color de un botón en su CTR? Un caso real de test multivariante.

2 marzo 2010 in Analítica Web, Diseño web by Ricardo Tayar | 15 comments

Probablemente muchos de los que leais este post ya conoceis perfectamente lo que es un test multivariante en Google Website Optimizer. Para los que no, aquí un pequeño resumen: Optimizer es una herramienta que te permite testear diseños alternativos de una landing page para ver si mejoras la conversión o cambia el comportamiento del usuario (esto es un test A/B) o bien puedes, dentro de un diseño, testear diferentes versiones de uno o varios elementos del diseño (botones, colores, fotos, etc.) para ver si mejoras la conversión, etc.

Un test multivariante nos permite comprobar el rendimiento de varias alternativas de un elemento en un diseño web. Para mejorar la conversión es una muy buena herramienta.

Dicho esto, en el caso práctico y real del que voy a hablar aquí, tenemos una web de comercio electrónico, y queríamos comprobar, tras leer un artículo, si la posibilidad de que un usuario haga clic sobre el botón de compra de un producto varia en función del color de éste. Es decir, si tengo un botón de “Iniciar compra” de un producto, ¿el color de este botón influye en la decisión del usuario de hacer clic en él, y por tanto comprar?.

En este test multivariante se utilizaron 3 colores diferentes para el botón de compra, con el objetivo de ver cual ofrecía mayor ratio de conversión.

En este test multivariante se utilizaron 3 colores diferentes para el botón de compra, con el objetivo de ver cual ofrecía mayor ratio de conversión.

Por supuesto, yo tengo claro que sí, que influye y mucho, y hay montones de estudios, posts y artículos hablando de ello, porque los colores tienen una asociación inconsciente con el comportamiento del usuario. Pero con creerlo o intuirlo no vale, así que decidí hacer un test multivariante para determinar si el color del botón de “Iniciar compra” influía en el CTR, el índice de clics, en ese botón de compra de los usuarios, en qué medida y qué margen de mejora teníamos en la web. Sigue leyendo »

Tags: , , ,

Como saber si un diseñador web sabe diseñar webs.

18 enero 2010 in Diseño web by Ricardo Tayar | 8 comments

El diseño web es una actividad que día a día, conforme el uso de internet es más general, va cobrando cada vez más importancia, ya que ante la demanda de creación y mantenimiento de sitios web cada vez más profesionalizados se hace necesario contar con buenos diseñadores web.

Lo malo es que la profesión de diseñador web alberga a muchos perfiles, algunos muy profesionales y conscientes de lo que supone el diseño de web y otros que simplemente se apuntan al carro porque saben manejar Dreamweaver un poco por encima y consideran que con eso ya son diseñadores web.

diseno-web-profesional-01

Aquí tenemos un diseño web reciente, de 2008 o 2009, aunque no lo parezca, ¿os atreveis a llamar profesional del diseño web a su autor?

La principal característica del diseño web y la que lo diferencia de otros tipos de diseño, es que requiere un buen conocimiento de conceptos como navegadores, usabilidad, arquitectura de la información, resoluciones, código HTML y demás zarandajas técnicas y no técnicas directamente relacionadas con el medio en el que trabaja el diseñador web: internet. En resumen, puedes ser un gran diseñador gráfico, pero eso no te convierte en un buen diseñador web, y la fórmula también se aplica a la inversa.

Después de conocer a muchos y trabajar yo mismo como diseñador web unos cuantos años, participar en procesos de selección e incluso hacerlos, os incluyo unas listas de mínimos que SI y que NO debe cumplir un diseñador web para poder considerarlo como tal. La lista podría ampliarse mucho en ambos sentidos, pero se trata de ver lo básico que debe tener y no tener un diseñador web.

Lo que SÍ debe saber o tener un diseñador web que sabe diseñar webs:

  1. En su portafolio deben aparecer varias direcciones web diseñadas por él mismo. Si un diseñador web no tiene URLs en su portafolio solo hay dos posibilidades: no sabe hacer webs o las que ha hecho le averguenzan y no las pone en su curriculum. En cualquier caso nada bueno.
  2. Debe conocer y utilizar CSS. Hoy en día, por muchísimos factores, el uso de CSS es imprescindible en el diseño web. Si un diseñador web no utiliza CSS generalmente es porque no se ha molestado en aprender y estar actualizado o porque sigue diseñando webs basadas en el uso de flash o en tablas y recorte de imágenes. Sigue leyendo »

Tags: , , ,

Utilizar Google Analytics para el diseño web: los navegadores

27 octubre 2009 in Analítica Web, Diseño web by Ricardo Tayar | No comments

La analítica web puede sernos muy util a nivel de diseño web y puede ser una herramienta importante para conocer a nuestros usuarios y orientar correctamente nuestros diseños web hacia ellos. En el caso de que utilicemos Google Analytics hay una serie de datos que resultan fundamentales para el diseño web, así que ya sabes, si eres diseñador y te da repelús usar Google Analytics, no tengas tanto miramiento porque es una herramienta de medición que te va a ser fundamental para hacer un diseño web mucho mejor.

Google Analytics puede ayudarte con el diseño web en lo referente a los navegadores empleados por los usuarios.

A nivel de diseño web uno de los valores más importantes que nos ofrece Google Analytics es la posibilidad de ver los navegadores web que utilizan los usuarios que usan nuestro sitio web. En los ejemplos voy a utilizar los datos de un sitio web de comercio electrónico orientado fundamentalmente a España pero con usuarios y clientes en algunos paises como Venezuela, Chile o Uruguay. Si por ejemplo, analizo la información del mes de septiembre de 2009 veo la lista de los navegadores más utilizados y los porcentajes de tráfico correspondientes a cada uno (en Google Analytics se ve esta información en Usuarios/Navegadores). Esta información lógicamente me es muy util porque me dice que navegadores usan los usuarios de mi sitio web. En este caso los navegadores que se usan son estos:

Google Analytics nos muestra el porcentaje de visitas de nuestro sitio web que corresponde a cada navegador.

Google Analytics nos muestra el porcentaje de visitas de nuestro sitio web que corresponde a cada navegador.

Como podemos ver haciendo una rápida suma los usuarios que emplean Internet Explorer y Firefox suponen el 94,5% de las visitas al sitio web, con lo que ya tenemos una primera conclusión, por muy obvia que sea: nuestro sitio web debe funcionar perfectamente y estar correctamente diseñado para ser usado con Internet Explorer y Firefox como mínimo. Sigue leyendo »

Tags: , , , , ,

Maquetar el contenido web para el usuario al que va dirigido.

19 octubre 2009 in Analítica Web, Arquitectura web by Ricardo Tayar | 4 comments

Hoy en día prácticamente todos estamos de acuerdo, en mayor o menor medida, en eso de que “content is king” o lo que es lo mismo, el contenido es el rey. Es cierto que depende del tipo de sitio web que tengamos puede ser que el contenido tenga mayor o menor importancia, pero en líneas generales, lo que contamos en nuestro sitio web y, sobre todo, como lo contamos, puede ser el principal valor para conseguir clientes, ventas, formularios o cualquiera que sea nuestro objetivo.

Ahora bien, por muy buen contenido que tengamos, ¿es suficiente con eso?, ¿solo importa el contenido?. La respuesta es no, porque el contenido del sitio web es su núcleo, pero el envoltorio también es muy importante, es como si un caramelo que está riquísimo lo envolvieramos en un cutreenvoltorio de papel de water. Sería igual de bueno, pero desde luego no lo parecería. Vale que el ejemplo no es el más apropiado, pero a lo que voy es que si es importante tener un buen contenido web es igual de importante maquetar ese contenido de una manera adecuada para que resulte atractivo para el usuario.

De hecho, y lo voy a explicar con un caso práctico, simplemente cambiando la apariencia de una landing page de un sitio web sin variar el contenido pueden mejorarse valores tan importantes en un sitio web como el porcentaje de rebote, el tiempo de permanencia o el número de páginas vistas por usuario. Y todo ello simplemente variando la forma de presentar la información, sin tocar el contenido ni el SEO del sitio web, ni la programación ni ningún factor que no sea la disposición de la información (ni siquiera voy a llamarlo usabilidad, que es un concepto más complejo). Para tomar este tipo de decisiones sobre como maquetar un sitio web es fundamental utilizar Google Analytics o similar y analizar con tranquilidad los datos que la analítica web nos ofrece, aplicar el sentido común, escuchar a los usuarios y sobre todo olvidarse de las opiniones personales sobre los sitios web. No importa que nos guste o no, importa que consigamos el objetivo que se pretende. Sigue leyendo »

Tags: , , , , ,

10 consejos para hacer un diseño web bien concebido

10 agosto 2009 in Arquitectura web, Diseño web by Ricardo Tayar | No comments

En menudo jardin me meto poniéndome a dar consejos sobre como hacer webs. Yo soy el primero al que le queda mucho por aprender, pero la verdad es que a base de hacer webs y más webs, y reunirte con clientes, y leer artículos y libros, y hacer cursos de usabildiad y diseño, y más y más cosas acabas teniendo unas pautas sobre como hacer un diseño web bien concebido, bien orientado para lo que el cliente quiere. Como en todo, cada uno tiene su método, pero creo que el 90% de los que lean esto estarán de acuerdo en que estos 10 consejos para hacer un diseño web son prácticamente universales. Espero que os sean útiles:

  1. Antes de diseñar nada de nada, reúnete con el cliente si es posible. Es fundamental saber de primera mano que es lo que el cliente quiere, y si no lo tiene claro, ayúdale. La pregunta clave es ¿para qué quieres una web?. La web no va a ser igual si el objetivo es vender productos, vender servicios, hacer branding o dar información. Pero lo más importante es saber lo que quiere el cliente con exactitud. A veces no es posible reunirse con el cliente, pero en ese caso es necesario disponer de un briefing (¿qué es un briefing?) o de unas indicaciones vía email o como sea pero sobre todo claras y concisas. Cuantos más intermediarios haya, más dificil te va a ser hacer un diseño web acertado. Me permito un apunte: muchas veces hay clientes que directamente no saben lo que quieren, así que si después de hacerle 2 o 3 propuestas no lo ve claro o sigue sin saber lo que quiere, no trabajes para él hasta que lo tenga claro, porque si no ni el cliente ni tú vais a tener una relación fácil.
  2. Haz una maqueta de la web que vas a hacer en papel, en plan dibujo esquemático. Esto parece una chorrada, pero te servirá, y mucho, para aclarar ideas y hacer un planteamiento de como vas a hacer la web.
  3. Crea una maqueta gráfica de la web en Photoshop o similares. Simplemente diseña todos los elementos, tal y como se verían en un navegador. Es una maqueta del resultado final, que no funciona pero que es al 100% un reflejo del aspecto gráfico que tendrá la web. Esta maqueta puede ser tu principal arma… a favor o en contra. Sigue leyendo »

Tags: , , ,

« Older entries