Crear un sitio web nuevo puede ser un proceso largo y complejo. Desde establecer objetivos con las partes interesadas hasta crear contenido y desarrollar el diseño, hay muchísimos pasos que dar antes de poder pulsar el botón de encendido. Revisar y probar la funcionalidad es clave para un lanzamiento exitoso.
Inspecciona el diseño
Antes de ponerte a probar la funcionalidad, echa un vistazo a los elementos visuales del diseño. ¿Estás usando el logo definitivo-definitivo-definitivo? ¿Hay fotos nuevas que incluir? ¿Y aumentaste el tamaño de fuente en las llamadas a la acción?
El proceso de diseño casi siempre conlleva una gran cantidad de comentarios y sugerencias de edición. Es fácil pasar algo por alto. Pero son estos pequeños detalles los que deleitarán o frustrarán a tu audiencia cuando el sitio esté en línea. Así que mantén una lista actualizada de ediciones y cambios, y asegúrate de resolverlos antes del lanzamiento.
Comprueba si hay inconsistencias. Los estilos y tamaños de fuente deben ser iguales de una página a otra. Es fácil pasar por alto una fuente incorrecta o un texto que es un punto más grande de lo debido. Después de todo, llevas mucho tiempo mirando este diseño.
Pide a alguien más que revise el sitio en busca de inconsistencias y detalles que se te hayan podido escapar.
En esta etapa, los responsables de la toma de decisiones deberían estar satisfechos con el aspecto del diseño. Es normal que haya pequeños ajustes y ediciones, pero si ha habido una buena comunicación y colaboración, no debería haber cambios importantes a estas alturas.
Si recibes sugerencias de edición que consumen mucho tiempo, evalúa su valor potencial antes de ponerte con ellas.
¿Mejorarán estos cambios la experiencia del usuario? ¿Retrasarán el lanzamiento del sitio web?
Está bien negarse si lo que se recomienda no mejora la usabilidad o la estética visual del sitio. Mantén el profesionalismo, pero aclara por qué algunas ediciones no son necesarias, especialmente en las etapas finales del proceso de diseño.
Presta atención a los detalles
Hay muchísimos detalles que considerar y verificar cuando se trata de diseño web. Especialmente para un negocio o un sitio de comercio electrónico. Es importante verificar cosas como el horario de atención, la información nutricional de un menú, las direcciones y los números de teléfono.
Los sitios de comercio electrónico necesitan fotos y descripciones precisas para cada producto. Siempre es un chasco abrir una caja de algo que pediste y descubrir que no se parece en nada a lo que pensabas haber comprado.
Asegúrate de que una parte interesada que sea experta en la marca y sus productos le eche un vistazo antes de que el sitio se publique. Pregunta a tu cliente quién debería hacer esta revisión y asegúrate de que esa persona conozca bien el cronograma.
Prueba la funcionalidad de las integraciones
Las integraciones pueden incluir carritos de compra, suscripciones a boletines informativos y formularios de solicitud de presupuesto, entre muchísimas otras cosas.
Prueba cualquier parte del sitio que requiera recopilación de datos (¡y asegúrate de haber configurado SSL!). Si un formulario se envía a una dirección de correo electrónico, verifica que sea la correcta. Además, confirma las direcciones de correo electrónico con el cliente.
Los formularios deben tener instrucciones y campos claros. Es una buena idea pedirle a alguien ajeno a la empresa o al proyecto que complete un formulario de prueba y dé su opinión sobre la experiencia.
Lo mismo ocurre con el proceso de pago: pide a un par de personas que lo revisen en busca de fallos o ambigüedades. ¿Cuántos de nosotros hemos abandonado un carrito de compra porque el proceso era demasiado complicado? Todo, desde las opciones de envío hasta las formas de pago, debe ser revisado. Asegúrate de que todo esté bien definido y sea fácil de navegar.
Antes del lanzamiento, averigua qué tipos de pago electrónico planea aceptar tu cliente. ¿Ya tienen configurado PayPal o Stripe? Si no es así, asegúrate de que se encarguen de ello; recopilar información a última hora para abrir una cuenta puede causar retrasos molestos.
Revisa tus enlaces
Los enlaces son una parte fundamental de la funcionalidad y debes comprobarlos todos. Y no olvides crear esa página de error 404; haz que esto sea parte de tu protocolo estándar. Es algo que se pasa por alto fácilmente.
Revisar manualmente cada enlace puede ser abrumador. ¡Buenas noticias: no tienes que hacerlo! Usa una herramienta de rastreo de enlaces como W3C Checker o Screaming Frog. Ambas escanearán rápidamente en busca de enlaces rotos y se asegurarán de que el contenido sea accesible.
Asegúrate de que tu diseño sea compatible con todos los navegadores
Tu diseño debe funcionar, verse y ofrecer una experiencia de usuario similar en todos los navegadores. Cada uno tiene sus propias ventajas y limitaciones. Si tu diseño solo funciona bien en uno, los visitantes que usen otros se sentirán frustrados.
Podrías descargar todos los navegadores populares y probar tu diseño en cada uno, pero eso llevaría mucho tiempo. Existen herramientas de compatibilidad entre navegadores que hacen que este paso sea rápido y sencillo, como Browsershots, Browser Sandbox y Browsera.
El proceso de diseño web moderno
Descubre los procesos y herramientas detrás de los sitios web de alto rendimiento en este libro electrónico gratuito.
Comprueba la funcionalidad del diseño en diferentes dispositivos
La gente usa diferentes dispositivos a lo largo del día para acceder a contenido. Alguien está de compras y busca cafeterías cercanas en su móvil. Más tarde, pide zapatos desde su portátil mientras se pone al día con Netflix. Tu diseño debe ser fluido en cualquier pantalla. Las aplicaciones prácticas del diseño responsivo dan como resultado sitios web que ofrecen una experiencia más uniforme.
Verifica que la navegación, los botones y otros elementos interactivos sigan siendo funcionales en diferentes tamaños de pantalla. Prueba el diseño en distintos dispositivos y velocidades de red. Si tarda en cargar, comprueba si tus imágenes de alta resolución y animaciones están afectando el rendimiento del sitio. El exceso de elementos dinámicos también podría dificultar su usabilidad.
Es poco probable que puedas conseguir todos los dispositivos importantes para hacer pruebas. ¡Sorpresa: hay varias aplicaciones para eso! Browserstack, Google Mobilizer y otras herramientas te permiten ver cómo funcionará tu sitio en diferentes dispositivos móviles. Y, una vez más, Webflow te permite previsualizar tu sitio en diferentes pantallas mientras lo construyes.
Ten en cuenta que ningún emulador reproduce a la perfección la experiencia en cada dispositivo, así que asegúrate de probarlo en tantos dispositivos reales como sea posible. No puedes tener todos los dispositivos a mano, ¡pero tus amigos, colegas y clientes también pueden echarte una mano aquí!
Echa un vistazo al contenido
“Cuanto más eliminas, más resaltas lo que dejas.”
–Henry Green, novelista
Reescribir un párrafo aquí o una frase allá (probablemente) no tendrá un impacto importante en el diseño final. Con suerte, tuviste, al menos, un borrador del texto del sitio antes de comenzar el proceso de diseño, y lo fuiste iterando durante todo el camino. Diseñar teniendo en cuenta el contenido te permite tomar decisiones meditadas. Siempre se pueden hacer ajustes al texto más tarde, incluso después de que el sitio esté publicado.
Pero eso no significa que debas saltarte una revisión exhaustiva del contenido justo antes del lanzamiento. Una simple errata o una frase mal construida pueden afectar seriamente la percepción de tu audiencia, así que asegúrate de que tus textos estén tan pulidos como tu diseño.
Asegúrate de que tu contenido sea útil y fácil de leer de un vistazo
Por mucho que les duela a los creadores de contenido, la gente no entra en una web para leerla como si fuera un libro. Quieren entrar, encontrar la información que buscan y salir. Hazles un favor y facilítales las cosas.
Así es como funciona:
- Usa encabezados descriptivos
- Escribe frases con estructuras sencillas y limita los párrafos a tres o cuatro oraciones
- Agrupa las ideas o elementos relacionados en listas con viñetas
- Elimina el texto que no aporte valor
- Comprueba que tu texto sea conciso, atractivo y coherente con la voz de la marca
- Revisa la gramática y la ortografía
- Pide a otras personas que le echen un vistazo para detectar errores que podrían dejarte en evidencia
- Pide a un editor profesional que revise tu texto
Buenas noticias: ¡más herramientas! Hemingway, Grammarly y Ginger pueden ayudarte con el proceso de edición. Además, aprenderás un par de trucos de escritura por el camino.
Practica buenos hábitos de SEO
Esperamos que ya hayas integrado cuidadosamente palabras clave y frases SEO bien investigadas en tu contenido. También debes asegurarte de que el código tenga las etiquetas de encabezado y párrafo adecuadas. Cada página debe incluir sus propios meta títulos y meta descripciones.
Un meta título debe definir el enfoque de la página. Usa solo palabras clave relevantes, especialmente al principio de la descripción, y mantén la longitud por debajo de los 70 caracteres. La meta descripción puede ser un poco más larga, pero intenta no superar los 160 caracteres y escribe con un tono que conecte con tu público objetivo.
Cuando tu sitio web aparece en los resultados de búsqueda, lo que el usuario ve (normalmente) es el meta título y la descripción. Esto ayuda a tu audiencia a saber que han encontrado un sitio que satisface sus necesidades. Google utiliza el meta título para posicionar tu contenido correctamente, así que debe reflejar la esencia de tu página. Las etiquetas H1 también ayudan al posicionamiento y facilitan que los rastreadores web determinen el propósito de tu contenido. Asegúrate de que esas etiquetas sean específicas.
A las meta descripciones no les dan mucha importancia los rastreadores web, pero siguen siendo fundamentales. Una buena meta descripción le confirma al usuario que ha encontrado lo que buscaba. Usa las mismas palabras clave principales del título en algún lugar de la descripción. Google pondrá en negrita las palabras de la consulta de búsqueda que aparezcan en tu descripción, lo que también ayuda a que tu audiencia vea que tu sitio coincide con lo que buscaban.
Listos para el despegue
Cuando todo esté probado y revisado, es hora de mostrar al mundo tu gran trabajo.
Con un poco de paciencia y mucha preparación, tu diseño estará listo para ver la luz. Dedicar tiempo a revisar y probar tu sitio es un paso clave en el proceso. No dejes que las prisas —ni las tuyas ni las de tus clientes— te obliguen a lanzar antes de tiempo.
Asegúrate de que tu trabajo refleje todo el esfuerzo y el cariño que le has puesto. Aprovecha lo aprendido para que tu próximo proyecto sea aún mejor.
¿Qué es lo esencial en tu proceso de diseño?
El proceso de diseño nos ayuda a crear sitios increíbles y a mantener una buena relación con los clientes. Siempre me da curiosidad saber qué les funciona a otros diseñadores. ¿Tienes algún paso en tu proceso que creas que podría ayudar a la comunidad? ¡Cuéntamelo en los comentarios!
