Logo-Amara-Horizontal
    EN

    |

    ES
    CONSULTA GRATUITA
    Logo-Amara-Horizontal
    CONSULTA GRATUITA
    Ico-Abrir

    Website | Online Strategy

    12 min de lectura

    Las mejores prácticas de diseño web para pymes y diseñadores

    Escrito por: Cristina García

    Como hemos mencionado en ocasiones anteriores (y como seguramente ya sabías) tu sitio web es uno de los activos más importantes de tu negocio y, en el contexto actual, más si cabe. Por ello, a la hora de crear una web existe una tríada por la que toda pyme debería regirse para garantizar su mejor rendimiento y esa es ‘contenido, funcionalidad y diseño’. En el último caso, el del diseño, es fundamental poder trasmitir al diseñador la importancia del nuevo diseño. La nueva web debe cumplir unos objetivos y, por ello, existen unas prácticas de diseño web a tener en cuenta tan por el responsable del proyecto en la pyme como por el diseñador:

    1. Exigir y ofrecer un pitch según tu posición.

    Puede parecer una obviedad, pero lo cierto es que no todos los proyectos empiezan con un buen pitch. Las prisas y, en ocasiones, la falta de comunicación pueden llevar a omitir un paso tan importante como es la descripción de las necesidades de la pyme a la hora de llevar a cabo un diseño para su sitio web. Y este paso es fundamental. De hecho, es el que puede evitar problemas en el futuro y garantizar que se cumplan plazos de entrega.

    Por esta razón, si eres el director o responsable digital de la misma, o bien, eres el diseñador web que realizará la obra maestra debes dar a conocer o exigir los detalles importantes que garanticen que el diseño de la web es el adecuado, que respeta la imagen y los valores de la marca y, especialmente, que el diseño se alinea con los objetivos empresariales.

    2. Tener en cuenta los objetivos de marketing y ventas principales.

    Un sitio web es el escaparate digital de un negocio, capaz de garantizar nuevos clientes y satisfacer a los antiguos. Por esta razón, cuando se crea una web es fundamental tener objetivos de negocio claros y tener en cuenta qué acciones estratégicas pueden llevar a conseguir un mayor número de conversiones y a mejorar la reputación online. Ya sea mediante la presentación de un contenido adecuado, de las distintas suscripciones, o bien, de una selección de productos organizados, debemos considerar que diseño es sólo una parte, aunque importante, de una estrategia global.

    ¿Quiere decir esto que ha muerto la creatividad y el diseño? En absoluto, pero debemos recordar que una web, si se crea con el propósito de atraer clientes e incluso vender directamente los productos de un negocio, no sólo debe estar diseñada respetando la imagen de marca, sino también de acuerdo a una serie de objetivos de marketing y ventas. Y, realmente, esto puede suponer mucha más creatividad por parte del diseñador siempre que se cree la web desde la perspectiva del Growth-Driven Design.

    ¿Y qué es Growth-Driven Design? A diferencia de los diseños tradicionales en los que un proyecto de diseño o rediseño web puede llevar meses y los cambios son mínimos a lo largo de los 3 a 5 años siguientes, el Growth-Driven Design permite, a grandes rasgos, realizar un diseño base en función de los objetivos principales e ir ampliando este diseño según la necesidad de la pyme.

    El Growth-Driven Design es una metodología de trabajo con la que es posible realizar mejoras en sitio web sin invertir una gran cantidad de recursos en cambiarla completamente. Esto implica tener un diseño ah-doc y comenzar por las piezas más relevantes para cumplir los objetivos a corto plazo y, posteriormente, ir realizando ajustes y añadiendo elementos y secciones de forma escalonada en función de un análisis de rendimiento y conversión web.

    esquema de growth-driven design

    Y por esta razón, consideramos que la creatividad del diseñador es fundamental, ya que tiene que contemplar un sitio web ágil y adaptable que no sólo se alinee con los objetivos empresariales en cada momento, sino que permita las optimizaciones sin que ello afecte a la experiencia del usuario en la web. Por esta razón, como hemos comentado en el primer punto, es fundamental realizar un pitch y tener en cuenta una serie de puntos clave de los que hablaremos a continuación:

    3. Conocer bien cuáles son los buyer personas del negocio.

    Es probable que ya estés cansado de oírlo, pero no podemos dejar de mencionar la importancia que tiene la elaboración de perfiles de buyer persona para cualquier decisión estratégica de marketing y ventas, diseño web incluido. Si eres el responsable encargado del proyecto web en la pyme, debes poder transmitir al diseñador la esencia de cada perfil de comprador de tu empresa y asegurarte de explicar cómo es su ciclo de compra.

    DESCARGA GRATIS LAS PLANTILLAS PARA CREAR PERFILES DE TUS BUYER-PERSONA

    ¿Por qué le interesa saber a un diseñador cuáles son los buyer personas del negocio? A diferencia del concepto de target, el de buyer persona concreta mucho más cuales son las necesidades de los compradores según la fase de compra en la que se encuentran. Esta información puede ayudar al diseñador a destacar la información o funcionalidades más importantes de determinadas páginas de la web y tener en cuenta las preferencias de distintos sectores sociodemográficos en cuanto a color, tipografías, iconos, imágenes...

    4. No olvidar la importancia de la funcionalidad y el contenido.

    Como hemos dicho al inicio, para garantizar el mejor rendimiento de un sitio web, la tríada fundamental es la de ‘contenido, funcionalidad y diseño’ y, por esta razón, los dos primeros conceptos deben respetarse a la hora de realizar el diseño. ¿Cómo exactamente?

    Como responsable de la pyme, podrías proporcionar la mayor parte del contenido para garantizar que en el diseño se incluye toda la información y se respeta su jerarquía. Pero como hemos comentado, es posible que, en función de objetivos, la plataforma web que servirá de lanzadera no tenga por qué tener todos los elementos finales y, ni mucho menos, todo el contenido. Por esta razón, es imprescindible hablar de la relevancia del mismo con el diseñador y tener en cuenta que, en algún momento, se deberá ampliar o cambiar el contenido y piezas.

    Como diseñador, es fundamental contemplar las distintas posibilidades y exigir una propuesta que permita determinar cuál es la jerarquía de la información en las distintas páginas y cómo podrían ampliarse secciones o añadir elementos. La conceptualización del diseño debe ser global, si bien la entrega inmediata de los primeros bocetos no incluya todos los elementos. De esta forma es posible garantizar que la web sigua siendo funcional para el buyer persona y que el contenido sea conexo y de utilidad.

    5. Buscar y ofrecer referencias, pero sin limitar posibles cambios.

    De nuevo, como responsable del proyecto web de tu pyme es posible que hayas realizado una rigurosa investigación de los sitios web de la competencia. Muchos de estos websites pueden servirte como referencia, especialmente si detectas que existen algunos elementos que son clave para la conversión, pero recuerda que tu web debe ser lo suficientemente diferenciadora para garantizar una experiencia única, de ahí la importancia de contar con un diseño diferente.

    Como diseñador, y teniendo en cuenta los distintos puntos fundamentales de los que hemos hablado, también es posible mostrar referencias al responsable de la web que sean los suficientemente diferenciadoras pero que, al mismo tiempo, se alineen con las necesidades de negocio. A partir de ahí es cuando hay que comenzar a diseñar:

    6. Tener en cuenta los estándares de marca o branding de la pyme.

    Como ya debes tener aprendido, un diseño web no es sólo estético, sino que debe ser funcional y debe estar conectado a los objetivos de negocio a la vez que satisface a los buyer persona. En definitiva, diseñar una web no es nada fácil. No obstante, una de las bases de todo diseño debe ser el branding de la pyme o lo que es lo mismo sus estándares de marca.

    Estos estándares pueden ayudar al diseñador a mantener la cohesión entre los distintos elementos online y offline. Es posible que la pyme cuente con documentos en los que se detalla cómo es el branding, cómo es la imagen de marca, por ejemplo, como proponemos con nuestra estrategia DDC (definición-diferenciación-comunicación).

    respetar el branding a la hora de realizar un diseño web

    7. Saber cuáles son las mejores prácticas de diseño y formato web.

    Balance:

    En general, los sitios web están construidos en un sistema de cuadrícula, lo que crea una forma de equilibrio visual. Siguiendo los estándares de marca, pueden realizarse diseños simétricos, asimétricos o incluso fuera de balance para crear una determinada sensación en el visitante de la web para dirigir la mirada, destacar elementos o, incluso, hacer pensar. Obviamente esto debe de alinearse con los objetivos principales del negocio.

    Espaciamiento:

    Una de las claves de la conversión es el espaciamiento de los distintos elementos de una página, para que los usuarios puedan diferenciar bloques y secciones. Esto se consigue mediante los espacios en blanco que reducen el ruido visual (la acumulación de elementos como texto e imágenes) y mejoran la legibilidad, especialmente relevante en páginas de blog y secciones que llevan a subsecciones.

    Punto focal:

    A la hora de llamar la atención sobre un elemento es fundamental que, mediante el diseño, se atraiga la mirada del visitante al punto focal relevante. Esto es especialmente importante para banners o botones CTA que invitan a la conversión y que también se pueden conseguir mediante el uso de colores destacables, lo que nos lleva al siguiente punto a tener en cuenta:

    Color:

    Para garantizar la coherencia en toda la web es fundamental elegir unos colores primarios y secundarios y ceñirse a ellos. La idea es que estos colores se correspondan a aquellos que se eligieron para la marca, pero en el caso de un rebranding completo deben tenerse en cuenta, principalmente, los buyer persona y sus preferencias.

    Tipografía:

    Si bien existen fuentes espectaculares con las que jugar y ser creativo, a la hora de crear un sitio web no todas estas podrán ser funcionales. Por ello, la recomendación es escoger entre el amplio abanico que ofrece Google Fonts, con elque se tendrá la seguridad de que se visualicen de forma correcta. Además, deberá tenerse en cuenta los distintos encabezados posibles, las negritas, los enlaces destacados... incluso si no aparecen en la primera versión de la web o lanzadera.

    Jerarquía:

    La jerarquía, de la que ya hemos hablado, es la relevancia de los distintos elementos de cada página. Es decir, la disposición o ubicación de estos elementos en las páginas web, de forma que los visitantes tengan claro qué es más importante en cada momento. A la hora de emplazar el contenido, deberán tenerse en cuenta bloque lógicos ampliables y dirigir la mirada con espacios y elementos que faciliten la conversión.

    Navegación:

    Como ya hemos comentado, la web debe ser funcional. Lo usuarios esperan poder encontrar el contenido relevante no sólo en cada página sino también entre páginas. Si bien la arquitectura de la web, es decir, la organización de las páginas en un sitemap corresponde al responsable del proyecto web, un diseñador debe saber que una web bien diseñada en la que el contenido es fácilmente accesible afecta de forma positiva a la entrada de tráfico desde los motores de búsqueda.

    Imagen:

    Las imágenes no sólo son importantes para garantizar que el sitio web sea atractivo, sino que también son una parte fundamental del SEO. Por esta razón, en el diseño se deben tener en cuenta cómo van a afectar a la velocidad del sitio, así como a su disposición según los distintos tamaños de pantalla, lo que nos lleva al siguiente punto:

    Responsividad:

    Por último, como no podía ser de otra forma, la responsividad de un sitio web es un elemento más a tener en cuenta en su diseño. Hoy en día es imprescindible adaptar el diseño desktop a las distintas versiones móviles de ahí la relevancia de usar guillas o sistemas de cuadrícula para garantizar que los elementos se mueven de la forma correcta y tiene una visualización relevante en las versiones de pantalla más pequeñas.

    Separador
    ¿Cómo debe ser la anatomía de una web de servicios?
    Aprende cuáles son los elementos imprescindibles en un website ecommerce

    Contenido relacionado

    Separador

    Website, UX

    10 frases antes de escoger el diseño de tu web

    Lee estas 10 frases antes de embarcarte en el diseño de tu web. No tomes decisiones a la ligera a la...

    Online Strategy, Website, Branding, UX, Marketing Online

    Las mejores prácticas del diseño web de 2018 que debes llevar al 2019

    Descubre las mejores prácticas del diseño web de 2018 y aplícalas en 2019 para crear una web de éxit...
    FREE CONSULTATION