Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Mobile Sites
Search
Victoria Ubaldo
July 21, 2017
Technology
70
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
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
220
Analizar Datos con Python y Google Colab
vickyale
1
180
¿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
110
Agile & Big Data
vickyale
1
70
Clean Data with Python
vickyale
0
270
AoG Workshop for IWD19
vickyale
0
170
Introducción a Actions for Google Assistant
vickyale
0
90
Other Decks in Technology
See All in Technology
オブザーバビリティを高める AI エージェント体験を考える / Designing AI Agent Experiences That Enhance Observability
aoto
PRO
2
320
オンラインゲームのシステム全体像 - コロプラ 2026年度 新卒研修
colopl
0
1k
脆弱性診断って、何をしているの? 〜弱点を見つけて、会社の改善につなげるまで〜
keeg
0
770
LocalStack を使ったサーバーレスアプリケーション開発 / Serverless Development with LocalStack
kakakakakku
1
340
二歩目のフロントエンド・ウェブアクセシビリティ
camiha
2
250
Kiro Crewをはじめよう
kizawa2020
1
110
AI時代だからこそ推したい!Gitコマンド再入門
munakata
0
160
契約書画像からの情報抽出に特化した視覚接地モデルを育てる話
sansantech
PRO
1
160
不可逆な意思決定を避けながら10億超の顧客データを AI Ready にするデータ基盤設計
baseballyama
1
240
AgentCoreで実践するハーネスエンジニアリング
yakumo
1
290
Deep Data Security 機能解説
oracle4engineer
PRO
2
740
スキルを作る、その前に!複数人で使われるスキルを 作るためのプロセス
junkifurukawa
2
370
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
20k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.5k
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
6.1k
Navigating Weather and Climate Data
rabernat
0
550
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
33
5.1k
Unsuck your backbone
ammeep
672
58k
Leo the Paperboy
mayatellez
10
2.4k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
2.1k
Bash Introduction
62gerente
615
220k
A Soul's Torment
seathinner
8
3.7k
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