Création d'un site web mobile-friendly est devenu crucial pour tout site web voulant une présence sur le Web mobile. Compte tenu de l'augmentation du montant des individus accéder à des sites à partir d'appareils mobiles compatibles avec Internet, les sites Web inaccessibles à partir de périphériques mobiles vont perdre une partie considérable de visiteurs. Compatibilité du navigateur reste le plus grand défi à transformer un site Web en une version mobile Lite. Les propriétaires de sites peuvent prendre quelques mesures standard, cependant, pour optimiser leur site Web pour le Web mobile et de rendre leur site Web mobile convivial.
Créer une feuille de style séparée pour les appareils mobiles en déclarant l'option de poche pour l'attribut des médias lors de la liaison de la feuille de style mobile pour les pages HTML. Ajout d'une autre feuille de style pour les appareils mobiles annule tous les styles de la feuille de style de l'écran, la feuille de style rendue par ordinateurs réguliers. Utiliser une feuille de style séparée pour les navigateurs mobiles permet aux propriétaires de site Web pour le style de la version mobile de leur site web différemment pour accueillir différents navigateurs et plates-formes mobiles.
Redimensionner les images pour les petites tailles d'écran avec le logiciel de retouche d'image. Écrans mobiles plus petits ont généralement plus de difficulté à rendre des images plus grandes et les redimensionner à la volée. En outre, la visualisation des images plus grandes sur les petits appareils mobiles consomme du temps de charge et de bande passante. Réduire les temps de chargement et économiser la bande passante en compressant les tailles d'image.
Présent tout le contenu dans un format linéaire, une colonne. Retirer toutes les colonnes, flotteurs et des cadres de feuilles de style mobiles. Ces éléments ont tendance à causer des problèmes de vision pour les appareils mobiles. En outre, éviter d'utiliser des pixels lors de la déclaration hauteur et la largeur des mesures en CSS. Pixels créent tailles navigateur rigides qui peuvent apparaître trop grande pour certains écrans mobiles, provoquant utilisateurs de faire défiler horizontalement. Au lieu de cela, faire usage de pourcentage et em unités de mesure pour créer tailles navigateur fluides, adaptées à plusieurs tailles d'écran.
Fournir la navigation du site clair et concis. Mobile navigation sur Internet produit des taux de rebond élevé parce que les lecteurs mobiles veulent se rendre à contenu souhaité en aussi peu de clics que possible. Supprimer les liens vers les sections du site Web de faible priorité pour les téléspectateurs mobiles. Sinon, déplacez menus de navigation au bas de la page pour servir éléments les plus importants tels que le contenu d'abord, dit Patrick Altoft au Blogstorm.
Testez la convivialité mobile de ce site. De la même façon face à des tests réguliers des sites Web, les versions mobiles des sites Web exigent des tests et de validation. Testez une version mobile du site Web sur les smartphones populaires, tels que le BlackBerry et iPhone, et autres appareils de base mobiles. Vérifiez convivialité mobiles globale d'un site Web en validant avec vérificateur mobileOK du W3C (voir Ressources). Assurer un site Web conforme aux normes Web mobiles garantit la compatibilité du site à travers de multiples dispositifs mobiles.