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
Victoria Ubaldo
July 21, 2017
Technology
1
58
Mobile Sites
Talk for Google I/O Extended Lima 17.
Victoria Ubaldo
July 21, 2017
Tweet
Share
More Decks by Victoria Ubaldo
See All by Victoria Ubaldo
Introduction to NLP : How to improve accessibility with Machine Learning
vickyale
1
200
Analizar Datos con Python y Google Colab
vickyale
1
140
¿Cómo estar al día en Tecnología, como profesional tech?
vickyale
1
430
Primeros pasos en AI/ML
vickyale
0
110
ML Zero to Hero in GCP
vickyale
0
73
Agile & Big Data
vickyale
1
40
Clean Data with Python
vickyale
0
230
AoG Workshop for IWD19
vickyale
0
140
Introducción a Actions for Google Assistant
vickyale
0
68
Other Decks in Technology
See All in Technology
💡Ruby 川辺で灯すPicoRubyからの光
bash0c7
0
110
機械学習を扱うプラットフォーム開発と運用事例
lycorptech_jp
PRO
0
250
生成AI時代のデータ基盤設計〜ペースレイヤリングで実現する高速開発と持続性〜 / Levtech Meetup_Session_2
sansan_randd
1
150
MCPで変わる Amebaデザインシステム「Spindle」の開発
spindle
PRO
3
3.2k
AWSを利用する上で知っておきたい名前解決のはなし(10分版)
nagisa53
10
3.1k
オブザーバビリティが広げる AIOps の世界 / The World of AIOps Expanded by Observability
aoto
PRO
0
380
ハードウェアとソフトウェアをつなぐ全てを内製している企業の E2E テストの作り方 / How to create E2E tests for a company that builds everything connecting hardware and software in-house
bitkey
PRO
1
130
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
9
73k
要件定義・デザインフェーズでもAIを活用して、コミュニケーションの密度を高める
kazukihayase
0
110
まずはマネコンでちゃちゃっと作ってから、それをCDKにしてみよか。
yamada_r
2
100
[ JAWS-UG 東京 CommunityBuilders Night #2 ]SlackとAmazon Q Developerで 運用効率化を模索する
sh_fk2
3
420
Django's GeneratedField by example - DjangoCon US 2025
pauloxnet
0
150
Featured
See All Featured
Speed Design
sergeychernyshev
32
1.1k
4 Signs Your Business is Dying
shpigford
184
22k
Into the Great Unknown - MozCon
thekraken
40
2k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
46
7.6k
Six Lessons from altMBA
skipperchong
28
4k
Building Adaptive Systems
keathley
43
2.7k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.1k
Producing Creativity
orderedlist
PRO
347
40k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
188
55k
GitHub's CSS Performance
jonrohan
1032
460k
GraphQLの誤解/rethinking-graphql
sonatard
72
11k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
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