El rediseño de sitio web implica revisiones importantes de su sitio web actual con el objetivo de mejorarlo, crear una mejor experiencia de usuario, aumentar las conversiones y mantenerse al día con las principales tendencias de diseño. Descubra cómo lograr un rediseño de sitio web exitoso con esta guía.
Existen muchas razones para hacer un rediseño de sitio web. Es posible que tenga un sitio web con prácticas de diseño desactualizadas que brinden una mala experiencia de usuario. Puede haber problemas técnicos persistentes que deban solucionarse, agregar funciones nuevas o eliminar las irrelevantes. O tal vez simplemente desee rediseñarse para las vacaciones u otra ocasión especial. Cualesquiera que sean sus motivos, rediseñar su sitio web puede tener grandes beneficios.
Esta guía lo ayudará a comprender el rediseño del sitio web, a saber cuándo usarlo y le proporcionará los métodos para hacerlo correctamente.
Tal vez te interese leer: Guía de estilo | Qué es, cómo crear una y 7 ejemplos
Qué es el rediseño de sitio web
El rediseño de un sitio web implica actualizar y mejorar significativamente su estructura, contenido, navegación y diseño visual. Este proceso busca optimizar la experiencia del usuario, mejorar la funcionalidad del sitio y asegurar que la estética y la tecnología del sitio estén al día con las tendencias actuales y los objetivos de la empresa. El rediseño de sitio web puede incluir desde cambios menores en la interfaz hasta una reconstrucción total del sitio, enfocándose en aspectos como la accesibilidad, la velocidad de carga y la integración de nuevas funcionalidades.
El rediseño de sitio web es el proceso de modernización, reparación o reposicionamiento de un sitio web para aumentar el tráfico, la participación, los ingresos y más.
Los rediseños no siempre se centran en cambios superficiales en el diseño de la interfaz. En algunos casos, el backend técnico se actualiza o repara para mejorar el rendimiento del sitio.
Los diseñadores pueden rediseñar cualquier faceta de un sitio web, incluyendo:
- Marca
- Navegación; diseño o estructura
- Tipografía
- Iconografía
- Fotografía
- Colores
- Diseño de página web
- Botones de llamada a la acción
- Elementos de contacto
- Viajes de usuario
- Procesos de pago
- Y más
No confunda el rediseño de un sitio web con una actualización del mismo. El rediseño de un sitio web se refiere a una revisión importante del diseño y / o las características de un sitio web, mientras que una actualización del sitio web se trata de preservar la mayor parte del diseño de página web mientras se implementan cambios menores en todo el sitio.
¿Por qué necesitamos rediseñar los sitios web?
Las tendencias del diseño web cambian. Las empresas evolucionan. Los consumidores se vuelven más exigentes. Estas son solo algunas de las formas en que las fuentes externas dictan que un rediseño está en orden.
En algunos casos, es el sitio web en sí el que solicita el cambio. O, más bien, son los datos los que nos permiten saber que hay algo que no está del todo bien y sugieren que un rediseño puede ayudar a solucionarlo.
Independientemente de por qué el sitio web debe ser rediseñado, el objetivo de su proyecto es el mismo: proporcionar una mejor experiencia de usuario en el sitio y, en consecuencia, hacer que el sitio web sea una fuente más exitosa de clientes potenciales, ingresos, usuarios, lectores, etc. para el negocio.
Tal vez te interese leer: Transformación digital | Guia Completa
¿Cómo prepararse para el rediseño de un sitio web?
El rediseño de un sitio web no puede ser simplemente algo que se junta. Debe ser un enfoque basado en datos, primero en el usuario que corrija las deficiencias del sitio, sin importar cuán grandes o pequeñas puedan ser.
Por lo tanto, debe abordar esto con el mismo cuidado y planificación que pone en la creación de sitios web desde cero.
Esto es lo que debe hacer para prepararse para el rediseño:
1. Comprenda la razón del rediseño
Por lo general, algo desencadena la discusión en torno a un rediseño. Si puede identificar su origen, lo ayudará a elegir el mejor enfoque.
Puede ser que su cliente (o usted mismo) comente sobre la antigüedad del sitio web, el ranking SEO actual, ventanas emergentes incorrectas, un embudo mal diseñado, problemas para obtener clientes potenciales, etc.
Al comprender qué fue lo que provocó el deseo de un rediseño, puede comenzar a planificar el enfoque correcto (es necesario cambiar el diseño, los colores, el tamaño del texto, agregar botones, eliminarlos, etc.)
2. Haga que sus usuarios intervengan
Hay una gran cantidad de datos a su disposición y esto puede brindarle una gran perspectiva de lo que funciona, lo que no y dónde debe enfocar sus esfuerzos de rediseño.
Aquí hay algunas herramientas que pueden ayudarlo con su esfuerzo:
Google Analytics
Es un recurso valioso al rediseñar un sitio web. Cualquier sospecha que usted o su cliente tuvieran sobre la inadecuación del diseño del sitio o su contenido se puede respaldar con una mirada a los números.
Lo primero que debe observar son los datos de su audiencia.
¿Quién visita el sitio web? ¿Es la persona de usuario para la que se diseñó inicialmente el sitio web?
Si tu respuesta es sí, ¿qué les impide hacer lo que se supone que deben hacer? (El flujo de usuarios le ayudará a visualizar esto).
Si la respuesta es no, entonces ¿el problema es que el sitio web está diseñado para el usuario equivocado? Imagínese cómo se verían las métricas clave de rendimiento, como la tasa de rebote, el tiempo en el sitio y las conversiones, si las rediseñara para ese usuario.
Lo siguiente que debe observarse es el rendimiento de cada página. Puede encontrar esta información en la opción “Comportamiento”.
En general, ¿qué tan satisfecho está con el rendimiento del sitio? Encontrarás esa información en la fila superior.
Si el sitio en su conjunto tiene un rendimiento muy bajo, tendrá que utilizar otras fuentes para tratar de detectar los problemas.
Si el problema se relega a ciertas páginas o partes de su sitio, estos datos serán útiles. Por ejemplo, qué páginas tienen el mejor rendimiento en términos de:
- Páginas vistas.
- Tiempo promedio en la página.
- Porcentaje de rebote
- Valor de la página
¿Faltan páginas críticas en la acción o tienen un rendimiento muy bajo? ¿Qué sospecha que está causando este problema? Etc.
Intente averiguar por qué sus páginas aparentemente más valiosas no obtienen el tráfico y la participación que necesita. La herramienta Behavior Flow también ayudará con esto.
Encuestas y comentarios del sitio web
Sus datos de Google Analytics existentes arrojarán mucha luz sobre lo que está sucediendo con su sitio web y dónde necesita un rediseño. Pero no confíe únicamente en sus suposiciones basadas en datos. Debes ir directamente a la fuente.
Una forma de hacerlo es agregando una encuesta o un widget de comentarios a su sitio web. De esta manera, los visitantes que se sientan fuertemente (de cualquier manera) sobre el diseño de su sitio web pueden brindarle información directa.
Pruebas de usabilidad
Otra forma de obtener comentarios directos de sus visitantes y clientes es configurando pruebas de usabilidad en su sitio web.
Con herramientas como los mapas de calor y los registradores de sesiones, verá lo que va mal mientras se mueven por su sitio web. Es una excelente manera de comprender en qué aspectos su diseño o el recorrido del usuario hacen tropezar a las personas.
Algunas de las herramientas más útiles para realizar pruebas de usabilidad son Aurora Heatmap, Hotjar y Crazy Egg.
La mayoría de estas herramientas tendrán las siguientes funciones útiles:
- Mapas de calor, que le muestran las partes de sus páginas más vistas, así como las que la gente ignora.
- Grabaciones: para que pueda registrar las sesiones de los visitantes y ver si se mueven por su sitio e interactúan con los elementos como usted desea.
- Encuestas: para que pueda crear widgets de comentarios personalizados para colocar a un lado o en la esquina de su sitio.
Las pruebas de usabilidad solo son realmente efectivas si tiene una muestra de buen tamaño de comentarios y aportes de visitantes con los que trabajar, y esta herramienta lo permite si paga por el plan de negocios. Por lo tanto, tenga esto en cuenta al presupuestar el proyecto de rediseño de su sitio web.
3. Realice una auditoría del sitio web
A continuación, es hora de que adopte un enfoque práctico para evaluar el diseño y la usabilidad de su sitio web. Hay varias cosas que debe hacer para completar esta auditoría:
Compare el diseño con las tendencias actuales
Las tendencias de diseño web pueden aparecer de la nada y no hay garantía de que se queden por mucho tiempo. Por lo tanto, es fácil que los sitios web parezcan obsoletos incluso si se crearon durante el último año o dos.
Lo primero que debe verificar es si su sitio mantiene tendencias o características de diseño obsoletas. O si una elección de diseño previamente aceptable ahora está pasada de moda.
También debe observar qué tan bien se adhiere el sitio a las mejores prácticas de diseño web, como la teoría del color y las reglas de emparejamiento de fuentes. No hay nada de malo en tomar decisiones de diseño únicas para su sitio, siempre que no se contrapongan a lo que funciona mejor para la experiencia del usuario.
Haga un recorrido por las tareas principales de su sitio web
Cree una lista de cinco a siete tareas principales que desea que las personas completen en su sitio web. Por ejemplo:
- Lea la página de inicio y complete el formulario de consulta en la parte inferior.
- Visite la página de “Precios” y elija un plan.
- Complete el proceso de pago en dos minutos.
- Vea el video en la parte superior de la página de “Soluciones” para obtener más información.
- Sepa cómo copiar el código de cupón de la barra de notificaciones y agregarlo al finalizar la compra.
Luego, vaya a su sitio web como visitante e intente completar cada tarea una por una. Sea lo más objetivo posible si encuentra fricciones en el camino.
Por lo general, si hay un problema con la finalización de la tarea, se debe a que no se siguen los principios del diseño web. Estos principios nos enseñan cómo factores como la ubicación, el espaciado, el tamaño, etc., afectan la usabilidad de un sitio web.
Haz un análisis competitivo
Visite algunos de los sitios web de la competencia con el mejor rendimiento y haga una comparación con los suyos.
- ¿Qué tipo de señales envían sus elecciones de diseño en comparación con las suyas? Por ejemplo, ¿un tema oscuro hace que su sitio web parezca más juvenil y moderno?
- ¿Qué tan eficientes son los viajes de los usuarios en comparación con los suyos? Por ejemplo, ¿el menú fijo y la barra de búsqueda proporcionan una experiencia de compra más rápida para los visitantes?
- ¿Qué hay de las funciones que tiene su sitio y que el tuyo no? Por ejemplo, ¿su colorida barra de notificaciones es menos perturbadora que su ventana emergente promocional?
Si atiende a los mismos usuarios, hay mucho que puede aprender sobre cómo y por qué su diseño falla a sus visitantes.
Revise sus tecnologías
Una última cosa que debe considerar es su tecnología. Porque no son solo las elecciones de diseño las que pueden generar experiencias negativas para el usuario, también puede ocurrir una mala infraestructura.
Debes evaluar:
- Plan de alojamiento web
- Sistema de gestión de contenidos
- Tema
- Creador de páginas
- Complementos
- Integraciones de terceros
También observe los procesos de optimización de su sitio, como el almacenamiento en caché, la compresión de imágenes y el SEO.
Si alguna de sus tecnologías causa problemas de rendimiento, querrá cambiar a una alternativa mejor durante el rediseño.
4. Cree su hoja de ruta de rediseño de sitio web
Una hoja de ruta no se trata de hacer ningún trabajo de rediseño de sitio web. Se trata solo de determinar el alcance del proyecto y luego crear una línea de tiempo y entregables para él.
Ahora, a diferencia de un proyecto de diseño web, debe tener en cuenta el hecho de que el sitio web está actualmente activo y la empresa lo está utilizando para realizar negocios (incluso si no está obteniendo los mejores resultados).
Sabiendo esto, no puede programar un proyecto de rediseño de sitio web como lo haría con un sitio desde cero. Hay muchas herramientas de gestión de proyectos que pueden ayudarlo con esta tarea, incluidos Monday, Asana, Trello y otros.
5. Determine sus KPI y establezca objetivos medibles
Ahora necesita una forma de supervisar el rendimiento de su sitio después de la implementación.
La mejor manera de hacerlo es elegir algunos indicadores clave de rendimiento (KPI) que le darán una pista sobre si el rediseño fue un éxito o no.
Por ejemplo, digamos que la primera tarea de rediseño de su lista es reelaborar la imagen principal de la página de inicio. Un KPI como la tasa de conversión podría ser una métrica demasiado amplia para decir si el rediseño mejoró algo. En cambio, querrá concentrarse en lo que cambiará el rediseño específico.
¿Qué hay de los clics en el botón de CTA?
Así como ha desglosado los pasos en su hoja de ruta de rediseño, cada uno debe tener un conjunto individual de KPI (o solo uno importante) para monitorear.
Además, querrá establecer un objetivo medible en relación con el KPI.
Supongamos que está cambiando la imagen, la copia y el botón en la imagen principal. Sabes que quieres ver un aumento en los clics. Pero, ¿cuánto de un aumento indicaría que el rediseño fue exitoso? ¿5%? ¿25%?
Mire los datos heredados del sitio, establezca algunos puntos de referencia y luego establezca sus objetivos basados en eso.
Tal vez te interese leer: Código QR de Instagram: ¿Qué es y para qué sirve?
¿Cómo realizar un rediseño de sitios web?
Ahora que sabe lo que está en juego con el rediseño de un sitio web, es hora de hablar sobre cómo realizarlo. Estos son los 10 pasos que debe seguir para asegurarse de que su rediseño sea exitoso:
Paso 1: Cree la propuesta de rediseño del sitio web
Incluso si sabe cuál es el plan de juego, el cliente debe estar de acuerdo con lo que está a punto de hacer.
Cree una propuesta de rediseño de sitio web que explique lo siguiente:
- Alcance del trabajo
- Estimaciones del proyecto y fechas de vencimiento de los pagos
- Cronograma e hitos
- Lista de entregables
- Términos de su relación
Una vez que obtenga su firma y aprobación, puede ponerse a trabajar.
Paso 2: Programe
Siguiendo los pasos establecidos aquí, así como las tareas individuales que realizará dentro de cada uno, configure su trabajo de rediseño dentro de su sistema de gestión de proyectos.
No tenga miedo de explicar todo, como cuándo y cuánto facturar a su cliente cuando se alcancen los hitos. Una vez que haya establecido todas las tareas y les haya dado fechas de vencimiento, comience a asignar tareas a las partes interesadas para que puedan ver lo que les espera.
No es una mala idea tener una llamada de inicio con su cliente y su equipo y hablar con ellos sobre el programa en tiempo real.
Paso 3: Investigar, planificar y organizar
Todo lo que se describe en «Cómo prepararse para el rediseño de un sitio web» se hará en esta etapa del trabajo.
Asegúrese de guardar todo en un lugar dedicado para tener un conjunto rápido de referencias que lo guiarán a usted, a su equipo y a su cliente a través del proyecto.
Paso 4: Haga una copia de seguridad del sitio web
Aunque realizará el trabajo de diseño y desarrollo en un servidor de ensayo o subdominio, aún debe realizar una copia de seguridad de su sitio web. Hay muchos complementos de WordPress que pueden ayudarlo con esta tarea.
Paso 5: Actualice la guía de estilo
Si el sitio web que se va a rediseñar aún no tiene una guía de estilo, ahora es el momento de crear una para él. Si hay uno, querrá revisar lo que hay allí y asegurarse de que los cambios estén documentados.
Nunca se sabe cuántas veces o con qué frecuencia actualizará este sitio web (o quién lo hará), por lo que siempre es una buena idea revisarlo y actualizarlo antes de hacer algo nuevo.
Paso 6: Estructura alámbrica de las páginas que se rediseñarán
A menos que solo realice cambios superficiales en la interfaz de usuario o en los elementos de la marca, es probable que cambie el diseño de sus páginas y el flujo de la estructura de su sitio.
Dedique un tiempo a crear wireframes para las páginas o partes de su sitio que se verán afectadas por el rediseño.
Si fue el diseñador original de este sitio web y tiene los wireframes originales, no tenga miedo de reutilizarlos. Le ahorrarán tiempo al tener que construirlos desde cero.
O, si lo prefiere, puede usar Elementor como su herramienta de estructura alámbrica.
Todo lo que tiene que hacer es hacer una copia de su sitio web actual en su servidor de ensayo. Luego, cree una nueva página o plantilla y comience a diseñar sus nuevas páginas o componentes.
Incluso puede usar las plantillas de bloques de Elementor para simplificar el proceso:
Si bien hay docenas de bloques completamente diseñados, hay muchas plantillas de bloques que funcionarían bien como marcadores de posición básicos.
Paso 7: Cree sus maquetas y / o prototipos
Lo bueno de hacer sus wireframes en Elementor es que puede omitir directamente la fase de maqueta y pasar directamente a la construcción de sus prototipos funcionales.
Si prefiere hacer sus maquetas con Photoshop o Sketch, también está bien. Puede utilizar esta guía para trasladar sin esfuerzo sus diseños a WordPress, donde los convertirá en prototipos.
Paso 8: QA el rediseño y obtener la aprobación del cliente
Una vez que se hayan creado los prototipos y se haya completado el rediseño y/o la reescritura, envíe el sitio web, el sitio web completo, a su persona de control de calidad.
Si lo va a manejar por su cuenta, también está bien. Simplemente, tome cierta distancia entre el trabajo de diseño y desarrollo del prototipo y la revisión de control de calidad.
Cuando este 100% satisfecho con lo que hay, pásalo a tu cliente y obtén sus comentarios al respecto.
Paso 9: Impulsar el nuevo diseño en vivo
Con la aprobación de su cliente en la mano y su lista de verificación previa al lanzamiento completo, puede mover su prototipo por etapas al sitio en vivo.
Paso 10: Supervise cuidadosamente el sitio durante el próximo mes
Querrá estar atento a Google Analytics, así como a sus pruebas de usabilidad (si aún tiene mapas de calor y grabaciones de sesiones) después del lanzamiento.
El objetivo del rediseño de este sitio web es ayudar a que su sitio web funcione mejor. Si sus datos no reflejan eso, es posible que desee revertir cualquier cambio que haya realizado o implementar una estrategia alternativa.
Una de las cosas buenas de usar WordPress para construir su sitio web es que guarda automáticamente las versiones anteriores de sus páginas.
Si su contenido está causando más problemas, simplemente vaya a “Revisiones de su página” y revísela. Si su diseño está causando el problema, puede restaurar la copia de seguridad anterior.
Por supuesto, si su rediseño de sitio web es exitoso, es hora de que le paguen por completar esta parte del trabajo de rediseño y comenzar con la siguiente.
Tal vez te interese leer: Among Us: ¿Qué es y cómo jugar?
Preguntas frecuentes sobre el rediseño del sitio web
Aquí hay algunas preguntas restantes que podría tener acerca de asumir un proyecto de rediseño de sitio web:
1. ¿El rediseño de sitio web afectará al SEO?
La respuesta corta es sí. Y puede ir de cualquier manera.
Si rediseña con éxito su sitio web y mejora la experiencia del usuario, el aumento en el tráfico, el compromiso y las conversiones le dará a su sitio web un impulso en la búsqueda.
Por otro lado, si comete algunos errores durante el rediseño y fracasa con los visitantes, la clasificación del sitio web podría caer en picado y ponerlo en una posición peor que antes.
Hay otra cosa a considerar cuando se trata de SEO.
Cuando realiza cambios masivos en el contenido y los metadatos de la página, puede afectar negativamente su clasificación. Pero eso no siempre es malo.
Por ejemplo, si está reorientando algunas de sus páginas en torno a mejores palabras clave, puede esperar que le lleve algo de tiempo volver a aumentar su visibilidad en la búsqueda.
Solo se convierte en un problema cuando cambia algo como la URL.
Si simplemente guarda la página rediseñada en la nueva URL, cualquiera que obtenga esa URL anterior (de búsqueda, de redes sociales o de otros sitios) terminará en una página de error 404.
Por lo tanto, si realiza grandes cambios en la estructura del sitio, debe recordar usar redireccionamientos 301 para mantener a los visitantes en las páginas en vivo y preservar el contenido de enlaces de la página original en la búsqueda.
2. ¿Cuánto cuesta el rediseño de un sitio web?
Los diseñadores web independientes cobran entre $ 500 y $ 5000 + por un nuevo sitio web. El precio es bastante sencillo, ya que sabe cuánto tiempo y recursos se necesitan para crear un determinado tipo de sitio web, así como el valor que obtendrá su cliente de él.
Sin embargo, fijar el precio del rediseño de un sitio web no es tan simple. Siendo realistas, podría costar desde $ 500 (para una actualización de marca simple) hasta más de $ 10,000 (para una revisión completa).
Realmente, depende del alcance del trabajo.
Aquí hay algunas cosas en las que pensar antes de presentar cualquier precio al cliente:
- ¿Su cliente le dará tiempo y la oportunidad de ejecutar pruebas de usabilidad y recopilar los datos necesarios para crear la estrategia adecuada?
- ¿Cuánto del sitio necesita ser rediseñado?
- ¿Qué tan complejos son los cambios?
- ¿Necesitará contratar a un especialista para que diseñe, codifique o escriba?
- ¿Vas a dedicar tiempo a cambiar alguna de las tecnologías?
- ¿Con qué rapidez se debe dar la vuelta al rediseño?
Si puede estimar el tiempo total que dedicará al proyecto, así como el costo de los recursos adicionales, su propuesta de proyecto y los costos serán mucho más precisos.
3. ¿Cuánto tiempo lleva un proyecto de rediseño de un sitio web?
Nuevamente, todo depende del alcance del trabajo. Además, si adopta un enfoque incremental para implementar cambios, eso también extenderá la duración del trabajo.
Pero supongamos que está trabajando en una ligera actualización de la interfaz de usuario. Si tiene en cuenta todo el tiempo que dedica a recopilar y analizar datos y establecer objetivos, probablemente le llevará entre uno o dos meses terminar todo.
Algo más grande o más complejo, por otro lado, puede durar meses y meses.
Y aunque es posible que su cliente no esté emocionado de escuchar eso, recuérdele por qué el sitio web debe ser rediseñado en primer lugar: no está funcionando tan bien como debería (si es que funciona).
Luego, explícales el valor de adoptar un enfoque metódico para el rediseño.
Al priorizar las partes del sitio que causan los problemas más importantes, comenzarán a ver el progreso antes de que el trabajo esté terminado.
Esto significa que no tendrán que gastar una gran suma de dinero en un proyecto de rediseño antes de esperar ver un retorno de su inversión. Pagarán por cada etapa del proyecto y, de forma lenta pero segura, verán que su sitio web comienza a generar más y más ingresos a lo largo del camino.
Rediseñe su sitio web con Elementor para darle nueva vida y obtener mejores resultados
El rediseño de un sitio web puede ser algo maravilloso si se usa de manera adecuada y se hace correctamente. Puede dar nueva vida a su sitio web, mejorar la experiencia del usuario, las conversiones y el SEO, y se asegurará de que esté al tanto de las últimas tendencias de diseño web y no se quede atrás de su competencia.
El proceso real implica mucha investigación antes y después del rediseño. Deberá asegurarse de rediseñar solo las cosas que tienen un impacto negativo en su sitio web y mantener las que tienen un efecto positivo en su sitio web. Además, una investigación adecuada es una forma segura de identificar sus puntos débiles y asegurarse de que el rediseño de su sitio web se realice correctamente y de acuerdo con las necesidades y expectativas de sus usuarios.
Ciertamente, dependiendo del alcance de su rediseño, es posible que tenga que pagar una suma considerable, pero no debería disuadirlo, ya que los resultados finales y los beneficios a largo plazo son mucho más difíciles.
