DISEÑANDO LA WEB MÓVIL
con
HTM
L5
y
CSS3
Javier Usobiaga · @htmlboy
Barcelona Visual Sound 2012
Slide 2
Slide 2 text
WEB MÓVIL
Slide 3
Slide 3 text
2012
los smartphones
no son cosa de geeks
Slide 4
Slide 4 text
PERO...
¿QUÉ ES UN MÓVIL?
Slide 5
Slide 5 text
¿un dispositivo
con una
pantalla
pequeña?
Slide 6
Slide 6 text
¿un dispositivo
que se puede
llevar encima
fácilmente?
Slide 7
Slide 7 text
¿un dispositivo
que se utiliza
normalmente
en la calle?
Slide 8
Slide 8 text
¿cualquier
dispositivo
con una pantalla
táctil y a color?
Slide 9
Slide 9 text
¿cualquier
dispositivo
que no sea
un sobremesa?
Slide 10
Slide 10 text
UN MÓVIL ES ESTO...
Slide 11
Slide 11 text
...Y ESTO
Slide 12
Slide 12 text
UN MÓVIL ES ESTO...
Slide 13
Slide 13 text
...Y ESTO
Slide 14
Slide 14 text
UN MÓVIL ES ESTO...
Slide 15
Slide 15 text
...Y ESTO
Slide 16
Slide 16 text
UN MÓVIL ES ESTO...
Slide 17
Slide 17 text
...Y ESTO
Slide 18
Slide 18 text
Y...
¿QUÉ HACEMOS?
Slide 19
Slide 19 text
HABLEMOS DE APPS
Slide 20
Slide 20 text
El debate de aplicaciones nativas
vs. aplicaciones móbiles sigue
siendo uno de los más polémicos.
Me parece ridículo. Nadie tiene
este problema respecto a las
aplicaciones nativas vs. las
aplicaciones de escritorio.
Cennydd Bowles
the-pastry-box-project.net/cennydd-bowles/2012-january-28
Slide 21
Slide 21 text
80%
de las apps de
marca no llegan
a 1.000 descargas
bit.ly/app-fail
Slide 22
Slide 22 text
No content
Slide 23
Slide 23 text
No content
Slide 24
Slide 24 text
No content
Slide 25
Slide 25 text
No content
Slide 26
Slide 26 text
+esfuerzo
+costes
+dolor
app app web
{
{
{
Slide 27
Slide 27 text
¿Y UNA
TEMPLATE
MÓVIL?
Slide 28
Slide 28 text
Creo que es peligroso denegar a
los usuarios el acceso al
contenido y la funcionalidad “por
su propio bien.” Asumir que sabes
lo que el visitante a tu página
web quiere y necesita basándote
solo en su dispositivo es ser muy
condescendiente.
Jeremy Keith
adactio.com/journal/1716
Slide 29
Slide 29 text
No content
Slide 30
Slide 30 text
No content
Slide 31
Slide 31 text
No content
Slide 32
Slide 32 text
No content
Slide 33
Slide 33 text
{
{
{
web web web
+versiones
+código
+dolor
Slide 34
Slide 34 text
UNA
WEB
Slide 35
Slide 35 text
La Web Móvil no existe. Sólo
existe La Web, y la vemos de
distintas formas. Tampoco existe
la Web de Escritorio. Ni la Web de
Tablet. Gracias.
Stephen Hay
the-haystack.com/2011/01/07/there-is-no-mobile-web
Slide 36
Slide 36 text
CONTENIDO
Slide 37
Slide 37 text
UNA WEB
CÓMO SE VERÁ
NUESTRA WEB
? ? ?
Slide 38
Slide 38 text
No content
Slide 39
Slide 39 text
{
web
+flexible
-control
-costes
Slide 40
Slide 40 text
REGLA DE ORO*
web app = template
*O DE BRONCE
contenido = una web
Slide 41
Slide 41 text
CON QUÉ HERRAMIENTAS
CONTAMOS
¿
?
Slide 42
Slide 42 text
NUEVA FILOSOFÍA
fallback
detectar capacidades
olvidarse del pixel perfect