En esta presentación, Mauricio Angulo hace un recorrido por las principales aplicaciones de AMP (Accelerated Mobile Pages): AMP Websites, AMP Ads, AMP Mail y AMP Stories, así como algunos tips y herramientas para creadores,
agregar etiquetas para características comunes de un sitio web • JavaScript está restringido • Validator informa problemas que podrían afectar la accesibilidad o el rendimiento • Los servidores almacenan en caché y optimizan páginas AMP válidas AMP HTML AMP JS AMP Cache
AMP son: • Construidos con HTML estándar, CSS y JavaScript • Compatible con todos los navegadores modernos. • No dependen de herramientas especiales. • Basados en componentes ¡Aprende las mejores prácticas con el ejemplo!
en la etiqueta HTML • Herramientas como el validador y la memoria caché reconocen sitios como AMP • El validador de AMP puede mostrar qué más necesitamos para una página de AMP válida <html ⚡ lang="es"> <html amp lang="es">
el AMP válido es bueno para sus usuarios. • Además, necesitarás AMP válido para ingresar a los cachés de AMP • Las reglas de AMP representan las mejores prácticas en accesibilidad, rendimiento, etc. • Los errores le indican que hay espacio para mejorar la experiencia de sus usuarios
buscan páginas AMP y le dicen a un caché AMP que las almacene • Almacena solo páginas válidas de AMP • Permite que las páginas AMP se carguen de manera segura y eficiente • Optimiza las páginas en caché.
y fuentes • Limita las dimensiones máximas de la imagen y agrega srcset • Convierte y comprime imágenes. • Sanitiza el HTML para evitar ataques XSS o errores de análisis
definen cómo se ve todo HTML lenguaje de marcado estándar para crear páginas web Javascript el código en un sitio web, usado para hacer que el sitio sea interactivo
o como estilos en línea • ¡Esto ayuda al rendimiento de tu página! • Restricciones de CSS: • Límite de 50 KB • No se puede utilizar !important • Algunos settings de CSS están restringidos (como transition)
• Limita las dimensiones máximas de la imagen y agrega srcset • Convierte y comprime imágenes. • Sanitiza el HTML para evitar ataques XSS o errores de análisis
correo. Los remitentes pueden incluir componentes AMP en correos electrónicos enriquecidos y atractivos, lo que los hace dinámicos e interactivos. Los usuarios pueden interactuar con el contenido y tomar medidas rápidamente, como confirmar su asistencia a eventos, completar cuestionarios y personalizar su contenido. Los correos electrónicos de AMP están siempre actualizados y pueden funcionar como resúmenes, con menos clics necesarios para lograr resultados eficientes. • Seguro y a salvo. AMP para correo electrónico no tiene funciones de terceros arbitrarias para limitar los problemas de seguridad y supera con creces las capacidades que ofrecen actualmente los proveedores de terceros. Los componentes de anuncios no están permitidos en el correo electrónico AMP, lo que mantiene a los usuarios seguros. Para mantener las expectativas de seguridad y privacidad de los usuarios, solo se permitirá un subconjunto conservador de la funcionalidad AMP.
AMP dentro de un correo electrónico es simple, agregue una nueva parte MIME con un tipo de contenido de como un descendiente de . Debe convivir con las secciones o el sin formato definido. Esto asegura que el mensaje de correo electrónico funcione en todos los clientes. • Mayor personalización AMP para correo electrónico permite una participación del usuario más inteligente y eficiente, ya que los clientes pueden tomar medidas directamente desde su correo electrónico, como administrar sus suscripciones, responder a encuestas, garabatos y reservas. Esto es posible porque el servidor recupera contenido nuevo de puntos finales remotos, manteniendo el correo electrónico actualizado.
Las capacidades en expansión de AMP Email le permiten tomar medidas directamente desde su bandeja de entrada. Esto incluye carruseles y acordeones, y tomar la entrada del usuario en formularios y cuestionarios. • Servicios mejorados y más inteligentes El correo electrónico AMP ofrece una opción atractiva para correos electrónicos promocionales y de lista de suscriptores. A través de un compromiso más inteligente, puede mejorar la satisfacción del cliente a través de comentarios sin problemas y administración de suscripciones, todo dentro de su bandeja de entrada.
un árbol MIME (Multipurpose Internet Mail Extensions). Este árbol MIME contiene el cuerpo del mensaje y los archivos adjuntos al correo electrónico. Para incrustar AMP en un correo electrónico, agrega una nueva parte MIME con un tipo de contenido de como descendiente de . Debe convivir con o sin formato existentes. Esto asegura que el mensaje de correo electrónico funcione en todos los clientes.
se resuelven con componentes AMP • Si está atascado, busca ayuda en amp.dev • Aprenderás mucho más sobre los componentes y la documentación de AMP mientras lo usas.
gdgculiacan
10tera
thehaigo
little_rubyist
happymana
ivargrimstad
nekomatu
suzukihoge
mot_techtalk
javiergs
righttouch
jponch
dougneiner
keithpitt
maggiecrowley
panda_program
jnunemaker
bryan
sferik
lemiorhan
jrom
mongodb
marcduiker
![¡Gracias! Mauricio Angulo S. UX Architect [email protected]](https://files.speakerdeck.com/presentations/a3533278c9984b928d32eafabff676a1/slide_46.jpg){kind=link}