Idées de titre (plus nazes les unes que les autres):

• Décrochez avec votre site mobile
• Votre site répond, même au téléphone
• Le web est une cible mouvante, suivez le avec le mobile
• Votre site dans la poche
• Faites bouger votre site avec une version mobile

1. Web mobile d’hier à aujourd’hui
2. One web? Stratégies pour que votre site soit mobile
3. Recommandations ergonomiques rapides (c’est pas le but de l’article)
4. Structure et media
5. CSS
6. Javascript
7. Conclusion, ouverture sur le futur du web mobile

On se rappelle du WAP 1.0 et du WML, de l’imode et de sa syntaxe dédiée. Languages spécifiques, nouvelles technologies à apprendre. Aujourd’hui, WAP 2.0, utilisation de XHTML et CSS. Aujourd’hui 2.7B de mobiles, des pays avec plus 100% de pénétration. Des dizaines de navigateurs différents, des proxies, des écrans différents, des fontes différentes, etc.

One web, un site web pour tous les appareils (W3C). Même technologies pour le web et le web mobile.

Différentes stratégies (de la moins lourde à la plus lourde)

1. Servir exactement les mêmes pages: aucune prise en compte des contraintes
2. Servir les même documents, avec une CSS adaptée: prise en compte de l’écran mais pas de l’utilisation
3. Servir une version adaptée, avec CSS adaptée: prise en compte des l’écran et des contraintes d’usage (navigation, input, mobilité, etc.)

• Penser au contexte (mobilité, en train de chercher un resto, recherche d’un no de tel, etc.)
  • Deux situation: passer le temps VS besoin d’une info

• Repenser pour le mobile
• Adapter pour l’affichage, l’input, la mobilité
• Allez à l’essentiel
• Contrainte du coût
• Prévenir les erreurs, pour éviter les aller-retour couteux
• Privilégier la recherche (taper quelques char plutot que browser une liste)

XHTML MP

div, span, p, br, b, small, form, input, select, option, textarea, table, tr, td, img, style, class

PNG, GIF, JPG, SVG tiny, flash lite

Quelques propriétés utilisables

color, background-color, border, margin, padding, text-align, vertical-align, font-size

Oubliez. Pour le moment.

On peut espérer une consolidation du marché des navigateurs avec l’émergence de Opera Mini, Webkit mobile (android). Apparition de terminaux capable de meilleurs prestations: iPhone (où le js est utilisable).

• http://www.w3.org/TR/mobile-bp/
• http://www.w3.org/Mobile/ : Mobile Web Initiative @ W3C
• http://www.w3.org/TR/xhtml-basic/ : XHTML Basic
• http://pc.dev.mobi/ : dev.mobi
• http://www.w3.org/Mobile/planet : Planet Web Mobile

• http://www.operamini.com/features/simulator/ Opera Mini emulator
• http://emulator.mtld.mobi/ .mobi emulator

• http://per.hedbor.org/mini.html: page test pour les hints

• http://www.google.com/mobile/ : google mobile apps
• http://m.technorati.com/ : technorati mobile
• http://m.flickr.com/ : flickr mobile
• http://www.youtube.com/mobile : Youtube mobile upload
• http://mobile.yahoo.com/ : Yahoo! mobile services