Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Mobile Sites
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Victoria Ubaldo
July 21, 2017
Technology
66
1
Share
Mobile Sites
Talk for Google I/O Extended Lima 17.
Victoria Ubaldo
July 21, 2017
More Decks by Victoria Ubaldo
See All by Victoria Ubaldo
Introduction to NLP : How to improve accessibility with Machine Learning
vickyale
1
210
Analizar Datos con Python y Google Colab
vickyale
1
160
¿Cómo estar al día en Tecnología, como profesional tech?
vickyale
1
480
Primeros pasos en AI/ML
vickyale
0
120
ML Zero to Hero in GCP
vickyale
0
89
Agile & Big Data
vickyale
1
56
Clean Data with Python
vickyale
0
250
AoG Workshop for IWD19
vickyale
0
160
Introducción a Actions for Google Assistant
vickyale
0
80
Other Decks in Technology
See All in Technology
マルチエージェント × ハーネスエンジニアリング × GitLab Duo Agent Platformで実現する「AIエージェントに仕事をさせる時代へ。」 / 20260421 GitLab Duo Agent Platform
n11sh1
0
160
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
3.1k
The Journey of Box Building
tagomoris
4
2.8k
AndroidアプリとCopilot Studioの統合
nakasho
0
100
プラットフォームエンジニアリングの実践 - AWS コンテナサービスで構築する社内プラットフォーム / AWS Containers Platform Meetup #1
literalice
1
180
AWS認定資格は本当に意味があるのか?
nrinetcom
PRO
2
270
Microsoft 365 / Microsoft 365 Copilot : 自分の状態を確認する「ラベル」について
taichinakamura
0
240
AIを共同作業者にして書籍を執筆する方法 / How to Write a Book with AI as a Co-Creator
ama_ch
2
130
[OAWTT26][THR1028] Oracle AI Database 26ai へのアップグレード:ベストプラクティスと最新情報
oracle4engineer
PRO
1
110
LLM時代の検索アーキテクチャと技術的意思決定
shibuiwilliam
3
1.2k
M5Stack CoreS3とZephyr(RTOS)で Edge AIっぽいことしてみた
iotengineer22
0
220
自分のハンドルは自分で握れ! ― 自分のケイパビリティを増やし、メンバーのケイパビリティ獲得を支援する ― / Take the wheel yourself
takaking22
1
910
Featured
See All Featured
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.2k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
9
1.3k
How GitHub (no longer) Works
holman
316
150k
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
160
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
0
210
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
420
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.2k
Context Engineering - Making Every Token Count
addyosmani
9
830
Unlocking the hidden potential of vector embeddings in international SEO
frankvandijk
0
770
Testing 201, or: Great Expectations
jmmastey
46
8.1k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
360
30k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
2.9k
Transcript
Sitios Web Móviles Victoria Ubaldo G. Software Engineer @VikyAle
¿Cómo es la web que conocemos?
None
2B dispositivos
5B dispositivos conectados a la web
` Visibilidad Formato ligero Presentación intuitiva
vs. Source: comScore Mobile Metrix, U.S., Age 18+, June 2015
13% 87% Mobile web Apps
80% de tiempo gasta un usuario en solo 3 aplicaciones
Source: comScore Mobile Metrix, U.S., Age 18+, June 2015
CERO Es el número promedio de aplicaciones instaladas por usuarios
al mes Source: comScore Mobile Metrix, U.S., Age 18+, June 2015
Importancia de los sitios web móviles
` Visibilidad Formato ligero Presentación intuitiva
` Una sola compilación para todas las plataformas Adaptabilidad Costes
reducidos Abierto para todos Seguimiento sencillo
de usuarios abandonan un sitio que toma más de 3
segundos en cargar. 53%
Velocidad de los sitios web móviles
` Herramientas Básicas 1. Configurar DevTools demo
` Herramientas Básicas 2. Emular experiencia de un usuario de
dispositivo móvil Panel Network Capture Screenshots Disable Cache(Regular 3G)
` Herramientas Básicas 3. Analizar solicitudes DomContentLoaded
Tecnologías Web Avanzadas
AMP Accelerated Mobile Pages
AMP HTML = Normal HTML Source: comScore Mobile Metrix, U.S.,
Age 18+, June 2015
None
None
None
None
None
PWA Progressive Web Apps
es un nuevo nivel en mejorar la calidad de la
experiencia de uso Progressive Web Apps
None
None
Capacidad
Capacidad Alcance
Capacidad Alcance
Capacidad Alcance
Capacidad Alcance
Confiable Rápida Engaging (Involucrar al usuario) La experiencia de uso
necesita ser...
None
None
`
¿Cómo empiezo?
Tres enfoques para PWA-ifying desde el principio una sola característica
una versión simple
None
None
None
None
None
` 70% de bytes de tráfico en internet es video
` 70% de bytes de tráfico en internet es video
Media Sessions API Background Fetch Full-screen orientation
`
`
https://codelabs.developers.google.com/
None
Jake Archibald @jaffathecake Paul Lewis @aerotwist Addy Osmani @addyosmani Paul
Kinlan @Paul_Kinlan Googlers que trabajan a diario en herramientas y mejoras para PWA
Certificado Sitios Web para Móviles
None
None
None
None
Gracias! Twitter : @vikyale