10 consejos clave para diseñar una página web efectiva

por

Cuando llega un cliente y te plantea un nuevo proyecto de diseño web para su empresa o negocio, ya sea en Valladolid, donde esta empresa presta la mayoría de sus servicios o de cualquier parte, lo primero que tenemos en cuenta es este decálogo de «obligaciones» para el proyecto.

Estas cuestiones están por delante de cualquier otra si queremos que nuestro trabajo tenga la utilidad que se le presupone a un sitio web de empresa: Que se encuentre rápidamente en los buscadores, que represente fielmente a la empresa, que sea sencilla y rápida.

Si eres un cliente que está buscando una empresa de diseño de páginas web debes exigir que tu proyecto contemple todo estos aspectos, y si eres un profesional principiante del diseño web en busca de conocimiento, te digo que estos 10 puntos deben ser tus 10 mandamiento del diseño web.

Da igual si trabajas con WordPress, Drupal, LifeRay, o vas a montar una tienda online. Estos 10 puntos son verdades casi universales del diseño web.

Diseño atractivo y acorde al tipo de negocio

Como en esta sociedad todo entra por los ojos, el aspecto es muy importante. Un diseño atractivo es la clave. Da igual si buscas algo disruptivo o clásico, adelante con tu idea, pero que sea atractivo, que no esté desfasado ni estéticamente obsoleto (en esto, querido potencial cliente, déjate aconsejar, hazme caso) y sobre todo que sea acorde a la actividad de la empresa. No se diseña la misma página para un negocio de fiestas de cumpleaños infantiles que para un bufete de abogados. Ni en estructura, ni en tipografía ni mucho menos en colores se van a parecer.

Y hablando de colores. Una página web debe tener sus líneas maestras de diseño acorde a los colores corporativos de la empresa. Con esto no quiero decir que deban utilizarse los mismos, pero si al menos la misma gama cromática. Si los colores del logo son fuertes o chillones, como diseñador profesional debes saber que no se deben utilizar grandes masas de color con este tipo de tonos, pero se puede meter algún detalle como líneas separadoras, bordes de botón, algún icono, etc.

La limpieza y claridad en el diseño es esencial, y muchas veces la imagen corporativa que nos trae el cliente no ayuda y es ahí donde nosotros como profesionales del diseño debemos dar respuesta creando algo elegante partiendo de una base que puede no serlo tanto.

Se verá bien en todos los soportes

No me voy a extender demasiado en este punto porque entiendo que a mediados de junio de 2023 este tema debe estar ya bastante claro para todos.

MOBILE FIRST. El móvil primero, diseñamos para móvil y luego ya vemos cómo queda en pantalla grande. Esto debemos tenerlo bien claro. Cerca del 80% de las consultas a páginas web se realizan actualmente en teléfonos móviles.

El diseño para teléfonos debe ser minimalista, vertical, obviamente, y debe ser una versión del diseño de escritorio, es decir, mostraremos siempre el mismo contenido esencial. Y digo contenido esencial porque muchas veces una maquetación compleja, currada y bonita en pantalla grande no es aplicable a móviles y puede que debamos prescindir de algún elemento, alguna imagen etc, pero nunca de algo que dé sentido al contenido.

Con las herramientas de maquetación web para WordPress como DIVI, que es con la que se trabaja en GB Comunicación, la ventaja es que el diseño para los tres tipos principales de visualización: Pantallas, tablets y móviles, se hace en el mismo momento, siendo casos puntuales en los que hay que crear versiones alternativas o especiales para móviles. El mismo diseño queda completamente adaptado en una sola sesión de trabajo.

Correcta elección de la tipografía

Muy en línea con los dos punto anteriores, la correcta elección de la tipografía es muy importante. Antes no había ese problema. Teníamos 3 o 4 tipos de letra a elegir pero con el catálogo de fuentes de Google podemos utilizar más de 200 tipos de letra.

Elegiremos siempre tipos de letra de imprenta que se lean con claridad tipo sans serif para párrafos, con un color que sea lo suficientemente contrastado con el fondo. Lo más importante es la legibilidad. No debemos sacrificar nunca legibilidad por diseño. Para enunciados y títulos podemos dar algo más de rienda suelta a nuestra creatividad jugando con grosores, tipos de letra y tamaños, siempre con el foco puesto en que se lea bien.

Redacción acorde al público objetivo

No es lo mismo dirigirnos a potenciales clientes de una clínica dental que a los padres y madres de un colegio de educación infantil, de igual manera que no trataremos del mismo modo ni utilizaremos los mismos términos en una tienda online orientada a un público juvenil que a un público más adulto.

Lo primero que debemos tener claro es que lo importante de una página web es el mensaje y el contenido. Pero el cómo lo escribimos es igual de importante. Aquí entra en juego la figura del copywriter, el experto en redacción que sabrá dar un tono más formal, más persuasivo, más orientado a ventas, o desenfadado, dependiendo del tipo de público, el tipo de contenido y el tipo de empresa dueña de la web.

Hay que saber cuándo tratar a tu lector tuteando o de usted, cuándo usar verborrea técnica y cuándo explicar las cosas con un lenguaje más llano, sin tecnicismos.

Contenido ordenado

Tanto para las personas como para los buscadores, es fundamentar ordenar y organizar correctamente el contenido y respetar las jerarquías de los títulos. No debemos caer en el error de utilizar un título H como recurso gráfico. Quiero decir que si en nuestro diseño general hemos dicho que H1 (que es el título principal de cada url) debe estar en un grosor, tipografía, color y tamaño determinados, no lo vamos a utilizar 5 veces en la misma página solamente porque nos venga bien a nivel estético.

H1 solo deber haber uno por página (url) y debe ser el título principal de la misma. Si después queremos poner otros enunciado utilizaremos H2, H3, H4…. y le daremos el formato estético que nos convenga. Te recuerdo que la estructura correcta es H1 para títulos principales, H2 para separar temas importantes dentro de la url, H3 para sub apartados de H2 y así sucesivamente es un jerarquía de árbol que no debemos alterar si queremos que todo el sitio web esté bien optimizado para los buscadores.

Tiene que ser rápida

A veces bonito y rápido no van de la mano. Llenamos las páginas de efectos, vídeos, fotos en alta calidad, más de la necesaria, decenas de plugins en WordPress temas pesados o mal optimizados, y todo eso son como piedras que vas echando al saco y ese saco cada vez pesa mas.

Google y los propios usuarios nos piden que las páginas sean rápidas, que carguen como un rayo. Hace poco, por ejemplo, he tenido que renunciar a una idea de diseño porque no era eficiente. Era una página que empezaba con un video de fondo. Es algo que me gusta bastante hacer como puedes ver en mi portafolio de trabajos web, pero no siempre es una buena idea.

Hay muchas formas de optimizar un sitio web, sobre todo en WordPress, no me voy a extender porque es un tema que da para un blog entero dedicado a ello pero si quiero decirte los puntos clave en los que hay que poner especial atención:

  • Imágenes optimizadas. Deben pesar lo menos posible y además sería conveniente utilizar algún plugin de optimización extra.
  • Minificar y comprimir las hojas de estilo y el javascript. También podemos hacerlo con plugins o con las propias herramientas del tema si dispone de ellas, como por ejemplo DIVI.
  • No «ratonear» con el hosting. No escatimes recursos económicos a la hora de elegir el mejor hosting para tu página web. Un hosting barato puede repercutir en una web lenta y carente de los servicios de mantenimiento y optimización necesarios. Hay que alojar la web en un sitio acorde al tamaño y tráfico de la página web.
  • Cachear la página. Cachear una página web se refiere al proceso de almacenar una copia estática de la página en un servidor o dispositivo cercano al usuario. Esta copia en caché se utiliza para servir rápidamente el contenido cuando se solicita nuevamente, evitando la necesidad de realizar una nueva solicitud al servidor original. El almacenamiento en caché mejora la velocidad de carga de la página y reduce la carga en el servidor, proporcionando una experiencia más rápida y eficiente al usuario. En WordPress lo podemos hacer con varios plugins gratis y estupendos.
  • Ojo con las llamadas a la base de datos. Esto puede suceder en páginas o desarrollos a medida si no están bien programados, incluso con algún plugin de WordPress que no tenga una programación afinada. La página hace excesivas llamadas a la base de datos con la consiguiente devolución de datos. Todo ese tráfico hace que se tarde en presentar la página al usuario.

Tiene que ser fácil de consultar

Obvio ¿no? Hay páginas que son un completo laberinto en las que a veces llegar a un apartado concreto es una odisea. Muchas veces pensamos que una página está bien estructurada pero cometemos el error (y hablo en primera persona porque me refiero a los desarrolladores web) de pensar que el usuario va a tener tan claro como nosotros dónde están las cosas.

Tanto el menú, como las transiciones entre páginas del sitio web deben ser claros y fáciles de encontrar. Incluir en la página un buzón de sugerencias, o si es una página con acceso a una comunidad de usuarios fidelizada y recurrente, una encuesta, nos ayudará a detectar esos posibles fallos de usabilidad.

Debe ser el reflejo fiel de la empresa que representa

Con esto me refiero a que el contenido debe estar constantemente actualizado y ser fiel a la realidad de la empresa. Si la empresa cambia de sede, si se añaden o eliminan servicios, si cambian las personas de contacto, si hay novedades importantes que nuestros lectores deben conocer… todo eso debe estar al día.

Su posicionamiento en Google debe ser una prioridad

De qué sirve la página más bonita y con el mejor contenido si luego no la encuentra nadie.

Debemos poner en marcha todos los mecanismos internos y externos para que la página tenga el mejor posicionamiento en Google. Bueno, venga, y en Bing, pero ya sabes que Google tiene el 99% del mercado de las búsquedas en Internet. Ya pondremos un decálogo de imprescindibles para que Google indexe y posicione nuestro sitio web. Que esto da también para artículo aparte.

Que no de problemas, y si los da, que sean mínimos y de fácil resolución

Por último, y si, es muy importante, trataremos de que un sitio que no de problemas. Los problemas en un sitio web suelen venir siempre de los mismos sitios. Vamos a verlos y como evitarlos:

  • Hackeo. Esta es la mayor amenaza para nuestro sitio web. Inyección de código malicioso, redirecciones, spam, denegaciones de servicio… Muchos de estos problemas se evitan manteniendo la página bien actualizada y mantenida y alojándola en un sitio web de confianza y con sistemas de seguridad contrastados y de garantía.
  • Caidas. A veces pasa, y les pasa a los mejores. Una caída generalmente suele ser culpa de un error en el servidor de alojamiento. Lo importante es darse cuenta rápido y reportarlo a la empresa de alojamiento para que lo solucionen lo antes posible.
  • Lentitud excesiva o no carga la página. Revisa lo primero el tamaño de las imágenes que tú o tu cliente, si gestionan ellos el contenido, estáis subiendo. No todo el mundo tiene los conocimientos o la voluntad de estar pendiente del optimizar el tamaño de las fotos que suben a la web. Es nuestra tarea como profesionales adelantarnos a esas circunstancias mediante optimizadores de imágenes y chequeos rutinarios.
  • Spam a través del formulario de contacto. Muy sencillo, utiliza la herramienta ReCaptcha de Google, mano de santo.
  • Pérdida total o parcial de información. Otro clásico. Ay madre! que se me ha borrado todo. Ay señor, que me he cargado toda la galería de fotos! Para eso están las copias de seguridad. Programa copias en el servidor o a través de algún plugin de WordPress en función del grado de actualización del sitio web. Por poner dos casos extremos: Para una empresa que toca su contenido dos veces al año, con programar una copia al mes será suficiente. Un periódico online deberá hacer copia como poco dos o tres veces al día, o más.

Y aquí acaban mis consejos para que tu próxima página web sea un completo éxito. Espero que te haya sido de utilidad.