Páginas móviles aceleradas: AMP para WordPress Mobile Optimization

Páginas móviles aceleradas para WordPress

Navegar y navegar en Internet debe ser rápido y fácil. Los webmasters constantemente intentan hacer esto posible optimizando el rendimiento del sitio web y mejorando las velocidades del sitio, y una excelente manera de lograrlo es con AMP para WordPress.


Los sitios web fueron diseñados principalmente para la pantalla más grande. Pero las pantallas más pequeñas están aumentando en número e incluso superando a las computadoras portátiles y personales. Los móviles ahora representan 65% del tiempo de los medios digitales. Los dispositivos de mano necesitan páginas para cargar tan rápido como lo hacen en pantallas más grandes, si no más rápido.

Para satisfacer esta demanda de contenido de carga rápida, las aplicaciones diseñadas para plataformas móviles específicas están disponibles en Apple (Noticias), Facebook (Artículos instantáneos) y Snapchat (Descubrir). A principios de este año. Google introdujo la página móvil acelerada (AMP) para acelerar la entrega de contenido móvil y proporcionar una mejor experiencia de usuario.

¿Qué es el AMP??

AMP para WordPress: Proyecto AMP

Proyecto AMP fue anunciado por Google en octubre de 2015, y se lanzó en febrero de 2016. Es una iniciativa de código abierto que brinda a los editores los medios para crear contenido optimizado para dispositivos móviles una vez y cargarlo instantáneamente en todas partes en la web móvil..

El 24 de febrero de 2016, Google comenzó a implementar contenido compatible con AMP en un carrusel en su página de resultados de búsqueda móvil. Los usuarios pueden deslizar el carrusel y tocar el elemento que desean leer. Pinterest informó que las páginas son 4 veces más rápido, utilizando 8 veces menos datos que las páginas optimizadas para dispositivos móviles normales. Esto es posible debido a la forma en que las páginas están formateadas y entregadas.

A partir de agosto de 2016, Google Search tiene más de 150 millones de documentos AMP en su índice y crece a un ritmo de 4 millones por semana. A principios de agosto, Google también comenzó un vista previa de la búsqueda de Google de contenido amplificado. Espera implementarlo más ampliamente a finales de este año..

AMP para WordPress: Vista previa de búsqueda de AMP

AMP en la vista previa de búsqueda

Puede echar un vistazo a las páginas de carga rápida en la búsqueda habilitada por AMP aquí. Compruébelo utilizando el enlace de su teléfono móvil (no funcionará en computadoras de escritorio).

Qué sitios web deben usar AMP?

En febrero, el proyecto se inició para los editores. Pero la adopción de AMP se ha extendido mucho más allá de la industria editorial al entretenimiento, los viajes, el comercio electrónico y más..

Se están recibiendo informes favorables de los primeros usuarios. Con una mejora del 88% en el tiempo de carga para documentos AMP, Informes del Washington Post un aumento en el número de usuarios que regresan de teléfonos móviles en un 23%. eBay es una de las principales empresas de comercio electrónico que cambia a AMP con cerca de 15 millones de páginas de navegación de productos basadas en AMP. En poco tiempo, se espera que estas páginas se incrementen para ser descubiertas en una búsqueda.

Entonces, ¿qué sitios web deberían usar AMP? Definitivamente aquellos que dependen en gran medida de los dispositivos móviles para el tráfico. Pero considerar que cada vez más usuarios eligen usar sus dispositivos móviles para navegar por Internet AMP para WordPress (o cualquier sitio web) podría ser una buena adición.

Lo que es diferente en AMP?

Este sistema de entrega de contenido se basa en el marco AMP HTML y es más rápido que el HTML habitual porque,

  • Es una versión ligera del marco HTML normal, menos todo el contenido de JavaScript. Para JavaScript, el marco se basa en la biblioteca común AMP JS.
  • El contenido se almacena en caché y se almacena en una nube común, por lo que se elimina el tiempo necesario para consultar y buscar del servidor.

Hay muchas más diferencias, pero las dos mencionadas aquí deberían darle una comprensión rápida y amplia.

Por qué los editores y los blogs deberían habilitar AMP

Mientras que leer páginas de carga lenta en móviles sigue siendo una experiencia desalentadora para los usuarios, los editores se están perdiendo los ingresos de la publicidad en móviles. AMP ayudará a atraer y retener a un visitante durante períodos más largos en el sitio web y tiene el potencial de generar clics que generen ingresos.

Las páginas AMP aparecen junto a un ícono de rayo para marcarlas de las páginas web normales. Los espectadores que hagan clic en esta opción, serán llevados directamente a las páginas de AMP dentro del visor de AMP. No solo eso, el contenido estará disponible instantáneamente en una búsqueda de Google y accesible a través de plataformas sociales como Twitter, LinkedIn, WordPress, Parse.ly, Adobe Analytics, Nuzzel y Pinterest.

Además, los editores tendrán acceso a Google Analytics para observar cómo funcionan sus páginas. Pueden seleccionar su mejor contenido y usarlo para optimizar el rendimiento del sitio web y la experiencia del usuario.

AMP ofrece otra ventaja, ya que se ocupa del alto rendimiento y la experiencia del usuario, por lo que los recursos del editor pueden centrarse en proporcionar excelente contenido.

Qué optimizaciones son necesarias para AMP

AMP es en realidad muchas optimizaciones para el sitio web hecho de manera uniforme como lo requiere Google. Las diversas optimizaciones que debe realizar para que una página web cumpla con AMP son,

  • Permitir solo JavaScript asincrónico – para evitar que demore la representación de la página. Esto significa que no puede usar ningún JavaScript que cree y que debe confiar en los elementos de AMP para manejar el contenido interactivo de sus páginas. Se permite JS en iframes, pero solo si no impide la representación.
  • Tamaño de todos los recursos estáticamente – AMP carga la página sin esperar recursos como imágenes e iframes para descargar. El tamaño de estos recursos debe establecerse en HTTP, por lo que el tamaño y la posición de estos recursos se conocen antes de que comience la descarga..
  • No permita que los mecanismos de extensión bloqueen la representación – si se va a incluir alguna extensión en la página, el script personalizado debe informar al sistema al respecto. Por lo tanto, se crea un espacio para la extensión, incluso antes de que AMP sepa lo que incluirá. Las extensiones para lightboxes, embebidos y tweets de Instagram están bien, ya que no bloquean la representación de la página, a pesar de que requiere solicitudes HTTP adicionales.
  • Mantenga todos los JavaScript de terceros fuera de la ruta crítica – JavaScript personalizado solo está permitido en iframes de espacio aislado. De esta manera, no bloquea la carga de la página principal.
  • Todos los CSS deben estar en línea y de tamaño – esto ayuda a reducir la cantidad de solicitudes HTTP en la ruta crítica.
  • La activación de fuentes debe ser eficiente– el sistema AMP no permite solicitudes HTTP hasta que las fuentes comiencen a descargarse.
  • Minimice los recálculos de tamaño – los recálculos retrasan la representación, por lo que debe mantenerse al mínimo.
  • Solo ejecuta animaciones habilitadas para GPU – todas las animaciones deben poder ejecutarse en GPU (Unidad de procesamiento gráfico).
  • Priorizar la carga de recursos – Solo el contenido que se necesita se carga primero, con anuncios e imágenes recuperados lo antes posible, pero solo se carga cuando es necesario. De esta forma, la demanda de CPU se mantiene al mínimo..
  • Carga páginas en un instante – La representación previa consume mucho ancho de banda y CPU. La representación previa de AMP solo carga primero el contenido requerido y descarga iframes de terceros y otros recursos solo si es necesario.

Habrá disponible una gama estándar de formatos de anuncios, redes publicitarias y tecnologías. Al mismo tiempo, los editores también pueden elegir sus propios formatos, siempre que no sea un obstáculo para la velocidad.

Cómo agregar AMP para WordPress

Google tiene un tutorial que puede consultar para crear páginas HTML básicas de AMP, organizarlas, validarlas como compatibles con AMP, publicarlas y distribuirlas. Validación de páginas AMP es importante, porque de esa manera terceros como Twitter e Instagram confían en que las páginas se mostrarán bien en sus plataformas.

En lo que respecta a los sitios web alojados en WordPress.com, son compatibles automáticamente con WordPress sin tener que hacer nada más. Los sitios web de WordPress autohospedados pueden habilitar AMP para WordPress instalando un complemento.

Plugin de WordPress AMP por Automattic

Plugin de WordPress AMP por Automattic

Una vez que descargue, instale y active el Complemento AMP en el sitio web de WordPress, sus publicaciones tendrán automáticamente una versión AMP generada dinámicamente. Puede acceder a estas páginas agregando amperio al final de su URL (example.com/my-post/amp). Si no tiene habilitados los enlaces permanentes bonitos, agregue ?amp = 1 a enlaces (que se verían como example.com/?p=100&amp=1). El único otro paso es probar y validar sus páginas como se mencionó anteriormente.

No notarás ninguna configuración o función para este complemento. Hay una opción de panel adicional para AMP Analytics donde puede pegar su propio código de configuración JSON, pero eso es todo amigos.

Este complemento es el complemento oficial del establo Automattic, y actualmente no es compatible con páginas y archivos, ni puede personalizar las páginas. Pero es una opción muy simple y fácil de usar, y puede encontrar alguna guía a través de documentación sobre Github para personalizar.

AMP para WP – Páginas móviles aceleradas

AMP para WP Plugin gratuito de WordPress

Otra gran opción gratuita es AMP para WP. Este complemento gratuito de WordPress ofrece una configuración rápida y fácil: simplemente instale, habilite la configuración y comience a generar automáticamente su AMP para su sitio web. Bonificación: este complemento también es compatible con varios sitios.

Hay configuraciones integradas para habilitar AMP (publicaciones, páginas, archivos), agregar áreas de publicidad móvil, datos estructurados (una parte importante del SEO), integración de metaetiquetas Yoast SEO, opciones avanzadas de índice / sin índice, notificación push, nativo Comentarios AMP, traducciones AMP personalizadas (si está utilizando un idioma que no sea inglés, querrá actualizar esto) y más. La configuración es muy completa para un complemento gratuito que es increíble.

Lo mejor de todo es que este complemento ofrece opciones de diseño para que pueda personalizar la apariencia de su salida AMP. Use los temas AMP predeterminados incluidos, o use sus Marco temático de AMP para crear su propio diseño único.

AMP para WP también ofrece extensiones premium para agregar funciones (como una llamada a la acción o almacenamiento en caché de AMP) y soporte para complementos populares que incluyen WooCommerce, Campos personalizados avanzados y Formulario de contacto 7.

Más formas de agregar AMP para WordPress

Por supuesto, esta no es la única forma de agregar AMP a su sitio web con WordPress. Otros complementos que pueden ayudarlo con AMP para sitios web de WordPress incluyen:

  • WP AMP: para crear un diseño AMP personalizado sin codificación y aumentar el SEO. Puedes leer más sobre esto aquí.
  • Páginas móviles aceleradas (AMP) para WordPress: para crear un tema AMP para su sitio web.
  • AMP personalizado – para ayudar a personalizar su contenido AMP.
  • Artículos instantáneos de Facebook y páginas de Google AMP – para publicar y administrar su contenido directamente desde WordPress a las páginas de Google AMP con soporte para anuncios y análisis.
  • Pegamento para Yoast SEO y AMP – para garantizar que el complemento AMP de WordPress predeterminado utilice los metadatos Yoast SEO adecuados y permita la modificación del diseño de la página AMP.

Debe agregar AMP para WordPress?

Aunque AMP no es obligatorio para que Google descubra páginas web, es bastante obvio que Google tendrá como objetivo implementar el proyecto AMP de una manera más amplia eventualmente. En la actualidad, cumplir con AMP no es un factor separado para ranking de búsqueda de Google. Aunque es razonable suponer que será importante en algún momento,

Si tiene en cuenta que la velocidad de carga de la página es un factor en la clasificación de los motores de búsqueda, realmente no tiene muchas opciones si desea ser parte de Internet móvil. Si las clasificaciones de los motores de búsqueda son importantes para usted, todas las dudas sobre el camino de AMP pueden desaparecer.

Pero ser parte del proyecto necesita una adhesión estricta al formato requerido por Google y puede que no sea una taza de té para todos. Restringe lo que puede poner en su sitio web y puede hacer que todos los blogs parezcan algo uniformes y carentes de individualidad. Algunas animaciones no están permitidas y los formularios no son compatibles. Y en lo que respecta a las páginas de destino, AMP puede no ser una buena idea en absoluto. Además, puede haber sitios web que enfatizan la estética y la marca sobre la velocidad, para quienes AMP puede ser un amortiguador.

Sin embargo, si desea crear una experiencia rápida y atractiva para sus usuarios y hacer que permanezcan más tiempo, debe considerar seriamente AMP para WordPress (o cualquier otro tipo de sitio web que pueda ejecutar). Si es un lugar en el carrusel de AMP en las páginas de búsqueda de Google que desea arrinconar, suba al carro de AMP.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map