Cómo rediseñar su sitio de WordPress (y mantener su SEO)

Publicado: 2025-02-24

Los rediseños del sitio web pueden ser emocionantes y desafiantes para las empresas. No hay poca cantidad de gran esperanza para el rediseño, pero esta es una empresa monumental. Un rediseño puede resolver sus problemas existentes dándole la oportunidad de despojar un sitio y volver a construirlo.

Tómelo de alguien que haya hecho muchas reconstrucciones de WordPress , vale la pena, pero definitivamente requiere algo de trabajo.

Tabla de contenido
  • 1 ¿Por qué rediseñar su sitio web?
  • 2 pasos para rediseñar un sitio de WordPress
    • 2.1 1. Planifique sus necesidades de rediseño
    • 2.2 2. Cree un sitio de puesta en escena
    • 2.3 3. Preserve SEO y detalles técnicos
    • 2.4 4. Use Divi para su rediseño de WordPress
    • 2.5 5. Diseñe sus páginas y plantillas
    • 2.6 6. Optimice su sitio para su rendimiento
    • 2.7 7. Sigue una lista de verificación previa al lanzamiento
    • 2.8 8. Ve a vivir
  • 3 rediseño de WordPress bien hecho bien
    • 3.1 consigue que se vaya

¿Por qué rediseñar su sitio web?

Se necesita un rediseño cuando su sitio se siente atascado. Esto viene en muchas formas diferentes, pero aquí hay algunas que justifican un gran cambio:

Razones para rediseñar el sitio web: los cambios de la industria requieren una actualización del sitio web, ya que su sitio no está logrando los resultados deseados, los visitantes tienen problemas para convertir a los clientes, sus objetivos comerciales han cambiado y ha actualizado su marca o logotipo.

Si asintió con la cabeza, sí a cualquiera de estos, un rediseño podría ser lo mejor para usted.

Pasos para rediseñar un sitio de WordPress

Hay un proceso infalible para cualquier rediseño del sitio web. Pero, como era de esperar, recomendamos comenzar con un plan.

1. Planifique sus necesidades de rediseño

La configuración de objetivos es una parte importante del rediseño de un sitio web. Es un proyecto demasiado grande para flotar sin rumbo. Piensa en lo que de manera realista quieres lograr.

Por qué debe escribir los objetivos de su sitio web

Los objetivos comunes para un rediseño del sitio web a menudo incluyen cosas como:

  • Mejores puntajes de Web Web Vitals (los sitios más rápidos son mejores para todos)
  • Tasas de conversión mejoradas (ya sean envíos de formularios, compras de productos o cualquier otra acción clave en su sitio)
  • La participación mejorada del usuario, medida por cosas como el tiempo de permanencia y las tasas de rebote
  • Creación de un sistema de diseño escalable que simplifica la creación de contenido futuro
  • Agregar nueva funcionalidad para mejorar la experiencia del usuario (como revisiones de clientes, pago más rápido, una mejor manera de mostrar video o una navegación más fácil)

Algunos de estos objetivos, como sus puntajes centrales de vital web o tasas de conversión, son fácilmente medibles mediante el seguimiento de las métricas. Otros, como crear un mejor sistema de diseño, podrían tratarse más de lograr una cierta sensación o nivel de eficiencia. Lo importante es asegurarse de que sus objetivos estén bien definidos y escritos antes de comenzar.

Consejo de rediseño
El hecho de que esté rediseñando su sitio no significa que todo debe ir . Su contenido principal, como publicaciones de blog, descripciones de servicios, biblioteca de imágenes e información de productos, generalmente es valioso. Determine lo que puede mantener para tener una lista de tareas pendientes ligeramente más corta.

2. Cree un sitio de puesta en escena

Nunca trabaje en un sitio en vivo. Configure un sitio de preparación en su lugar. Use sus herramientas de alojamiento para clonar su sitio de WordPress. Si no hace esto, corre el riesgo de romper su sitio web mientras los visitantes aún intentan acceder a él. Además, un sitio de estadificación elimina la presión al mantener su sitio web actual. Tampoco recomiendo usar una página de construcción en un sitio en vivo a menos que el sitio original sea una red negativa. Solo espere hasta que el sitio rediseñado esté listo.

SiteGround ofrece una de las formas más fáciles de crear un sitio de puesta en escena desde su sitio web existente.

Sitio Sitebround Sitio de estadificación de un solo clic

Un sitio de puesta en escena es un clon de su sitio web que "vive" en una URL temporal. Está completamente separado de su sitio en vivo, por lo que no hay interferencia entre los dos.

En su sitio de puesta en escena, querrá desandearlo temporalmente para que Google no lo note hasta que lo presione como su sitio en vivo. Para hacer eso, vaya a "Configuración> Lectura ", luego marque la casilla que dice: " Desalentar los motores de búsqueda de indexar este sitio ". Confundirá en Google si deja que indexe su sitio de estadificación además de su sitio en vivo.

3. Preserve SEO y detalles técnicos

Un rediseño puede afectar su SEO. Los motores de búsqueda crean sus índices basados ​​en la estructura de su sitio existente. Cambiar demasiado hará que Google elimine las páginas de su índice y comience el proceso nuevamente. Es por eso que recomiendo realizar una auditoría completa de su sitio existente. Use la consola de búsqueda de Google para identificar páginas de alto rendimiento, errores de rastreo y clasificaciones de palabras clave. Exportar estos datos lo ayudará a establecer puntos de referencia para comparar su sitio rediseñado y evitar que cambie demasiado los fundamentos de su sitio web.

Asegúrese de hacer cada uno de estos para cada rediseño:

  1. Preserva las URL existentes. Realice un seguimiento de cada página y publique en su sitio web, incluidas las páginas construidas por CMS (piense en taxonomías y páginas de tiendas). Me gusta tener una hoja de cálculo de todos estos. Puede ver sus sitios sitios para el 95% de las páginas de su sitio.
  2. Configure 301 redireccionamientos para cualquier página con un cambio de URL (muy importante, algunos complementos lo harán automáticamente).
  3. Con respecto a los 301, mantenga intactos sus redirecciones anteriores. Es posible que también desee limpiar los 301 necesarios (los 404 no son malos, pero use un 301 si se mueve una página).
  4. Migra tus etiquetas de título y meta descripciones. Puedes cambiarlos, pero ciertamente no quieres perderlos si no lo haces.
  5. Mantenga cualquier esquema adicional utilizado en sus páginas (más de lo que se crea de forma predeterminada desde su complemento SEO). Es un dolor recrear el esquema cuando simplemente olvidó guardarlo (use la hoja de cálculo para esto también).
  6. Mantenga su estructura de encabezado intacta porque los motores de búsqueda la usan para el contexto. Se le permite realizar cambios de contenido, pero solo sepa que podrían afectar su SEO anterior.

Tareas de SEO para un rediseño de WordPress

El SEO es a menudo una ocurrencia tardía con rediseños. Si bien el SEO puede ser una de las últimas cosas para las que optimiza un nuevo sitio web (dentro de lo razonable), debería ser una de las primeras cosas en las que piensa en un rediseño . Si su sitio web existente obtiene el tráfico actual, no desea volver un paso (o varios).

Consejo de rediseño
También le recomiendo que no cambie los complementos de SEO a menos que tenga una razón clara para hacerlo. Si lo hace, muchos complementos tienen herramientas de migración para hacer la mayor parte de la configuración de SEO desde su complemento anterior al nuevo.

4. Use Divi para su rediseño de WordPress

Si bien cambiar un tema puede cambiar drásticamente un sitio web, la buena noticia es que todos sus medios y CPT se mantienen intactos. Sus imágenes y videos cargados tendrán la misma ruta de URL que con cualquier tipo de publicación personalizado que haya creado (aunque los bucles de consultas y los elementos en la página deberán ser reconstruidos, y su paginación podría cambiar). Esto debería darle más confianza con un rediseño porque no está comenzando desde cero.

Ahora, tiene cientos de opciones al elegir un tema para un rediseño de WordPress. Sin embargo, no hay nada mejor para diseñar realmente un sitio web que Divi. No he visto a un constructor de páginas para WordPress dar a los usuarios tantas opciones de diseño (ya sea o no un principiante o alguien muy competente en CSS).

Función del editor Divi 5

Divi es una máquina de diseño, y si realmente se está comprometiendo con un rediseño , le sugiero que no elija una herramienta que lo empuje a otro cuello de botella de diseño . En primer lugar, Divi es una herramienta de diseño. Eso significa que tiene todas las características y funciones que necesita para reconstruir su nuevo sitio web.

Si necesita un poco más de ayuda, Divi tiene sitios iniciales diseñados por nuestro equipo de diseñadores web profesionales. También podría usar nuestro constructor de sitios web de IA probado y verdadero para algo más personalizado. La mejor parte de ambas opciones es que cada diseño compatible con Divi, lo que significa que todo es editable dentro del editor de Divi.

Con un presupuesto ajustado? Divi se encuentra en realidad entre las herramientas de diseño web más asequibles del mercado. Obtiene una herramienta de diseño completa, almacenamiento en la nube, asistente de IA, soporte VIP (y más de lo que estoy dispuesto a meter en esta oración) por $ 7.42 al mes.

Obtenga Divi para su rediseño

Consejo de rediseño
Para aprovechar al máximo el Divi, aprenda sobre el uso de presets de módulos y los nuevos ajustes presets del grupo de opciones (en Divi 5). Estas son las formas de Divi de aplicar un sistema de diseño basado en clase que hace que el diseño sea más rápido y más consistente. Si está utilizando un diseñador, asegúrese de que conozcan estas características dentro de Divi.

5. Diseñe sus páginas y plantillas

Comience configurando sus colores y fuentes globales . Puede establecer su paleta de colores primaria y su parejas de fuentes directamente dentro de las opciones de tema Divi o el personalizador de temas de WordPress.

editar fuentes globales en divi

A continuación, comience a trabajar con el sistema preestablecido de Divi. Los presets crean estilos de diseño reutilizables para todos los elementos de su sitio web comunes. Piense en cosas como botones, encabezados, diferentes estilos de texto, campos de forma, etc. Los preajustes son cruciales para garantizar la consistencia del diseño en todo su sitio. Comienzo con una página con elementos que sé que usaré en todo el sitio, a otros como comenzar con su página de inicio para esto.

Luego, trabaje en sus plantillas de encabezado y pie de página utilizando el creador de temas de Divi. Cree plantillas globales de encabezado y pie de página que se aplicarán en todo su sitio web (o en secciones específicas, si es necesario). Además, cree cualquier plantilla de página dinámica necesaria. Las plantillas de página dinámicas se utilizan para el contenido que se aplica a una plantilla automáticamente (como las publicaciones de su blog, las páginas de archivo de categorías y las páginas de productos).

Builder de temas de Divi

Después de esto, me parece mejor terminar diseñando páginas estáticas básicas. Comience con sus páginas estáticas más críticas, como su página de inicio, la página sobre la página, la página de contacto, la página de servicios, etc. A medida que diseña estas páginas, aplique sus estilos y preajustes globales para mantener la consistencia visual. Concéntrese en crear diseños claros con llamadas efectivas en cada página.

6. Optimice su sitio para su rendimiento

No seré este punto, ya que puede leer en profundidad sobre la mejora de su puntaje de velocidad de página de Google y qué complementos debe usar para la optimización de velocidad. Pero aquí hay cosas que tendría en cualquiera de mis propios rediseños completos:

Divi

Divi 4 vs Divi 5 Page Speed

Una versión anterior de Divi 5 alfa que redujo el tiempo de carga de la página por un factor de cuatro

Ya hemos cubierto cómo Divi es un tema fantástico que no coloca límites a la libertad y control de diseño. Pero también se encuentra entre los temas de WordPress más rápidos y actuados en el mercado. Si está instalando Divi por primera vez durante este rediseño, le recomiendo que busque Divi 5, una versión completamente reconstruida de nuestro constructor de sitios web que es mucho, mucho más rápido y que ya tiene más características nuevas que la versión anterior de Divi . Si está rediseñando una tienda de WooCommerce, entonces la versión anterior es su mejor apuesta en este momento, pero en la mayoría de los otros casos, Divi 5 será lo que desea usar.

Obtenga Divi para su rediseño

Cloudflare CDN

Cloudflare - Página de inicio - enero de 2025

Cloudflare es una red de entrega de contenido (CDN) que almacena y sirve los activos estáticos de su sitio web en los servidores de todo el mundo, reduciendo los viajes de datos de distancia a sus usuarios (haciéndolo más rápido). A menudo he usado la versión gratuita para sitios web más pequeños. Sin embargo, la próxima herramienta es lo que usaría para un sitio web del que dependí para los ingresos de mi negocio.

Obtener CloudFlare

Nitropack

Optimización de velocidad de nitropack

Nitropack es una plataforma todo en uno para hacer sitios web muy, muy rápido. Ofrece sitios web de WordPress en caché inteligente, entrega de recursos optimizados a través de su propia CDN e impresionante optimización de imágenes. También maneja la carga perezosa y la conversión de imágenes en WebP. Con WordPress, a menudo estás uniendo una serie de complementos y herramientas de terceros, pero Nitropack es realmente una ventanilla única. Date un capricho con este increíble conjunto de herramientas integradas, me agradecerás más tarde.

Obtener nitropack

7. Sigue una lista de verificación previa al lanzamiento

Hay una lista de verificación previa al lanzamiento para que no se pierda algo accidentalmente. Hay literalmente cientos de cosas que puedes verificar, pero aquí hay seis categorías principales de cosas para verificar:

  • Revise todo el contenido : verifique si hay errores tipográficos, errores gramaticales y cualquier cosa que requiera un ojo cercano para atrapar (me gusta usar IA aquí para atrapar ciertas cosas).
  • Revisión de imágenes y medios : asegúrese de que todas las imágenes y videos se muestren correctamente y optimizan.
  • Pruebas móviles : pruebe cada página en dispositivos móviles y tabletas para garantizar que el diseño receptivo funcione como se esperaba. Vivimos bien en el siglo XXI, así que asegúrese de probar también exhibiciones ultra ultra.
  • Prueba de navegador cruzado : pruebe su sitio en diferentes navegadores (Chrome, Firefox, Safari, Edge) para garantizar la compatibilidad.
  • Realice un sitio de rastreo : si puede, use la versión gratuita de ScreamingFrog para rastrear su sitio y vea si es necesario abordar los errores obvios antes del lanzamiento.
  • Instalación de análisis : justo antes de un lanzamiento es un buen momento para configurar el análisis. Asegúrese de establecer eventos de conversión para que realmente pueda ver cómo está su sitio rediseñado.

Rediseñe la lista de verificación previa al lanzamiento del sitio de WordPress

8. Ve a vivir

¡Ha llegado el momento de la verdad! Una vez que haya probado rigurosamente su sitio web rediseñado en su entorno de puesta en escena y confíe en su estabilidad y rendimiento, es hora de ponerse en marcha. En este punto, ha creado algo que funciona bien, satisface a sus usuarios finales y cumplirá con sus objetivos comerciales.

Tres aspectos de un buen rediseño del sitio web

Si está utilizando SiteGround, puede hacer que su sitio de escenificación sea en vivo utilizando sus herramientas de sitio. Al igual que SiteGround creó su entorno de puesta en escena con un solo clic, intercambiará el sitio de puesta en escena al entorno en vivo.

Sitio de implementación de un solo clic de sitio

Solo toma unos momentos para que suceda. Me encanta cómo maneja el cambio de URL de puesta en escena en todo el sitio a su dominio personalizado. Esto solía ser un dolor, pero ahora es realmente sin esfuerzo.

Rediseño de WordPress bien hecho bien

A menudo escuchamos a los usuarios decir que deseaban haber cambiado a Divi con años de anticipación, especialmente aquellos que desean un mayor control de diseño que lo que ofrece un tema típico de WordPress. Divi hace que un rediseño de WordPress sea un placer. Su constructor de arrastre y saliva , configuraciones de diseño global y opciones de estilo avanzado le permiten rediseñar su sitio web para reflejar su marca y objetivos. No corte ninguna esquina y obtenga un tema de WordPress que terminará reemplazando en un par de años.

Prueba Divi

Una vez que tenga el tema correcto, concéntrese en agregar nuevas funciones a su sitio web, mantener (mantener (mejorar) su SEO y construir con velocidad y capacidad de respuesta desde el principio.

Consigue que se vaya

Los rediseños son mucho trabajo, pero la forma en que lo hacemos usando estas herramientas los hace mucho más fáciles. Recomendamos cualquiera de estas herramientas a continuación para el alojamiento, el diseño y la optimización de su sitio.

Recomendaciones Útil para
Cementerio Proveedor de alojamiento web con puesta en escena de un solo clic Obtener ahora
Tema Divi El mejor tema de WordPress para diseñadores Obtener ahora
Sitios rápidos Sitios de inicio preconstruidos y sitios web generados por IA Obtener ahora
Divi ai Asistente de diseño web con IA Obtener ahora
Nitropack Complemento y servicio total de optimización de rendimiento del sitio web Obtener ahora
Marco de la nube Seguridad, CDN y optimización del rendimiento Obtener ahora
Rango de matemáticas Complemento de SEO de WordPress líder Obtener ahora
Divi Dash Panel de control gratuito para monitorear todos sus sitios web desde un solo lugar Obtener ahora