Vérificateur de Ratio d'Aspect d'Image
Analysez les fractions exactes de ratio d'aspect, les proportions décimales, la compatibilité avec les réseaux sociaux et le code CSS aspect-ratio dans votre navigateur.
Glissez-déposez votre image ici ou cliquez pour parcourir
Découvrez les fractions simplifiées, validez la compatibilité sociale, calculez les dimensions proportionnelles et générez du code CSS sans envoi sur serveur
Prend en charge JPG, PNG, WebP, SVG, GIF, AVIF, BMP, ICO et TIFF • Collez avec Ctrl+V
Qu'est-ce que le ratio d'aspect d'une image et pourquoi est-il crucial ?
Le ratio d'aspect d'une image décrit la relation proportionnelle entre sa largeur et sa hauteur, exprimée par deux chiffres séparés par deux-points (comme 16:9, 4:3 ou 1:1). Contrairement aux dimensions en pixels qui mesurent la définition totale (ex. 1920 × 1080 pixels), le ratio d'aspect définit la forme géométrique visuelle de l'image, quelle que soit sa taille d'affichage.
Comprendre les proportions est indispensable pour les graphistes, photographes et développeurs web. Téléverser une image avec un mauvais ratio entraîne des recadrages automatiques tronqués ou des bandes noires. Le vérificateur d'ImgFeel calcule vos proportions instantanément sans envoyer vos fichiers sur un serveur.
Ratio et Décimales Instantanés
Calcule les fractions simplifiées (16:9, 4:3, 1:1) et les facteurs décimaux exacts.
Compatibilité Réseaux Sociaux
Vérifie l'adaptation sur Instagram, YouTube, TikTok, Facebook, X et LinkedIn.
Code CSS Prêt à l'Emploi
Génère des propriétés CSS aspect-ratio et des balises HTML d'images réactives.
100% Privé dans le Navigateur
Tous les calculs s'exécutent en JavaScript local sans transmission à un serveur.
Comment calculer le ratio d'aspect (La méthode mathématique)
Pour calculer mathématiquement le ratio d'aspect, on cherche le Plus Grand Commun Diviseur (PGCD) de la largeur et de la hauteur en pixels, puis on divise ces deux nombres par ce diviseur. Par exemple, pour une image de 3840 × 2160 pixels, le PGCD est 240. En divisant 3840 par 240, on obtient 16, et en divisant 2160 par 240, on obtient 9, soit un ratio de 16:9.
Alternativement, diviser la largeur par la hauteur donne le ratio décimal (3840 ÷ 2160 = 1.778). Les formules ci-dessous illustrent ces deux approches :
Simplified Aspect Ratio = (Width ÷ GCD(Width, Height)) : (Height ÷ GCD(Width, Height)) Decimal Aspect Ratio = Width ÷ Height : 1 CSS Padding-Top Hack % = (Height ÷ Width) × 100% Example: For a 1920 × 1080 Full HD image, GCD is 120. (1920 ÷ 120) : (1080 ÷ 120) = 16:9 (1.78:1 decimal, 56.25% CSS height). Ratio d'Aspect vs. Résolution d'Image : Quelle est la Différence ?
Il est fréquent de confondre ratio d'aspect et résolution d'image. La résolution désigne le nombre total de pixels (largeur en pixels × hauteur en pixels, ou mégapixels). Le ratio d'aspect traite uniquement de la géométrie géométrique.
Par exemple, des images de 1280 × 720 (0.92 MP), 1920 × 1080 (2.07 MP) et 3840 × 2160 (8.29 MP) possèdent des résolutions et des poids de fichier très différents, mais partagent exactement le même ratio d'aspect 16:9. Le tableau ci-dessous résume ces distinctions :
| Concept | What It Measures | Standard Units | Example Values |
|---|---|---|---|
| Aspect Ratio | Proportional relationship between width & height | Ratio string (W:H) or decimal | 16:9, 4:3, 1:1, 9:16, 1.78:1 |
| Image Resolution | Total number of pixels in the digital image grid | Pixels (W × H) and Megapixels | 1920 × 1080 px (2.07 MP), 3840 × 2160 px (8.29 MP) |
| Print Density (DPI) | Physical ink dots per linear inch on printed media | Dots Per Inch (DPI) | 300 DPI (Fine photo), 150 DPI (Flyer) |
| Display Density (PPI) | Physical hardware pixel density of a screen panel | Pixels Per Inch (PPI) | 460 PPI (iPhone Super Retina), 163 PPI (4K Monitor) |
Tableau des Ratios d'Aspect Standards les Plus Répandus
Les différents écrans, appareils photo et réseaux sociaux utilisent des ratios spécifiques pour assurer une diffusion parfaite :
| Ratio | Decimal | Standard Name | Primary Application | Common Resolutions |
|---|---|---|---|---|
| 16:9 | 1.78:1 | Widescreen (HD/4K) | YouTube videos, TVs, PC monitors, PowerPoint | 1920×1080, 2560×1440, 3840×2160 |
| 9:16 | 0.56:1 | Vertical Story / Reel | TikTok, Instagram Reels, YouTube Shorts, Snapchat | 1080×1920, 720×1280 |
| 1:1 | 1.00:1 | Square | Instagram feed, profile photos, product thumbnails | 1080×1080, 1200×1200, 500×500 |
| 4:5 | 0.80:1 | Social Portrait | Instagram feed portrait (maximum screen real estate) | 1080×1350 |
| 4:3 | 1.33:1 | Classic Standard | iPad displays, Micro Four Thirds cameras, CRT TV | 1024×768, 2048×1536 |
| 3:2 | 1.50:1 | Classic 35mm DSLR | Full-frame cameras, 4×6 photo prints, Surface laptops | 6000×4000, 3000×2000 |
| 21:9 | 2.33:1 | Ultrawide Cinema | Anamorphic cinema movies, curved ultrawide monitors | 2560×1080, 3440×1440, 5120×2160 |
| 1.91:1 | 1.91:1 | Social Landscape | Facebook feed link previews, Twitter / X summary cards | 1200×628, 1200×630 |
Guide des Ratios pour Réseaux Sociaux (Instagram, YouTube, TikTok et plus)
Chaque plateforme optimise ses fils pour des ratios particuliers. Instagram privilégie le 1:1 pour les posts carrés, le 4:5 pour les portraits verticaux et le 9:16 pour les Stories et Reels. YouTube utilise le 16:9 pour les vidéos et miniatures, et le 9:16 pour les Shorts. TikTok requiert le format 9:16 vertical. Utiliser le bon format évite les coupures intempestives.
Développement Web Moderne : La Propriété CSS aspect-ratio et Prévention du CLS
En conception web moderne, la propriété CSS `aspect-ratio` permet aux navigateurs de réserver l'espace dimensionnel exact des images avant la fin de leur chargement. Cela supprime les décalages de mise en page (Cumulative Layout Shift ou CLS), améliorant les Core Web Vitals de Google.
Auparavant, on utilisait l'astuce du padding-top en pourcentage (`padding-top: 56.25%` pour 16:9). Aujourd'hui, il suffit d'écrire `aspect-ratio: 16 / 9;` directement sur le conteneur ou la balise `<img>`.
Recadrer vs. Redimensionner vs. Ajouter des Bandes (Letterboxing)
Lors de l'adaptation d'une image à un autre ratio, trois choix s'offrent à vous : (1) Recadrer supprime des pixels sur les bords pour ajuster la proportion sans perte de netteté ; (2) Redimensionner sans conserver les proportions déforme et étire l'image ; (3) Ajouter des bandes noires ou neutres remplit les côtés sans modifier le cadrage d'origine.
Comment Vérifier le Ratio d'Aspect sur Windows, Mac, iOS et Android
Pour inspecter les dimensions et calculer le ratio directement sur votre appareil sans logiciel supplémentaire :
Windows
Right-click image > Properties > Details. Check Dimensions (e.g. 1920 × 1080) and divide Width by Height.
macOS
Select image and press Cmd + I or open in Preview and press Cmd + I to inspect pixel dimensions.
iPhone / iOS
Open image in Photos app and tap the (i) Info button to inspect resolution and proportions.
Android
Open image in Google Photos or Gallery, swipe up to view technical details, dimensions, and Megapixels.
Foire Aux Questions (FAQ)
Comment vérifier gratuitement le ratio d'aspect d'une image en ligne ?
Glissez votre image dans l'outil ImgFeel ci-dessus ou sélectionnez un fichier. Vous pouvez également coller avec Ctrl+V. L'outil calcule immédiatement la fraction (16:9, 4:3, 1:1), la valeur décimale, la compatibilité sociale et le code CSS.
Quel est le ratio d'aspect le plus courant pour les photos et vidéos ?
16:9 est le standard universel pour la vidéo panoramique, les téléviseurs et les moniteurs. Pour les smartphones et réseaux sociaux, 9:16 et 4:5 sont les plus courants. En photographie reflex, 3:2 est le format classique.
Changer le ratio d'aspect réduit-il la qualité de l'image ?
Recadrer une image pour changer son ratio retire des pixels extérieurs, réduisant la résolution totale mais conservant la netteté des pixels restants. Étirer l'image sans bloquer les proportions déforme le sujet.
Comment calculer le ratio d'aspect à partir de la largeur et de la hauteur ?
Divisez la largeur et la hauteur par leur plus grand commun diviseur (PGCD). En 1920 × 1080, diviser les deux par 120 donne 16:9. Vous pouvez aussi diviser la largeur par la hauteur (1920 ÷ 1080 = 1.78) pour obtenir le ratio décimal.
Quel ratio d'aspect choisir pour les publications Instagram ?
Pour les publications verticales de fil, 4:5 (1080 × 1350 px) offre la plus grande visibilité à l'écran. Les publications carrées utilisent 1:1 (1080 × 1080 px) et les Stories/Reels utilisent 9:16 (1080 × 1920 px).
Qu'est-ce que la propriété CSS aspect-ratio ?
C'est une propriété CSS moderne qui définit le ratio d'aspect préféré d'un élément (ex. `aspect-ratio: 16 / 9;`), empêchant les décalages de mise en page pendant le chargement des images.
Mes images sont-elles envoyées sur un serveur lors de l'analyse ?
Non. Toutes les analyses s'exécutent à 100% localement dans votre navigateur web via JavaScript. Vos images ne quittent jamais votre ordinateur ou téléphone.