Tout le monde connaît très bien la balise méta dans les mises en page Web sur les plateformes de bureau. Elle est toujours située à l'intérieur de l'élément head. Les amis qui font du référencement doivent avoir un sens particulier des méta sur les plateformes mobiles. , quels sont les effets magiques des balises méta sur les plateformes mobiles ?
1. La fenêtre d'affichage de Meta
En parlant de balises méta de plateforme mobile, nous devons parler de viewport. Alors, qu'est-ce que viewport ?
Viewport est la zone visuelle. Pour les navigateurs de bureau, viewport fait référence à la zone utilisée pour afficher les pages Web après avoir supprimé toutes les barres d'outils, barres d'état, barres de défilement, etc.
. Pour les pages WEB traditionnelles, il est normal que la largeur de 980 soit affichée sur l'iPhone, et elle remplit également l'écran. Mais pour les webapps, cela peut poser un peu problème. Sur les iPhones, nos webapps ont généralement une largeur de . 100cm en mode portrait 320, quel effet affichera notre page 320 sur l'iPhone ? Certaines personnes peuvent penser que l'iPhone ne fait pas 320 mm de large, il devrait remplir l'écran, n'est-ce pas ? Jetons un coup d'œil à la façon dont la disposition suivante apparaît sur l'iPhone
Nous devons donc changer la fenêtre d'affichage. Nous avons les valeurs d'attribut suivantesqui peuvent être définies :
largeur : largeur de la fenêtre (plage de 200 à 10 000, la valeur par défaut est 980 pixels)
hauteur : hauteur de la fenêtre (plage de 223 à 10 000)
échelle initiale : mise à l'échelle initiale (plage de > ;0 à 10)
échelle minimale : le rapport minimum sur lequel l'utilisateur est autorisé à zoomer
échelle maximale : le rapport maximum sur lequel l'utilisateur est autorisé à zoomer
évolutif par l'utilisateur : si le l'utilisateur peut zoomer manuellement
Pour ces attributs, nous pouvons en définir un ou plusieurs, et vous n'avez pas besoin de les définir tous en même temps. L'iPhone calculera automatiquement d'autres valeurs d'attribut en fonction des attributs que vous définissez, au lieu de. directement en utilisant les valeurs par défaut.
Si vous définissez initial-scale=1, alors la largeur et la hauteur seront automatiquement de 320*356 en mode portrait (et non de 320*480 car la barre d'adresse, etc. occupent toutes de l'espace), et de 480*208 en mode paysage. De même, si vous définissez uniquement la largeur, l'échelle initiale et la hauteur seront automatiquement calculées. Par exemple, si vous définissez la largeur = 320, l'échelle initiale est de 1 lorsque l'écran est en mode portrait et elle devient 1,5 lorsque l'écran est en mode paysage. Alors, comment ces paramètres permettent-ils à Safari de le savoir ? En fait, c'est très simple, juste une méta, sous la forme :
telephone=yes permet la conversion des numéros en liens d'accès commuté. Pour activer la fonction de conversion, il n'est pas nécessaire d'écrire cette méta. Elle est activée par défaut !
3. Apple-mobile-web-app-capable de Meta
La fonction de cette méta est de supprimer la barre d'outils et la barre de menu Apple par défaut. le contenu a deux valeurs "oui" et "non". Lorsque nous devons afficher la barre d'outils et la barre de menus, il n'est pas nécessaire d'ajouter cette ligne de méta. La valeur par défaut est de l'afficher.
4. Méta du style apple-mobile-web-app-status-bar