AMP en tu sitio web de WordPress

Si se pregunta cómo configurar una página AMP de WordPress, no está solo. Los administradores de sitios web, en un intento de optimizar su sitio para usuarios móviles, investigan Google AMP, solo para encontrar más preguntas que respuestas.
¿Qué en el mundo es AMP? ¿Por qué lo necesito para mi sitio web? Si quiero páginas AMP, ¿cómo empiezo?

¿Qué es Google AMP?

Google AMP significa páginas móviles aceleradas de Google y es un catálogo de código abierto de páginas web que son aptas para dispositivos móviles. El objetivo de AMP es hacer que estas páginas móviles se carguen más rápido y sean más fáciles de recorrer.

En realidad, lo que sucede es que Google AMP crea un duplicado de su sitio web en formato AMP HTML, que se basa en tecnologías web previamente existentes.

Esto elimina muchos de los elementos en su sitio que hacen que se cargue más lento, a su vez, lo que lo hace más rápido. Además de eso, Google "aplana" su sitio para que se cargue aún más rápido.

Google lanzó AMP en octubre de 2015 con su enfoque principal en la velocidad. Eso tiene sentido porque el 53% de las personas abandonan un sitio web si tarda más de tres segundos en cargarse. Y el 73% de los usuarios móviles dicen que han visitado un sitio web demasiado lento.

Pero, ¿cómo afectan estos números a su balance final? ¿Por qué importa AMP?

El AMP es importante debido a esta estadística: un retraso de un segundo en el tiempo de carga puede resultar en una pérdida de conversiones del 7% .

Hoy en día, muchas empresas confían en sus sitios web para realizar conversiones, como probablemente sea el caso de su negocio. Entonces puede ver por qué un tiempo de carga rápido puede potencialmente hacer o deshacer el crecimiento de su empresa.

Aquí hay otra razón por la que AMP es importante: si un motor de búsqueda ve que su sitio no se cargará lo suficientemente rápido para los usuarios móviles, Google no lo mostrará en la parte superior de los resultados de búsqueda.

Es por eso que muchas de las compañías conocidas han implementado AMP en sus sitios, incluidos WordPress, Pinterest, LinkedIn y Reddit.

Para mantenerse al día con esta nueva innovación, nuestro propio tema, Astra , es en realidad uno de los pocos temas con compatibilidad nativa con AMP. Anunciado a principios de este año, es uno de los grandes avances que hemos dado para asegurarnos de que su sitio de WordPress esté actualizado con rapidez, en todos los dispositivos y plataformas.

Ventajas de usar AMP en tu sitio web de WordPress

¿Cómo puede el uso de un sitio AMP de WordPress beneficiar su tráfico y su negocio? Estas son las ventajas de optimizar para AMP.

AMP es gratis

Desde el lanzamiento de AMP, ha sido completamente gratuito para cualquiera. Es una de las muchas herramientas gratuitas que ofrece Google para los administradores de sitios web. Básicamente, Google quiere que las personas tengan una mejor experiencia al usar su servicio, y su sitio es parte de esa experiencia. Entonces, ¿por qué cobrarle para que su sitio sea más fácil de usar?

Impulso de optimización de motores de búsqueda

Google prefiere mostrar a los usuarios sitios que forman parte de AMP, por lo que tener páginas AMP en su sitio le brinda una mejor oportunidad de aparecer en la primera página de resultados de búsqueda.

Además, el uso de AMP ayuda a aumentar la velocidad de su página, que es un factor importante cuando se trata de SEO. Cuanto más rápido se cargue su sitio, es más probable que Google le otorgue una mejor clasificación en los resultados de búsqueda.

Además, Google AMP se asegura de que su sitio aparezca en el carrusel de Google Noticias, que es una prioridad más alta que los resultados superiores en el móvil.

Mejor experiencia de usuario

El uso de AMP no solo carga su sitio web más rápido, sino que también es más conveniente para los visitantes del sitio. La velocidad es uno de los factores más importantes para un sitio web. Como mencionamos anteriormente, la mayoría de las personas abandonan un sitio web si no se carga lo suficientemente rápido.

Por lo tanto, ofrecer a sus usuarios una mejor experiencia con AMP significa que podría ver menos rebotes, clientes más felices y un posible aumento en las ventas.

Rendimiento mejorado del servidor

Debido a que AMP elimina los elementos de su página que la ralentizan, el ancho de banda necesario disminuye. Y cuanto menos ancho de banda requiera su sitio, mejor será el rendimiento de su servidor.

Previene grandes marcos
Participar en AMP puede ayudar a evitar que los sitios utilicen grandes marcos de hojas de estilo en cascada (CSS) y JavaScript (JS).

Opciones de publicidad
Si su sitio está en AMP, tiene opciones de publicidad que pueden ser exclusivas para los usuarios móviles que visitan su sitio. Los anuncios aparecerán de manera diferente en sus páginas AMP que en su sitio normal, lo que significa que puede crear y compartir anuncios específicos para dispositivos móviles.

Optimización automática de imagen
Cuando crea una versión AMP de su sitio, todas sus imágenes se optimizan para usuarios móviles, incluida la conversión de imágenes al formato WebP cuando sea necesario. Por lo tanto, aún puede entregar una publicación o página de blog fácil de ver a sus visitantes móviles.

Es más fácil de lo esperado
Implementar AMP en su sitio de WordPress es mucho más fácil que muchas otras plataformas de creación de sitios web, gracias a algunos complementos muy útiles (más sobre eso a continuación).

Es de código abierto
Debido a que AMP es de código abierto, continúa mejorando. Además, es más seguro porque todo es público, lo que significa que hay menos posibilidades de que alguien o algo pueda corromper todo el sistema.

Los 4 mejores complementos de WordPress AMP

Configurar manualmente su sitio en Google AMP es complicado. Afortunadamente, hay muchos complementos AMP para WordPress que hacen que este proceso sea muy simple.

Así que echemos un vistazo a los cinco mejores complementos AMP de WordPress.

1. AMP (el complemento oficial de WordPress)

Complemento oficial de AMP para WordPress en WordPress.org
El complemento AMP de WordPress es bueno tanto para principiantes como para aquellos que buscan mejorar su optimización AMP en un sitio de WordPress. Sin embargo, los principiantes de WP pueden encontrarse con una curva de aprendizaje más que los expertos, ya que requiere una codificación simple.

Este complemento le brinda una guía que muestra cómo puede personalizar su sitio AMP. Aunque puede que no sea tan fácil de usar como algunos de los otros complementos de código abierto, constantemente lo desarrollan y lo mejoran.

Comience con AMP (el complemento oficial de WordPress)

2. AMP para WP

Página de descarga de AMP para WP
AMP for WP es un complemento que optimiza inmediatamente su sitio para Google AMP. Viene con extensiones, herramientas de diseño y soporte adicional.

Los desarrolladores lo actualizan regularmente para eliminar errores y agregar nuevas características, por lo que no se quedará atrapado con un complemento que nunca mejora. Es ideal para los principiantes de WordPress, ya que funciona sin requerir mucha experiencia.

AMP para WP le permite crear un diseño AMP que es diferente del diseño de su sitio web habitual, gracias a la función de editor AMP personalizado de arrastrar y soltar. Esto le brinda un control completo sobre lo que ven los usuarios de dispositivos móviles en lugar de dejarlo en manos de Google.

Comience con AMP para WP

3. AMP WP

Página de descarga de AMP WP en WordPress.org
AMP WP dice que puede hacer que su sitio móvil se cargue 5 veces más rápido usando sus funciones. Eso suena como una afirmación audaz, pero en realidad es creíble.

La lista de funciones gratuitas es bastante larga e incluye cosas como "Soporte completo de Google AMP" y "Compatibilidad automática de complementos de AMP".

Cuando instala el complemento, puede elegir la instalación automática, que es donde WordPress transfiere todos los archivos por usted y no tendrá que salir de su navegador web.

Comience con AMP WP

4. AMP en WordPress

AMP en la página de descarga de WordPress en WordPress.org
El AMP en WordPress: el plugin weeblrAMP CE tiene una versión gratuita y una de pago para crear páginas AMP. Puede crear una versión AMP completa de su sitio web, optimizando publicaciones, páginas, etiquetas, categorías e incluso archivos.

Si obtiene la edición premium, puede convertir automáticamente los formularios para que los usuarios puedan seguir utilizándolos fácilmente, incluidos los formularios de registro de MailChimp, Contact Forms 7, WooCommerce, WPForms y muchos más.

weeblrAMP viene con la configuración predeterminada, por lo que puede comenzar a trabajar para usted de inmediato. Y si es desarrollador, tiene control sobre cada parte del AMP: puede anular plantillas, filtros y acciones. Esto significa que su sitio AMP se verá y actuará de la manera más similar posible a su sitio real.

Ya sea que sea un usuario gratuito o un usuario pago, la interfaz está diseñada de forma sencilla, aunque está dirigida a desarrolladores y diseñadores.

Comience con AMP en WordPress

Cómo configurar Google AMP para WordPress

Ahora veamos los pasos para configurar Google AMP para su sitio web de WordPress. No es súper complicado, por lo que este tutorial debería eliminar la posibilidad de errores.

Utilizaremos el complemento AMP oficial de WordPress como ejemplo.

1. Instalar y activar el complemento AMP
Complemento AMP para la página de instalación de WP en el Panel de WordPress
Si está utilizando WordPress.com, no podrá instalar ningún complemento a menos que actualice a su plan de negocios.

Sin embargo, si tiene un sitio autohospedado en WordPress.org, podrá instalar cualquier complemento que necesite.

Para instalar un complemento, puede usar la función de búsqueda yendo a Complementos → Agregar nuevo, luego escribiendo “Complemento AMP” en la barra de búsqueda. Una vez que encuentre el complemento, haga clic en "Instalar ahora".

Si desea cargar el complemento AMP desde su computadora, simplemente presione el botón "Cargar complemento" en la parte superior de la página y cargue su complemento.

A continuación, deberá activarlo. En la página "Instalación del complemento", presione el enlace "Activar complemento" para que el complemento comience a funcionar en su sitio.

2. Ajuste la configuración
Configuración de AMP en el panel de WordPress
Después de activar el complemento, ahora puede ajustar la configuración para personalizar el aspecto de sus páginas AMP.

Vaya a la pestaña AMP> General en el tablero. Aquí es donde puede configurar el complemento.

Una vez que haya ajustado la configuración a su gusto, presione el botón "Publicar". Su sitio AMP no será visible para los usuarios y Google no podrá descubrirlo.

También puede elegir si sus publicaciones, páginas o ambas se mostrarán en su sitio AMP. Anule la selección de la casilla de verificación de Plantillas compatibles y verá más opciones.

Elija las opciones requeridas y haga clic en " Guardar cambios ".

3. Obtenga una vista previa de sus páginas AMP
Ahora puede obtener una vista previa de su sitio AMP antes de publicarlo. Simplemente visite cualquiera de sus páginas o publicaciones de blog y agregue / amp / al final de la URL.

Aquí hay un ejemplo:

http://su-sitio.com/blog-post-title/amp/

Con eso, sabrá si su sitio AMP está listo para funcionar.

Cómo probar que Google AMP funciona correctamente

Ahora debe asegurarse de que su sitio AMP funciona correctamente. Hay dos formas principales de validar su AMP de WordPress, las cuales le darán una lectura de su código y cualquier error que deba corregir.

Herramienta de prueba de AMP de Google

La forma en que prueba su sitio AMP de Google es a través de la herramienta de prueba AMP de Google . Lo lanzaron en octubre de 2016, solo un año después del lanzamiento de AMP.

Entonces, ¿cómo se usa la herramienta de prueba de Google AMP?

Bueno, una vez que llegue a la página principal de la herramienta de prueba, simplemente ingrese la URL de su sitio, página o publicación en el cuadro y presione " Probar URL ". Alternativamente, puede pegar el código de su sitio web y hacer clic en " Probar URL ".

Luego, el robot de Google analizará la optimización AMP de su sitio, incluida la validez de su marcado AMP y datos estructurados.

Si tiene un sitio optimizado para AMP válido, esta herramienta le mostrará una vista previa de cómo se verán sus páginas AMP en la página de resultados de búsqueda de Google.

Esta herramienta hace que sea mucho más fácil encontrar errores de AMP en su sitio, y puede ayudarlo a mostrar el código que está causando el problema. También puede compartir fácilmente los resultados del análisis con los miembros de su equipo haciendo clic en el botón compartir en la esquina inferior derecha.

Validación manual
También puede validar su AMP de WordPress manualmente.

Primero, abra una de sus páginas AMP. Luego agregue lo siguiente a la URL:

A continuación, abra la consola de herramientas de desarrollador en su navegador. Si su página AMP tiene algún error, aquí es donde los verá resaltados en rojo. También verá una explicación de la causa.

Muchas veces, los errores de validación ocurren debido a prefijos inválidos, códigos incorrectos y / o etiquetas que no están permitidos. La mayoría de las veces, la solución se da justo al lado de la explicación del error.

Pero ese no es siempre el caso. Cuando eso suceda, necesitará saber cómo corregir esos problemas.

Resolver problemas de Google AMP
Además de darle una lectura de los errores de validación, Google a menudo le notificará directamente sobre cualquier problema de AMP, así como sobre los pasos para corregirlos.

Pero debe tener en cuenta los errores comunes de AMP y cómo solucionarlos porque Google no siempre proporciona la respuesta.

A continuación, verá los problemas de AMP más comunes y cómo resolverlos. También puede ver una lista completa de los errores AMP específicos de Google aquí .

Error 404 (URL no encontrada)
Como mencionamos anteriormente, debería poder agregar / amp / al final de sus páginas AMP después de instalar el complemento AMP. Sin embargo, es posible que vea un error 404 justo después de instalar el complemento. Afortunadamente, es un problema menor con una solución fácil.

Simplemente necesita actualizar los enlaces permanentes. Para hacer esto, vaya a Configuración> Enlaces permanentes . Luego, sin hacer ningún cambio, haga clic en " Guardar ".

Básicamente, esto actualiza la estructura de enlaces permanentes, incluidas las versiones AMP de la página. Esto debería corregir el problema de 404 AMP al instante.

Páginas en blanco de AMP
Dependiendo del complemento de AMP que use, puede ver que su sitio de AMP carga páginas en blanco o simplemente no carga. Esto generalmente significa que sus páginas AMP están allí, pero tienen errores.

Primero, actualice los enlaces permanentes como lo hizo con el error 404. Configuración> Enlaces permanentes> Guardar .

Si eso no corrige el problema, deberá ir a AMP> General . Asegúrese de que las casillas de verificación " Plantillas " y " Páginas " estén marcadas, luego presione " Guardar ".

Esto debería corregir el problema. Vea la versión AMP de cualquier publicación o página de blog para asegurarse.

"Se requiere un valor para el campo del logotipo"
Uno de los problemas más comunes de AMP en WordPress es recibir el mensaje de error, " Se requiere un valor para el campo del logotipo " en el informe de error.

Este tiene una solución simple. Significa que no ha agregado un favicon o logotipo a su sitio AMP.

Para agregar un favicon, vaya a Apariencia> Personalizar> Identidad del sitio . En " Icono del sitio " , haga clic en " Seleccionar imagen " para cargar su logotipo. Una vez cargado, haga clic en " Publicar ".

"URL no válida para el atributo HTML 'href' en la etiqueta 'a'"
Si su informe de error muestra “URL no válida para el atributo HTML 'href' en la etiqueta 'a'” o algo similar, esto significa que su sitio AMP tiene un enlace que apunta a un sitio web inexistente o con error 404.

Para solucionar este problema, haga clic en el error y vea la versión en vivo. Hacer esto probará su página AMP en formato HTML y se resaltará la línea donde se encuentra el error.

Si la comprensión de los códigos HTML suena abrumadora, puede visitar la página AMP y probar cada enlace, luego corregir o eliminar los enlaces rotos.

Duplicar secuencias de comandos .js
Cuando agrega un script .js a su página AMP, verifique que no lo haya agregado accidentalmente dos veces. Si lo hizo, causa un error.

Para solucionarlo, simplemente elimine los scripts .js adicionales hasta que tenga solo uno.

No coinciden los contenidos
Cuando recibe un error de "falta de coincidencia de contenido" en AMP, eso significa que hay contenido en la página web que falta en la versión de AMP. Por lo general, este es un video incrustado que puede haber sido eliminado.

Entonces, no solo se ve mal, sino que también generará este error.

Para solucionarlo, simplemente elimine o reemplace el video o lo que sea el elemento de la página.

Contras de Google AMP

Por ahora, puede pensar que participar en Google AMP es obvio. Pero, al igual que cualquier otra cosa, tiene un lado negativo.

Restricciones CSS y JS
Aunque limitar los marcos CSS y JS ayuda a que los sitios se carguen más rápido, puede terminar eliminando elementos de marca, como gráficos, animaciones e imágenes de alta definición. Y una cosa que hace que un sitio sea único y amigable es la marca. Es posible que haya escrito una publicación de blog que usa infografías; con Google AMP, se pueden eliminar.

Muestra solo páginas en caché
AMP solo muestra páginas en caché, lo que significa que los usuarios pueden no tener acceso a su contenido más reciente. ¿Por qué pasó esto? Porque Google puede mostrar resultados más rápido al cargar sus páginas en caché.

Opciones de ingresos publicitarios limitados
Google AMP le permite anunciar, pero el proceso es complicado y ofrece una integración limitada con otras plataformas publicitarias. Este es el proceso paso a paso para usar anuncios en AMP .

Puede dañar el compromiso
Aunque la idea de Google AMP es aumentar el compromiso, algunas personas informan que usar AMP genera tasas de rebote mucho peores y menos sesiones de página.

Problemas de seguimiento
Las estadísticas de sus páginas AMP se rastrean y almacenan por separado y de manera diferente a su sitio real. Por lo tanto, a menos que sea muy cuidadoso y organizado, puede terminar perdiendo el rastro de las estadísticas de su sitio.

El principal beneficio de usar un sitio de WordPress AMP

Si su sitio web se carga incluso un segundo o dos más lentamente, podría afectar drásticamente el tráfico de su sitio web. Su tasa de rebote podría aumentar. La experiencia del usuario es pobre. Y es posible que Google no clasifique bien su sitio porque nota que es lento.

La velocidad es lo principal positivo para implementar un complemento AMP de WordPress. Aunque el uso de AMP puede ayudar con el SEO, mejorar el rendimiento de su servidor y optimizar sus imágenes, tener un sitio web rápido es la razón más convincente para usarlo.