L’arrivée de l’iPhone dans le marché du mobile a complètement révolutionné notre manière de naviguer sur Internet lors de voyages ou de déplacement. Il est rapidement devenu la quatrième plateforme la plus utilisée pour surfer sur la toile, juste après Windows, Mac et Linux, laissant derrière lui d’autres systèmes comme Symbian OS, SunOS ou Playstation.
Les utilisateurs d’iPhone et iPod Touch représentent ainsi un marché considérable que vous ne saurez que mieux toucher en développant des sites adaptés pour un affichage mobile.
Rappelez-vous ce à quoi ressemblait le web mobile en 2006 : des services WAP mal référencés et pour la plupart incompris ou inutilisés par le grand public, des coûts de navigation exhorbitants, et des navigateurs mobile incapables de comprendre la moindre instruction de mise en forme CSS, exception faites de certains Smartphones professionels.
Avec l’iPhone, Apple a su faire tomber ces barrières, notamment grâce à Safari mobile. Celui-ci est capable d’afficher et de rendre utilisable les sites optimisés pour un grand écran d’ordinateur sur un petit écran, et avec la technologie multitouch, le duo est parfait.
Alors, pourquoi se casser la tête à créer des sites pour l’iPhone alors que celui-ci peut déjà parfaitement afficher des sites optimisés pour de grands écrans ? Tout est question d’optimisation.
Un site optimisé pour un affichage mobile offrira une expérience utilisateur beaucoup plus agréable et enrichissante car les internautes n’auront pas à se soucier de zoomer pour distinguer telle ou telle zone d’un site. Dans le meilleur des cas, ils pourront même avoir l’impression d’utiliser une application plutôt qu’un site Web.
Applications iPhone vs. Application Web iPhone : Et les vraies applications dans tout ça ?
L’utilisation du SDK d’Apple permet de tirer davantage parti des performances du téléphone et de faire des choses que nous ne serons jamais capables de faire sur un site Web. Certes. Mais cela vous oblige à apprendre un nouveau langage, à faire valider votre application par Apple qui a tous les droits de la refuser, et ne rend votre travail accessible que par l’intermédiaire d’un système : l’AppStore.
Tenons-nous en à ce que nous savons faire de mieux des sites Internet. Safari Mobile interprète HTML, Javascript et CSS, et certaines fonctions vous permettent même de détecter de manière dynamique l’orientation de l’iPhone. Autant dire que nous avons là sufisamment d’outils pour développer des choses merveilleuses.
Google en est l’exemple parfait : Gmail, Google Calendar, Google Reader et plusieurs autres services ont été optimisés pour l’iPhone. Non pas sous forme d’applications se basant sur le SDK mais sous forme de sites Internet dynamiques optimisés pour Safari Mobile.
Comment développer un site optimisé pour l’iPhone ?
Nous vous proposons ci-dessous une liste de liens qui vous permettront de débuter dans le développement de sites Internet destinés à l’iPhone. Des tutoriaux étape par étape, des framework permettant de rapidement mettre en place des sites ressemblant à des applications natives, des éléments graphiques, etc… Vous avez là toutes les ressources nécessaires pour commencer.
N’hésitez pas à nous faire part d’autres ressources que vous auriez découvert ou à nous donner le lien de sites pour iPhone que vous avez développé !
Tutorial : Apprenez à développer pour l’iPhone
Excelent tutorial étape par étape de Nettuts qui vous permettra de construire facilement un site pour l’iPhone.
Nettuts : Learn How To Develop For The iPhone
http://nettuts.com/misc/learn-how-to-develop-for-the-iphone/
Tutorial : Construire un site Web pour l’iPhone
Un autre tutorial étape par étape pour construire un site pour l’iPhone
Engage Interactive: Building a website for the iPhone
http://www.engageinteractive.co.uk/blog/2008/06/19/tutorial-building-a-website-for-the-iphone/
iPhoney : Simulateur iPhone Safari Mobile pour designers
Application pour Mac permettant de simuler le navigateur de l’iPhone, Safari Mobile.
http://www.marketcircle.com/iphoney/
TestiPhone
Un autre simulateur, cette fois sous forme de site Internet pour tester votre travail sur l’iPhone. À utiliser avec Safari de préférence.
http://www.testiphone.com/
iUI
Librairie permettant de reproduire l’interface utilisateur d’applications iPhone avec du simple HTML. Permet de détecter l’orientation de l’iPhone. Offre une expérience utilisateur “iPhone-like”. Vous trouverez ci-dessous un tutorial pour iUI
http://code.google.com/p/iui/
Tutorial pour iUI
http://www.webmonkey.com/tutorial/Build_an_iPhone-Optimized_Website_with_iUI
iWebKit
Une autre librairie permettant de mettre en place très facilement un site Internet pour l’iPhone.
http://www.iwebkit.net/index.html
Exemple de site iPhone
Différents exemples destinés à l’iPhone desquels vous pouvez vous inspirer. Testez avec votre iPhone pour vous faire une vraie idée.
http://groupaware.mobi/iphone/index.html
Perfect multi-column CSS liquid layouts
Mises en page CSS multi-colonnes compatibles avec l’iPhone
http://matthewjamestaylor.com/blog/perfect-multi-column-liquid-layouts
iPhoneWebDev
Exemples de pages et de fonctionnalités destinés à l’iPhone et offerts avec leurs sources.
http://www.iphonewebdev.com/examples/
iPhone GUI PSD
Un fichier PSD regroupant tous les éléments graphiques utilisés nativement par l’iPhone.
http://www.teehanlax.com/blog/?p=447
A List Apart : Put Your Content in My Pocket
Excellent article de A List Apart qui vous accompagne dans l’adaptation de votre site pour l’iPhone
http://alistapart.com/articles/putyourcontentinmypocket
6 trucs & astuces pour optimiser votre site pour l’iPhone
Utilisez des styles optimisés pour Safari Mobile, définition du zoom par défaut, détection de l’orientation de l’iPhone, cacher la barre d’outils de l’iPhone, optimiser les images pour l’iPhone, composer sans le support de Flash
http://iphonemicrosites.com/articles/6-tips-to-optimize-your-current-site-for-the-iphone/
Ajoutez un icône d’accueil à votre site pour l’iPhone et détectez son orientation
http://www.hanselman.com/blog/MakeYourWebsiteMobile…
Aucun commentaire:
Enregistrer un commentaire