Cómo rediseñar una página web
Rediseñar una página web no es nada fácil, al menos si el rediseño que tienes en mente es un cambio profundo, no un simple lavado de cara. Evidentemente instalar una nueva plantilla y hacer unos pocos ajustes se puede consideran un rediseño, pero no te hablo de eso.
Te hablo que redefinir la estrategia completa, meditar en lo que necesita tu proyecto y aplicar todos y cada uno de los cambios estéticos, técnicos y de contenidos que sean precisos para cubrir dichas necesidades.
Tienes que planificar todo muy bien, saber a quién quieres llegar, qué le quieres trasmitir y cómo lo vas a hacer.
En mi caso llevaba meses pensando en todos y cada cambio, cada ajuste, cada texto, el objetivo de cada página…
Si quieres saber cuál ha sido el proceso de rediseño de mi web sigue leyendo, te cuento con pelos y señales todo cuanto he hecho y el por qué de cada decisión.
Cómo nace el rediseño de la web
A mediados de diciembre fui a la capital española a conocer en persona a mi Secre y ya de paso planificar las líneas maestras del proyecto de cara a dos mil dieciseis. En aquella mañana definimos los nuevos servicios que íbamos a ofertar, optimamos los procesos desde el momento en que el cliente del servicio nos contacta hasta que le entregamos la web y procuramos las fórmulas para exprimir al máximo el potencial de la página web.
Previamente ya le había dado muchas vueltas al tema, mas se puede decir que ese día comenzó el proceso de rediseño de la web.
Porque hay una cosa que debes tener clara,
tu web debe valer para alcanzar unos objetivos, tener una web por tenerla es una pérdida de tiempo y dinero, así que si deseas que ésta sea efectiva lo primero que debes hacer es decidir qué es lo que deseas lograr.
¿Qué quería en mi caso? Dos cosas muy concretas:
Vender más servicios y producir más ingresos pasivos.
Y ahora es posible que digas: “Joder, como todo el mundo…” y tendrías razón, mas no todo el mundo está presto a hacer todo lo que sea necesario para lograr dichos objetivos.
Nosotros sí. Y digo pues esto ha sido un trabajo de equipo.
Primer paso. Definir y actualizar los servicios
Empezaré por el primer objetivo, vender más servicios.
Hacer un rediseño porque sí, simplemente porque te has aburrido de la apariencia de tu web no es inteligente. Te recomiendo que, si no estás seguro de si lo necesitas, te leas esta entrada en la que te explican cómo saber si.
En mi caso sabíamos que había una serie de necesidades que nos estaban demandando los clientes del servicio y que no estábamos cubriendo.
Lo más atractivo e importante: El servicio de SEO.
Como afirma la página de venta del serviciopero los clientes del servicio cuando contratan una web quieren que esta posicione bien, así que dicho y hecho, servicio de posicionamiento web en buscadores al canto.
Para dar este servicio cuento con la ayuda de un tio que sabe mucho más que del tema, el señor Luis Revuelto. Un crack, un buen amigo y una genial persona.
Bienvenido al equipo Luigi.
Diseña tu web a tu ritmo
También sabemos que hay bastante gente que no puede permitirse el contratar un desarrollo completo, así que pensamos una fórmula que le facilitara la vida al cliente, le garantizara un resultado de calidad y que no le vaciara el bolsillo.
te ayuda a comenzar con una base sólida, bien hecha y te permite proseguir avanzando con la personalización de tu web a tu ritmo, sin agobios y sin inconvenientes técnicos.
Mentoring for designers
Los visitantes de mi weblog tienen 2 perfiles muy marcados y muy diferentes. Por un lado están los emprendedores que desean hacer su web con Wordpress y por otro los diseñadores que vienen a leer sobre las herramientas que pueden utilizar en sus proyectos.
La verdad es que el weblog hace ya un tiempo que está orientado hacia los primeros, pero me llegan muchas dudas al correo de diseñadores que están empezando, o que no tienen tantos clientes como les gustaría, y que necesitan que alguien les guíe.
Les comprendo a la perfección por el hecho de que yo estaba como ellos no hace tanto. Y se pasa mal, vaya que sí…
De ahí que me haya animado a lanzar mi propioorientado a los diseñadores autónomo.
Los demás servicios
Aparte de esos nuevos servicios había que darle un lavado de cara a los dos que ya teníamos. El diseño de páginas completas con WP es mi fuente de ingresos número uno y la página de venta era lamentable, vergonzante, humillante…
Apenas cien palabras, una única referencia a mi cliente más importante e información absolutamente desfasada.
Totalmente inadmisible.
Y con el servicio de diseño gráfico 3 cuartos de lo mismo.
A la página de testimonios le he añadido los de ciertos nuevos clientes que no estaban en la precedente por último me faltaría por añadir un porfolio. El antiguo estaba desfasado, pero todavía no he sacado el tiempo para prepararlo.
Segundo paso. La relevancia de los textos
Una vez que sabíamos qué servicios queríamos ofertar y a qué público queríamos llegar con cada uno llegó el momento de darles forma.
Los contenidos son el alma de tu web, los que expresan quién eres, cómo eres, de lo que eres capaz.
Son más esenciales que el diseño. Tus contenidos
deben ser la prioridad y luego adaptar el diseñopara que se amolde a dichos contenidos, no al revés.
Unos textos aburridos, insulsos y genéricos no te van a ayudar en nada. Todo lo contrario, cuando escribes para rellenar se nota, aburres y pierdes clientes.
En mi caso tenía muuuuy claro que para la nueva versión de mi web tenía que contar con un copy profesional. Conozco a varios muy buenos,yentre otros, pero hace ya un tiempo que tengo predilección por un joven gaditano de sonrisa fácil y mente inquieta…
El señor Javi Pastor.
Le llamé, aceptó y el resultado ha superado todas mis esperanzas. Te prometo que en el momento en que me pasaba los textos y me ponía a leerlos se me saltaba la risa pensando… ¡Pero qué bueno es el cabrón!
Así que nada, muchísimas gracias Javi, has hecho un trabajo de temor.
Mucha gente todavía no es consciente de lo importante que es este tema para el éxito de su web. No quieren invertir en textos, pero si te lo puedes permitir valóralo, puede marcar la diferencia entre un resultado mediocre y convertir tu web en un imán para clientes.
Tercer paso. Agredir el segundo objetivo de la web
En este punto ya sabía qué servicios prestar para atraer más clientes del servicio y tenía en mi poder unos textos persuasivos para que estos no se me escapasen.
Tocaba trabajar y potenciar la
generación de ingresos pasivos.
Desde hace meses el weblog ya produce unos ingresos por marketing de afiliación bien interesantes. No es que pueda vivir de ellos, pero son un extra más que deseable.
¿Y cuál es el mejor canal para producir ese género de ingresos?
Sin duda alguna el correo electrónico, así que en este punto
mi prioridad era la captación de nuevos suscriptores.No es que no esté contento con el ritmo al que crece mi lista, todo lo opuesto, desde octubre se suscriben más de 300 personal al blog cada mes, lo que me semeja asombroso, pero la página web no estaba optimizada y por lo tanto estimaba que los resultados podían ser mejores aún.
Para hacer crecer mi lista he tomado 3 medidas.
Nuevo lead magnet
A principios de enero envié a mis subscriptores un nuevo recurso exclusivo. Un training en vídeo en el que explicaba “Cómo planificar una web para lograr un resultado profesional”.
Una hora y veintiséis minutos de vídeo que tardé en escribir, maquetar en PowerPoint, grabar y editar unos 3 días… casi palmo por el camino.
El tema de los vídeos está genial, mas dan un curro alucinante, a mí cuando menos.
El caso es que la temática del training estaba escogida a conciencia para atraer a subscritores que estén en las primeras fases del desarrollo de su web con un triple objetivo:
- Atraer a potenciales estudiantes de mi próximo curso.
- Atraer a usuarios que puedan estar interesados en las herramientas de las que hablo y de las que soy afiliado.
- Atraer a potenciales clientes del servicio que de entrada quieran hacer su página web, mas que quizá se vean superados y terminen recurriendo a un profesional.
Cuando hagas un lead magnet piensa muy bien en quién es tu cliente ideal, a quién quieres atraer y diseña un recurso que
le solvente un inconveniente o le enseñe a hacer algo paso a paso.Es la mejor manera de atraer su atención, de fidelizarlo y de rentabilizar su presencia en tu lista de correo en un largo plazo.
Nuevos formularios de suscripción
A día de hoy tengo:
- Un popup con exit intent, cuando el lector va a desamparar la web salta. Es como un intento a la desesperada de que esa visita no se vaya en balde.
- Formulario al final de las entradas.
- desarrollador blogs in que entra desde la derecha cuando haces scroll y llegas al ochenta por ciento de la página.
- Formulario en una landing en la que muestro los recursos que tengo para subscritores. Entonces te hablo de esta landing.
- Tres cajas con formularios que saltan cuando haces clic en el botón que hay en la cabecera de la home, en el botón del footer y en el vídeo de la landing. Esto del vídeo es un experimento que te cuento con más detalle en la una parte de la landing.
Todo esto con diferentes versiones de cada formulario que saltan aleatoriamente y que compiten entre sí para poder ver cuál marcha mejor.
Además tengo control sobre los suscriptores que me da cada formulario y el ratio de conversión, lo que hace sumamente sencillo el saber cuáles merece más la pena mantener, prosperar o bien suprimir.
El complemento que utilizo para hacer todo esto es.
La idea es no dejar todo cuanto hay ahora, solo me quedaré con los que mejor rendimiento me den. Tampoco es plan de agobiar al visitante, pero de momento deseo probar y optimarlo todo lo antes posible.
Nueva página de recursos para suscriptores
He rediseñado landing con recursos para subscritores y además he añadido una captura de mi training en vídeo.
A esta landing redirige la imagen de cabecera de la home, un apartado del menú y la utilizaré como página de aterrizaje si decido arrancar alguna campaña de Facebook Ads, cosa que no descarto en absoluto.
El tema de añadir la captura del vídeo y que al hacer click salte un popup se debe a un razonamiento: «si has llegado hasta aquí y has hecho clic sobre el vídeo es porque te resulta interesante lo que debo contarte ¿no? Pues entonces solo debes darme tu correo electrónico y podrás verlo cuantas veces quieras.»
El hecho de
que parezca que el vídeo se reproduce ahí mismo es un imán de clicks.Este es de largo el formulario que mejor transforma de toda la web en estos instantes. Ya veremos si con el tiempo sostiene su efectividad.
Ojo:Varios visitantes han vuelto a la landing de los recursos para reproducir el vídeo en el momento en que se habían subscrito, pero el vídeo prosigue sin reproducirse porque no es un vídeo, es una imagen. El tema es que he tenido que explicarles que deben acceder a otra url, introducir una contraseña, etcétera Lo que te quiero decir es que
este género de estrategias pueden causar confusión y algún que otro malentendido, así que cuidado con ellas. Si veo que este género de problemas se generalizan me tendré que cargar la atrapa del vídeo enlazada al formulario… con todo el dolor de mi corazón.
Dentro de un tiempo te contaré qué tal han funcionado estos tres cambios, pero de momento te puedo decir que el número de subscritores que se dan de alta al día ha aumentado un treinta por ciento más o menos desde el instante en que lancé la nueva web, si bien aún es muy pronto para sacar conclusiones y esto puede ser una consecuencia puntual por el rediseño de la página web.
Ya veremos.
Por fin llegan a mi weblog los Auto Responders
Desde que pasé de 2000 subscriptores enme toca pagar, mas a cambio tengo auto responders. Una herramienta muy potente para aportar valor, fidelizar y en última estancia rentabilizar a tus suscriptores.
Hasta este instante no los había aprovechado, mas ahora tengo una secuencia(que diría Javi Pastor) en la que redirijo a los nuevos subscriptores hacia los contenidos de mi weblog que más me resulta interesante que lean.
Esta estrategia te trae tráfico, ayuda a tu lector ideal y multiplica las posibilidades de que el día de mañana te adquiera por ejemplo… no sé… un curso 😉
Ya que captamos suscriptores habrá que exprimir las posibilidades del e-mail marketing al máximo ¿No?
Otra forma de generar ingresos pasivos sin emplear el email
En algunas de mis entradas los enlaces que llevan a ciertos temas, complementos o bien hostings son de afiliado. Esto quiere decir que si un usuario compra el producto en cuestión a través de mi link me llevo una comisión.
En este sentido has de saber que el hecho de
llevarme una comisión no influye en mi valoraciónsobre ellas. En mis entradas te hablo de sus ventajas y también inconvenientes sin tapujos, las he probado todas y cada una a fondo y si no las considerara las mejores no las utilizaría en mi web y en los desarrollos de mis clientes.
Dicho esto, es interesante crear unaen la que muestras todas y cada una estas herramientas y colocarla en tu menú principal, que esté bien perceptible. Así tendrás más posibilidades de que alguna visita las acabe comprando.
En mi experiencia este tipo de páginas no convierte ni de lejos tan bien como el email, mas algo dejan y muchos pocos acaban sumando un mucho.
Cuarto paso. Definiendo el nuevo estilo
Como puedes ver, lo que te he explicado hasta aquí es cuál ha sido el proceso de planificación y el por qué de cada decisión a nivel estratégico. Ahora veremos cómo he incorporado todo esto en la web, las herramientas que he usado y cómo he decidido el diseño de la página.
Siempre he tenido adwords murcia ía que la web fuera:
- Fácil de navegar.
- Clara, sencilla y minimalista.
- Sobria y elegante.
Esas cualidades las intento implementar en cada desarrollo que realizo y por tanto debían estar presentes en mi web.
A nivel de navegación he optado por incluir pocas páginas en el menú primordial y que sean solo aquellas que tienen un valor estratégico para mí.
Claridad, sencillez y minimalismo. Espacios blancos, sin distracciones, sin ruido, sin elementos disonantes.
Todo lo que no sirva para un propósito se elimina.Fuera los elementos ornamentales que no sean estrictamente necesarios.
La web tiene que convertir visitas en suscriptores o bien en potenciales clientes del servicio, todo cuanto no ayude en estos propósitos sobra.
Además de todo esto, quería añadir otro ingrediente, la continuidad. Hacer un rediseño no es como iniciar una web desde cero. Ya tienes visitas y lectores recurrentes que se sienten cómodos en tu weblog. No vale la pena hacer un cambio tan radical que tus lectores se sientan extraños.
De ahí que mantenga los colores anteriores y la tipografía del body.
Quinto paso. Seleccionar la plantilla
En mi caso lo tenía claro. Me iba a mudar a.
La razón es que es una plantilla que encaja realmente bien con mi filosofía de diseño, es minimalista, limpia, sobria, ligera, rápida y muy versátil.
Fácil de manejar para un usuario inexperto y muy potente para un desarrollador profesional.
La llevo tiempo usando en las páginas de mis clientes y a día de el día de hoy me siento mucho más cómodo con ella que con Genesis, el framework que usaba previamente.
Mucha gente me ha preguntado por qué dejo Genesis.
Bueno, no tengo nada en contra del framework de StudioPress, mas destacaría 3 razones principales:
- Mis clientes se veían limitados con Genesis, en el momento en que les entregaba la página web se veían fastidiados para hacer determinados cambios.
- Tardo menos en hacer una web con agencia de inbound marketing valencia con Genesis, me resulta más fácil y la calidad no se ve perjudicada.
- Genesis está hiper extendido, muchas veces por mucho que lo procures tu web se prosigue pareciendo demasiado a otras. Eso, o te toca meterle muuucho trabajo de personalización.
Además el resultado visual que consigo es igualmente bueno y a nivel de rendimiento ocurre algo similar… y eso que una de las grandes virtudes de Genesis ha sido siempre sus tiempos de carga.
Esto es lo que tardaba en cargar la web precedente con Genesis:
Esto es lo que tarda ahora con GeneratePress:
No está mal teniendo en cuenta que la página de inicio ahora pesa un treinta por ciento más, que tengo múltiples shortcodes de Thrive Leads (que antes no tenía) que le añaden 200ms y que es un tema de treinta dólares americanos ¿No te semeja?
Sexto. Los colores
Cuando tengo la plantilla instalada, la estructura general de la página web clara y los contenidos definidos me agrada empezar la fase de personalización por el color. Así empiezas a ver el carácter de la web y a intuir como puede ser el acabado final.
En este caso
quería que hubiese mucho blanco, sostener el amarillo que tenía ya antes (si bien he optado por un tono más suave) y me decanté por tonos terrosos como colores auxiliares y para acotar espacios.
Sinceramente creo que es una apuesta arriesgada, esta combinación puede transmitir elegancia y sobriedad, que es lo que procuraba, o bien se puede quedar un tanto insípida o aun triste, como me ha comentado algún lector.
Pero como afirma Mayra… Para gustos Pantones.
La distribución del color es evidente. Blanco para los fondos, cobrizos grisáceos para separar espacios y amarillo cuando hay que llamar la atención.
He tenido mucho cuidado con no pasarme con el amarillo,
si abusas de tu color llamativo este perderá toda su eficiencia.
Si quieres aprender más sobre el empleo del color en el diseño web te invito a que te leas esta.
Séptimo. Las tipografías
son uno de los elementos que más condicionan la personalidad de una web así como los colores.
Me apetecía una fuente rotunda para los encabezados y una elegante para el cuerpo, de ahí que la combinación escogida sea Montserrat y Raleway.
Montserrat sustituye a Roboto Slab y va con un grosor de setecientos, además le he metido una separación entre caracteres (letter-spacing) de -1.5px. La fuente en sí me agrada mucho, pero me parece que se “desparrama” demasiado, con esa disminución de la separación permanece más compacta.
Y Raleway ya la utilizaba antes, solo que a 16px de tamaño, al tiempo que ahora ha pasado a 18px. La razón para este cambio es que las resoluciones de los monitores cada vez son mayores y permiten usar tipografías más grandes. Además tenía claro que me iba a cargar la sidebar en las entradas del blog y que iba a acrecentar el ancho del contenedor de las misma por lo que era preciso acrecentar el tamaño de la fuente o bien las líneas se iban a hacer interminables.
En este sentido debo darle la razón a Berto cuando hizo el rediseño de, si bien al final reculó tenuemente por culpa de las presiones a las que le sometimos jejeje.
En cuanto a los links ahora no van en azul como antes, sino que tienen una fina línea amarrilla que los destaca, la idea la tomé del weblog de.
Octavo. Cómo personalizar las páginas interiores
Javi ha hecho un trabajo excelente con los textos, pero algunos son largos de narices y no quería destruírlos con una maquetación mediocre…
Darle formato a páginas con mucho contenido siempre es complicado, tienes que hacer variaciones en el diseño para separar los diferentes apartados con cuidado de no perder la coherencia.
Tocaba meterle mano ay darle a las páginas una apariencia a la altura de los textos.
Personalmente estoy satisfecho con el resultado, mas mi trabajo me llevó. Creo que fue en lo que más tardé de todo el rediseño.
Noveno. Novedades en el blog
En mi caso se lo debo todo al blog. Merced a él tengo muchos lectores que me visitan cada semana, consigo clientes del servicio y produzco ingresos pasivos que complementan mi actividad primordial.
Hay que cuidarlo como se merece, así que pensé mucho en cómo dejarlo lo más claro y agradable posible para que te sientas cómodo en él.
Fuera sidebar
Nada de ruido ni distracciones ¿recuerdas? Pues la barra lateral tenía muchas cosas innecesarias que solo causaban estruendos y ralentizaban la página.
El usuario llega a tu weblog para leer así que cuantas menos distracciones tenga más cómodo se sentirá.
Por eso mismo no me gustan los popup que brincan después de equis tiempo o bien los formularios que entran cuando terminamos de comenzar a leer. Todos esos elementos los utilizo cuando el visitante ya se marcha o bien cuando llega al final de la entrada.
Mientras el lector lee no se le molesta.
El único problema de esta eliminación es que me he cargado las etiquetas y la barra de búsqueda, con lo cual perjudico la usabilidad de la página web y le complico la vida al usuario que desea buscar o bien acceder a otros contenidos.
La solución que he adoptado es hacer un menú fijo (sticky-menu) que va bajando mientras haces scroll y que se sostiene en la parte superior todo el rato. Así puedes acceder a las demás páginas en cualquier instante e incluso hacer una búsqueda por términos concretos.
Por otro lado he apartado los botones vinculados a mis perfiles sociales al pie de página, que no molestan e inclusive quedan bonitos 🙂
Ancho completo
Los monitores full HD tienen 1920px de ancho, un portátil normalito unos 1500px ¿Por qué vamos a limitarnos a un ancho de 600 o 700px en nuestras entradas?
El nuevo ancho de mis publicaciones son 1100px. ¿Demasiado? Puede que para algunos sí, por lo menos de momento, mas en el mundo anglosajón ya se prosigue esta tendencia y aquí en España poco a poco lo vamos a ir viendo cada vez más.
Como te comentaba ya antes el tamaño de la tipografía también se ha aumentado en dos puntos para “acortar” las líneas y facilitar la lectura.
Por ahora parece que a los lectores les agrada, así que por el momento creo que el cambio ha sido positivo.
Décimo. La página de Inicio
La home page de tu página web debe ser un buen escaparate de lo que haces. En ella debes condensar la esencia de tu página para que el visitante tenga claro
lo que puede localizar en tu lugar en menos de diez segundos.
Hay estudios que afirman que tienes un máximo de tres segundos para ocasionar una buena primera impresión, si tu visitante ve que tu diseño es poco profesional o que está trasnochado se marchará ya antes de los cinco segundos.
Si tu diseño es adecuado tienes otros cinco ó 7 segundos a fin de que escanee de arriba a abajo el resto de la home y decida si se queda en tu sitio.
Con esta máxima presente y sin perder de vista los dos objetivos que persigo para mi nueva web decidí lo que aparecería en la home y lo que no.
Lo que busco en primer lugar
Captar suscriptores. Así que la cabecera va dedicada en exclusiva a este propósito. Tonos oscuros de fondo, texto sucinto y de tamaño espléndido en blanco y un único botón en amarillo.
Todo optimado para convertir, y de momento marcha.
Que la cabecera podía ser más vistosa… sí. Que puede quedar un poco oscura… también. Mas como las conversiones sean buenas me doy por satisfecho.
No obstante
esta una parte de la página web no estará así siempre y en todo momento.Quiero probar, experimentar y optimar ese campo de la web todo lo que pueda, así que a lo mejor dentro de un mes pruebo con un formulario completo en lugar de con un botón, cambio las imágenes de los lead magnet, pruebo con otro color de fondo, etc.
El segundo objetivo
Vender servicios. La segunda sección de la página web va dedicada al segundo objetivo, vender mis servicios más esenciales.
No me gustan las páginas que ponen en la home los 200.000 servicios que ofrecen, de hecho tampoco me gustan las páginas de empresa (o bien freelance) que se venden como especialistas en 30 cosas.
Si eres diseñador gráfico no puedes ser especialista en posicionamiento web, WordPress, Marketing on-line, Gestión de redes sociales, Prestashop, campañas de SEM, Facebook Ads, etc. Etc. Etc.
Que puedes (y debes) saber un poco de todo eso… como es natural, pero no puedes dominarlo todo y cuando veo que me intentan vender la moto desconfío.
Así que en mi web las cosas claras,, esa es mi especialidad, si bien con una base sólida en diseño gráfico.
De ahí que en primera plana vayan mis 2 servicios de diseño web primordiales.
El tercer escogido es el posicionamiento en buscadores pues tengo una confianza ciega en mi colaboración con Luis y creo que puede ser un servicio muy demandado.
Los demás servicios pasan a un segundo plano.
Si tengo 10 segundos para captar la atención del usuario deseo aprovecharlos para mostrarle las cosas que más me interesan.
Tercer objetivo, producir confianza
Considero fundamental dar la cara en tu página web ypor todos y cada uno de los medios posibles.
La tercera sección de la página web va dedicada a una breve introducciónpara que el visitante sepa desde el principio quién está detrás de todo esto y además enlazo a los testimonios de mis clientes del servicio para.
La fotografía de fondo es tema aparte, ya ha habido cachondeito con el tema, mas ahí se quedará 🙂
Cuarta sección, el blog
Mi primera web no mostraba el blog en la home, era una página más bien corporativa. Cuando el weblog empezó a levantar el vuelo vi la necesidad de ponerlo en portada, después de todo era lo que estaba atrayendo a las visitas y así ha estado hasta este rediseño.
La portada tipo weblog está excelente si no vendes servicios,pero si quieres dar a conocer tus productos me da la sensación de que no aprovechar la página de inicio para este propósito es un lujo que no te deberías permitir.
No obstante, ni se me ha planteado que el weblog no tuviese presencia en la home, primero pues es mi activo más valioso y segundo pues los títulos de las entradas y el extracto que se muestra aportan contenido a la página y te ayudan a posicionar las palabras clave relacionadas con tu ámbito.
Por cierto, las entradas de esta página se muestran mediante el complemento, que te permite mostrar entradas, páginas, productos, etcétera de mil formas, con mil estilos y mil opciones. Además es rápido, funcional, responsive y además está chulo. Las galerías de entradas se cargan con un, así que puedes publicarlas en casi cualquier una parte de tu web.
Cómo he maquetado las secciones de la home
La primera parte, la cabecera, está hecha con el addon “Page header” de. La maquetación la he hecho en html y le he asignado estilos personalizados mediante CSS a través de su, con lo que los cambios estéticos no se perderán con las actualizaciones del tema.
El resto de apartados están creados con el addon “Sections”, que te deja crear bandas que ocupan el 100 por ciento del ancho de tu monitor y añadir imágenes de fondo, colores, contenido a través de el editor de WP, html, shortcodes, etc.
Vamos, que son muy versátiles. El único problema es que no son compatibles con Thrive Content Builder y por lo tanto maquetar estas secciones requiere más trabajo.
En estate doy una solución para salir del paso, mas te aviso de que no es una solución óptima, ni muchísimo menos.
En este caos he optado por añadir los contenidos con el editor de WordPress y ayudarme del pluginpara crear las columnas y asegurarme de que se comportaban bien al mostrarse en dispositivos móviles.
Los botones los he creado directamente en CSS.
Y la última sección, la del blog, solo contiene el shortcode que carga la galería de entradas.
Cómo hacer todo esto sin que la página web esté cerrada
Como puedes ver el rediseño ha sido un trabajo costoso. Solo en la ejecución de mi parte (maquetación, preparación de las imágenes, creación de formularios, creación de los Auto Responders, el nuevo lead magnet, las nuevas páginas, etcétera) me he tirado unos diez días dándole caña día y alguna noche.
Cuando tienes una web que ya funciona y recibe cierta cantidad de tráfico no puedes tenerla cerrada diez días, así que la solución pasa por hacer un ambiente de desarrollo, trabajar reposadamente en él y sustituir la página web antigua por la nueva cuando todo esté en orden.
Para estos temas siempre confío en Paul Benítez, un crack de la seguridad, las migraciones, servidores, hostings, optimizaciones y demás cuestiones que a mí me vienen grandes.
Su implicación supuso que la web no estuviera fuera de servicio en ningún instante, solo se pudo ver un cartel de «en construcción» a lo largo de dos horas por decisión mía para poder comprobar ciertas cosas y también incorporar algún cambio de última hora. Mas el cambio dela antigua versión a la nueva podría haber sido inmediato.
Lo dicho, un crack.
Lo que falta por hacer
La verdad es que una web nunca está terminada, siempre hay cosas que se pueden mejorar y cambios por hacer. En mi caso quiero repasar las entradas antiguas, actualizarlas, ampliar su contenido y crear una mejor estructura de links internos.
Todo esto con la intención de progresar el posicionamiento web y la experiencia de usuario, mas esto ya te lo contaré en otra entrada que ya hemos pasado las 5000 palabras y tienes que estar bostezando.
Gracias a todos los que me habéis ayudado
Mi nuevo lead magnet nació a raíz de hacer una encuesta a
mis suscriptoresy examinar sus necesidades. Me respondieron más de trescientos personas y desde aquí les quiero dar las gracias a cada uno de ellos de ellos por el hecho de que su participación me ayudó a acotar mejor mi estrategia para la web… y algunos detalles de mi primer curso.
También quiero darlas merced a todos
los que alguna vez han comentado en el blogy singularmente a los que me han dado su opinión franca sobre el rediseño. He hecho algún que otro cambio gracias a sus sugerencias.
A
Alvaro Fontelade, mi alojamiento web de confianza, que me ha ayudado a dejar los tiempos de carga de la página web en poco más de medio segundo.
A los
bloggersde los que he aprendido tanto en estos años, los nombraría a todos pero son demasiados y ellos saben de forma perfecta quiénes son.
Y por último, evidentemente a los cuatro amigos que han participado de forma activa en el rediseño:
con unos textos increíbles que ya están atrayendo a más clientes del servicio. Este tio te cobra X y su trabajo te devuelve 5X.
que me ha facilitado las cosas muchísimo y me ha ahorrado una brutalidad de tiempo y cefaleas. Un aliado de los buenos para los diseñadores que vamos un poco justos de conocimientos técnicos.
, nuevo miembro del equipo que me lleva ayudando desde el instante en que empecé con el blog. Siempre digo lo mismo, gran Seo, buen amigo y mejor persona. Tengo muchas esperanzas puestas en nuestra colaboración.- , la Secre, pues lleva conmigo un año entero, hemos pasado de todo y su aportación ha hecho crecer este proyecto en todos los sentidos. Ha sido parte indispensable en la planificación de los nuevos servicios. Es mucho más que una secretaria externa y además su trabajo lo hace siempre #conunasonrisa.
Y a ti, faltaría más, que me estás leyendo y haces posible que este proyecto siga creciendo.
Gracias a todos, de todo corazón.
