Blog
Guides sur l'affichage mobile, le responsive design et des astuces Chrome par l'équipe Mobile View Extension.
Extensions Chrome pour développeur web : celles qui valent le coup
Les extensions Chrome pour développeur web qui comblent de vrais manques de DevTools : outils de frameworks, accessibilité, inspecteurs, affichage mobile, sécurité.
Lire l'article →Breakpoints Bootstrap 5 et grille responsive expliqués
Les breakpoints de Bootstrap 5, la largeur des conteneurs, les classes de la grille responsive, les mixins Sass et utilitaires d'affichage, et comment les tester.
Lire l'article →Comment changer le user agent dans Chrome (sans extension)
Changer le user agent dans Chrome sans extension : Network conditions de DevTools, mode appareil, client hints, option de lancement et Playwright.
Lire l'article →Outils de développement Chrome : guide pratique de DevTools
Guide pratique des outils de développement de Chrome : ouvrir DevTools, à quoi sert chaque panneau principal et les raccourcis qui font gagner le plus de temps.
Lire l'article →Émulateur mobile Chrome : utiliser le mode appareil de DevTools
L'émulateur mobile de Chrome pas à pas : mode appareil, choix ou ajout d'un appareil, bridage réseau et CPU, tactile émulé et captures d'écran.
Lire l'article →Test cross-browser : une checklist pratique et des outils gratuits
Comment tester un site sur différents navigateurs avec un petit budget : quels navigateurs couvrir, quoi vérifier et quels outils gratuits comme Playwright utiliser.
Lire l'article →Les media queries CSS expliquées, avec des exemples mobile
Les media queries CSS expliquées : syntaxe, min-width ou max-width, syntaxe par plages, fonctionnalités pour mobile, mode sombre et tactile, erreurs courantes.
Lire l'article →Le test d'optimisation mobile de Google a disparu : par quoi le remplacer
Google a retiré son test d'optimisation mobile en décembre 2023. Voici les outils gratuits qui le remplacent et une routine de 10 minutes pour vérifier une page.
Lire l'article →Comment rendre un site responsive : les 10 corrections qui comptent
Dix changements pour rendre un site responsive : balise viewport, mise en page fluide, zones tactiles, formulaires et images, avec du code à copier.
Lire l'article →Comment tester un site responsive : une méthode qui trouve les vrais bugs
Méthode pas à pas pour tester un site en responsive : balayage des largeurs, profils d'appareils, contenus extrêmes, zoom et captures automatisées.
Lire l'article →Taille d'écran et viewport de l'iPhone : le tableau complet
Tous les iPhone, du SE à l'iPhone 18 Pro Max : taille d'écran, résolution, viewport CSS et densité de pixels, avec des repères pour le webdesign.
Lire l'article →Lighthouse dans Chrome : audit mobile avec DevTools ou l'extension
Audit Lighthouse mobile dans Chrome DevTools, en extension ou en ligne de commande : réglages, lecture des scores, variations et priorités.
Lire l'article →Comment rendre un site WordPress responsive sur mobile
Corriger un site WordPress qui s'affiche mal sur mobile : thème, blocs et constructeurs de pages, menus, images, extensions et tests.
Lire l'article →Mobile first : définition et mise en pratique en design et en CSS
Ce que signifie le mobile first pour le contenu, la mise en page et le CSS, la différence avec le desktop first, un exemple de code et les erreurs fréquentes.
Lire l'article →Test de vitesse de site sur mobile : mesurer et améliorer le chargement
Comment faire un test de vitesse mobile qui a du sens : données terrain et données de labo, seuils des Core Web Vitals, outils gratuits et corrections efficaces.
Lire l'article →Faire une capture d'écran d'un site en version mobile depuis un ordinateur
Capturez n'importe quelle page web au format téléphone depuis Chrome sur ordinateur : zone visible ou page entière, avec ou sans cadre d'appareil.
Lire l'article →Simulateur mobile : extension Chrome ou DevTools, lequel choisir ?
Extensions de simulateur mobile pour Chrome ou mode appareil des DevTools : ce que chacun émule et quel outil choisir pour vos tests mobiles.
Lire l'article →Checklist de test de site mobile : 30 vérifications avant la mise en ligne
Checklist pour tester un site sur mobile : mise en page, navigation, formulaires, médias, vitesse, SEO et accessibilité, avec un outil pour chaque point.
Lire l'article →Breakpoints responsive : valeurs courantes et comment les choisir
Les breakpoints CSS courants pour mobile, tablette et desktop, la comparaison entre Tailwind, Bootstrap et Material, et comment choisir ses breakpoints à partir du contenu.
Lire l'article →Responsive design avec Tailwind CSS : breakpoints et media queries
Comment fonctionne le responsive dans Tailwind CSS v4 : breakpoints par défaut, préfixes mobile first, variantes max et plages, breakpoints personnalisés et tests.
Lire l'article →Tester un site en localhost sur mobile : téléphone et vue mobile
Ouvrir un site local sur un vrai téléphone : IP locale et --host, redirection de ports Chrome, tunnels, adresses des émulateurs et correctifs courants.
Lire l'article →Émulateur Android sur PC : comment tester un site sur Android
Tester un site sur Chrome Android depuis votre ordinateur : vues mobiles dans Chrome, émulateur Android Studio et débogage à distance d'un vrai téléphone.
Lire l'article →Émulateur iPhone sur PC : tester un site sur iPhone sans iPhone
Tester un site sur Safari iPhone sans iPhone : Simulator de Xcode, inspecteur web de Safari, WebKit via Playwright et appareils dans le cloud.
Lire l'article →User agent switcher : à quoi il sert et quand l'utiliser
Ce que modifie un user agent switcher, pourquoi il ne suffit pas pour une vue mobile, le rôle des client hints et comment choisir une extension sûre.
Lire l'article →Comment voir la version mobile d'un site sur ordinateur
Quatre façons d'ouvrir la version mobile de n'importe quel site sur ordinateur, ce que chaque méthode montre vraiment et laquelle choisir pour une vérification rapide.
Lire l'article →Simulateur tablette : afficher un site comme sur iPad dans Chrome
Trois façons de voir un site au format tablette dans Chrome, les tailles d'affichage des iPad actuels et pourquoi Safari sur iPad reçoit la version desktop.
Lire l'article →Balise meta viewport : quoi mettre et pourquoi
Ce que fait la balise meta viewport sur mobile, la ligne dont chaque page a besoin, les valeurs à éviter et les options récentes comme viewport-fit et interactive-widget.
Lire l'article →Pourquoi un site s'affiche mal sur mobile (et comment corriger)
Onze raisons pour lesquelles un site s'affiche mal sur mobile : balise viewport absente, cache, mode sombre, particularités de Safari, et comment corriger.
Lire l'article →Qu'est-ce que le responsive design ? Principes et exemples
Le responsive web design expliqué : son origine, ses principes, la différence entre responsive et adaptive design, les techniques CSS actuelles et les tests.
Lire l'article →Qu'est-ce que la taille du viewport ? Comment la connaître
La taille du viewport expliquée : pixels CSS et résolution d'écran, device pixel ratio, layout et visual viewport, unités svh et dvh, et comment vérifier la vôtre.
Lire l'article →
Voyez votre prochain site en version mobile.
Ajoutez l'extension et ouvrez des aperçus d'appareils directement dans l'onglet où vous travaillez.