En este artículo presentaré uno de mis últimos proyectos: una palabra Rediseño de prensa con Divi. ¿Qué es un rediseño? Este es el cambio radical de un sitio web para mejorar su diseño y funcionalidad.
Un rediseño es un pasaje muy delicado, es en mi opinión mucho más complejo que crear un sitio web porque debemos "hacer" con limitaciones que se nos imponen teniendo en cuenta el contenido ya existente...
Por no mencionar que la mayor parte del tiempo, te topaste con "bones" que no esperabas, ¡es como un iceberg de hecho!
Sugiero que vuelvas a un caso práctico para retransmitir un restaurante web.
Aquí está el programa:
- ¿Por qué un rediseño?
- ¿Cómo elegir tu nuevo tema?
- ¿Tenemos que preparar el terreno en el local?
- ¡Acción!
- Mejorar la experiencia y corregir errores
- Una palabra Rediseño de prensa con Divi: la evidencia detrás de ella
- En conclusión
¿Por qué un rediseño?
Un recast está lejos de ser un capricho porque el trabajo a hacer no es a menudo pastel, te dije un poco antes...
¿Entonces por qué considerar un rediseño?
La mayor parte del tiempo es porque el propietario del sitio tiene deseo de renovación o mejora para satisfacer mejor las necesidades de sus clientes/usuarios.
Como primer paso, tendrá que ver con el cliente o el usuario principal del sitio lo que no es adecuado para él con su sitio actual.
Necesitamos hacer una evaluación y enumerar los diversos puntos a mejorarNormalmente es fácil...
Lo que va a ser más complicado es lo que el usuario va a querer mantener en el estado, eso es unas cuantas veces más Rocks...
¿Por qué? Porque... Si cambiamos el tema, el diseño cambiará, tendremos que adaptarlo e incluso tener que hacer desarrollo a medida.
De todos modos, una vez que tengamos todas las cartas en mano, podremos elegir su nuevo tema o incluso decidir crear uno a medida.
En mi caso práctico, el tema utilizado fue BeTheme. Siento lo de aquellos que pasaron horas diseñando, pero Este tema es una verdadera plaga.
Sin embargo, es una de las 3 mejores ventas de ThemeForest (en el momento en que escribo este artículo), lo que significa nada...
De hecho, lo que realmente está mal con este tema es su página de construcción llamada "Muffin Builder"... Deben haber olvidado la levadura o los quemaron. magdalenas, porque dejan un sabor amargo a todos sus usuarios !
¡Ahora descubre el Constructor Divi!
¿Cómo elegir tu nuevo tema?
Para elegir su nuevo tema, se deben tener en cuenta los siguientes criterios:
- Mi cliente necesita un sitio multilingüe = verificar compatibilidad con WPML o Polylang.
- Mi cliente tendrá necesita una tienda = Confeccionar compatibilidad con WooCommerce
- Mi cliente mantener su propio sitio = No elegir una fábrica de gas / pensar también en actualizaciones de temas (En ThemeForest, es un poco más complicado para un novicio)
- Es el tema compatible con la última versión de WordPress ?
- ¿El tema es popular o viene de detrás de los maricas?
- ¿El tema está bien codificado, SEO-Friendly, fácil de modificar?
- ¿El tema está bien señalado?
Una vez que haya hecho su inventario, puede elegir su tema con calma.
Para mi caso práctico, ¿adivina qué tema elegí? DIVI ¡Por supuesto!
Era obvio que podía modificarlo fácilmente para que encajase en el diseño antiguo, que podría añadir una tienda y sobre todo que podría mejorar la experiencia de usuario (frontera y trasera)...
El cliente también podrá editar fácilmente las páginas de su sitio web gracias a su intuitivo constructor de páginas.
Preparando el terreno en el lugar, es obvio...
Para mi caso práctico, empecé creando el diversos diseños en uno WordPress sitio instalado en local.
Por supuesto, el sitio del restaurante no podía permanecer en mantenimiento durante el tiempo de diseño de cada página.
Así que he creado todo en paralelo y local. Esto me permitió comparar visuales y acercarme al diseño original.
Si usted hace su rediseño en vivo, sin pasar por el modo local, puede que no recuerde lo que su sitio parecía antes y no será capaz de hacer comparaciones...
Por lo tanto, este paso es esencial, no comience el rediseño de su sitio WordPress sin pruebas locales.
Para mi caso práctico dejé una WordPress en blanco pero podría (debería) también hacer una duplicación local, desde el sitio para ser recast ya que esto permite descubrir algunos conflictos con los plugins existentes, por ejemplo.
El ambiente es específico del sitio y nunca estamos a salvo de sorpresas.
¡Acción!
El día que tuve que hacer el rediseño, el sitio estaba bajo mantenimiento hasta una o dos horas.
Esto fue muy sencillo porque no tenía que migrar. Como Divi Builder permite importar y exportar diseños completos¡Fue una obra!
La buena sorpresa en mi caso es que la eliminación de BeTheme y su Muffin Builder capacitación total eliminación de todos mis contenidos.
Ha funcionado bien pero puede ser de doble filo: imagínate si tienes cientos de artículos que creaste a través de la página de construcción y que elimina tus textos e imágenes cuando lo deshabilitas, sería terrible!
Por eso No uso constructor de páginas para construir mis artículos, sólo uso para el diseñar mis páginas.
En otros casos, si utiliza páginas de construcción como Divi Builder o Composer visual, cuando usted decide hacer sin ella, estos plugins dejar estigmas en su contenidoentonces verás aparecen códigos cortos por todas partesEn su lugar, mire la siguiente captura de pantalla:
Aquí hay un caso donde el rediseño puede llegar a ser complejo...
Lee también: ¿Qué hacer con los códigos cortos después de desactivar el Divi Builder?
Mejorar la experiencia y corregir cualquier fallo.
Una vez sitio había pasado de BeTheme a DiviAproveché la oportunidad para limpiar un poco:
- Borré el plugin Shareaholic y lo reemplacé con Monarca que es mucho "limpiador".
- Me suprimí Formulario de contacto 7 porque Divi tiene un módulo de contacto nativo.
- Como optin, añadí Bloom, que creo que es un gran pluginEs limpio, fácil de establecer y bonito.
- Finalmente pude activar WP Rocket (caching) porque con BeThemeFue demasiado terrible...
- Aproveché la oportunidad para eliminar los widgets innecesarios al pie.
- Pude crear una tienda online usando WooCormerce. Este plugin encaja perfectamente en Divi: sin errores, sin preocupaciones visuales y me gusta esta presentación en pestañas "descripción del producto / reseñas de clientes". Sin embargo, algunos retoques en el color de los botones de la tienda.
- También añadí SecuPress Pro y suprimidas iThemes Security.
Moralidad: el sitio ha adquirido en rendimiento, gestión de Módulos Divi Builder es mucho más simple que con el Dinosaur BuilderLo siento. Muffin Builder. Sin mencionar que la representación del lado del visitante es mucho más armónica.
Una palabra Rediseño de prensa con Divi: algunas pruebas para apoyar...
Bueno, la bla-bla es buena, pero de hecho tienes curiosidad y quieres ver el resultado, ¿verdad? Es normal, por eso hice pruebas y videos antes y después... Mira esto.
= Pregunta de diseño...
Para empezar, hablemos de representación visual. Aquí hay dos videos, la luna es un vídeo sobre la página de inicio del sitio original, así que con el tema BeTheme. El otro fue tomado después del rediseño con el tema Divi…
Antes... con BeTheme:
Después... con Divi:
= Pregunta de rendimiento...
Por supuesto, uno. recast needs to make improvementsDe lo contrario sería una retransmisión fallida. La siguiente imagen demuestra que el sitio ha adquirido en el rendimiento.
Para ser leído absolutamente: ¿Cómo mejorar el rendimiento de sus sitios Divi?
Antes de rediseñar, con el BeTheme, hice una prueba de velocidad en el sitio de Google Page Speed. El resultado no fue bonito. 27/100 versión móvil y 34/100 versión de escritorio !
Después del simple cambio de tema, una nueva prueba en PageSpeed nos permite ver que ganamos ligeramente en el rendimiento: 35/100 móvil y 46/100 escritorio. Ya es mejor pero aún no superior...
Entonces el plugin WP Rocket fue simplemente activado, dos o tres opciones fueron verificadas y luego nueva prueba de rendimiento: 55/100 móvil y 64/100 escritorio. Es mucho mejor...
Todavía estamos lejos de los 100/100 pero la experiencia del usuario ya ha mejorado y el sitio ha casi duplicado en rendimiento/velocidad, la operación parece bastante concluyente.
Entonces usted tendrá que ajustar todo esto y eventualmente añadir un plugin como Imágenes para aclarar las imágenes del sitio y ganar algunos micro segundos más de carga de página.
En conclusión
Sabemos cuando comenzamos un rediseño, pero no podemos predecir realmente cuándo será completado, porque un sitio debe evolucionar constantemente...
Siempre hay cosas que hacer. mejoras, esto es esencial para que su sitio crezca al mismo tiempo que la evolución de su negocio.
En mi caso práctico, todavía no estoy satisfecho con el resultado, todavía hay trabajo, especialmente en la versión móvil/tablet... Pero esto es lo que es emocionante: siempre mejorar, siempre evolucionar!
¿Necesita más recursos en Divi? Visita Elegante Themes blog lleno de ideas y tutos!
Bonjour,
Suite à la lecture de votre newletter, j’ai fais une visite complète de votre nouveau blog et je confirme que c’est une bonne nouvelle d’avoir un blog en français qui traite du thème Divi.
J’hésite depuis longtemps à acheter ce thème pour plusieurs raisons :
– ses performances (rapidité, les titres souvent en h2 au lieu d’avoir un h1, la compatibilité mobil etc…)
– la construction de la page d’accueil
Après avoir lu vos articles, je suis de nouveau tenté par ce thème mais, je ne suis pas certaine de ne pas faire une erreur.
Actuellement, j’utilise un thème gratuit/premium (Sydney) que j’ai bidouillé à ma façon.
Ce thème donne de très bons résultats en l’état mais, ne me convient pas vraiment.
Je présente des recettes de cuisine avec une mise en page particulière (colonne bootstrap) et je ne voudrais pas perdre la mise en page de mes articles en changeant de thème.
J’aimerais présenter mes dernières recette en page d’accueil mais, est-ce possible avec Divi ?
Vous voyez que je me pose énormément de questions avant de franchir le pas. J’ai passé trop d’heures à peaufiner mon blog que je ne voudrais pas tout casser.
Cordialement
Bonjour Edith et bonne année ! Lorsque on change de thème, il y a de grandes chances d’avoir des surprises… souvent mauvaises… le mieux serait de tester la refonte en local. Il faudrait dupliquer votre blog actuel avec le plugin Duplicator et de le migrer en local sur MAMP par exemple. Cela pourrait faire l’objet d’un prochain article bien que vous pourriez trouver cela facilement sur le web. Ma question est : vos articles de recettes sont-ils fait avec un constructeur de page comme Elementor ou Visual Composer ? Si c’est le cas, vous devrez soit conserver ce constructeur sous Divi, soit tout refondre. Cela prendra du temps. Il faut évaluer le temps-risques-bénéfices. Pour les H2, cela fait longtemps que Elegant Thème a corrigé cela. Pour la performance, ça dépend de beaucoup de facteurs. Comme je l’ai expliqué dans cet article, je ne regrette pas d’avoir changé BeTheme pour Divi mais il y a encore des optimisations à faire… Pour conclure, je dirais que vous pouvez tester mais en local d’abord, histoire de ne pas être déçue… Bonne continuation !