Optimisation CSS pour iPod et iPhone Safari

ipod touch et iphoneCréer des applications optimisées pour l'utilisation de l'iPod ou de l'iPhone est un excellent moyen de plonger dans un marché en pleine explosion avec plus de 1 milliard de téléchargements à ce jour. Il est important de réaliser que ces chiffres n'incluent pas les applications basées sur un navigateur qui sont optimisées pour Safari sur iPhone ou iPod Touch et ne nécessitent aucun téléchargement.

Aujourd'hui, j'ai mordu la balle et acheté un IPod Touch 16 Go pour commencer à vérifier la plate-forme pour Safari et les applications. Bien sûr… J'étais ravi de pouvoir regarder des films sur la route et que l'iPod Touch puisse aussi servir de télécommande pour mon AppleTV!

Ma première tâche consistait à mettre à jour mon Calculatrice de Salaire pour une utilisation avec Safari sur l'iPod Touch ou l'iPhone. C'est une application que j'ai créée dans pratiquement toutes les langues… il est donc temps que je commence à apprendre le développement pour Safari et le framework Apps.

Chose intéressante, l'affichage de la page dans Safari n'utilisait pas automatiquement le media = portable css, j'ai donc dû écrire des scripts côté serveur en PHP pour utiliser la feuille de style appropriée:


> link rel = "stylesheet" media = "screen" href = "iphone.css" type = "text / css" />
>? php} else {?>
> link rel = "stylesheet" media = "screen" href = "style.css" type = "text / css" />
>? php}?>

J'ai une bonne page, mais je sais qu'il y a une tonne de Arguments CSS pour iPhone et iPod Safari Je peux utiliser, même déplacer des composants selon que l'orientation de la page est paysage ou portrait. Je vais continuer à expérimenter !

Vous avez un iPhone ou un iPod Touch? Essayez le Calculatrice de Salaire et laissez-moi savoir à quoi cela vous ressemble! Gardez à l'esprit que pratiquement tous les changements entre les pages ont été effectués uniquement avec CSS! Il a peut-être été plus facile d'écrire simplement une page entièrement nouvelle - mais pas aussi difficile.

3 Commentaires

  1. 1

    Douglas-

    Merci pour les astuces CSS iPhone… serait-ce similaire pour un Blackberry ou un autre smartphone utilisant un navigateur mobile?

    • 2

      Salut Ken,

      Non - la plupart des navigateurs mobiles peuvent appliquer un media = "portable" désignation css. Safari sur l'iPod touch ou l'iPhone ignore cela, cependant.

      Doug

  2. 3

    Je dois me procurer un iPhone, je n'ai même pas d'iPod touch. Je vais me perdre avec le css et tout ça, tout ce qui a du code est hors de ma ligue lol

Que pensez-vous?

Ce site utilise Akismet pour réduire les spams. Découvrez comment sont traitées les données de vos commentaires..