525 | Anatomía de una web WordPress que convierte

En el episodio 525 de WordPress Semanal, te cuento que tiene una web que convierte y que le falta la mayoría. No voy a hablar de plugins ni diseño, voy a hablar de cómo decir las cosas claras y quitar lo que sobra. Vamos allá. Hola, hola, soy Gonzalo Navarro y bienvenidos al episodio 525 de WordPress Semanal, el podcast en el que aprendes a crear y gestionar tus propias webs con WordPress en profundidad. Hoy vamos a ver cómo crear webs que conviertan, que en esencia es cómo prepararlas para que cuando empecemos a tener tráfico, logremos nuestros objetivos. Hoy vamos a ver qué está pasando en Gonzalo Navarro. Es esta semana porque tenemos varias novedades. La primera es el nuevo video de la zona código y en el te enseñó a establecer un mínimo de compra por producto en WooCommerce. Es un snippet de código, un trocito de código que sólo tienes que copiar y pegar tal y como te muestro en el video y te va a permitir que en la parte de edición de un producto en WooCommerce, tú puedes decir vale, este producto sólo se puede comprar a partir de que la gente añada 5 unidades al carrito. Y así va a ser, si lo intenta con menos unidades no va a poder, se le vamos a dar un mensaje, necesitas 5 unidades para este producto. En los demás todo va a funcionar normal, que el lugar de 5 quieres que sea 3 para ese producto, pues lo redita, molificas esa parte y listo. Esto se puede hacer con plugins, pero como ves también por código y es muy sencillito. Hay un montón de videos relacionados con WooCommerce, así que si te interesa esto, echa a la un vistazo en la zona código, filtra por WooCommerce y puedes ver todos los videos, tienes un buscador también. Además tuve dejar dos talleres muy relevantes para este episodio, uno es el taller de cómo crear la landing page perfecta. Aquí vemos ejemplos de webs como las de Apple, como las de Tesla y aprovechamos esa información para plantear el diseño o la creación de tus páginas de venta o tus páginas de oferta de algo. También te voy a dejar el taller de Copywriting que está basado en el libro uno de los libros de Isra Bravo, con el que no concuerdo en todas las partes simplemente por estilo, pero que nos arroja un montón de aprendizajes chulos, así que te recomiendo también ese taller y una parte importante, como veremos ahora en la conversión, es la velocidad, así que te voy a dejar el curso de cómo mejorar la velocidad de tus páginas webs con WordPress. Todo esto ya sabes en las notas del episodio, en la parte de contenidos recomendados es decir abajo del todo. Si en tu app de podcast no se ven bien los enlaces, no te preocupes porque puedes ir a Gonzalo Navarro.s/525 y ahí verás todo perfecto. Si, ven a una vez vistas las novedades, vámonos ahora con el plugin de la semana que se llama Page Optimize. Esto es un plugin desarrollado por Automatic, es decir, la empresa que más peso tiene en WordPress son los que tienen WordPress.com, detrás está el cofundador de WordPress y la persona más influyente. Pero bueno, ¿qué haces de plugin? Pues este plugin agrupa los archivos ccse y llavascript de tu web para que carguen más rápido. Está pensado para que lo actives y funcione, es como no se si conoces Autoptimize, pero con menos opciones, es como más el liviano y demás. Ten en cuenta que estas características sobre todo la de agrupar o con con catenar porque en ingleses con catenate. El llavascript es la que te puede dar problemas. Problemas me refiero que te vayas a la parte frontal de la web y veas cosas rotas. En ese caso, la mejor si tienes que ajustar algo, pero normalmente la parte del cc se se note va a dar problemas y la llavascript depende. Y luego hay una parte que también puedes controlar el tiempo con el que se cargan los scripts que no son necesarios. Digamos o que no son relevantes para la carga de la página, entonces se cargan como al final. Esto es este plugin para los que queréis tener todas las partes de la optimización del rendimiento muy separadas. Porque si tu coges y instalas un plugin de estos que vemos por ejemplo en el curso de velocidad o en otros cursos como el de Wordpress Rocket y demás o el plugin de optimización de Sideground, pues estos ya traen estas opciones. ¿Qué pasa? ¿Qué hay gente que quiere como control de granular? Y por una parte, esta parte de agrupar los archivos de cc yavascript por otra, pues optimizar las imágenes, por otra esto, por otra. Entonces es solo para ese tipo de usuario que queréis controlando cosas pequeñitas de forma separada. Si denomo se llama Page Optimize está activo en más de 200 mil WebSconverpress y lo tenéis en las notas del episodio. Venga, pues ahora sí vamos con el tema central, ¿cómo crear WebSportpress que convierten? Lo primero que es esto de la conversión, que quiere decir convertir, pues es simplemente que el visitante haga lo que tú necesitas, que describa, que compre, que se apunta algo que reserbe, cada web va a tener su conversión, incluso. Cada página de tu web puede tenerla y si no la tienes definida, pues es difícil que mejoremos, por eso empiezo por aquí, por definir bien que es esto de la conversión. Entonces de forma muy llana, cuando tú quieras tocar, editar, crear una página de tu web, primero preguntate, ¿qué quiero que haga la persona que llega? Y casi siempre lo más recomendable es una sola cosa, y veces que no será posible, pero intenta que sea una sola cosa. Bien, una vez visto esto, obteniendo ya esto claro, vámonos al punto dos, y es que tu prioridad debe ser los mensajes claro. Al final lo más importante de una web no es el diseño, va a ser el mensaje. Y lo ideal es que cuando alguien llegue a una página entienda tres cosas en los primeros segundos. ¿Qué ofreces? ¿Cómo le ayudas? ¿Y qué tiene que hacer? ¿Cuál es el siguiente paso para esa persona? Por ejemplo, muy obvio, si tu titular dice "Bien, venido a mi web", o soluciones integrales para tu negocio, pues esto no va a funcionar, el visitante no sabe qué haces. Así que un marco que te puedes plantear para cualquier mensaje, o lo puedes adaptar como quieras, pero una buena estructura base puede ser. Ayudamos a este cliente, ahí ponés tu el cliente que el tipo de cliente que sea, a resolver este problema, ahí ponés tu el programa que sea, para que pueda este resultado. Y ahí ponés el resultado que obtiene. Entonces, estás respondiendo en ese primer detitular, encabezado o mensaje, a eso que te decía yo de qué ofreces, como le vas a ayudar y que tiene que hacer después. O que lograría después, básicamente. Un ejemplo de este marco de trabajo, esto te lo dejo todos critos en las notas del episodio, para que puedes ir copiarlo, pegarlo y tenerlo siempre ahí como referencia. Pero un ejemplo puede ser diseño webs para fisioterapéutas, que quieren llenar su agenda sin depender deportales de terceros. E incluso si tú ya sabes el nombre de esos portales de terceros, que a los fisioterapéutas sabrán seguro, yo que se me llena que vez a Doctor Alla, que no sé si esos para fisioterapéutas también, pero es la típica página donde uno consulta. Pues ¿qué tal es un doctor, incluso puede reservar una cita con él? Pues lo ponés diseño webs para fisioterapéutas que quieren llenar su agenda sin depender de Doctor Alla. Ahí estás diciendo, ¿a quién va? ¿Qué problema resuelves y qué resultado estás ofreciendo? Compáralo con uno muy típico, imagínate que el lugar de eso hubiese puesto desarrollo web profesional y a medida. Aquí no está muy claro aquí en va, tampoco está muy claro que se resuelve, no se sabe. ¿Qué es lo que desarrolla? ¿Como qué tipo de webs desarrolla es mejor dicho? ¿Para qué tipo de clientes? Si es mucho más ambigo, entonces es más difícil que llegue. Y esta claridad la puedes aplicar a todo, el titular de la home, los encabezados de tus páginas de servicios, tus formularios. Si, sobre todo cuando no te conocen, porque ya si te ha comprado antes, si te escuchan, si siguen o no lo que sea, es distinto, pero sobre todo cuando no te conocen, tu prioridad debe ser la claridad. Si te quieres quedar con algo de este episodio, que sea esto. Venga, vamos con el tercer punto. Y es que cada página, incluida la home, tiene un solo trabajo. ¿Cuál es ese trabajo? Llevar al visitante al siguiente paso. ¿Qué puedes hacer la estructura de una buena lándina? Es decir, de una buena página que tengo una objetivo es un titular que diga qué haces y para quien, un parafito corto que refuerce el beneficio o el resultado, un botón visible sin hacer scroll, para poder ser, no siempre vas al posible, pues pide presupuesto, empieza gratis, reserva tu cita. Y ahí puedes añadir también una prueba social, que esté ahí cerca del principio, pues es un testimonio que es lo típico, pero también sirve, pues algún logo de cliente muy reconocible, un dato concreto. Por ejemplo, yo tengo puesto, no recuerdo exactamente el dato, pero el 95% renueva, en mi embre sía, como como prueba social. Es decir, no tiene que ser, puede ser un dato tuyo interno, una métrica que ayude, que refuerce lo que tú estás haciendo. Y sobre todo, cosas que sobran, ahí en esa parte inicial de lo que el visitante ve nada más llegar a esa página, pues sobran sliders, que nadie le va a dar a siguiente. La historia de la empresa desde 1900, no sé cuánto, distintos botones, no, aquí vas a no sé dónde, aquí vas a mi blog, aquí vas a etal, esos sueles sobran. Me les siempre habrá algún caso que tenga sentido que haya distintas llamadas a la acción, pero normalmente tú intenta que sea una por página. Luego tienes el menú de navegación para llevar a la gente a las siguientes zonas de tu web. Y eso me lleva al punto número cuatro, y es que tengas una navegación web simplificada. Si tu menú tiene 12 opciones, pues el visitante tiene que pensar mucho, y cuando piensa, muchas veces no hace nada. No es que seamos tontos, pero tenemos muchos impactos, muchas web salas que ir, muchas redes sociales. Entonces, si necesitas varios elementos, pues piensa mejor entre 5 y 7, que es, digamos, los estupos los estudios dicen que estos son el número de elementos, no? No es que yo haya probado esto ni nada. Y los demás, los que sean menos importantes, llevátelos al fúter o otra área que tú tengas, donde puedas poner menus de navegación. Y luego, al contrario de lo que muchos piensen, la gente está acostumbrada a palabras muy reconocibles. Por ejemplo, servicios en el menú de navegación va a funcionar mejor que lo que hacemos. Contacto va a funcionar mejor que hablemos. Yo aquí en el menú no sería muy creativo, porque la gente está acostumbrada. Sabe perfectamente lo que es contacto, sabe perfectamente lo que es servicios, sabe perfectamente lo que es precios, si te fijas las grandes empresas, lo hacen así. Y de hecho, muchas veces, cuando tú vas a ver un servicio, lo primero que te vas a ser menú a buscar precios. En la navegación, sé claro, además no tienes mucho espacio. Y aquí, pues, sé un poco inteligente si tu conversión, tu objetivo de conversión es que te contacten, pues pongo un botón de contacto en el menú que esté visible, incluso que esté visible en todas las páginas. Aquí como truco, para no llenar mucho la tu navegación, puedes usar menús condicionales. Hay un montón de plugins que te permiten hacer esto como if, men, in, y otros. Incluso, puedes hacer por código, la zona código tengo un vídeo donde lo explico, y puedes hacer tener menús distintos o elementos del menú de navegación distintos en función de páginas o por el tipo de usuario. si ha iniciado sesión, que vea unos elementos de menú y si no ha iniciado sesión, que vea otros, después con todo esto de la navegación simplificada hay excepciones, por ejemplo, las grandes tiendas o tiendas que venden muchos tipos de productos muy categorizados suelen usar mega menús, por qué? Porque la gente sí está acostumbrada a usar estos menús enormes, por ejemplo Amazon, tiendas de ropa, ahí sí la gente está acostumbrada a navegar así, pues me voy a modar mujer, me voy accesorios, me voy a tal, ¿no? Entonces con esto quiero decirte que tienes que ver un poco, no tanto lo que hace en otras web, sino lo que hace el usuario a lo que está acostumbrado el usuario en el tipo de web que tú quieres crear. Punto número 5, crea páginas de servicio que resuelvan dudas. La mayoría, yo he incluido, al final tengo que hacer un ejercicio consciente para que no me pase, describimos lo que ofrecemos y la gente se queda ahí, una descripción de lo que haces, pero el visitante va a tener preguntas y no se lo hagas, no se lo vamos a estar casi nunca en escribirte para hacerte las, pues cuánto cuesta de verdad, cuánto tarda, qué pasa si no me gusta, por qué elegirte a ti y no a otro, y cada dudas sin responder, pues puede ser una venta perdida lógicamente. Entonces, si no hablas del precio, la gente pueda sumir que es caro, si no muestras casos, pues pueden asumir que no tienes experiencia, así que mis recomendaciones que con lenguaje ya no, con lenguajes sencillo, hagas este ejercicio. Primero, explica tu servicio, me refiero un ejercicio que hagas tú, con abreté un doc o escribelo y explica tu servicio, como tú lo explicarías. Y ahora, imagínate que alguien te dice, ¿qué quieres decir o qué te refieras exactamente y responde a esa pregunta? Normalmente, después de eso sí que vas a tener la explicación que deberías escribir en tu web, ¿vale? Y luego ya cuando vaya a re-actar esa página, que para esto te recomiendo el taller que te he comentado antes de cómo crear la landing perfecta, pero lo que puedes hacerte es presentar el problema, ¿no? Estamos hablando de una página de servicios, ¿eh? Presentas el problema que tiene la gente, le dice cuál es tu solución para esa problema. Después de explicas qué procesos seguirías, después le pones el precio que le va a costar, si no tienes un precio exacto por un rango o el precio mínimo del que partiría, después puedes añadir prueba social, testimonios o no hace falta que sean testimonios, puede ser otro tipo de prueba social y luego la llamada la acción clarísima. Esto puede ser una estructura, puedes variar, el orden, algunos elementos, pero buscando tener siempre un marco de trabajo claro, puedes partir de esto. Problema, tu solución, el proceso que tenéis que seguir, lo que le va a costar, demuestra de alguna forma cómo has ayudado a otros con eso, es decir, la prueba social y por último aquí tienes que ir sin necesitas esto. Un botón, la llamada acción, un enlace lo que sea. Sí, vamos a el siguiente punto, te quiero hablar ahora de los formularios, formularios son importantísimos, porque suelen ser la principal forma de contacto, salvo que también tenga soluciones como poner tu número de teléfono o un botón para WhatsApp o lo que sea, pero aún así los formularios la gente sigue buscando yendo a los formularios, al menos yo lo hago. Entonces, a ver aquí, normalmente se añades más campos, me refiero a la propia acción del formulario, cuanto más campos añadas normalmente va a ser reducir las respuestas. De hecho, cuando alguien quiere asegurarse de que solo le contacte gente muy cualificada, lo que suele hacer es poner los formularios más difíciles, entonces dependiendo de lo que busques juega con esto. Si tu objetivo es que te contacten más, o imagínate que quieres que se apunten a tu newsletter, porque ya sabes que una conversión es simplemente que hagan lo que tú quieras, entonces puede ser cualquier objetivo, entonces dependiendo, vas a optar por una cosa u otra, pero en general, o si hablamos de un formulario de contacto, pues con que pongas nombre e-mail suele bastar. Sí, por ejemplo pides también el telefono, tiles para que lo quieres. Pues podrías poner por ejemplo, deja tu telefono y te escribimos por whatsapp o algo así. Si esta es el primer mensaje sobre los formularios. Lo segundo, hay tres aspectos. Diría yo que importan tanto como el número de campos que pone. Primero, ¿dónde vas a poner tu formulario? Si solo pone su formulario en la página de contacto, muchos no van a llegar ahí. Entonces, por lo también, al final de que a la página de servicio, si tienes sentido, ¿eh? Otra cosa que es importante. ¿Qué dices en ese formulario? Pues por ejemplo, poner solo contacto, va a convertir menos que cuéntame tu proyecto y te respondo 24 horas. Fíjate la diferencia entre cuando te hablaba de poner contacto en el menú de navegación, que la gente está acostumbrada y sabe que va a ir a la página de contacto. Si pone simplemente contacto, ¿a? Cuando ya quieres que conviertan, que te escriban para algo ahí y así, le decimos lo que tiene que hacer y qué va a pasar una vez lo haga. Lo que tiene que hacer es cuéntame tu proyecto y lo que va a pasar es te respondo 24 horas. Y la siguiente, el siguiente aspecto importante, los formularios es que pasa después de ser rellenado. Pues llevas al usuario una página, que confirma el envío y le diga qué es lo que va a pasar, o muestra su mensaje en pantalla con esto mismo. Siguiente gran aspecto, velocidad y móvil, si tu web tarda más de tres segundos en cargar, lo más probable es que pierdas esa visita. Esto lo primero, lo segundo, si te centras en tener imágenes optimizadas, tener un buen hosting y tener un plugin de caché, estás resolviendo el 80% de los problemas. En términos de optimización, te puedes ligar la manta la cabeza lo que quieras. Pero esas son las partes fundamentales, además de haber elegido bien tus herramientas iniciales. Si has elegido un zim que pesa una barbaridad, has añadido 150 mil plugins, sin saber si eran buenos malos, si no los necesitas, si no. Y ese tipo de cosas, pues, ya tienes más problemas, ¿no? Pero en general, esos son los puntos clave. Y luego, la parte móvil es muy importante. Revisa tu web en un teléfono real. Se ve en tus botones, por ejemplo, botón de contacto sin hacer scroll infinito, se le ve en el texto sin tener que hacer zoom, se puede reinar el formulario con el pulgar fácilmente. En muchos casos, más de la mitad de tus visitas van a llegar desde móvil. Revisa la un tonalitis de todas formas. En mi caso, no. Yo como hago en mi caso digo mi web principal, como hago formación, la gente de la formación la suele consumir en pantalla grande. Pero el resto de mis proyectos, la mitad de las visitas o así, sí que vienen desde móvil. Así que revisas esto. Primero, optimiza. Ya te he dicho que tienes. Hay varios cursos, ¿no? Pero el curso de velocidad de web, estoy lo recomiendo como punto de partida y luego ya puedes ver otras opciones. El octavo punto que quería tratar es la manidad prueba social. Todo el mundo habla de prueba social, los marketing, sí demás. Y tiene sentido, pero no tiene que ser lo típico, ¿no? De un testimonio. Al final, el visitante no te conoces. Estamos hablando sobre todo de gente que no te conoce, ¿vale? Porque luego, cuando ya te conoces, es de todo cambia. Pero pongámonos en esta situación. El visitante no nos conoce. Necesita ver que otros han confiado en nosotros y que les fue bien. No hace falta 50 testimonios, porque seguramente no los tengas, con tener 3 o 4 buenos, es suficiente. Si los pones, carátal de otras opciones, lo importante es que sean concretos. Pues por ejemplo, me hizo la web en tres semanas y las consultas se triplicaron. Es decir, está diciendo que trabajas bien rápido y que encima tuvo resultados. Esto va a funcionar mejor que un testimonio que ponga gran profesional. Pero puede que no tengas testimonios, puede que sabe los que pienses que la gente no se cree los testimonios. Entonces hay más opciones. Puedes poner logos de clientes si tus clientes son relevantes en el sector o relevantes para la persona que quiere contratarte. Puedes poner si hay. has trabajado con gente famosa en el sector o conocida o en la que la gente confía, puedes poner sus caras, si pidiéndome permiso. Pues, en supuesto, puedes poner el número de proyectos a los años de experiencia, siempre que puedas demostrarlo. Puedes poner casos breves donde, pues, en este servicio tenía este problema. Yo les di esta solución y este fue el resultado. Esto funciona también muy bien. Así en lugar de eso, que es muy bien Gonzalo conmigo, trabajó genial. Pues si muestras eso, casos reales, la gente se puede sentir, más reconocida en ellos y además suelen ser comprobables. Y luego también mostrarte, puedes poner tu cara, una foto real tuya, un pequeño video muy cortito. Si, sobre todo si eres freelance, una foto real suele generar más confianza que simplemente un logo. Y luego, como te he dicho antes, más que tener una zona ahí con todos la prueba social, todos los testimonios, suele funcionar mejor. Suele funcionar mejor ponerlo o poner cerca de los botones, por ejemplo, o cerca de la parte de precios, que a lo mejor debajo ya tienes la parte de contratar, pues ahí. Que cuando el visitante, decida si hacía clic o no, pueda ver que otros ya lo hicieron y pueda ver ahí la prueba social. Y punto número 9, antes de hecho que había 10, pero no hay equivocado, es un 9. Aquí, para cerrar, te quiero hablar de los errores que veo constantemente. Y así no se hubiera un poco de resumen. Primero, slidez en la home. Esto se sigue viendo muchísimo. Y mira que yo han voluado, yo he dicho diciendo que no, yo que se hace cuantos años los cucho y otros marketers, pero da igual. Se siguen usando. Yo creo que es porque los diseños, los teams que hay trayen diseños prediseñados, trayen sliders a punta pala, porque como que son muy visuales, pero esto no funciona. Entonces, nadie pasa a tu pasas a algún slider. Entonces, mejor ahí un titular con un botón que convierta más. Otro gran fallo, páginas sin botón. El usuario llega al final de la página y no sabe qué hacer. Y esto suele pasar porque la gente dice "vale, ya tengo el botón en el menú de navegación". ¿Para qué lo voy a poner en esta página? Pues sí, por lo, porque si la gente ha ido, se ha leído todo eso, hasta abajo, y no ve qué hacer ahí. Puede que no lo haga. Siguiente error que se ve mucho, menúse normes, más de 10 opciones que abruman. A mí me abruman. Otro re que suelo ver. Disseño muy bonito, pero sin objetivos. Pues animaciones que, por ejemplo, no están muy chulas, pero no ayudan a que nadie te contacte. Este tipo de cosas. Yo, por ejemplo, me suelo fijar en los diseños bonitos, porque me he dicho a la página web, pero luego no voy a hacer nada. Digo, "Ah, mira qué bonito". Pero ya está. Otro error es dirigirte a todo el mundo, sin tentas dirigirte a todos. Pues al final no le estás hablando a nadie. Y esto es complicado. A mí me pasó también a veces. Yo tengo también en mi web principal dos tipos de público. Uno son los profesionales que quieren dedicarse a hacer webs para otros. Y otros son los usuarios que quieren crearse la propia web de su negocio. Entonces, para mí a veces es difícil. Es cierto que tienen un vínculo ahí, porque ambos van a crear crear webs con webres de forma profesional. Por eso mi mensaje va un poco enfocado ahí. Pero en muchos casos donde no estén tan relacionados como en el mío, si de verdad tienes distintos públicos objetivos, deberías crear distintos embudos o distintos caminos, distintas páginas a las que llega ese usuario y distintos pasos por los que los llevan. Y otro error muy típico, aunque en esto tengo sentimientos encontrados, es textos escritos pensados para ti. Aquí la teoría dice que debes escribir para quien busca una solución, escribir para esa persona. Y es así, lo que pasa es que también pienso que tienes que tener tu personalidad y mostrar un poco como tú eres depende, ¿no? Pero sobre todo hablando de marcas personales. Entonces yo esto me lo tomaría más como tú eres un experto en tu materia, pero la persona que está llegando ahí. Entonces, volvemos a lo que te comentaba antes de simplificar el mensaje y manteniendo tu personalidad, por supuesto, escribe pensando en quién está buscando tu solución, escribe para esa persona. Y como punto final, te diría que la solución casi nunca es añadir, casi siempre, es quitar lo que sobra. Nada más por este episodio, nos seguimos escuchando, adiós. [Música]