Comment construire html5 applications ipad

Recherche et Préparation

1. Sélectionnez un programme à utiliser pour la construction de l'application. Bien que vous pouvez utiliser des programmes sophistiqués de conception Web tels que Adobe Dreamweaver, vous pouvez également utiliser un éditeur de texte comme Notepad base pour créer des fichiers HTML et CSS.

2. Recherche Safari Developer d'Apple Bibliothèque des tutoriels et des exemples de code. Le code est disponible pour un grand nombre des caractéristiques iPad, tel que "SlideMe," ainsi que d'autres HTML, CSS et javascript codes spécifiquement pour les appareils Apple iOS et pour Safari en général.

3. Familiarisez-vous avec les normes et les capacités de HTML5, CSS et javascript pour l'iPad. Tutoriels et des exemples de codes sont disponibles dans les livres de la bibliothèque ainsi que de développeurs expérimentés dans les blogs et forums.

Conception de l'App

1. Créer une page HTML distincte pour chaque page de votre application. Utilisez les liens HTML de demander aux utilisateurs de passer d'une page à l'autre.

2. 
   
   
   

   Utilisez les événements tactiles plutôt que les événements de souris sur les pages d'applications pour accueillir l'interface de l'écran tactile iPad. Par exemple, utiliser "touchstart," "touchEnd," "TouchMove" et "touchcancel," plutôt que d'utiliser les événements de souris.

3. Utilisation "textarea" attributs de style pour les zones où l'utilisateur doit saisir du texte dans l'application. L'iPad ne supporte pas la "contenteditable" attribuer cet ordinateur navigateurs Web utilisent.

4. 
   
   
   
   

   Inclure le "" attribuer à chaque page si vous voulez l'application soit disponible hors ligne. Notez que vous aurez également besoin d'un "htaccess" et "manifeste" déposer dans le répertoire racine de l'application afin d'utiliser les capacités de cache de HTML5.

Icon Design

1. Sélectionnez une image représentative de votre application, ou de créer une nouvelle image en utilisant un programme de conception graphique comme GIMP ou Photoshop. Lorsque les utilisateurs économisent l'application à partir de Safari, l'icône apparaîtra sur l'écran d'accueil.

2. Enregistrez l'image sous un fichier PNG qui est de 114 par 114 pixels en taille avec le nom "apple-touch-icon.png." Placez le fichier d'image dans le répertoire racine de l'application iPad. La brillance stylisée iPad et coins arrondis sont appliquées à l'icône lorsqu'il est enregistré sur l'appareil.

3. Inclure un lien vers l'icône dans l'en-tête des pages d'applications Web en utilisant le "" le format. Ce lien dirige l'iPad, ou tout autre appareil Apple iOS, à l'endroit où l'icône est enregistrée.

Test sur votre ordinateur

1. Télécharger Safari le navigateur Web d'Apple à partir apple.com/safari, et l'installer sur votre ordinateur. Ce navigateur vous permettra de tester votre application à partir de votre ordinateur pendant que vous construisez.

2. Lancez Safari. Sélectionner "Préférences" du "Fichier" menu, et sélectionnez "Avancée." Cliquez "Montrer Développer Menu dans la barre de menus" option. Le "Développer" menu apparaît en haut de la fenêtre.

3. Cliquez sur le "Développer" menu. Sélectionner "User Agent," puis "Autres." Une boîte de dialogue apparaît. Double-cliquez sur le contenu, et appuyez sur "Supprimer." Pâte "Mozilla / 5.0 (iPad-U CPU OS 3_2 comme Mac OS X fr-fr) AppleWebKit / 531.21.10 (KHTML, comme Gecko) Version / 4.0.4 Mobile / 7B334b Safari / 531.21.10" dans le champ de texte. Safari va maintenant se comporter comme la version iPad.