10 RAZONES PARA AMAR (Y USAR) LOS GRADIENTES EN 2018

Después de años de estilos planos, materiales y completamente minimalistas, el gradiente ha vuelto. Dondequiera que mires, los diseñadores están usando fundidos de color para añadir interés visual, crear el compromiso del usuario y simplemente diseñar algo que valga la pena mirar.

Si no eres un fan de los gradientes, tal vez es hora de reconsiderar tu postura sobre el tema. Para ayudar a convencerlo, tenemos 10 razones para amar y usar gradientes en sus proyectos de diseño web este año.

1. Los fondos crean interés

Un gradiente crea interés visual y ayuda a mover a los usuarios a través de un diseño. El ojo se posará sobre un área de color y el cambio entre las tonalidades y las áreas claras y oscuras ayuda a cambiar el enfoque a través de la pantalla.

Los degradados pueden ser una herramienta de diseño muy útil y atractiva y añadir chispa e intriga a una multitud de proyectos. Aunque hay muchas maneras de usar los degradados, una de las opciones más populares es como elemento de fondo con imágenes, texto y otros elementos superpuestos.

2. Las Cartas Pueden Proporcionar un Punto Focal

Del mismo modo que se puede utilizar un gradiente en el fondo, también puede ser un elemento de primer plano. Los degradados de color son una técnica bastante versátil, que podría contribuir a su popularidad general.

Voltee el uso y un gradiente de primer plano se puede utilizar como relleno para letras sobre un fondo más sencillo para resaltar y llamar la atención sobre las palabras.

La elección del color tiene que ser intencional para que siempre haya mucho contraste y se mantenga la legibilidad.

3. Las superposiciones pueden darle sabor a una imagen insípida

Una superposición de color puede añadir un interés adicional a una imagen que es un poco sosa. Una superposición de degradado no es una solución para una imagen de baja resolución o pobremente compuesta, pero puede dar a una escena simple más pop.

Las superposiciones de degradado pueden ayudar a establecer la marca, así como la voz, el tono y la personalidad del sitio web. Los colores brillantes dicen algo muy diferente de las opciones más apagadas.

Mientras que esta técnica puede parecer bastante limpia, como el ejemplo del portafolio a continuación, está comenzando a ser un poco sobreutilizada. Asegúrese de hacer algo un poco diferente con una imagen completa, superposición de gradiente para establecer su diseño aparte. El ejemplo siguiente lo hace atenuando completamente la imagen para que la parte inferior del degradado cree una barra de color sólido a través de la parte inferior de la pantalla.

4. Ayude a mover el ojo

Un gran gradiente puede ayudar a mover el ojo a través de un diseño de una manera que ayuda a crear la intención para los usuarios. La mayoría de los usuarios leen en forma de F, comenzando en la parte superior izquierda y moviéndose hacia abajo y a través de la pantalla.

Utilice áreas más claras y oscuras de un esquema de degradado de color para mover el ojo desde un punto de partida, como un logotipo o un mensaje primario, hasta la llamada principal a la acción. El ojo irá primero a las áreas de color más claras y luego a los espacios más oscuros. Diseñe y coloque el color del gradiente para reforzar este movimiento ocular.

5. Cree algo memorable

Aunque los degradados son cada vez más populares, el hecho de que cada combinación de colores sea algo diferente los hace memorables para los usuarios. Una combinación de colores asesina puede sobresalir-y quedarse con-un usuario para ayudarlo a recordar su marca o mensaje.

Diseñe gradientes con el propósito de ayudar a crear esa conexión. Lo bueno de un buen gradiente es que casi se convierte en un color sobre sí mismo. Si tienes un gran gradiente con el que trabajar, úsalo como lo harías con cualquier otro color de la paleta de tu marca para establecer una conexión visual. (O use múltiples degradados como la paleta de colores.)

6. Enfatice los colores de la marca

Utilice un degradado si tiene colores de marca que se prestan a ser emparejados. Para las nuevas marcas o sitios web que intentan establecerse, esta puede ser una manera sólida de construir la marca y la conexión con los usuarios.

Piense en cómo incorporar el mismo estilo de gradiente en múltiples usos: en el sitio web, para mensajes de medios sociales en campañas impresas o publicitarias. Ver el mismo uso de los mismos colores en el mismo gradiente comenzará a pegarse con los usuarios, que a su vez asociarán esos colores con usted.

7. Son fáciles de crear (o generar)

Agregar un degradado a una imagen o crear uno desde cero puede ser tan simple como elegir dos o tres colores y luego seleccionar una forma para el degradado y donde los colores deben comenzar, detenerse y superponerse.

Los gradientes, en términos de forma, son direccionales, de izquierda a derecha o arriba o abajo; o radiales, donde las variaciones de color emanan de un solo punto de forma circular. Un diseño puede contener uno o varios estilos de degradados.

Escoger colores para el gradiente puede ser el paso más difícil. El uso de colores cercanos en la rueda de colores dará como resultado los degradados más complementarios y naturales. Pero eso no es siempre con lo que tienes que trabajar. En ese caso, usted querrá jugar con los colores para no terminar con un tono desagradable en el espacio donde se encuentran sus opciones de colores primarios.

8. Los desvanecimientos del color se sienten naturales

Aunque no sea su primer pensamiento, los degradados a menudo tienen colores y combinaciones que se sienten naturales. Piénsalo, no todo en la naturaleza es un sólido y único tono de verde.

Los degradados son una opción natural por esta razón, particularmente cuando se combinan colores que realmente se desvanecerían entre sí en el mundo natural.

9. Crea arte cuando no tienes una visión dominante

Un buen gradiente puede crear interés visual y una visualización cuando no se tiene mucho con qué trabajar. Usar un color brillante, como el ejemplo de abajo, o colores de marca puede ayudar a establecer la presencia de su sitio web.

Los cambios de color son lo suficientemente interesantes como para que a menudo sean independientes como elemento de diseño. Piensa en cómo usas y selecciona los colores para que creen la atracción emocional adecuada para los usuarios y les ayuden a encontrar los sentimientos adecuados para asociarlos con el contenido.

Incluso un degradado sutil puede ser de gran ayuda para establecer el tono de un diseño.

10. Los gradientes están de moda

Los degradados son un elemento fácil y altamente utilizable de añadir para dar un toque de moda sin sentirse abrumador. Con tantas maneras de usar un gradiente, tiene mucho sentido que esta pueda ser su solución.

Y aunque los gradientes han caído en desuso de vez en cuando, tienden a volver bastante rápido debido a un atractivo casi universal.

4 TRUCOS DE UI MÁS ODIADOS

Nadie quiere crear un mal diseño, y sin embargo ocurre todo el tiempo. Y aunque la causa del mal diseño varía, el resultado final es la misma mala experiencia del usuario.

Una mala experiencia de usuario frustra a los usuarios y a menudo lleva a abandonar el producto. En este artículo, me centraré en un aspecto particular del mal diseño: el uso de técnicas de interfaz de usuario que conducen a una mala interfaz de usuario.

1. Pop-Ups

Si te pido que nombres la cosa más irritante de la web, lo más probable es que respondas: “Pop-ups”. Según el Grupo NN, los pop-ups son la experiencia web más odiada.

Todos conocemos ese sentimiento. Usted visita un nuevo sitio web, el contenido de la página parece ser interesante. Comienzas a leerlo y justo cuando estás a la mitad del texto, de repente te interrumpe una enorme superposición que te pide que te suscribas a un boletín informativo o que te ofrezca algo. En la mayoría de los casos, su reacción inmediata será cerrar la sobreimpresión o cerrar toda la página, la sobreimpresión junto con ella.

Es obvio por qué tantos sitios usan esta técnica: Los anunciantes les pagan para que lo hagan. Sin embargo, la técnica del pop-up es demasiado disruptiva, y tiene un enorme efecto negativo en los visitantes. Cada vez que muestres una ventana emergente, pides a los usuarios que dejen de hacer lo que quieren hacer (lo que es importante para ellos) y que centren su atención en lo que tú quieres que hagan (lo que es importante para ti). No es sorprendente que tal comportamiento a menudo aumente la tasa de rebote.

Es posible utilizar pop-ups sin molestar a los visitantes. Sólo tienes que seguir una regla simple: activa una ventana emergente en el momento adecuado. Por ejemplo, es mucho mejor permitir que los usuarios terminen la actividad actual (por ejemplo, llegar al final de la página) antes de mostrar una ventana emergente. Una vez que los usuarios han tenido un poco más de tiempo para aprender acerca de usted (su marca y sus ofertas), la probabilidad de que estén dispuestos a hacer lo que usted quiere que hagan aumenta.

Otro componente importante es el mensaje real que tiene en su ventana emergente. Necesitas escribir una gran copia. La copia no debe ser insultante, engañosa o confusa.

Vale la pena decir que hay muchas herramientas menos intrusivas como las barras deslizantes que no cubren toda la página y producen resultados similares en términos de conversión.

2. Desplazamiento infinito

El desplazamiento infinito es una técnica que permite a los usuarios desplazarse a través de una gran cantidad de información sin que haya una línea de meta a la vista. La página simplemente se actualiza mientras los usuarios se desplazan hacia abajo. La técnica se hizo popular en la era de los dispositivos móviles (el desplazamiento es mucho más cómodo que hacer clic en una pequeña pantalla). A primera vista, esta técnica es una solución perfecta para muchos problemas, requiere menos esfuerzo y hace que la comprensión del contenido sea lo más fácil posible (lo único que tienen que hacer los usuarios es desplazarse). Sin embargo, no es una solución única para todos los sitios o aplicaciones.

El principal inconveniente de la técnica es también su principal ventaja: no hay línea de meta a la vista. Cuando los usuarios llegan a un cierto punto en el flujo, no pueden marcar su ubicación y volver a ella más tarde (nota, me refiero a la posición, no a un determinado elemento). Por lo tanto, si abandonan el sitio (por ejemplo, se mueven de un dispositivo a otro), perderán todo su progreso y tendrán que volver a desplazarse hacia abajo para volver al mismo lugar. La incapacidad para determinar la posición de desplazamiento a menudo molesta a los usuarios y perjudica la experiencia general del usuario.

En 2012 Etsy, un sitio web de comercio electrónico centrado en artículos hechos a mano o de época, experimentó con diseños para la página de su producto. Implementaron una interfaz de desplazamiento infinito y descubrieron que la nueva interfaz no funcionaba tan bien como una versión anterior con paginación. Aunque algunas compras se mantuvieron, el compromiso de los usuarios disminuyó.

¿Qué nos dice el ejemplo de Etsy? Nos dice que con cada decisión de diseño debemos sopesar los pros y los contras antes de incorporarlo a nuestros diseños. Hablando de pergamino infinito, funciona bien para algo como Twitter/Instagram donde los usuarios están felices de escanear un flujo interminable de datos sin buscar nada en particular.

3. Notificaciones push

¿Alguna vez has prestado atención al número de notificaciones que recibes diariamente de varias aplicaciones? ¿Cuántas de esas notificaciones te preocupan realmente? No demasiados, supongo.

Todos los días nos bombardean con notificaciones inútiles que nos distraen de lo que hacemos. Nos molestan.

De hecho, las notificaciones molestas son la razón número uno por la que la gente desinstala aplicaciones móviles (según el 71% de los encuestados).

La notificación push es una herramienta poderosa, pero como con cualquier otra herramienta, puede ser usada para el bien o para el mal. Cuando los usuarios empiezan a usar tu aplicación, no les importa recibir notificaciones siempre y cuando éstas proporcionen un valor real. Es esencial diseñar notificaciones que sean útiles, relevantes y oportunas para sus usuarios. El contenido personalizado es la clave para una excelente experiencia de usuario. Cuando usted entrega el mensaje correcto a la persona correcta en el momento correcto, su notificación push se convierte en un poderoso disparador que motiva a la persona a tomar acción.

4. Secuestro de scroll

El scrolling secuestrado es una de las cosas más molestas para muchos usuarios ya que les quita el control y hace que el comportamiento de scrolling sea completamente impredecible. Al diseñar un sitio web, en la mayoría de los casos es mejor evitar el secuestro de scrolls y dejar que el usuario controle su navegación y movimiento por el sitio. Pero en algunos casos raros, el secuestro de scrolls puede funcionar bien para sus usuarios. Por ejemplo, Tumblr utiliza esta técnica en su página de inicio para presentar información en trozos.

Conclusión

Vale la pena decir que todas las técnicas mencionadas en este artículo no son malas per se. Los usuarios sólo los odian cuando los diseñadores los incorporan ciegamente. Cada técnica o patrón en su sitio web o en su aplicación debe ser utilizado de manera inteligente y con cierta moderación.

¿CUÁNTO DURA LA ENTRADA PERFECTA EN EL BLOG?

Hay un viejo dicho sobre vestidos y discursos que señala con razón que ambos deben ser lo suficientemente largos para cubrir el tema. En la era moderna, los hombres en particular harían bien en dejar de hacer referencia a la vestimenta femenina y hablar de blogs.

¿Cuánto debe durar un blog? La Internet infinita ha eliminado el estricto recuento de palabras y, en teoría, cada artículo en línea puede ser tan largo como el autor se siente necesario para hacer llegar su punto de vista. Desgraciadamente, muchos blogueros olvidan la segunda parte del viejo chiste relacionado con los vestidos y los discursos: ¡también deberían ser lo suficientemente cortos como para ser interesantes!

La longitud ideal de un blog dependerá, hasta cierto punto, del motivo por el que lo escribas. ¿Es su propósito principal SEO o el compromiso de los medios de comunicación social? ¿Quieres impulsar las ventas o recopilar vínculos de retroceso? ¿Su escritura busca proporcionar conocimiento detallado o entretenimiento?

La respuesta a estas preguntas tendrá una fuerte relación con la duración de sus entradas de blog tiene que ser. Pero antes de que veamos las posibilidades, hay una cosa que usted necesita saber….

Respetar los deseos de los editores

Sólo hay una regla en el club de escritura… el editor siempre tiene razón.

Los días de poner palabras en piedra y luego imprimirlas en una página pueden estar casi terminados, pero todavía se necesita algo de consideración para los editores y diseñadores. Las revistas online suelen tener un número de palabras objetivo para sus artículos: Proporcionando la copia que está dentro de alrededor de 50 palabras aumentará enormemente las posibilidades de que su artículo aparezca como usted lo escribió.

Porque si no lo editas a medida, alguien más lo hará. Incluso si eres un invitado escribiendo para el blog de otra persona que tiene un estilo definido, sigue siendo cortesía común escribir a su duración habitual.

Establecer un objetivo es bueno para su escritura

Un estricto recuento de palabras obliga al autor a editar y podar sin piedad y eso suele ser bueno. Por lo tanto, puede valer la pena fijarse un objetivo, incluso cuando se está escribiendo por amor a él, o por su propio sitio web.

Lo que es más, escribiendo a una longitud regular construirás un cierto estilo o marca personal, y tus lectores sabrán qué esperar cuando vean tu Tweet diciéndoles que has lanzado un nuevo post. Antes de que se den cuenta, estarán eligiendo el momento perfecto para saborear sus pensamientos con un café. Y ese tiempo durará siete minutos.

La respuesta científica

Las opiniones en cuanto a la longitud ideal de un blog varían mucho. Incluso excluyendo a los bloggers de imágenes, las fotocopiadoras y los blogueros de noticias de la blogosfera, los formatos populares van desde alrededor de 300 palabras hasta más de 2.000.

Este post admirablemente detallado sobre Medium pretendía adoptar un enfoque científico, analizando el número de clics y enlaces que reciben los blogs de distintas longitudes. Concentrándose en el tiempo que se tarda en leer un artículo, más que en el número de palabras, la conclusión de Medium es que para fines de SEO por lo menos, usted debe estar apuntando a 7 minutos. Con alrededor de 1.600 palabras -quizás un poco menos si incluyes muchas imágenes y gráficos para ralentizar a la gente, eso parece mucho.

Contrariamente a lo que podrían decir tus abuelos, la capacidad de atención de la gente no se ha acortado; es sólo que hay tantas distracciones por ahí. Si sus lectores están trabajando, ¿cuánto tiempo es su descanso? ¿Cuándo volverá el jefe? 1.600 palabras es estupendo para un artículo bien investigado, pero si estás buscando producir comentarios regulares que muestren tu experiencia y que puedan ser escritos más o menos sobre la marcha, estarás en peligro de aburrir a la gente.

El enfoque probado y comprobado

Para los fines de un artículo de opinión bien elaborado, apuntar a la longitud de una columna de un periódico o revista parece una buena apuesta: Eso significa entre 600 y 1.000 palabras. Ese es un buen tamaño para que sus lectores disfruten en su pausa para el café, con la oportunidad de pensarlo y, con suerte, compartirlo en los medios sociales antes de pasar el día.

Esta es la razón por la que gran parte del contenido de primera calidad de los periódicos es de esta longitud: es una pepita de oro del tiempo de alguien, a menudo cuando se toma un descanso de su actividad principal.

También se trata de la duración máxima a la que el oficinista promedio estará dispuesto a comprometerse sin temor a que realmente parezca que está postergando las cosas.

Por supuesto, la evidencia científica apunta a 1.600 palabras como una longitud ideal para SEO, y eso no es para ser olfateado. ¿Pero qué tal si divides ese blog en dos – parte uno y dos? El análisis de Medium no deja claro si sus dos blogs más cortos reunirán más clics que uno más largo, pero con una amplia curva de campana en el gráfico, es una buena apuesta que lo harán.

Las publicaciones épicas

Por otra parte, es grande tener el pedazo más largo impar en su sitio también. Estos podrían estar en el rango de 1.600 palabras o incluso más.

Yoast continúa señalando que estos posts épicos tienen la ventaja de permitir que se incluyan muchas instancias de sus palabras clave más importantes, sin abarrotarlas. Pero advierte que necesitarás buenas habilidades de escritura para crear estos mensajes y mantenerlos legibles.

Incluso si usted es un escritor competente, es poco probable que estos artículos largos sean pura opinión. Usted tendrá que poner en la investigación y tomar el tiempo para crearlos. Son ideales para `cómo guiar’ o tutoriales que abordarán una necesidad importante en su base de lectores o clientes y, lo que es crucial, seguirán siendo relevantes en los años venideros. De esa manera, tu trabajo duro valdrá la pena.

El Equilibrio Saludable

Si usted está produciendo un blog regular para una combinación de SEO y la participación de los lectores, que es entretenido si también provoca la reflexión y es informativo, tendrá que encontrar un equilibrio. Intenta desarrollar un tema para tus mensajes regulares. Luego, de vez en cuando, cuando tengas tiempo e inspiración, escribe un post realmente épico. Cuando haga esto, deje claro que le está dando a sus lectores algo fuera de lo común.

SEO al margen – y creo que se nos permite decir eso de nuevo hoy en día – un buen escritor quiere que su blog sea leído en su totalidad. Si los lectores se aburren, son interrumpidos, o incluso se sienten apresurados, no leerán hasta el final e inmediatamente se olvidarán de usted. Eso significa que no hay acciones, ni enlaces, ni fans adoradores.

5 MÉTRICAS DE SITIOS WEB QUE NO PUEDE IGNORAR (Y CÓMO DISEÑAR PARA ELLOS)

La analítica está de moda. Pero todos esos números pueden llegar a ser abrumadores rápidamente.

Aquí hay cinco métricas del sitio web que no puede ignorar -fuentes de tráfico, palabras clave, visitantes, las 10 páginas principales, páginas de salida- y ajustes de diseño que puede hacer para que vea mejoras en esas áreas. (Puede encontrar todas estas métricas y más en Google Analytics. Si usted no está rastreando los análisis en su sitio web, usted necesita comenzar ahora mismo.

1. Fuentes de Tráfico

¿Sabe de dónde vienen los visitantes de su sitio web? Eso es lo que le dice la métrica de las fuentes de tráfico.

El tráfico se agrupa en tres cubos:

Referencia: Visitantes que llegan a su sitio web desde un enlace en otro sitio web

Búsqueda: Los visitantes que llegan a su sitio web al introducir palabras clave en un motor de búsqueda y hacer clic en los resultados; el tráfico de búsqueda se divide a su vez en búsqueda orgánica y búsqueda pagada (si usted ejecuta anuncios en los motores de búsqueda y los usuarios hacen clic en los listados de búsqueda en lugar de los no pagados).

Directo: Los visitantes que llegan a su sitio web escribiendo una URL

La mayoría de los sitios web se benefician de tener tráfico que proviene de las tres fuentes, pero muchos sitios web sólo tienen tráfico de búsqueda orgánica y no necesariamente tienen un presupuesto para la búsqueda de pago.

DESIGN FOR IT

Saber de dónde vienen los usuarios puede ayudarle a crear un diseño que les atraiga más. Desglosar las fuentes de tráfico también puede ayudarlo a entender cómo diseñar para segmentos a los que no está llegando.

Diseño para el tráfico de referencia mediante la creación de contenido que otras fuentes quieren enlazar. Esto puede incluir entradas de blog, kit de interfaz de usuario o kits de elementos gráficos, o infografías que otros sitios pueden incrustar y enlazar.

Diseñe para el tráfico de búsqueda utilizando las mejores prácticas de optimización de motores de búsqueda, tales como palabras clave adecuadas en el contenido y atributos alt y meta. Diseñar para la búsqueda puede no ser la parte más sexy de su trabajo, pero puede ser una de las más valiosas.

Diseñe para tráfico de referencia utilizando URLs que sean fáciles de recordar. Este sitio web es un gran ejemplo de cómo utilizar una URL: El nombre del sitio, Webdesigner Depot, y URL, webdesignerdepot.com, coinciden. Es fácil pensar en cualquier tipo. Las URLs que son una sola cadena de palabras son las más fáciles de recordar. Cuando los usuarios tienen que preguntar si hay puntos, guiones o guiones bajos entre las palabras, se confunden.

He aquí otro truco de diseño: Incorporar la búsqueda de forma prominente en el diseño. Los usuarios repetidores sabrán que pueden acceder a todo lo que necesiten desde su página de inicio con facilidad. Eso puede ayudar a aumentar el tráfico directo y el tiempo en el sitio en un solo paso!

2. Palabras claves

¿Sobre qué trata su sitio web? Las palabras clave son la respuesta a esa pregunta.

Puede haber confusión entre lo que usted cree que es un sitio web y lo que piensan los usuarios. Las métricas de palabras clave, así como la búsqueda interna, le dirán qué palabras clave asocian los usuarios con su sitio web y contenido. Puede darle una idea de lo que los usuarios están buscando cuando encontraron su sitio web. En un mundo ideal, usted y los usuarios tienen la misma idea de lo que se trata el diseño.

¿Coinciden las palabras clave? ¿Está obteniendo tráfico valioso de usuarios que realmente están buscando el tipo de información en su sitio web?

DESIGN FOR IT

La mayoría de los diseñadores piensan que la solución es llenar el diseño de palabras clave. Aunque deberías usar palabras clave, rellenar el diseño no es la respuesta.

Realmente sólo necesitas crear un plan visual sólido que se relacione con un tema. Usa imágenes de calidad (y usa slugs y etiquetas para describir lo que hay en la imagen) y copia para dibujar usuarios. Luego concéntrese en cosas que usted probablemente ya sabe que debería estar haciendo:

Utilice un diseño receptivo; evite sitios web múltiples para el mismo contenido
Escriba el texto de la manera en que la gente habla y lee, y asegúrese de que no contenga errores ortográficos o gramaticales.
Haga que todo en su sitio web sea fácil de compartir para ayudar a construir credibilidad social
Enlace a fuentes que tienen contenido – y palabras clave – similares a las suyas
Promueva el contenido y la información o los productos que los usuarios desean; no se quede atascado tratando de usar las mismas palabras clave una y otra vez porque comenzará a sonar como un robot.

3. Visitantes

Hay dos tipos de visitantes del sitio web: Aquellos que vienen a su sitio web por primera vez, y aquellos que regresan para una visita repetida.

Una mezcla de ambos tipos de visitantes es importante. Si todo lo que tienes son nuevos visitantes, entonces el sitio web no era lo suficientemente atractivo como para traerlos de vuelta. Si todo lo que tienes son usuarios que regresan, no estás creciendo una base potencial de usuarios/clientes/ventiladores.

DESIGN FOR IT

Para dar a ambos tipos de visitantes lo que necesitan, el diseño del sitio web tiene que hacer un par de cosas.

Tiene que tener una imagen fuerte que atraiga a los visitantes desde el principio, pero también tiene que ser dinámica para que los visitantes que repiten se sientan atraídos. Fotos o videos interesantes pueden ser un buen punto de partida.

Debe dar inmediatamente a los visitantes una idea de lo que es el sitio web y cómo encontrar lo que están buscando. Utilice un título grande, marca o logotipo y elementos de navegación para establecer un sentido de propósito.

Debe haber algo que los usuarios puedan hacer para que puedan crear una conexión duradera: haga clic en un enlace, vea un video, juegue un juego, regístrese para un evento o promoción. La llamada a la acción debería ser obvia. No tenga miedo de decirles a los visitantes qué hacer y cómo interactuar mejor con el diseño, especialmente si es un poco complicado o poco convencional.

4. Las 10 Páginas Principales

Una de las métricas más interesantes del sitio web puede ser una lista de las páginas con las que los visitantes están más comprometidos. Los sitios web con blogs robustos pueden usar esta información para ayudar a rastrear qué tipos de mensajes crear en el futuro basándose en temas populares, los sitios de comercio electrónico pueden ver si el tráfico de páginas y el interés se traduce en ventas (y qué productos son los más populares en línea) y las clasificaciones de las páginas principales pueden ayudarle a determinar el flujo de tráfico y si los usuarios están encontrando lo que están buscando.

Muchos propietarios de sitios web a menudo se sorprenden por las páginas que son las más populares. Las 10 páginas principales a menudo incluyen páginas Acerca de o Contacto (los usuarios quieren saber quién eres u obtener ayuda con algo), blog o entradas de noticias (tal vez has tenido la suerte de que algo se vuelva viral), datos e información sobre tu campo o negocio y la página de inicio.

Las páginas en las que los usuarios hacen clic también pueden ayudarle a determinar si sus objetivos están en línea con los objetivos de los usuarios. ¿Están viendo contenido que es importante para usted?

DESIGN FOR IT

Incluya enlaces y llamadas a la acción a las páginas más visitadas de la página principal y otras páginas. Se trata de contenido bajo demanda; debería hacer que sea lo más fácil posible para que lo encuentren más usuarios.

Lleve a los usuarios a sus 10 páginas principales aún más fácilmente incluyendo enlaces como parte de una imagen deslizante o de héroe. Cree una presencia visual para estos enlaces.

Incluya páginas populares en la navegación principal o compártalas en los medios sociales. Enlace desde las páginas superiores a otras páginas superiores para animar a los usuarios a seguir haciendo clic. Un elemento de la barra lateral de las “Páginas más visitadas” o “Top Stories” puede ser una forma fácil de facilitar esto.

5. Páginas de salida

Tan importante como la forma en que un usuario llega a su sitio web es cómo lo deja.

Las páginas de salida (tarifas) muestran el porcentaje de visitantes que abandonaron su sitio web desde una página en particular. Se diferencia de una tasa de rebote en que rastrea a los visitantes que hicieron clic en varias páginas (las tasas de rebote son una métrica de una sola página).

Si una página determinada tiene una alta tasa de salida, podría ser una indicación de un problema con la interfaz de usuario, como un error o un camino roto. Por otra parte, algunas páginas siempre deben tener altas tasas de salida, como la página de pago/pedido procesado en un sitio de comercio electrónico que muestra que un pedido se ha completado.

Si las tarifas de salida de la página no están en línea con las expectativas, es probable que sea necesario rediseñar la página.

DESIGN FOR IT

El elemento de diseño clave en las páginas con altas tasas de salida (cuando no deberían estarlo) es dar a los usuarios algo más que hacer. Enlace a contenido interesante o relacionado en otra página. Y asegúrese de que no haya ATC rotas en el diseño (ese es a menudo el caso con altas tasas de salida inexplicables).

Si las páginas que deberían tener bajas tasas de salida son altas, ¿por qué? Volvamos al diseño de la página de finalización de comercio electrónico, ¿tiene usted un enlace de bucle incluido por el diseño que mantiene a los usuarios en su sitio, o están fallando en llegar al paso final en el proceso (busque errores de UI).

Recuerde, las salidas no son buenas o malas. Cada usuario se irá en algún momento. La clave a tener en cuenta con las páginas de salida y el diseño, son las salidas inesperadas. Mientras los usuarios estén saliendo de los lugares naturales, el diseño está en funcionamiento. Si las salidas son menos naturales, como salir en medio de un proceso, probablemente haya un error oculto o un problema de diseño.

6 COSAS PARA PONER EN TU GUÍA DE DISEÑO AHORA MISMO

Las guías de diseño son una herramienta invaluable para maximizar la producción del equipo de diseño y para asegurar una identidad de marca consistente. Observamos seis componentes esenciales de guías de diseño exitosas.

Una guía de diseño es más que un documento que viene con un nuevo sitio web o identidad de marca. Una buena guía de diseño es una obra de arte en sí misma y tiene una aplicación práctica en el trabajo diario de diseño. Muestra lo que es su proyecto y lo que aspira a ser. Debe reunir elementos de diseño, voz e incluso código de una manera que sea manejable, usable y fácil de entender.

Comienza con estos seis elementos de la guía de diseño que deben estar en su documentación. (Si no lo son, ¡revisa tu guía de inmediato!)

1. Ejemplos de Identidad de Marca

Su guía de diseño debe mostrar su identidad de marca en un formato visual que sea representativo de la forma en que desea que se vean los materiales de diseño. Ese es un ejemplo de clase de espectáculo, no lo cuentes. (Aunque hay algo que dice en la guía que debe ir con los ejemplos visuales).

Los mejores ejemplos son los usos en casos reales que ejemplifican exactamente lo que las normas de diseño pretenden representar.

Utiliza capturas de pantalla de la página de inicio de tu sitio web, de la página de inicio de tu móvil, de una aplicación o de cualquier otro lugar cuando el diseño esté en su mejor momento.

Lo bueno de la guía de diseño Love to Ride es que cada página del folleto se parece al sitio web, creando consistencia de marca. La guía incluso enfoca pequeños elementos del diseño, como el estilo correcto de los iconos de las aplicaciones en una visualización precisa.

Lo mejor de usar ejemplos reales en una guía de diseño es que no tienes que crear trabajo extra para mostrar elementos visuales; ya los tienes a mano. Además, los miembros del equipo sabrán que la guía escrita funciona en la práctica porque hay pruebas visuales.

2. Pautas de diseño

Todo, desde las muestras de color hasta las paletas de tipografía, pasando por las formas y el uso de elementos de diseño, debe estar claramente definido.

¿Por qué el diseño se ve y funciona de cierta manera? ¿Cuál es la filosofía detrás de esto?

Explicar estas cosas puede ayudar a los usuarios a aplicar el estilo de diseño de manera más precisa y consistente en todos los medios. Cuando se trata de diseño de sitios web, es una buena idea incluir elementos que pueden ser diferentes de los equivalentes de impresión de marca y cómo se relacionan. Por ejemplo, muchos diseñadores optan por una paleta de tipografía diferente en línea que imita la marca impresa para maximizar el uso de Google Fonts to Typekit para facilitar su uso.

Asegúrese de anotar qué tipos de letra son sustitución si esto es parte de su estrategia de diseño.

Al delinear las pautas de diseño, sea específico cuando sea importante (las etiquetas H1 son siempre 88 puntos o las imágenes en miniatura son siempre de 200 por 200 píxeles), pero no sobrecomunique detalles innecesarios. Usted quiere que los miembros del equipo vean la información de un vistazo y la usen, no que se sientan abrumados tratando de encontrar algo en un mar de especificaciones.

3. Voz y Personalidad

Las pautas de estilo de redacción no son tan divertidas como otros elementos visuales de una guía de diseño, pero son tan importantes.

Un estilo de escritura descriptivo para la copia también puede impactar los visuales. Contribuye al tipo de imágenes que elijas usar e incluso a elementos como el color y el tipo. Todos estos elementos van juntos para crear una personalidad general para la marca.

Es como el mundo exterior te identificará.

Lo que es más, una voz y una personalidad fuertes se convierten también en parte de la identidad visual. Una buena personalidad se manifiesta en los elementos de diseño porque los usuarios casi pueden identificar elementos de diseño incluso fuera del contenido del resto de la marca. (Piensa en rojo Coca-Cola o en el tipo de letra de la firma de Disney.)

4. Palabras clave de SEO

La optimización de motores de búsqueda puede ser una de las partes más habladas y menos divertidas del diseño web. Piense en las palabras clave temprano y a menudo.

Inclúyalos en la forma de hablar de la marca, en lenguaje descriptivo sobre el diseño y ponga una lista de las palabras clave más importantes en la propia guía de diseño.

Urban Outfitters tiene una lista de palabras clave bien diseñada (y divertida) en su guía de marcas. Si bien la marca de ropa utiliza un montón de palabras clave diferentes las palabras más importantes son resaltadas por el color para que usted las vea de inmediato.

Una lista de palabras clave como esta trae las palabras que desea decir a la parte superior de la mente, cada vez que las vea. La mayoría de las personas que escriben textos te dirán que una vez que ves o piensas en una palabra en un determinado contexto, se te queda atascada en la cabeza. Eso es exactamente lo que la lista de palabras clave SEO se supone que debe hacer.

Los elementos de diseño deben correlacionarse con estas palabras clave en todo momento para que el contenido esté relacionado a lo largo del diseño del sitio web.

5. Estilos de Patrones y Elementos

Con tantos medios diferentes en línea (sin mencionar las empresas que también diseñan elementos impresos), es importante tener guías para todos los usos posibles.

Esto se aplica a versiones fijas y animadas de logotipos, paletas de colores, patrones e incluso elementos de diseño como campos de formulario y navegación.

Su libro de diseño debe tener una sección dedicada a estos elementos. Y si quieres que el equipo te ame de verdad, crea una guía de estilo de patrones y elementos en una ubicación en línea para que los usuarios puedan copiar y pegar elementos para un uso rápido.

6. Fragmentos de código

Cada guía del diseño del Web site necesita incluir el un montón de pedacitos comúnmente utilizados del código. Desde botones hasta pequeñas animaciones y efectos deslizantes, estos pequeños fragmentos de código añaden horas a su flujo de trabajo diario al eliminar la necesidad de introducir manualmente las especificaciones de cada nuevo elemento.

Esto funciona para todo, desde entradas de blogs -añadir un bloque de código para imágenes que los bloggers pueden copiar y pegar para obtener el tamaño y recorte adecuados- hasta efectos de interfaz de usuario más elaborados.

Firefox incluye información sobre los componentes de diseño en su guía de diseño para el uso del logotipo y la marca recientemente revisados. Incluso si no proporciona una biblioteca completa de fragmentos de código, recuerde incluir alguna información básica como dónde utilizar H1 a H4 en las páginas dentro del diseño del sitio web y cómo cambiar el estilo de los botones y las imágenes.

Conclusión

La mejor parte de una guía de diseño es que no tiene que ser un documento estático. Puede crecer y cambiar a medida que su marca y su identidad visual hacen lo mismo.

La mayoría de los diseñadores, en particular los diseñadores de sitios web, están optando por versiones en línea de una guía de diseño para que los cambios y la captura de código y fragmentos de color sean rápidos y fáciles. Considere la posibilidad de añadir una página de guía de estilo a su sitio web y recuerde consultarla (y actualizarla) con frecuencia.