AMP y su validación

jbex

El que peca y reza empata
Administrador
Para quien no sepa que es las Páginas Aceleradas para Móviles, en inglés Accelerated Mobile Pages o su abreviatura AMP, es un proyecto de internet de código abierto dedicado a mejorar, optimizar y acelerar el funcionamiento de las páginas web en los dispositivos portables, como teléfonos celulares y tablets.

Las Páginas Aceleradas para Móviles son páginas que cargan y renderizan el contenido estático como imágenes, videos y otros elementos mucho más rápido.
Para lograr lo anterior se valen de tres factores:
  • Un marcado de HTML5 modificado, con marcadores y elementos adicionales.
  • Una librería JavaScript de AMP que administra la carga de recursos externos para asegurar un renderizado rápido de la página.
  • Emplea técnicas para mejorar el rendimiento, que incluye deshabilitar elementos que no pasan la validación.
    También asegura que todos los recursos externos sean cargados de forma asincrónica para evitar cualquier bloqueo.
  • La red CDN de AMP que guarda el contenido de las páginas en cache en distintas bases de datos en la nube.
  • Al usar el CDN todos los elementos son cargados de internet mediante HTTP/2 para una máxima eficiencia.
  • Las páginas en formato AMP cargan más rápido que las paginas tradicionales, se benefician principalmente los dispositivos portables.
  • Son destacadas en los resultados de las búsquedas de Google con un pequeño icono que indica que la pagina usa esta funcionalidad, además son priorizadas por el buscador en los resultados de las noticias.
  • El CDN de AMP hace que las páginas se carguen mediante el nuevo protocolo HTTP/2, que acelera la velocidad en la navegación, que la inmensa mayoría de los sitios aun no puede disponer.

Al crear o habilitar páginas AMP en nuestro blog o sitio web, es necesario validar y comprobar si el código y su estructura es correcto.
Si no fuera así no gozaríamos ninguna de las ventajas del formato AMP.

Al validarlas podremos conocer errores y advertencias e intentar solucionarlos.

Hay varias formas de validar una página acelerada AMP.
Cada cual usa el método que le sea más factible ya que todos devuelven el mismo resultado.
Los enumeramos a continuación:
1- Usar la Consola del navegador Google Chrome.
2- Usar el Validador web del AMPProject o el de Google.
3- Usar en el navegador Google Chrome la extensión AMP Validator.
4- Informe de Páginas Aceleradas, en Google Search Console.

El primer método que se implementó luego de la liberación de las páginas aceleradas, es usar la Consola en las Herramientas para desarrolladores del navegador Google Chrome.

Abre la página de AMP en el navegador.
Añade
Insertar CODE, HTML o PHP:
#development=1
a la URL, por ejemplo:
Insertar CODE, HTML o PHP:
https://www.trucoswindows.net/como-saber-si-un-telefono-es-original-o-una-imitacion/amp/#development=1
Abre la consola DevTools de Chrome ( F12) y comprueba si hay errores de validación.

Los errores se mostrarán en Developer Console de una forma similar a esta:

upload_2017-2-12_12-7-53.png



El validador de AMP se puede utilizar como una interfaz web en validator.ampproject.org. Esta interfaz muestra los errores entre líneas, junto con el código fuente HTML de la página. La interfaz es un editor interactivo: cambia al resultado del código fuente HTML en una revalidación interactiva.

Comprobar y validar una página AMP con la extensión AMP Validator
Este es el método más rápido y sencillo. Hay extensiones disponibles para los navegadores Google Chrome y Opera.
Instalar extensión AMP Validator

Ya por ultimo tenemos Google Search Console y su Prueba de AMP

Son varias las desventajas en la práctica de la implementación en un sitio de Páginas Aceleradas para Móviles.
Antes de considerar usar este proyecto se debe analizar lo siguiente:
  • Las restricciones en el código impiden usar elementos tan comunes y útiles en internet como los SCRIPTS.
  • Por esa razón es imposible disponer de funcionalidades usando JavaScript del modo clásico, como los botones de las redes sociales.
  • Los componentes necesarios para usar las AMP añaden componentes al sencillo código HTML5 de las páginas y lo hacen más complejo, dificultando su uso por aficionados o no profesionales.
  • Aumenta el tamaño de las páginas, debido al incremento del marcado necesario y la restricción de impedir la carga de hojas de estilo CSS externas.
  • Por otra parte no debemos olvidar que no es un estándar, sino solo un proyecto experimental, sin garantía alguna, que en el futuro pueda ser desechado.

Nosotros acabamos de implementar AMP en la web, pero en el foro a día de hoy es imposible su implementación.

Un saludo
 
Arriba Pie