Comment faire une page web compatible iPhone

Citation:

---

Envoyé par Macmillenium

Chaque navigateur intègre une feuille de style par défaut qui contient toutes les propriétés/valeurs appliquées par défaut sur les différents éléments.

Pour faire un reset le mieux serait de déclarer un font-size:62,5% ou font-size:77% sur le body et utiliser des valeurs en em (qui seront calculées à partir du font-size du body) pour le reste des éléments.

Le navigateur calcule par la suite la bonne valeur.

---

hmmm... intéressant. Je vais essayé cela.

Citation:

---

Envoyé par Macmillenium

A savoir que certains Agents utilisateurs sont capables de lire dans le Média screen et handheld, la feuille css-media-handheld.css devrait donc contenir des correctifs.

---

Non justement même si ça peut être le cas en réalité, les UA qui ne lisent QUE handheld devrait être servis avec une CSS complète comprenant les correctifs qui s'imposent.

On pourrait aussi ajouter par exemple

Code:

---

1 2 3

<!--[if !IE]> <--> <link rel="stylesheet" type="text/css" href="screen.css" media="screen and (min-device-width: 620px)" /> <!--> <![endif]-->

---

On exlue IE (qui n'implémente pas encore les media queries) et ont sert la CSS screen uniquement si la largeur du viewport dépasse 620px, afin d'obtenir un contenu linéarisé pour les UA qui ne prennent pas en compte le media handheld.

Ceci dit cette méthode n'est pas à généraliser non plus, à voir selon le cas.

Citation:

---

Pour faire un reset le mieux serait de déclarer un font-size:62,5%

---

Mieux vaut ne pas descendre au dessous de 75% pour ne pas obtenir des tailles de font trop petites dans certaines configs.

Citation:

---

Envoyé par Erwan31

Non justement même si ça peut être le cas en réalité,

---

Des tests sur un Pocket PC m'ont confirmé que c'est malheureusement le cas.
Ceci dit, il ne faut surtout pas partir dans une CSS différente et entièrement dédiée au média handheld.

Citation:

---

Envoyé par Erwan31

les UA qui ne lisent QUE handheld devrait être servis avec une CSS complète comprenant les correctifs qui s'imposent.

---

Oui c'est ce que je disais :

Citation:

---

Ensuite, si l'Agent Utilisateur n'implémente pas le fameux module Média Queries mais arrive à lire dans le Média handheld, il serait donc possible de viser ce type de média

---

Citation:

---

Envoyé par Erwan31

On pourrait aussi ajouter par exemple

Code:

---

1 2 3

<!--[if !IE]> <--> <link rel="stylesheet" type="text/css" href="screen.css" media="screen and (min-device-width: 620px)" /> <!--> <![endif]-->

---

On exlue IE (qui n'implémente pas encore les media queries) et ont sert la CSS screen uniquement si la largeur du viewport dépasse 620px, afin d'obtenir un contenu linéarisé pour les UA qui ne prennent pas en compte le media handheld.

---

Il n y a pas que IE, Gecko n'implémente pas non plus les Media Queries (et heureusement que Minimo (Navigateur mobile basé sur Gecko) n'est pas largement utilisé).
Cette méthode reste réservée aux navigateurs Webkit et Presto.

Citation:

---

Des tests sur un Pocket PC m'ont confirmé que c'est malheureusement le cas.

---

Je ne connais pas encore la solution idéale (si elle existe) mais il faut pourvoir anticiper sur tous les cas de figure.

Citation:

---

Envoyé par Macmillenium

Ceci dit, il ne faut surtout pas partir dans une CSS différente et entièrement dédiée au média handheld.

---

Et pourquoi ça?

Citation:

---

Envoyé par Macmillenium

Il n y a pas que IE, Gecko n'implémente pas non plus les Media Queries (et heureusement que Minimo (Navigateur mobile basé sur Gecko) n'est pas largement utilisé).
Cette méthode reste réservée aux navigateurs Webkit et Presto.

---

Ce n'est plus vrai, les média queries sont en théorie implémentées sur FF depuis sa version 3 et sont maintenant applicable sur FF 3.5.

Citation:

---

Envoyé par Erwan31

Et pourquoi ça?

---

Pour éviter simplement les mauvaises surprises :

Citation:

---

A savoir que certains Agents utilisateurs sont capables de lire dans le Média screen et handheld, la feuille css-media-handheld.css devrait donc contenir des correctifs.

---

Autrement dit, au lieu de se lancer dans le développement d'une feuille de style handheld différente comme Rollois et TekP@f pensaient faire (si j'ai bien compris), il serait préférable de partir directement des CSS Screen et appliquer les correctifs, de telle manière qu'en cas d'interprétation des CSS handheld et Screen en même temps, les styles seront écrasées.

Citation:

---

Envoyé par Erwan31

Ce n'est plus vrai, les média queries sont en théorie implémentées sur FF depuis sa version 3 et sont maintenant applicable sur FF 3.5.

---

Je ne vois pas ce que tu veux dire par "en théorie implémentées" mais d'après le blog de Mozilla l'implémentation des Media Queries semble faire partie des nouveautés sur FF3.5.

Il y a aussi Konqueror, le navigateur populaire sous Linux qui n'implémente pas également les Media Queries ... bref, je pense que l'utilisation de ce type de requêtes pour viser le media screen risque d'attendre encore quelques années.

Citation:

---

Envoyé par Macmillenium

Autrement dit, au lieu de se lancer dans le développement d'une feuille de style handheld différente comme Rollois et TekP@f pensaient faire (si j'ai bien compris), il serait préférable de partir directement des CSS Screen et appliquer les correctifs, de telle manière qu'en cas d'interprétation des CSS handheld et Screen en même temps, les styles seront écrasées.

---

On s'est mal compris, c'est bien ce que je voulais dire ;)
Ce qui me gêne c'est ta formulation un peu péremptoire

Citation:

---

Ceci dit, il ne faut surtout pas partir dans une CSS différente et entièrement dédiée au média handheld.

---

Ça dépend ce que tu englobes dans le mot "correctifs".
Rien n'interdit de créer une nouvelle CSS (en reprenant uniquement les élément relatifs à l'identité graphique) qui tient compte des contraintes d'utilisation du media...
Ça c'est le minimum à mettre en place, après pour éviter de saturer la bande passante (plus faible sur les appareils portatifs) et la surcharge informationnelle, il est préférable de ne servir que le contenu nécessaire
mais là c'est plus compliqué.

Citation:

---

Envoyé par Macmillenium

Je ne vois pas ce que tu veux dire par "en théorie implémentées" mais d'après le blog de Mozilla l'implémentation des Media Queries semble faire partie des nouveautés sur FF3.5.

---

En fait les media queries devraient fonctionner depuis FF3 mais ce n'est pas le cas dans la pratique ou alors leur implémentation n'est que partielle.

Citation:

---

Envoyé par Macmillenium

Il y a aussi Konqueror, le navigateur populaire sous Linux qui n'implémente pas également les Media Queries ...

---

Merci pour l'info ;)

Citation:

---

Envoyé par Erwan31

Ça c'est le minimum à mettre en place, après pour éviter de saturer la bande passante (plus faible sur les appareils portatifs) et la surcharge informationnelle, il est préférable de ne servir que le contenu nécessaire
mais là c'est plus compliqué.

---

Oui mais bon la bande passante c'est encore une autre histoire pour les appareils mobiles et nécessite d'autres interventions (Optimisation du nombre de requêtes HTTP, compression des fichiers coté serveurs etc.)
Bref je suis d'accord avec toi, c'est plus compliqué :)

Ce logiciel peut convertir un fichier .FLA en HTML
WALLABY
http://labs.adobe.com/technologies/wallaby/