Cómo ayudamos a Vionso a optimizar el SEO técnico y modernizar la entrega de correos en su sitio web

Vionso, una agencia que ofrece servicios de desarrollo, nos contrató para implementar una serie de mejoras en su sitio web.

Como contexto, vionso.com es un sitio desarrollado con Next.js.

Mejoras en el SEO técnico

El equipo de Vionso había identificado previamente, mediante Google Search Console, varios problemas relacionados con el SEO técnico que estaban afectando su posicionamiento en buscadores:

• Problemas con la URL canónica de varias páginas
• Ausencia de los archivos robots.txt y sitemap.xml
• Falta de metadatos en algunas páginas

Generación de metadatos por página

Desarrollamos una función para generar dinámicamente los siguientes metadatos en cada página:

• Título
• Descripción
• URL canónica
• Palabras clave
• Metadatos de Open Graph y Twitter
• JSON-LD

Movimos la generación de metadatos de los layouts a las páginas individuales, para evitar posibles conflictos en el futuro y asegurar que cada ruta tenga metadatos precisos y actualizados.

Generación de los archivos sitemap.xml y robots.txt

Para sitemap.xml, desarrollamos una solución que identifica todas las rutas de la aplicación durante la compilación y genera el archivo automáticamente.

En el caso de robots.txt, implementamos una versión simple que permite la indexación de todas las páginas disponibles e incluye el enlace al sitemap.

Solución de errores en la consola

Durante el proceso, también identificamos errores en la consola del navegador que, además de afectar la experiencia de desarrollo, pueden impactar negativamente en el SEO.

Todos estos errores fueron corregidos.

Resultados

Como resultado de estas mejoras, la puntuación de SEO en Lighthouse pasó de 85 a 100.

Antes de los cambios:

Después de los cambios:

Mejoras en la entrega de correos electrónicos

La página de contacto en vionso.com envía un correo automático a posibles clientes una vez completado el formulario. El equipo de Vionso nos expresó su interés en mejorar la fiabilidad de estos envíos.

Migración de Nodemailer a Resend

Propusimos migrar de Nodemailer a Resend, un proveedor moderno y confiable con una integración sencilla.

El proceso consistió en:

• Crear una cuenta en Resend
• Generar una API key
• Instalar el SDK para Node.js
• Modificar unas pocas líneas de código para reemplazar la lógica de envío

Desarrollo de una plantilla de correo personalizada

Además, desarrollamos una plantilla de correo personalizada utilizando React Email, lo que nos permitió tener control total sobre el diseño del mensaje, manteniendo una apariencia profesional y coherente con la marca. La integración con Resend fue fluida y sin fricción.