10 mejores prácticas de diseño de blog para 2022: no permita que los diseños incómodos arruinen su UX

Publicado: 2022-04-30

Un sabio diseñador de experiencias de usuario dijo: “el buen diseño es invisible”. En otras palabras, si usted o sus usuarios notan el diseño de su blog o la experiencia del usuario, es probable que sea un mal diseño.

Piense en todos los sitios web, aplicaciones y plataformas que usamos a diario. ¿Estamos pensando conscientemente en la interfaz de usuario y la experiencia?

La mejor interfaz de usuario (UI) y experiencia de usuario (UX) es aquella que no se interpone en el camino para lograr nuestros objetivos, ya sea comentar una publicación de Instagram, navegar por una publicación de blog larga o ingresar datos en una aplicación web

Un blog bien diseñado es esencial para los dueños de negocios de comercio electrónico de muchas maneras. Por ejemplo, dirigen el tráfico a un sitio y ayudan a generar confianza con los clientes potenciales. También ayudan a promover productos y servicios, lo que genera oportunidades de crecimiento más adelante.

Desafortunadamente, si tiene un diseño extraño, pronto descubrirá que es menos probable que las personas se queden y lean su contenido. Eso significa que es probable que no suceda ninguna de las cosas buenas mencionadas anteriormente.

"El medio es el mensaje." Eso significa que la forma en que entrega su contenido es tan importante como la calidad del contenido en sí.

Dado que su blog es una parte importante de su embudo de marketing, una buena UI/UX sin duda afectará a los visitantes que regresan y a los ingresos.

Esta publicación de blog presentará algunas de las mejores prácticas de diseño para 2022 que mantendrán a los usuarios comprometidos, regresando por más y recomendando su blog a otros.

10 mejores prácticas de diseño de blog para UX en 2022

La tecnología, incluidas las mejores prácticas web, parece cambiar semanalmente. Y con la nueva tecnología llegan formas nuevas y emocionantes de consumir contenido.

Los usuarios ahora están acostumbrados a consumir contenido en ráfagas cortas, ya sea a través de las redes sociales o leyendo blogs en sus teléfonos.

El diseño de tu blog debe adaptarse a estos cambios y ser fácil de leer, sin importar dónde o cómo alguien lo esté consumiendo.

Aquí hay algunos consejos para tener en cuenta al diseñar el diseño de su blog para una experiencia de usuario óptima.

Sugerencia n.º 1: use un enfoque de "centro de aprendizaje" centralizado

Escribir extensamente sobre un tema en particular es una excelente manera de generar autoridad sobre el tema en Google y generar confianza con su audiencia.

Sin embargo, la forma en que organiza este contenido en su blog es tan importante como el contenido en sí.

Digamos que has escrito todo lo que hay que saber sobre la recaudación de fondos para organizaciones sin fines de lucro. Eso es genial. Pero, ¿de qué le sirve eso a un prospecto sin fines de lucro si el contenido relevante no está etiquetado, sin categorizar y entremezclado con un montón de otros temas?

Esto no es ideal para el usuario que quiere consumir todo su contenido sobre un tema específico de una sola vez. Es mucho mejor tener un enfoque acumulativo en el que todo sobre ese tema esté organizado en un solo lugar; a esto lo llamamos el enfoque del "centro de aprendizaje".

Este enfoque es una excelente manera de aumentar el compromiso. Permite a los usuarios encontrar y consumir fácilmente todo el contenido que tiene sobre un tema en particular sin tener que buscarlo en su sitio web. También le permite realizar una promoción cruzada de otras piezas de contenido y aumentar el tiempo que pasa en su sitio.

Además, el enfoque del centro de aprendizaje probablemente aumentará sus páginas por sesión.

¿Cómo se ve esto en la práctica? Puede consultar el blog de MatterApp para ver buenos ejemplos. La empresa, que cuenta con una aplicación que brinda felicitaciones y comentarios a los equipos del lugar de trabajo, ha agrupado su pilar y el contenido del grupo en seis categorías en una sola página. La página contiene todo lo que un usuario necesitaría investigar para saber más sobre su producto.

Consejo #2: Aproveche los elementos "pegajosos"

Los humanos somos perezosos. Por lo tanto, uno de los principios principales del diseño es agregar el máximo valor y hacer que el usuario trabaje lo menos posible.

El uso de elementos "pegajosos" en la página es una de las mejores maneras de facilitar esto y aumentar la participación en su blog.

Los elementos adhesivos permanecen visibles en la pantalla a medida que los usuarios se desplazan hacia abajo. Esto significa que siempre están accesibles sin que el usuario tenga que desplazarse hacia arriba hasta la parte superior de la página.

Por ejemplo, si tiene un llamado a la acción para registrarse en su lista de correo electrónico, el uso de un elemento adhesivo garantizará que esté siempre visible y al alcance de la mano.

Puedes ver un ejemplo de esto en el blog de HubSpot . La empresa utiliza una llamada a la acción adhesiva en la esquina inferior derecha de la pantalla que anima a los usuarios a registrarse en su lista de correo electrónico.

Puede usar elementos adhesivos para una variedad de otros propósitos, como:

  • Botones de redes sociales
  • Menús de navegación
  • Barras de búsqueda
  • Widgets de chat en vivo

La moderación es la clave aquí. Demasiados elementos pegajosos pueden hacer que la página sea abrumadora y desordenada, lo que en última instancia perjudicará la experiencia del usuario.

Consejo #3: Vaya al grano

Tener contenido de formato largo es esencial para atraer tráfico a tu blog y posicionarte bien en Google. Sin embargo, la mayoría de los lectores quieren respuestas rápidas y no quieren oírte parlotear interminablemente sobre las virtudes de tus productos o servicios.

Por ejemplo, si sus usuarios solo quieren la respuesta a la pregunta "qué es escribir en un blog", la mayoría de los resultados de búsqueda para su consulta implican la lectura de guías extensas y completas. Aunque las guías responden las preguntas, su usuario tendrá que hojear el contenido largo para encontrar la definición.

Otro ejemplo es leer una larga publicación de blog en Pinterest para llegar a los ingredientes y los pasos de la receta. Gracias a Dios por los expertos culinarios que usan enlaces que lo llevan directamente a la receta, ¿verdad?

Sin lugar a dudas, estos ejemplos consumen mucho tiempo y son frustrantes para la mayoría de los usuarios, lo cual es el epítome de una mala experiencia de usuario. Entonces, en su lugar, utilice cuadros de resumen rápido de artículos para ir al grano.

Tener pequeños recuadros que contengan el resumen de todo el artículo es útil y una excelente manera de ahorrar tiempo a sus usuarios o lectores. Si bien los cuadros de resumen son ajustables para adaptarse al contenido en cualquier lugar, colocarlos al comienzo del artículo es una excelente manera de elaborar la respuesta o el contenido para los lectores.

Como beneficio adicional, responder clara y claramente a las preguntas de los usuarios aumentará la probabilidad de que Google lo coloque en su codiciado resultado de "fragmento destacado", que es el resultado principal en un SERP de Google que destaca la respuesta a la pregunta de un usuario.

Consejo #4: Utilice un diseño de tarjeta de blog

Para mantener tu blog actualizado, probablemente estés publicando muchos artículos, ¡bien hecho! Seguid así.

Sin embargo, esto puede conducir rápidamente a un desorden visual, especialmente cuando intenta resaltar todas sus publicaciones nuevas a la vez en la página principal de su blog.

Entonces, ¿cuál es el mejor equilibrio para presentar publicaciones en la página principal de tu blog sin abrumar al usuario? ¿Qué tan grandes o pequeñas deben ser las miniaturas de los blogs y los enlaces a los artículos?

Bueno, no hay una respuesta simple a esa pregunta, pero al menos sabemos que el enfoque más efectivo es el diseño de "tarjeta de blog". En cuanto a los detalles, recomendamos estudiar y replicar las prácticas de los sitios de publicación de buena reputación.

Medium.com ofrece un excelente ejemplo de este formato.

El uso de un diseño de tarjeta de blog tiene muchas ventajas, incluidas las siguientes:

  • Son fáciles de escanear y digerir.
  • Nos permiten reconocer, recordar y leer fácilmente información importante.
  • Permiten incluir mucha información sin abrumar al usuario.
  • Se pueden reorganizar y reordenar fácilmente, lo cual es excelente para el diseño receptivo.
  • Proporcionan amplios espacios en blanco, lo que los hace visualmente atractivos y fáciles de navegar.

Sin embargo, los diseños deben tener diferentes tamaños de fuente e imágenes para distinguir claramente entre los elementos menos importantes y los más importantes. Esta táctica hace que el diseño sea más legible para los lectores.

Además, puede incluir los siguientes elementos en el diseño de la tarjeta.

  • Foto principal
  • Autor del blog (imagen)
  • Categoría
  • Titulo de Blog
  • Enlaces para compartir en redes sociales
  • Fecha de publicación
  • Extracto del blog
  • Leer más botón

Teniendo esta lista en mente, veamos la página de inicio de Medium:

Observe cada “tarjeta” y toda la información asociada. Casi todas las publicaciones de blog tienen al menos lo siguiente:

  • Titulo de Blog
  • Foto principal
  • autor del blog
  • Imagen del autor del blog
  • Fecha de publicación
  • Tiempo de leer
  • La capacidad de marcar la publicación para más tarde.

Probablemente nunca hayas notado todos esos elementos antes, ¿verdad? Sin embargo, probablemente aprecies su existencia. Ese es un ejemplo perfecto de un gran diseño siendo invisible.

Además, una de las mejores prácticas que recomiendan los expertos en inbound marketing de Impact para organizar los artículos en el diseño de la tarjeta de blog consiste en colocarlos en columnas de dos o tres.

Esto depende de la información que estés presentando, pero en general, maximiza la cantidad de publicaciones que se ven simultáneamente.

Consejo #5: Incluye el Tiempo de Lectura

Al crear contenido, desea que la gente se quede y lo lea. Pero si tus lectores sienten que no tienen tiempo, es probable que sigan adelante. Es por eso que una de las mejores cosas que puede hacer es decirles exactamente cuánto tiempo llevará leer su artículo.

Esta táctica es especialmente importante si su público objetivo consiste en personas ocupadas que siempre están en movimiento. Al darles un tiempo de lectura estimado, ha implementado una estrategia que le brinda al lector un aviso sobre el compromiso de tiempo que también es más probable que lo traiga de regreso para contenido que es fácil de digerir en períodos cortos.

Entonces, si desea que las personas se queden y lean su contenido, dígales exactamente cuánto tiempo llevará. Este simple acto aumentará la participación y mantendrá a las personas en su sitio por más tiempo.

Consejo #6: Usa los espacios en blanco a tu favor

El espacio en blanco, también conocido como espacio negativo, es el espacio alrededor de los elementos de una página. Es importante usar espacios en blanco en su diseño para despertar el interés visual del lector y llamar la atención sobre contenido específico.

Encontrar el equilibrio adecuado de espacios en blanco es esencial para crear un diseño bien diseñado. Muy poco espacio en blanco puede hacer que una página se sienta apretada y ocupada, lo que puede ser abrumador para los usuarios. Por otro lado, demasiados espacios en blanco pueden hacer que una página parezca inacabada o poco profesional.

Por ejemplo, TikTok utiliza una gran cantidad de espacios en blanco. La cantidad que usan puede parecer una tontería en un sitio web comercial, pero es perfecto para dirigir toda la atención al video en la página.

En general, es mejor errar por el uso de demasiados espacios en blanco en lugar de muy pocos. Esto ayudará a crear una apariencia limpia y espaciosa que sea agradable a la vista.

Entonces, cuando se trata de diseños de blogs, los espacios en blanco son tus amigos. Puede ayudar a llamar la atención sobre contenido específico y hacer que su diseño sea más atractivo visualmente.

Consejo # 7: no tenga barras laterales abarrotadas

Este es un error común que cometen muchos blogueros. Llenan sus barras laterales con íconos de redes sociales, suscripciones, anuncios y otra basura aleatoria.

Esta práctica no solo hace que todo se vea mal, sino que también puede resultar confuso y abrumador para los visitantes.

También da la impresión de que le importa más vender algo que agregar valor a sus clientes, anulando todo el propósito del contenido informativo y de creación de confianza.

No trate su barra lateral como un cajón de chatarra. En su lugar, apégate a lo esencial, como los íconos de las redes sociales y las suscripciones. Esto ayudará a crear una apariencia más optimizada que sea fácil de navegar y mejore la experiencia del usuario.

Consejo # 8: Use la tipografía sabiamente

La tipografía es cómo se ve el texto en una página física o digital para los curiosos. También implica manipular el tipo de letra para hacer que la forma escrita sea legible y atractiva cuando se muestre.

Este arreglo generalmente implica tomar elementos de diseño como la longitud de línea y palabra, el espaciado, etc., o el tamaño de punto y agregarlos o manipularlos para hacerlos agradables a la vista y más digeribles.

Para lograr un mayor impacto, es fundamental utilizar la tipografía de forma inteligente en el diseño. Creas interés visual y llamas la atención sobre contenido específico cuando lo haces.

Por ejemplo, siempre querrá utilizar fuentes más grandes para los encabezados y más pequeñas para el cuerpo del texto. O es posible que desee utilizar una fuente completamente diferente para los encabezados.

Idealmente, los tamaños de fuente entre 17 px y 21 px se consideran adecuados para los lectores digitales. Algunos tamaños de fuente son naturalmente más grandes en comparación con otros.

Además, es una buena forma limitar la cantidad de fuentes que usa en una página a tres como máximo. Por ejemplo:

  1. Use el primer estilo de fuente para el título de las publicaciones.
  2. Utilice el segundo estilo de fuente para los títulos de las barras laterales.
  3. Use el tercer estilo de fuente para el cuerpo de la publicación.

Y un último consejo, asegúrese de que sus fuentes sean seguras para la web. De lo contrario, es posible que no se carguen en algunos dispositivos. Google Fonts es un repositorio gratuito de fuentes web y siempre es una apuesta segura.

Consejo #9: Incorpora artículos relacionados

Otra forma de hacer que la gente se quede y lea tu contenido es incorporando artículos relacionados en tu diseño.

Los artículos relacionados son enlaces a otras publicaciones de blog (internas y externas) similares en tema o materia. Al incluir estos enlaces, puede mantener a las personas interesadas y leyendo su contenido durante períodos de tiempo más prolongados.

Para encontrar artículos relacionados, puede usar un complemento como Yoast SEO. Este complemento analizará la publicación de su blog y sugerirá artículos relacionados para que los incluya.

O puede hacer una búsqueda manual yendo a Google y buscando "[tema clave clave] sitio: [yoursite.com]". Mientras Google indexe su sitio, esto revelará todas las páginas y publicaciones en su sitio que contienen esa palabra clave.

Por ejemplo, si quisiéramos ver todas las páginas que hemos escrito sobre el tema de los blogs, ingresaría la siguiente búsqueda en Google: “sitio de blogs: skuvault.com”.

Las páginas resultantes son probablemente buenas candidatas para la interconexión.

Consejo # 10: Usa imágenes de alta calidad

Es crucial usar imágenes de alta calidad y que no sean cursis en el diseño de tu blog. Eso se debe a que las personas son criaturas visuales que tienden a interactuar más con las imágenes que con el texto.

De hecho, los estudios han demostrado que es más probable que las personas recuerden la información si se presenta junto con una imagen.

Por lo tanto, al elegir imágenes para las publicaciones de su blog, asegúrese de que sean de alta calidad y relevantes para el tema en cuestión.

Haz tu mejor esfuerzo para evitar las fotos de stock genéricas. A veces, eso es tan simple como realizar algunas ediciones en una foto existente para que se vea más personalizada.

Un gran lugar para encontrar fotos de archivo elegantes y gratuitas es Pexels .

Otras formas de subir de nivel la experiencia de usuario de tu blog

Además de los diez consejos que hemos enumerado, aquí hay otras formas de mejorar la UX/UI de tu blog:

  • Elija un diseño escaneable : escribir un blog es muy diferente a escribir un libro o un artículo académico. Puede hacer que el diseño del blog sea escaneable escribiendo secciones cortas y precisas, evitando párrafos extensos, dividiendo el texto con encabezados e imágenes relevantes y organizando secciones usando subtítulos y encabezados.
  • Marca tu diseño : la marca es la clave para comercializar un negocio exitoso, y funciona de la misma manera para el diseño de tu blog. El blog que cree debe reflejar la sensación y el aspecto de su marca. Eso significa que si su página de inicio tiene un tema o diseño simple, es una buena idea mantenerlo igual para el diseño de su blog.
  • Utilice la alineación vertical : los elementos mal diseñados sobresalen como un pulgar dolorido. Por ejemplo, cuando las imágenes y el texto se ven fuera de lugar con respecto al resto de la columna, se convierte en una distracción y se ve poco profesional. Además, los párrafos y las fotos deben tener el mismo ancho para lograr una continuidad visual.
  • Incluya una barra de búsqueda : si tiene mucho contenido en su sitio, puede ser difícil para las personas encontrar lo que buscan. Es importante incluir una barra de búsqueda en el diseño de su blog. De esa manera, las personas pueden encontrar rápida y fácilmente la información que buscan.
  • Resalta a los autores de tu contenido : si tienes varios autores en tu blog, es importante resaltar sus nombres e incluir una foto de alta calidad junto con sus publicaciones. Este enfoque humaniza todo y ayuda a generar confianza con sus lectores. También les facilita encontrar otro contenido del mismo autor y ayuda a Google a determinar su EAT (experiencia, autoridad, confianza).
  • Haga que su sitio sea compatible con dispositivos móviles: es 2022. No es negociable asegurarse de que el diseño de su blog sea compatible con dispositivos móviles. Afortunadamente, todos los diseños de blog modernos de proveedores acreditados (WordPress, Squarespace, Shopify) incluyen un diseño compatible con dispositivos móviles desde el primer momento. Si no tiene un diseño compatible con dispositivos móviles, tiene problemas que van más allá del alcance de esta publicación.

¡Ahí tienes! Utilice estos consejos para crear un diseño de blog excelente que haga que los lectores regresen por más.

No olvides el control de inventario

Si sigue nuestro consejo e implementa estos consejos de UX, prepárese para un aumento en el número de lectores, el tráfico y las ventas (¡de nada!).

Si tiene una tienda de comercio electrónico, necesitará un buen sistema de inventario para administrar este crecimiento.

SkuVault existe para ayudar a las empresas de todas las formas y tamaños a optimizar y agilizar el tedioso trabajo relacionado con el control de inventario.

Haga clic aquí para obtener más información sobre las formas específicas en que nos unimos a los propietarios de negocios para ayudarlos a aumentar sus resultados (y salvar su cordura).