Mobile-first indexing : l'index de référence depuis 2019
Qu'est-ce que le mobile-first indexing ?
Le mobile-first indexing est la politique de Google (appliquée depuis septembre 2019 à l'ensemble des sites) qui consiste à utiliser la version mobile du contenu comme index de référence. Concrètement : c'est le HTML, le contenu, les balises et les métadonnées de la version mobile qui déterminent le classement, pas la version desktop.
Avant 2019, Google indexait la version desktop par défaut et utilisait la version mobile uniquement pour les recherches sur mobile. Depuis 2019, la version mobile est la seule qui compte. Si votre site mobile est moins complet, moins rapide ou moins bien structuré que la version desktop, c'est la version mobile qui détermine votre classement — même pour les recherches effectuées sur desktop.
Ce que ça change concrètement
Le mobile-first indexing impacte 5 dimensions du site :
| Dimension | Avant 2019 | Depuis 2019 |
|---|---|---|
| Contenu indexé | Version desktop | Version mobile |
| Balises (title, meta, H1) | Version desktop | Version mobile |
| Données structurées | Version desktop | Version mobile |
| Liens internes | Version desktop | Version mobile |
| URLs indexées | Version desktop | Version mobile |
Si votre site est responsive (un seul code HTML, adapté via CSS media queries), la version mobile et desktop sont identiques en contenu → pas d'impact. Si votre site a une version mobile séparée (m.yperline.net, ou du contenu masqué sur mobile via CSS display: none), le contenu masqué n'est pas indexé.
Vérifier que votre site est mobile-first ready
- Google Search Console → « Améliorations » → « Mobile » : détecte les problèmes de responsive (texte illisible, éléments trop petits, viewport non configuré).
- Google Mobile-Friendly Test (developers.google.com/mobile-friendly) : tester une URL → rapport détaillé des problèmes.
- Inspection manuelle : ouvrir le site sur un smartphone (360 px de large). Vérifier : contenu lisible, navigation utilisable, boutons cliquables, pas de zoom forcé.
- Comparaison desktop / mobile : ouvrir la même page en desktop et en mobile. Le contenu (textes, images, liens, schemas) doit être identique. Si un tableau est masqué sur mobile, il n'est pas indexé.
- Vue source : sur mobile, faire « Voir le code source » et vérifier que le contenu complet est dans le HTML (pas injecté par JS après chargement).
Responsive vs mobile-first : la différence
Deux concepts distincts qui sont souvent confondus :
| Concept | Définition | Exemple |
|---|---|---|
| Responsive design | Un seul code HTML/CSS qui s'adapte à toutes les tailles d'écran (media queries, flexbox, grid) | Le site s'affiche correctement sur 360 px, 768 px et 1440 px |
| Mobile-first (approche de design) | Le design est conçu d'abord pour mobile, puis enrichi pour desktop (CSS mobile-first : styles de base = mobile, media queries = desktop) | body { font-size: 16px; } @media (min-width: 768px) { body { font-size: 18px; } } |
| Mobile-first indexing | La politique de Google qui indexe la version mobile comme référence | Google lit le HTML mobile pour indexer et classer |
Recommandation : utiliser un responsive design avec une approche mobile-first (CSS mobile-first). C'est la solution la plus simple : un seul code, un seul index, pas de divergence entre versions.
Le contenu doit être identique
La règle la plus importante du mobile-first indexing : le contenu de la version mobile doit être identique à celui de la version desktop. Concrètement :
- Textes : pas de contenu « desktop-only » (paragraphes masqués sur mobile via
display: noneouvisibility: hidden). - Images : les images présentes sur desktop doivent être présentes sur mobile (même en version optimisée). Les
altdoivent être identiques. - Liens : les liens internes présents sur desktop doivent être accessibles sur mobile (même si le menu est replié en hamburger).
- Données structurées : les schemas JSON-LD doivent être présents dans le HTML mobile (pas seulement dans le HTML desktop).
- Balises : title, meta description, H1, H2 doivent être identiques sur mobile et desktop.
Le piège du display: none
Si vous masquez un contenu sur mobile avec display: none ou visibility: hidden, Google ne l'indexe pas. C'est le cas typique des :
- Tableaux comparatifs « trop larges » pour mobile → masqués au profit d'une liste simplifiée.
- Colonnes de sidebar (liens, widgets) → masquées sur mobile.
- Contenu « bonus » desktop (infographies, vidéos embed) → masquées sur mobile.
Solution : au lieu de masquer, adapter. Un tableau trop large devient une liste sur mobile. Une sidebar devient une section en bas de page. Le contenu est toujours dans le HTML, mais la mise en page change.
Performance mobile : les seuils
Les Core Web Vitals sont mesurés en priorité sur mobile. Les seuils sont les mêmes que sur desktop, mais l'atteinte est plus difficile à cause de la connexion et du hardware :
| Métrique | Seuil « bon » | Seuil « médiocre » | Spécificité mobile |
|---|---|---|---|
| LCP | ≤ 2,5 s | ≥ 4,0 s | Connexion 4G/5G → TTFB 2-3× plus élevé qu'en fibre |
| INP | ≤ 200 ms | ≥ 500 ms | Hardware milieu de gamme → long tasks 2-3× plus lents |
| CLS | ≤ 0,1 | ≥ 0,25 | Viewport réduit → les shifts sont plus visibles |
UX mobile : les 7 points de contrôle
| # | Point de contrôle | Seuil | Impact |
|---|---|---|---|
| 1 | Texte lisible sans zoom | Font-size ≥ 16 px, ligne ≥ 1,5 | Accessibilité + signal qualité |
| 2 | Boutons et liens cliquables au pouce | Cible ≥ 44 × 44 px, espacement ≥ 8 px | Taux de rebond, INP |
| 3 | Navigation utilisable (hamburger ou bottom nav) | Menu accessible en 1 tap, pas de scroll horizontal | Usability + crawl (liens découverts) |
| 4 | Viewport configuré | <meta name="viewport" content="width=device-width, initial-scale=1"> | Prérequis responsive |
| 5 | Formulaires utilisables | Champs ≥ 44 px, type="email" / type="tel" (clavier adapté) | Conversion |
| 6 | Pas de popups qui bloquent le contenu | Interstitiel ≤ 30 % de l'écran, fermable en 1 tap | CLS + signal qualité (Google pénalise les intrusive interstitials) |
| 7 | Images adaptées au viewport | srcset + sizes, pas d'image 2000 px sur un écran 360 px | LCP + poids de page |
Les 5 erreurs les plus fréquentes
| # | Erreur | Conséquence | Correction |
|---|---|---|---|
| 1 | Contenu masqué sur mobile (display: none) | Contenu non indexé → perte de pertinence | Adapter la mise en page, pas masquer le contenu |
| 2 | Version mobile séparée (m.domaine.com) non à jour | Google indexe une version obsolète | Passer en responsive (un seul code) ou synchroniser les 2 versions |
| 3 | Viewport non configuré | Le site est zoomé-out, illisible, pénalisé | Ajouter <meta name="viewport" content="width=device-width, initial-scale=1"> |
| 4 | Liens internes accessibles uniquement sur desktop (sidebar masquée) | Les liens ne sont pas découverts en mobile → crawl inefficace | Intégrer les liens dans le flux du contenu ou dans le menu mobile |
| 5 | Interstitiels / popups bloquants sur mobile | Pénalité « intrusive interstitials » + CLS + frustration | Supprimer ou limiter à 30 % de l'écran, fermable en 1 tap |
Checklist mobile-first
| # | Point de contrôle | Statut |
|---|---|---|
| 1 | Viewport configuré (width=device-width, initial-scale=1) | ☐ |
| 2 | Contenu identique mobile / desktop (pas de display: none sur du texte) | ☐ |
| 3 | Texte lisible sans zoom (font-size ≥ 16 px) | ☐ |
| 4 | Boutons et liens ≥ 44 px de cible | ☐ |
| 5 | Navigation mobile fonctionnelle (hamburger ou bottom nav) | ☐ |
| 6 | Liens internes accessibles sur mobile (pas seulement dans la sidebar desktop) | ☐ |
| 7 | Schemas JSON-LD présents dans le HTML mobile | ☐ |
| 8 | Images avec srcset/sizes (pas d'image 2000 px sur mobile) | ☐ |
| 9 | Pas d'interstitiel bloquant (ou ≤ 30 % de l'écran) | ☐ |
| 10 | LCP ≤ 2,5 s sur mobile (GSC) | ☐ |
| 11 | INP ≤ 200 ms sur mobile | ☐ |
| 12 | CLS ≤ 0,1 sur mobile | ☐ |
| 13 | Google Mobile-Friendly Test : 0 erreur | ☐ |
| 14 | GSC → « Améliorations » → « Mobile » : 0 problème | ☐ |
Pour la performance mobile (détail des CWV), voir Core Web Vitals. Pour la vitesse en général, voir Vitesse de chargement. Pour le contexte plus large, voir SEO fondamental.
Vérifiez que votre site est mobile-first ready
Audit SEO : nous testons votre site sur mobile (contenu, performance, UX) et identifions les écarts entre version mobile et desktop qui pénalisent votre indexation.
Demander un audit