7 pasos para el desarrollo de un diseño web
Actualizado: 29 / 01 / 2022

7 pasos para el desarrollo de un diseño web

Bruno Díaz Marketing Manager
Bruno Díaz
Marketing Manager
SectorHablamos de
El diseño web es una variante del diseño gráfico que implica unas exigencias determinadas. No sólo se trata de acertar en un mensaje, lenguaje y uso de colores, sino que hay que tener muy en cuenta su aplicación en la web: pensar en la usabilidad para el usuario, la jerarquización de la información, la adaptación del diseño a las pantallas de diferentes dispositivos, etcétera. Esto implica que para un buen diseño web necesitamos grandes dosis de creatividad, pero también son imprescindibles conocimientos técnicos y un método de trabajo. En este artículo te vamos a explicar nuestro método, el proceso que seguimos hasta tener listo nuestro nuevo diseño web (Para más información sobre el concepto diseño web, visita nuestro artículo del blog -> ¿Qué es el diseño web?.

  1. Captar el gusto del cliente: lo primero que debemos hacer es escuchar a nuestro cliente. Que nos explique qué quiere conseguir con la web, a qué público se quiere dirigir, cómo se imagina el diseño de su web, etcétera. En ocasiones puede ser que el cliente nos dé información insuficiente o contradictoria, y debemos insistir en que quede todo claro desde el inicio para luego no perder horas en cambios. Y a veces sucede que lo que quiere el cliente no nos parece acertado. En ese caso, ¿aplicamos la regla "el cliente siempre tiene la razón"? Esto ya lo dejamos en manos de cada uno, pero en cualquier caso creemos que lo más sensato es darle siempre nuestra opinión profesional al cliente, también en caso de discrepar con él, y esperar que escuche nuestra opinión experta. Pero si al final el cliente se enroca, se puede hacer finalmente lo que él pide, con la tranquilidad de haberle avisado antes.

  2. Análisis de los contenidos: a partir del material que aporte el cliente y el que nos pida que generemos, debemos hacernos una idea del material del cual dispondremos para la web. Tener en cuenta los apartados que tendrá, qué volumen y formato de imágenes, textos, vídeos y otros elementos tendremos, nos ayudará a proyectar un diseño web que se adapte bien a nuestro material. Porque un error común de algunos diseñadores es crear unas páginas muy bonitas con fotografía a toda pantalla, para una web donde el cliente nos aportará unas imágenes que no se podrán lucir en pantalla completa, por ejemplo.

  3. Análisis de mercado: observar qué están haciendo las empresas competidoras directas e indirectas. Los colores, estructuras, lenguajes gráficos, funcionalidades y programación web que usan. A partir de esta información y el briefing que nos haya pasado el cliente, determinaremos si vamos a hacer algo en la línea del sector, algo con cosas en común con el sector pero con hechos diferenciales, o apostar por algo totalmente rompedor con el resto de competidores. Por lo general lo más acertado es el camino del medio (por ejemplo si vamos a hacer una web para un dentista hacerla en fondo negro sería muy rompedor, pero quizá no lo más adecuado), pero no siempre es así.

  4. ¿Habemus logotipo? Esta es una pregunta muy importante. El logotipo es la base de la identidad corporativa, y su presencia en la web debe ser destacada, y su combinación con el resto de elementos de la web, armónica. Si el logotipo ya nos viene dado por el cliente, lo más aconsejable es plantear un diseño web tomando como punto de partida ese logotipo: sus colores, tipografías, efectos, elementos iconográficos, etc. Si observamos que el logotipo está desfasado o que no se corresponde con el mensaje que la marca quiere transmitir, lo mejor y más honesto es plantearle al cliente un cambio en su logotipo. Aunque para muchos diseñadores la mejor situación es cuando es una empresa de nueva creación y podemos empezar de 0, también creando el logo.

  5. Un lenguaje para la web: el siguiente paso es escoger los elementos del lenguaje indispensables como la tipografía que vamos a utilizar (generalmente es recomendable hacerlo todo con una tipo o una familia de ellas), las iconografías que vamos a hacer, los colores a utilizar, etcétera. Estos elementos serán los que le darán cuerpo y coherencia a la web.

  6. Jerarquías visuales y arquitectura de la información: hay que tener muy en cuenta la importancia de cada uno de los contenidos y qué predominancia tienen que tener unos sobre otros en el diseño web. Esto se debe esencialmente a dos razones: que consigamos que el usuario cuando aterrice en la web haga el recorrido que más nos interesa (que pase por nuestro embudo), y para nuestro amigo SEO, pudiendo determinar los importantísimos h1, h2, h3...

  7. Equilibrio visual/funcional: son dos esferas que a menudo tienen sus fricciones, y en ocasiones incompatibilidades. Lo bonito no siempre es funcional, y lo funcional no siempre es bonito. Nosotros aconsejamos unos diseños web que no crucen determinadas líneas rojas: el SEO o posicionamiento web y el web responsive design. Mientras el diseño web respete la optimización de estos dos elementos, a partir de aquí se puede dar rienda suelta a la creatividad. Por ejemplo, un tipo de diseño muy atractivo visualmente pero malo para SEO es el Parallax,como ya explicamos en otro artículo.
Estos son, a grandes rasgos, los pasos y elementos relevantes del proceso de elaboración de un diseño web, como los hacemos en La Teva Web. Esperamos que el artículo te haya resultado de interés. Si quieres, puedes consultar nuestro porfolio de páginas web y ver si cumplimos con lo que predicamos ;)
Bruno Díaz Marketing Manager
Sobre el autor/a
Bruno Díaz — Marketing Manager
Profesional de larga trayectoria como consultor de comunicación y marketing digital, y especializado en SEO, SEM y proyectos web. Como Marketing Manager de la agencia, coordino a un equipazo de técnicos de marketing digital del cual estoy muy orgulloso.

Noticias relacionadas

¿Tienes un proyecto en mente? Cuéntanoslo