[{"data":1,"prerenderedAt":2804},["ShallowReactive",2],{"blog-post-/blog/fr-fr/best-image-format-for-email-attachments":3,"related-posts-/fr-FR/blog/best-image-format-for-email-attachments":418},{"id":4,"title":5,"author":6,"body":7,"category":401,"date":402,"description":403,"extension":404,"featured":405,"image":406,"meta":407,"navigation":405,"path":408,"readingTime":409,"seo":410,"stem":411,"tags":412,"tools":415,"__hash__":417},"content/blog/fr-FR/best-image-format-for-email-attachments.md","Quel est le meilleur format d'image pour une pièce jointe email : JPG, PNG ou WebP ?","Anything Tools Editorial",{"type":8,"value":9,"toc":382},"minimark",[10,14,36,50,55,118,129,133,136,152,158,162,167,181,184,187,198,206,210,215,218,232,235,238,242,247,250,261,264,268,273,278,282,286,290,294,298,304,308,317,321,324,327,342,345,349,352,370,373],[11,12,5],"h1",{"id":13},"quel-est-le-meilleur-format-dimage-pour-une-pièce-jointe-email-jpg-png-ou-webp",[15,16,17,18,22,23,27,28,31,32,35],"p",{},"Lorsque vous envoyez une image par email, il ne faut pas regarder uniquement la qualité visuelle. Il faut aussi penser à la ",[19,20,21],"strong",{},"taille du fichier, à la netteté et à la compatibilité",". Dans la plupart des cas, ",[24,25,26],"code",{},"JPG"," est le meilleur choix pour les photos, ",[24,29,30],{},"PNG"," pour les captures avec du texte ou les visuels transparents, et ",[24,33,34],{},"WebP"," seulement si vous savez que le destinataire pourra l'ouvrir facilement.",[15,37,38,39,44,45,49],{},"Si vous devez préparer l'image avant l'envoi, vous pouvez utiliser le ",[40,41,43],"a",{"href":42},"/image/compressor","compresseur d'images"," pour réduire la taille ou le ",[40,46,48],{"href":47},"/image/converter","convertisseur d'images"," pour changer de format rapidement.",[51,52,54],"h2",{"id":53},"réponse-rapide","Réponse rapide",[56,57,58,74],"table",{},[59,60,61],"thead",{},[62,63,64,68,71],"tr",{},[65,66,67],"th",{},"Type d'image",[65,69,70],{},"Meilleur format pour email",[65,72,73],{},"Pourquoi",[75,76,77,88,98,108],"tbody",{},[62,78,79,83,85],{},[80,81,82],"td",{},"Photos",[80,84,26],{},[80,86,87],{},"Fichiers plus légers et excellente compatibilité",[62,89,90,93,95],{},[80,91,92],{},"Captures avec texte",[80,94,30],{},[80,96,97],{},"Texte et contours plus nets",[62,99,100,103,105],{},[80,101,102],{},"Graphiques transparents",[80,104,30],{},[80,106,107],{},"Conserve la transparence",[62,109,110,113,115],{},[80,111,112],{},"Exports très légers avec compatibilité connue",[80,114,34],{},[80,116,117],{},"Compression efficace",[15,119,120,121,124,125,128],{},"En cas de doute, utilisez ",[19,122,123],{},"JPG pour les photos"," et ",[19,126,127],{},"PNG pour les captures d'écran",".",[51,130,132],{"id":131},"pourquoi-le-format-compte-dans-un-email","Pourquoi le format compte dans un email",[15,134,135],{},"Les pièces jointes ont des contraintes concrètes :",[137,138,139,143,146,149],"ul",{},[140,141,142],"li",{},"les gros fichiers sont plus lents à envoyer et télécharger",[140,144,145],{},"certaines messageries imposent une limite de taille",[140,147,148],{},"une capture trop compressée devient difficile à lire",[140,150,151],{},"tous les destinataires n'utilisent pas les mêmes logiciels",[15,153,154,155,128],{},"Le meilleur format n'est donc pas seulement celui qui offre la meilleure qualité, mais celui qui équilibre ",[19,156,157],{},"poids, lisibilité et ouverture facile",[51,159,161],{"id":160},"quand-choisir-jpg","Quand choisir JPG",[15,163,164,166],{},[24,165,26],{}," est souvent le meilleur format pour envoyer :",[137,168,169,172,175,178],{},[140,170,171],{},"des photos prises au téléphone ou à l'appareil photo",[140,173,174],{},"des images produit",[140,176,177],{},"des photos d'événement",[140,179,180],{},"des visuels marketing sans transparence",[15,182,183],{},"JPG utilise une compression avec perte. Une petite partie des détails disparaît, mais pour une photo classique, cela permet souvent de gagner beaucoup en taille sans impact visible important.",[15,185,186],{},"Choisissez JPG si votre priorité est :",[137,188,189,192,195],{},[140,190,191],{},"un fichier plus léger",[140,193,194],{},"un envoi plus rapide",[140,196,197],{},"une ouverture simple sur presque tous les appareils",[15,199,200,201,203,204,128],{},"Si l'image reste trop lourde, passez-la dans le ",[40,202,43],{"href":42}," ou convertissez un PNG avec le ",[40,205,48],{"href":47},[51,207,209],{"id":208},"quand-png-est-préférable","Quand PNG est préférable",[15,211,212,214],{},[24,213,30],{}," convient mieux lorsque la netteté est plus importante que la taille du fichier.",[15,216,217],{},"Exemples courants :",[137,219,220,223,226,229],{},[140,221,222],{},"captures d'écran avec texte d'interface",[140,224,225],{},"graphiques et schémas",[140,227,228],{},"logos",[140,230,231],{},"éléments avec fond transparent",[15,233,234],{},"PNG conserve mieux le texte, les lignes fines et les bords francs. C'est donc souvent un meilleur choix pour les tutoriels, les rapports de bug ou les revues de design.",[15,236,237],{},"Son principal inconvénient est le poids : un PNG peut être nettement plus lourd qu'un JPG.",[51,239,241],{"id":240},"faut-il-utiliser-webp-dans-un-email","Faut-il utiliser WebP dans un email ?",[15,243,244,246],{},[24,245,34],{}," peut produire des fichiers très légers avec une bonne qualité, mais ce n'est pas toujours le meilleur choix pour les pièces jointes.",[15,248,249],{},"Pourquoi ?",[137,251,252,255,258],{},[140,253,254],{},"certains destinataires ne sont pas familiers avec ce format",[140,256,257],{},"certains outils plus anciens le gèrent moins bien",[140,259,260],{},"le destinataire devra parfois le reconvertir pour le réutiliser",[15,262,263],{},"Si vous contrôlez le flux de travail ou savez que le destinataire peut l'ouvrir sans problème, WebP peut convenir. Sinon, JPG et PNG restent plus sûrs pour l'email.",[51,265,267],{"id":266},"quel-format-choisir-selon-le-cas","Quel format choisir selon le cas",[269,270,272],"h3",{"id":271},"envoyer-des-photos-à-un-client-ou-un-collègue","Envoyer des photos à un client ou un collègue",[15,274,275,276,128],{},"Utilisez ",[24,277,26],{},[269,279,281],{"id":280},"envoyer-une-capture-avec-du-texte","Envoyer une capture avec du texte",[15,283,275,284,128],{},[24,285,30],{},[269,287,289],{"id":288},"envoyer-un-logo-avec-transparence","Envoyer un logo avec transparence",[15,291,275,292,128],{},[24,293,30],{},[269,295,297],{"id":296},"rester-sous-une-limite-de-taille-de-pièce-jointe","Rester sous une limite de taille de pièce jointe",[15,299,300,301,303],{},"Commencez par ",[24,302,26],{},", puis compressez davantage si nécessaire.",[269,305,307],{"id":306},"envoyer-à-des-personnes-non-techniques","Envoyer à des personnes non techniques",[15,309,310,311,313,314,316],{},"Privilégiez ",[24,312,26],{}," ou ",[24,315,30],{}," plutôt que WebP.",[51,318,320],{"id":319},"comment-réduire-la-taille-avant-lenvoi","Comment réduire la taille avant l'envoi",[15,322,323],{},"Le bon format aide, mais il faut aussi supprimer le poids inutile.",[15,325,326],{},"Avant d'envoyer :",[328,329,330,333,336,339],"ol",{},[140,331,332],{},"redimensionnez les images trop grandes",[140,334,335],{},"exportez les photos en JPG si la transparence n'est pas nécessaire",[140,337,338],{},"gardez PNG pour les captures qui doivent rester très nettes",[140,340,341],{},"compressez le fichier final avant de l'attacher",[15,343,344],{},"Une erreur fréquente consiste à joindre la photo originale très lourde du téléphone. Dans beaucoup de cas, une version plus légère est identique à l'écran dans un email, mais se transfère bien plus vite.",[51,346,348],{"id":347},"recommandation-finale","Recommandation finale",[15,350,351],{},"Si vous voulez retenir une règle simple :",[137,353,354,360,365],{},[140,355,356,357,359],{},"utilisez ",[24,358,26],{}," pour les photos",[140,361,356,362,364],{},[24,363,30],{}," pour les captures, graphiques et images transparentes",[140,366,356,367,369],{},[24,368,34],{}," uniquement si la compatibilité n'est pas un sujet",[15,371,372],{},"Cette approche offre un bon équilibre entre qualité, taille et compatibilité.",[15,374,375,376,378,379,381],{},"Si votre fichier est trop lourd ou dans le mauvais format, utilisez le ",[40,377,43],{"href":42}," ou le ",[40,380,48],{"href":47}," avant l'envoi.",{"title":383,"searchDepth":384,"depth":384,"links":385},"",2,[386,387,388,389,390,391,399,400],{"id":53,"depth":384,"text":54},{"id":131,"depth":384,"text":132},{"id":160,"depth":384,"text":161},{"id":208,"depth":384,"text":209},{"id":240,"depth":384,"text":241},{"id":266,"depth":384,"text":267,"children":392},[393,395,396,397,398],{"id":271,"depth":394,"text":272},3,{"id":280,"depth":394,"text":281},{"id":288,"depth":394,"text":289},{"id":296,"depth":394,"text":297},{"id":306,"depth":394,"text":307},{"id":319,"depth":384,"text":320},{"id":347,"depth":384,"text":348},"Guides","2026-03-17T00:00:00.000Z","Découvrez quel format choisir pour envoyer des images par email, quand utiliser JPG ou PNG, et pourquoi WebP n'est pas toujours le choix le plus sûr.","md",true,"/blog/best-image-format-for-email-attachments.jpg",{},"/blog/fr-fr/best-image-format-for-email-attachments",null,{"title":5,"description":403},"blog/fr-FR/best-image-format-for-email-attachments",[413,26,30,34,414],"Pièces jointes email","Compression d'image",[416],"/image","XUzlHqVu1ti68HLcYxwyQTzgQndZVWIB6wHGeew87Ug",[419,2427],{"id":420,"title":421,"author":422,"body":423,"category":401,"date":2412,"description":2413,"extension":404,"featured":2414,"image":2415,"meta":2416,"navigation":405,"path":2417,"readingTime":1143,"seo":2418,"stem":2419,"tags":2420,"tools":2424,"__hash__":2426},"content/blog/en/avif-format-complete-guide.md","AVIF Format: Complete Guide to the Next-Gen Image Format","Anything Tools Team",{"type":8,"value":424,"toc":2356},[425,428,431,435,438,443,463,467,471,474,534,540,544,547,561,565,680,684,760,766,770,784,788,792,797,800,813,817,820,831,835,838,849,853,856,867,871,875,878,892,896,899,910,913,917,920,931,935,939,942,1090,1094,1097,1169,1173,1380,1384,1388,1408,1412,1415,1518,1521,1551,1554,1573,1577,1582,1755,1760,1825,1829,1833,1839,1845,1849,1854,1860,1864,1869,1872,1876,1881,1884,1888,1958,1964,1968,1972,2031,2035,2079,2083,2086,2165,2169,2172,2218,2222,2226,2229,2233,2236,2240,2243,2247,2250,2254,2257,2261,2264,2268,2271,2297,2300,2304,2307,2310,2313,2319,2323,2343,2346,2352],[11,426,421],{"id":427},"avif-format-complete-guide-to-the-next-gen-image-format",[15,429,430],{},"AVIF delivers the smallest image files with the best quality. Here's everything you need to know about this revolutionary format.",[51,432,434],{"id":433},"what-is-avif","What is AVIF?",[15,436,437],{},"AVIF (AV1 Image File Format) is a modern image format developed by the Alliance for Open Media. It uses the same compression technology as AV1 video, delivering unprecedented compression efficiency.",[15,439,440],{},[19,441,442],{},"Key features:",[137,444,445,448,451,454,457,460],{},[140,446,447],{},"50% smaller than JPG at similar quality",[140,449,450],{},"20-30% smaller than WebP",[140,452,453],{},"Supports transparency (alpha channel)",[140,455,456],{},"Supports HDR and wide color gamut",[140,458,459],{},"Supports animation",[140,461,462],{},"Royalty-free",[51,464,466],{"id":465},"avif-vs-other-formats","AVIF vs Other Formats",[269,468,470],{"id":469},"compression-comparison","Compression Comparison",[15,472,473],{},"Same quality photo at different formats:",[56,475,476,489],{},[59,477,478],{},[62,479,480,483,486],{},[65,481,482],{},"Format",[65,484,485],{},"File Size",[65,487,488],{},"Relative",[75,490,491,501,512,523],{},[62,492,493,495,498],{},[80,494,30],{},[80,496,497],{},"12.5 MB",[80,499,500],{},"100%",[62,502,503,506,509],{},[80,504,505],{},"JPG 85%",[80,507,508],{},"850 KB",[80,510,511],{},"6.8%",[62,513,514,517,520],{},[80,515,516],{},"WebP 85%",[80,518,519],{},"580 KB",[80,521,522],{},"4.6%",[62,524,525,528,531],{},[80,526,527],{},"AVIF 75%",[80,529,530],{},"380 KB",[80,532,533],{},"3.0%",[15,535,536,539],{},[19,537,538],{},"AVIF is 55% smaller than JPG"," at equivalent visual quality.",[269,541,543],{"id":542},"quality-comparison","Quality Comparison",[15,545,546],{},"At the same file size, AVIF shows:",[137,548,549,552,555,558],{},[140,550,551],{},"Fewer compression artifacts",[140,553,554],{},"Better color accuracy",[140,556,557],{},"Sharper details",[140,559,560],{},"Less banding in gradients",[269,562,564],{"id":563},"feature-comparison","Feature Comparison",[56,566,567,583],{},[59,568,569],{},[62,570,571,574,576,578,580],{},[65,572,573],{},"Feature",[65,575,26],{},[65,577,30],{},[65,579,34],{},[65,581,582],{},"AVIF",[75,584,585,600,613,626,639,652,665],{},[62,586,587,590,593,596,598],{},[80,588,589],{},"Lossy",[80,591,592],{},"✅",[80,594,595],{},"❌",[80,597,592],{},[80,599,592],{},[62,601,602,605,607,609,611],{},[80,603,604],{},"Lossless",[80,606,595],{},[80,608,592],{},[80,610,592],{},[80,612,592],{},[62,614,615,618,620,622,624],{},[80,616,617],{},"Transparency",[80,619,595],{},[80,621,592],{},[80,623,592],{},[80,625,592],{},[62,627,628,631,633,635,637],{},[80,629,630],{},"Animation",[80,632,595],{},[80,634,595],{},[80,636,592],{},[80,638,592],{},[62,640,641,644,646,648,650],{},[80,642,643],{},"HDR",[80,645,595],{},[80,647,595],{},[80,649,595],{},[80,651,592],{},[62,653,654,657,659,661,663],{},[80,655,656],{},"Wide Color",[80,658,595],{},[80,660,592],{},[80,662,595],{},[80,664,592],{},[62,666,667,670,672,674,677],{},[80,668,669],{},"Browser Support",[80,671,500],{},[80,673,500],{},[80,675,676],{},"97%",[80,678,679],{},"91%",[51,681,683],{"id":682},"browser-support-2026","Browser Support (2026)",[56,685,686,699],{},[59,687,688],{},[62,689,690,693,696],{},[65,691,692],{},"Browser",[65,694,695],{},"AVIF Support",[65,697,698],{},"Since",[75,700,701,711,721,730,740,750],{},[62,702,703,706,708],{},[80,704,705],{},"Chrome",[80,707,592],{},[80,709,710],{},"Aug 2020",[62,712,713,716,718],{},[80,714,715],{},"Firefox",[80,717,592],{},[80,719,720],{},"Oct 2021",[62,722,723,726,728],{},[80,724,725],{},"Edge",[80,727,592],{},[80,729,710],{},[62,731,732,735,737],{},[80,733,734],{},"Opera",[80,736,592],{},[80,738,739],{},"Sep 2020",[62,741,742,745,747],{},[80,743,744],{},"Safari",[80,746,592],{},[80,748,749],{},"Sep 2022",[62,751,752,755,757],{},[80,753,754],{},"Safari iOS",[80,756,592],{},[80,758,759],{},"iOS 16",[15,761,762,765],{},[19,763,764],{},"Global support:"," ~91% of users",[269,767,769],{"id":768},"who-doesnt-have-avif-support","Who doesn't have AVIF support?",[137,771,772,775,778,781],{},[140,773,774],{},"Safari on older macOS (pre-Ventura)",[140,776,777],{},"iOS 15 and earlier",[140,779,780],{},"Some older Android devices",[140,782,783],{},"Internet Explorer (but who uses that?)",[51,785,787],{"id":786},"why-choose-avif","Why Choose AVIF?",[269,789,791],{"id":790},"for-websites","For Websites",[15,793,794],{},[19,795,796],{},"Smaller files = faster loading",[15,798,799],{},"A typical blog post with 5 images:",[137,801,802,805,808],{},[140,803,804],{},"As JPG: 2.5 MB total",[140,806,807],{},"As AVIF: 1.0 MB total",[140,809,810],{},[19,811,812],{},"60% bandwidth savings",[269,814,816],{"id":815},"for-seo","For SEO",[15,818,819],{},"Google considers page speed a ranking factor. AVIF helps:",[137,821,822,825,828],{},[140,823,824],{},"Faster LCP (Largest Contentful Paint)",[140,826,827],{},"Better Core Web Vitals scores",[140,829,830],{},"Reduced bounce rates",[269,832,834],{"id":833},"for-e-commerce","For E-commerce",[15,836,837],{},"Product images load faster:",[137,839,840,843,846],{},[140,841,842],{},"Better mobile experience",[140,844,845],{},"Higher conversion rates",[140,847,848],{},"Reduced hosting costs",[269,850,852],{"id":851},"for-photography","For Photography",[15,854,855],{},"Premium quality at smaller sizes:",[137,857,858,861,864],{},[140,859,860],{},"HDR support for modern displays",[140,862,863],{},"Wide color gamut preservation",[140,865,866],{},"Perfect for portfolio sites",[51,868,870],{"id":869},"when-not-to-use-avif","When NOT to Use AVIF",[269,872,874],{"id":873},"universal-compatibility-needed","Universal Compatibility Needed",[15,876,877],{},"Use JPG instead when:",[137,879,880,883,886,889],{},[140,881,882],{},"Email marketing images",[140,884,885],{},"Social media uploads",[140,887,888],{},"Client deliverables",[140,890,891],{},"Legacy system integration",[269,893,895],{"id":894},"encoding-speed-critical","Encoding Speed Critical",[15,897,898],{},"AVIF encoding is slow:",[137,900,901,904,907],{},[140,902,903],{},"AVIF: 5-10 seconds per image",[140,905,906],{},"WebP: 1-2 seconds",[140,908,909],{},"JPG: instant",[15,911,912],{},"For real-time applications, use WebP or JPG.",[269,914,916],{"id":915},"lossless-required","Lossless Required",[15,918,919],{},"For absolute lossless quality:",[137,921,922,925,928],{},[140,923,924],{},"AVIF lossless is larger than PNG",[140,926,927],{},"PNG is better for lossless storage",[140,929,930],{},"Use PNG for source files",[51,932,934],{"id":933},"how-to-use-avif-on-your-website","How to Use AVIF on Your Website",[269,936,938],{"id":937},"the-picture-element-recommended","The Picture Element (Recommended)",[15,940,941],{},"Serve AVIF to supported browsers, fallback to WebP/JPG:",[943,944,948],"pre",{"className":945,"code":946,"language":947,"meta":383,"style":383},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cpicture>\n  \u003Csource srcset=\"image.avif\" type=\"image/avif\">\n  \u003Csource srcset=\"image.webp\" type=\"image/webp\">\n  \u003Cimg src=\"image.jpg\" alt=\"Description\" loading=\"lazy\">\n\u003C/picture>\n","html",[24,949,950,966,1004,1034,1080],{"__ignoreMap":383},[951,952,955,959,963],"span",{"class":953,"line":954},"line",1,[951,956,958],{"class":957},"sMK4o","\u003C",[951,960,962],{"class":961},"swJcz","picture",[951,964,965],{"class":957},">\n",[951,967,968,971,974,978,981,984,988,990,993,995,997,1000,1002],{"class":953,"line":384},[951,969,970],{"class":957},"  \u003C",[951,972,973],{"class":961},"source",[951,975,977],{"class":976},"spNyl"," srcset",[951,979,980],{"class":957},"=",[951,982,983],{"class":957},"\"",[951,985,987],{"class":986},"sfazB","image.avif",[951,989,983],{"class":957},[951,991,992],{"class":976}," type",[951,994,980],{"class":957},[951,996,983],{"class":957},[951,998,999],{"class":986},"image/avif",[951,1001,983],{"class":957},[951,1003,965],{"class":957},[951,1005,1006,1008,1010,1012,1014,1016,1019,1021,1023,1025,1027,1030,1032],{"class":953,"line":394},[951,1007,970],{"class":957},[951,1009,973],{"class":961},[951,1011,977],{"class":976},[951,1013,980],{"class":957},[951,1015,983],{"class":957},[951,1017,1018],{"class":986},"image.webp",[951,1020,983],{"class":957},[951,1022,992],{"class":976},[951,1024,980],{"class":957},[951,1026,983],{"class":957},[951,1028,1029],{"class":986},"image/webp",[951,1031,983],{"class":957},[951,1033,965],{"class":957},[951,1035,1037,1039,1042,1045,1047,1049,1052,1054,1057,1059,1061,1064,1066,1069,1071,1073,1076,1078],{"class":953,"line":1036},4,[951,1038,970],{"class":957},[951,1040,1041],{"class":961},"img",[951,1043,1044],{"class":976}," src",[951,1046,980],{"class":957},[951,1048,983],{"class":957},[951,1050,1051],{"class":986},"image.jpg",[951,1053,983],{"class":957},[951,1055,1056],{"class":976}," alt",[951,1058,980],{"class":957},[951,1060,983],{"class":957},[951,1062,1063],{"class":986},"Description",[951,1065,983],{"class":957},[951,1067,1068],{"class":976}," loading",[951,1070,980],{"class":957},[951,1072,983],{"class":957},[951,1074,1075],{"class":986},"lazy",[951,1077,983],{"class":957},[951,1079,965],{"class":957},[951,1081,1083,1086,1088],{"class":953,"line":1082},5,[951,1084,1085],{"class":957},"\u003C/",[951,1087,962],{"class":961},[951,1089,965],{"class":957},[269,1091,1093],{"id":1092},"content-negotiation","Content Negotiation",[15,1095,1096],{},"Let the server detect browser support:",[943,1098,1102],{"className":1099,"code":1100,"language":1101,"meta":383,"style":383},"language-nginx shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","# Nginx configuration\nlocation ~* ^.+\\.(jpe?g|png)$ {\n  add_header Vary Accept;\n  \n  if ($http_accept ~* \"image/avif\") {\n    rewrite ^(.+)\\.(jpe?g|png)$ $1.avif break;\n  }\n  \n  if ($http_accept ~* \"image/webp\") {\n    rewrite ^(.+)\\.(jpe?g|png)$ $1.webp break;\n  }\n}\n","nginx",[24,1103,1104,1109,1114,1119,1124,1129,1135,1141,1146,1152,1158,1163],{"__ignoreMap":383},[951,1105,1106],{"class":953,"line":954},[951,1107,1108],{},"# Nginx configuration\n",[951,1110,1111],{"class":953,"line":384},[951,1112,1113],{},"location ~* ^.+\\.(jpe?g|png)$ {\n",[951,1115,1116],{"class":953,"line":394},[951,1117,1118],{},"  add_header Vary Accept;\n",[951,1120,1121],{"class":953,"line":1036},[951,1122,1123],{},"  \n",[951,1125,1126],{"class":953,"line":1082},[951,1127,1128],{},"  if ($http_accept ~* \"image/avif\") {\n",[951,1130,1132],{"class":953,"line":1131},6,[951,1133,1134],{},"    rewrite ^(.+)\\.(jpe?g|png)$ $1.avif break;\n",[951,1136,1138],{"class":953,"line":1137},7,[951,1139,1140],{},"  }\n",[951,1142,1144],{"class":953,"line":1143},8,[951,1145,1123],{},[951,1147,1149],{"class":953,"line":1148},9,[951,1150,1151],{},"  if ($http_accept ~* \"image/webp\") {\n",[951,1153,1155],{"class":953,"line":1154},10,[951,1156,1157],{},"    rewrite ^(.+)\\.(jpe?g|png)$ $1.webp break;\n",[951,1159,1161],{"class":953,"line":1160},11,[951,1162,1140],{},[951,1164,1166],{"class":953,"line":1165},12,[951,1167,1168],{},"}\n",[269,1170,1172],{"id":1171},"css-background-images","CSS Background Images",[943,1174,1178],{"className":1175,"code":1176,"language":1177,"meta":383,"style":383},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","/* Fallback */\n.hero {\n  background-image: url('hero.jpg');\n}\n\n/* WebP for wider support */\n@supports (background-image: url('test.webp')) {\n  .hero {\n    background-image: url('hero.webp');\n  }\n}\n\n/* AVIF for modern browsers */\n@supports (background-image: url('test.avif')) {\n  .hero {\n    background-image: url('hero.avif');\n  }\n}\n","css",[24,1179,1180,1186,1197,1224,1228,1233,1238,1268,1277,1297,1301,1305,1309,1315,1341,1350,1370,1375],{"__ignoreMap":383},[951,1181,1182],{"class":953,"line":954},[951,1183,1185],{"class":1184},"sHwdD","/* Fallback */\n",[951,1187,1188,1190,1194],{"class":953,"line":384},[951,1189,128],{"class":957},[951,1191,1193],{"class":1192},"sBMFI","hero",[951,1195,1196],{"class":957}," {\n",[951,1198,1199,1203,1206,1210,1213,1216,1219,1221],{"class":953,"line":394},[951,1200,1202],{"class":1201},"sqsOY","  background-image",[951,1204,1205],{"class":957},":",[951,1207,1209],{"class":1208},"s2Zo4"," url",[951,1211,1212],{"class":957},"(",[951,1214,1215],{"class":957},"'",[951,1217,1218],{"class":986},"hero.jpg",[951,1220,1215],{"class":957},[951,1222,1223],{"class":957},");\n",[951,1225,1226],{"class":953,"line":1036},[951,1227,1168],{"class":957},[951,1229,1230],{"class":953,"line":1082},[951,1231,1232],{"emptyLinePlaceholder":405},"\n",[951,1234,1235],{"class":953,"line":1131},[951,1236,1237],{"class":1184},"/* WebP for wider support */\n",[951,1239,1240,1244,1247,1250,1252,1254,1256,1258,1261,1263,1266],{"class":953,"line":1137},[951,1241,1243],{"class":1242},"s7zQu","@supports",[951,1245,1246],{"class":957}," (",[951,1248,1249],{"class":1201},"background-image",[951,1251,1205],{"class":957},[951,1253,1209],{"class":1208},[951,1255,1212],{"class":957},[951,1257,1215],{"class":957},[951,1259,1260],{"class":986},"test.webp",[951,1262,1215],{"class":957},[951,1264,1265],{"class":957},"))",[951,1267,1196],{"class":957},[951,1269,1270,1273,1275],{"class":953,"line":1143},[951,1271,1272],{"class":957},"  .",[951,1274,1193],{"class":1192},[951,1276,1196],{"class":957},[951,1278,1279,1282,1284,1286,1288,1290,1293,1295],{"class":953,"line":1148},[951,1280,1281],{"class":1201},"    background-image",[951,1283,1205],{"class":957},[951,1285,1209],{"class":1208},[951,1287,1212],{"class":957},[951,1289,1215],{"class":957},[951,1291,1292],{"class":986},"hero.webp",[951,1294,1215],{"class":957},[951,1296,1223],{"class":957},[951,1298,1299],{"class":953,"line":1154},[951,1300,1140],{"class":957},[951,1302,1303],{"class":953,"line":1160},[951,1304,1168],{"class":957},[951,1306,1307],{"class":953,"line":1165},[951,1308,1232],{"emptyLinePlaceholder":405},[951,1310,1312],{"class":953,"line":1311},13,[951,1313,1314],{"class":1184},"/* AVIF for modern browsers */\n",[951,1316,1318,1320,1322,1324,1326,1328,1330,1332,1335,1337,1339],{"class":953,"line":1317},14,[951,1319,1243],{"class":1242},[951,1321,1246],{"class":957},[951,1323,1249],{"class":1201},[951,1325,1205],{"class":957},[951,1327,1209],{"class":1208},[951,1329,1212],{"class":957},[951,1331,1215],{"class":957},[951,1333,1334],{"class":986},"test.avif",[951,1336,1215],{"class":957},[951,1338,1265],{"class":957},[951,1340,1196],{"class":957},[951,1342,1344,1346,1348],{"class":953,"line":1343},15,[951,1345,1272],{"class":957},[951,1347,1193],{"class":1192},[951,1349,1196],{"class":957},[951,1351,1353,1355,1357,1359,1361,1363,1366,1368],{"class":953,"line":1352},16,[951,1354,1281],{"class":1201},[951,1356,1205],{"class":957},[951,1358,1209],{"class":1208},[951,1360,1212],{"class":957},[951,1362,1215],{"class":957},[951,1364,1365],{"class":986},"hero.avif",[951,1367,1215],{"class":957},[951,1369,1223],{"class":957},[951,1371,1373],{"class":953,"line":1372},17,[951,1374,1140],{"class":957},[951,1376,1378],{"class":953,"line":1377},18,[951,1379,1168],{"class":957},[51,1381,1383],{"id":1382},"creating-avif-images","Creating AVIF Images",[269,1385,1387],{"id":1386},"online-tools","Online Tools",[328,1389,1390,1396,1402],{},[140,1391,1392,1395],{},[19,1393,1394],{},"Squoosh.app"," - Visual compression comparison",[140,1397,1398,1401],{},[19,1399,1400],{},"AVIF.io"," - Batch conversion",[140,1403,1404,1407],{},[19,1405,1406],{},"CloudConvert"," - API available",[269,1409,1411],{"id":1410},"command-line","Command Line",[15,1413,1414],{},"Using libavif:",[943,1416,1420],{"className":1417,"code":1418,"language":1419,"meta":383,"style":383},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","# Single image\navifenc input.jpg output.avif -q 75\n\n# Batch conversion\nfor f in *.jpg; do avifenc \"$f\" \"${f%.jpg}.avif\" -q 75; done\n","bash",[24,1421,1422,1427,1445,1449,1454],{"__ignoreMap":383},[951,1423,1424],{"class":953,"line":954},[951,1425,1426],{"class":1184},"# Single image\n",[951,1428,1429,1432,1435,1438,1441],{"class":953,"line":384},[951,1430,1431],{"class":1192},"avifenc",[951,1433,1434],{"class":986}," input.jpg",[951,1436,1437],{"class":986}," output.avif",[951,1439,1440],{"class":986}," -q",[951,1442,1444],{"class":1443},"sbssI"," 75\n",[951,1446,1447],{"class":953,"line":394},[951,1448,1232],{"emptyLinePlaceholder":405},[951,1450,1451],{"class":953,"line":1036},[951,1452,1453],{"class":1184},"# Batch conversion\n",[951,1455,1456,1459,1463,1466,1469,1472,1475,1478,1481,1484,1486,1489,1492,1495,1497,1500,1503,1506,1508,1510,1513,1515],{"class":953,"line":1082},[951,1457,1458],{"class":1242},"for",[951,1460,1462],{"class":1461},"sTEyZ"," f ",[951,1464,1465],{"class":1242},"in",[951,1467,1468],{"class":986}," *.jpg",[951,1470,1471],{"class":957},";",[951,1473,1474],{"class":1242}," do",[951,1476,1477],{"class":1192}," avifenc",[951,1479,1480],{"class":957}," \"",[951,1482,1483],{"class":1461},"$f",[951,1485,983],{"class":957},[951,1487,1488],{"class":957}," \"${",[951,1490,1491],{"class":1461},"f",[951,1493,1494],{"class":957},"%",[951,1496,128],{"class":986},[951,1498,1499],{"class":1461},"jpg",[951,1501,1502],{"class":957},"}",[951,1504,1505],{"class":986},".avif",[951,1507,983],{"class":957},[951,1509,1440],{"class":986},[951,1511,1512],{"class":1443}," 75",[951,1514,1471],{"class":957},[951,1516,1517],{"class":1242}," done\n",[15,1519,1520],{},"Using FFmpeg:",[943,1522,1524],{"className":1417,"code":1523,"language":1419,"meta":383,"style":383},"ffmpeg -i input.jpg -c:v libaom-av1 -crf 30 output.avif\n",[24,1525,1526],{"__ignoreMap":383},[951,1527,1528,1531,1534,1536,1539,1542,1545,1548],{"class":953,"line":954},[951,1529,1530],{"class":1192},"ffmpeg",[951,1532,1533],{"class":986}," -i",[951,1535,1434],{"class":986},[951,1537,1538],{"class":986}," -c:v",[951,1540,1541],{"class":986}," libaom-av1",[951,1543,1544],{"class":986}," -crf",[951,1546,1547],{"class":1443}," 30",[951,1549,1550],{"class":986}," output.avif\n",[15,1552,1553],{},"Using ImageMagick:",[943,1555,1557],{"className":1417,"code":1556,"language":1419,"meta":383,"style":383},"convert input.jpg -quality 75 output.avif\n",[24,1558,1559],{"__ignoreMap":383},[951,1560,1561,1564,1566,1569,1571],{"class":953,"line":954},[951,1562,1563],{"class":1192},"convert",[951,1565,1434],{"class":986},[951,1567,1568],{"class":986}," -quality",[951,1570,1512],{"class":1443},[951,1572,1550],{"class":986},[269,1574,1576],{"id":1575},"build-tools","Build Tools",[15,1578,1579],{},[19,1580,1581],{},"Webpack:",[943,1583,1587],{"className":1584,"code":1585,"language":1586,"meta":383,"style":383},"language-javascript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","module.exports = {\n  module: {\n    rules: [{\n      test: /\\.(png|jpe?g)$/i,\n      use: [{\n        loader: 'image-webpack-loader',\n        options: {\n          avif: {\n            quality: 75\n          }\n        }\n      }]\n    }]\n  }\n};\n","javascript",[24,1588,1589,1599,1608,1621,1666,1677,1694,1703,1712,1721,1726,1731,1739,1746,1750],{"__ignoreMap":383},[951,1590,1591,1594,1597],{"class":953,"line":954},[951,1592,1593],{"class":957},"module.exports",[951,1595,1596],{"class":957}," =",[951,1598,1196],{"class":957},[951,1600,1601,1604,1606],{"class":953,"line":384},[951,1602,1603],{"class":961},"  module",[951,1605,1205],{"class":957},[951,1607,1196],{"class":957},[951,1609,1610,1613,1615,1618],{"class":953,"line":394},[951,1611,1612],{"class":961},"    rules",[951,1614,1205],{"class":957},[951,1616,1617],{"class":1461}," [",[951,1619,1620],{"class":957},"{\n",[951,1622,1623,1626,1628,1631,1634,1636,1639,1642,1645,1648,1651,1654,1657,1660,1663],{"class":953,"line":1036},[951,1624,1625],{"class":961},"      test",[951,1627,1205],{"class":957},[951,1629,1630],{"class":957}," /",[951,1632,1633],{"class":1461},"\\.",[951,1635,1212],{"class":957},[951,1637,1638],{"class":986},"png",[951,1640,1641],{"class":957},"|",[951,1643,1644],{"class":986},"jpe",[951,1646,1647],{"class":957},"?",[951,1649,1650],{"class":986},"g",[951,1652,1653],{"class":957},")",[951,1655,1656],{"class":1242},"$",[951,1658,1659],{"class":957},"/",[951,1661,1662],{"class":1443},"i",[951,1664,1665],{"class":957},",\n",[951,1667,1668,1671,1673,1675],{"class":953,"line":1082},[951,1669,1670],{"class":961},"      use",[951,1672,1205],{"class":957},[951,1674,1617],{"class":1461},[951,1676,1620],{"class":957},[951,1678,1679,1682,1684,1687,1690,1692],{"class":953,"line":1131},[951,1680,1681],{"class":961},"        loader",[951,1683,1205],{"class":957},[951,1685,1686],{"class":957}," '",[951,1688,1689],{"class":986},"image-webpack-loader",[951,1691,1215],{"class":957},[951,1693,1665],{"class":957},[951,1695,1696,1699,1701],{"class":953,"line":1137},[951,1697,1698],{"class":961},"        options",[951,1700,1205],{"class":957},[951,1702,1196],{"class":957},[951,1704,1705,1708,1710],{"class":953,"line":1143},[951,1706,1707],{"class":961},"          avif",[951,1709,1205],{"class":957},[951,1711,1196],{"class":957},[951,1713,1714,1717,1719],{"class":953,"line":1148},[951,1715,1716],{"class":961},"            quality",[951,1718,1205],{"class":957},[951,1720,1444],{"class":1443},[951,1722,1723],{"class":953,"line":1154},[951,1724,1725],{"class":957},"          }\n",[951,1727,1728],{"class":953,"line":1160},[951,1729,1730],{"class":957},"        }\n",[951,1732,1733,1736],{"class":953,"line":1165},[951,1734,1735],{"class":957},"      }",[951,1737,1738],{"class":1461},"]\n",[951,1740,1741,1744],{"class":953,"line":1311},[951,1742,1743],{"class":957},"    }",[951,1745,1738],{"class":1461},[951,1747,1748],{"class":953,"line":1317},[951,1749,1140],{"class":957},[951,1751,1752],{"class":953,"line":1343},[951,1753,1754],{"class":957},"};\n",[15,1756,1757],{},[19,1758,1759],{},"Next.js:",[943,1761,1763],{"className":1584,"code":1762,"language":1586,"meta":383,"style":383},"// next.config.js\nmodule.exports = {\n  images: {\n    formats: ['image/avif', 'image/webp'],\n  },\n}\n",[24,1764,1765,1770,1778,1787,1816,1821],{"__ignoreMap":383},[951,1766,1767],{"class":953,"line":954},[951,1768,1769],{"class":1184},"// next.config.js\n",[951,1771,1772,1774,1776],{"class":953,"line":384},[951,1773,1593],{"class":957},[951,1775,1596],{"class":957},[951,1777,1196],{"class":957},[951,1779,1780,1783,1785],{"class":953,"line":394},[951,1781,1782],{"class":961},"  images",[951,1784,1205],{"class":957},[951,1786,1196],{"class":957},[951,1788,1789,1792,1794,1796,1798,1800,1802,1805,1807,1809,1811,1814],{"class":953,"line":1036},[951,1790,1791],{"class":961},"    formats",[951,1793,1205],{"class":957},[951,1795,1617],{"class":1461},[951,1797,1215],{"class":957},[951,1799,999],{"class":986},[951,1801,1215],{"class":957},[951,1803,1804],{"class":957},",",[951,1806,1686],{"class":957},[951,1808,1029],{"class":986},[951,1810,1215],{"class":957},[951,1812,1813],{"class":1461},"]",[951,1815,1665],{"class":957},[951,1817,1818],{"class":953,"line":1082},[951,1819,1820],{"class":957},"  },\n",[951,1822,1823],{"class":953,"line":1131},[951,1824,1168],{"class":957},[51,1826,1828],{"id":1827},"converting-from-to-avif","Converting From & To AVIF",[269,1830,1832],{"id":1831},"avif-jpg","AVIF → JPG",[15,1834,1835,1838],{},[19,1836,1837],{},"When:"," Need universal compatibility",[15,1840,1841],{},[40,1842,1844],{"href":1843},"/image/converter/avif-to-jpg","Convert AVIF to JPG →",[269,1846,1848],{"id":1847},"avif-png","AVIF → PNG",[15,1850,1851,1853],{},[19,1852,1837],{}," Need lossless output",[15,1855,1856],{},[40,1857,1859],{"href":1858},"/image/converter/avif-to-png","Convert AVIF to PNG →",[269,1861,1863],{"id":1862},"jpg-avif","JPG → AVIF",[15,1865,1866,1868],{},[19,1867,1837],{}," Optimizing existing photos",[15,1870,1871],{},"Quality recommendation: 70-80% (equivalent to JPG 85-90%)",[269,1873,1875],{"id":1874},"png-avif","PNG → AVIF",[15,1877,1878,1880],{},[19,1879,1837],{}," Optimizing graphics with transparency",[15,1882,1883],{},"Use lossy AVIF at 80-85% for good balance.",[51,1885,1887],{"id":1886},"avif-quality-settings-guide","AVIF Quality Settings Guide",[56,1889,1890,1902],{},[59,1891,1892],{},[62,1893,1894,1897,1900],{},[65,1895,1896],{},"Quality",[65,1898,1899],{},"Use Case",[65,1901,485],{},[75,1903,1904,1915,1926,1937,1948],{},[62,1905,1906,1909,1912],{},[80,1907,1908],{},"50-60%",[80,1910,1911],{},"Thumbnails, previews",[80,1913,1914],{},"Smallest",[62,1916,1917,1920,1923],{},[80,1918,1919],{},"65-75%",[80,1921,1922],{},"Blog images, general web",[80,1924,1925],{},"Small",[62,1927,1928,1931,1934],{},[80,1929,1930],{},"75-85%",[80,1932,1933],{},"E-commerce, portfolios",[80,1935,1936],{},"Medium",[62,1938,1939,1942,1945],{},[80,1940,1941],{},"85-95%",[80,1943,1944],{},"High quality display",[80,1946,1947],{},"Larger",[62,1949,1950,1952,1955],{},[80,1951,500],{},[80,1953,1954],{},"Lossless (not recommended)",[80,1956,1957],{},"Largest",[15,1959,1960,1963],{},[19,1961,1962],{},"Sweet spot:"," 70-80% quality",[51,1965,1967],{"id":1966},"performance-tips","Performance Tips",[269,1969,1971],{"id":1970},"preload-important-avif-images","Preload Important AVIF Images",[943,1973,1975],{"className":945,"code":1974,"language":947,"meta":383,"style":383},"\u003Clink rel=\"preload\" as=\"image\" href=\"hero.avif\" type=\"image/avif\">\n",[24,1976,1977],{"__ignoreMap":383},[951,1978,1979,1981,1984,1987,1989,1991,1994,1996,1999,2001,2003,2006,2008,2011,2013,2015,2017,2019,2021,2023,2025,2027,2029],{"class":953,"line":954},[951,1980,958],{"class":957},[951,1982,1983],{"class":961},"link",[951,1985,1986],{"class":976}," rel",[951,1988,980],{"class":957},[951,1990,983],{"class":957},[951,1992,1993],{"class":986},"preload",[951,1995,983],{"class":957},[951,1997,1998],{"class":976}," as",[951,2000,980],{"class":957},[951,2002,983],{"class":957},[951,2004,2005],{"class":986},"image",[951,2007,983],{"class":957},[951,2009,2010],{"class":976}," href",[951,2012,980],{"class":957},[951,2014,983],{"class":957},[951,2016,1365],{"class":986},[951,2018,983],{"class":957},[951,2020,992],{"class":976},[951,2022,980],{"class":957},[951,2024,983],{"class":957},[951,2026,999],{"class":986},[951,2028,983],{"class":957},[951,2030,965],{"class":957},[269,2032,2034],{"id":2033},"use-lazy-loading","Use Lazy Loading",[943,2036,2038],{"className":945,"code":2037,"language":947,"meta":383,"style":383},"\u003Cimg src=\"photo.avif\" loading=\"lazy\" alt=\"Description\">\n",[24,2039,2040],{"__ignoreMap":383},[951,2041,2042,2044,2046,2048,2050,2052,2055,2057,2059,2061,2063,2065,2067,2069,2071,2073,2075,2077],{"class":953,"line":954},[951,2043,958],{"class":957},[951,2045,1041],{"class":961},[951,2047,1044],{"class":976},[951,2049,980],{"class":957},[951,2051,983],{"class":957},[951,2053,2054],{"class":986},"photo.avif",[951,2056,983],{"class":957},[951,2058,1068],{"class":976},[951,2060,980],{"class":957},[951,2062,983],{"class":957},[951,2064,1075],{"class":986},[951,2066,983],{"class":957},[951,2068,1056],{"class":976},[951,2070,980],{"class":957},[951,2072,983],{"class":957},[951,2074,1063],{"class":986},[951,2076,983],{"class":957},[951,2078,965],{"class":957},[269,2080,2082],{"id":2081},"set-width-and-height","Set Width and Height",[15,2084,2085],{},"Prevent layout shift:",[943,2087,2089],{"className":945,"code":2088,"language":947,"meta":383,"style":383},"\u003Cimg \n  src=\"photo.avif\" \n  width=\"800\" \n  height=\"600\" \n  alt=\"Description\"\n>\n",[24,2090,2091,2100,2115,2131,2147,2161],{"__ignoreMap":383},[951,2092,2093,2095,2097],{"class":953,"line":954},[951,2094,958],{"class":957},[951,2096,1041],{"class":961},[951,2098,2099],{"class":957}," \n",[951,2101,2102,2105,2107,2109,2111,2113],{"class":953,"line":384},[951,2103,2104],{"class":976},"  src",[951,2106,980],{"class":957},[951,2108,983],{"class":957},[951,2110,2054],{"class":986},[951,2112,983],{"class":957},[951,2114,2099],{"class":957},[951,2116,2117,2120,2122,2124,2127,2129],{"class":953,"line":394},[951,2118,2119],{"class":976},"  width",[951,2121,980],{"class":957},[951,2123,983],{"class":957},[951,2125,2126],{"class":986},"800",[951,2128,983],{"class":957},[951,2130,2099],{"class":957},[951,2132,2133,2136,2138,2140,2143,2145],{"class":953,"line":1036},[951,2134,2135],{"class":976},"  height",[951,2137,980],{"class":957},[951,2139,983],{"class":957},[951,2141,2142],{"class":986},"600",[951,2144,983],{"class":957},[951,2146,2099],{"class":957},[951,2148,2149,2152,2154,2156,2158],{"class":953,"line":1082},[951,2150,2151],{"class":976},"  alt",[951,2153,980],{"class":957},[951,2155,983],{"class":957},[951,2157,1063],{"class":986},[951,2159,2160],{"class":957},"\"\n",[951,2162,2163],{"class":953,"line":1131},[951,2164,965],{"class":957},[269,2166,2168],{"id":2167},"consider-decoding","Consider Decoding",[15,2170,2171],{},"For large images:",[943,2173,2175],{"className":945,"code":2174,"language":947,"meta":383,"style":383},"\u003Cimg src=\"large-photo.avif\" decoding=\"async\" alt=\"Description\">\n",[24,2176,2177],{"__ignoreMap":383},[951,2178,2179,2181,2183,2185,2187,2189,2192,2194,2197,2199,2201,2204,2206,2208,2210,2212,2214,2216],{"class":953,"line":954},[951,2180,958],{"class":957},[951,2182,1041],{"class":961},[951,2184,1044],{"class":976},[951,2186,980],{"class":957},[951,2188,983],{"class":957},[951,2190,2191],{"class":986},"large-photo.avif",[951,2193,983],{"class":957},[951,2195,2196],{"class":976}," decoding",[951,2198,980],{"class":957},[951,2200,983],{"class":957},[951,2202,2203],{"class":986},"async",[951,2205,983],{"class":957},[951,2207,1056],{"class":976},[951,2209,980],{"class":957},[951,2211,983],{"class":957},[951,2213,1063],{"class":986},[951,2215,983],{"class":957},[951,2217,965],{"class":957},[51,2219,2221],{"id":2220},"common-questions","Common Questions",[269,2223,2225],{"id":2224},"is-avif-supported-everywhere","Is AVIF supported everywhere?",[15,2227,2228],{},"Not yet. About 91% of users have AVIF support. Always provide fallbacks (WebP → JPG).",[269,2230,2232],{"id":2231},"does-avif-work-on-iphone","Does AVIF work on iPhone?",[15,2234,2235],{},"Yes, since iOS 16 and macOS Ventura. Older Apple devices need JPG/WebP.",[269,2237,2239],{"id":2238},"why-is-avif-encoding-so-slow","Why is AVIF encoding so slow?",[15,2241,2242],{},"AVIF's superior compression requires complex calculations. The trade-off: slow encoding, but smaller files.",[269,2244,2246],{"id":2245},"can-i-use-avif-in-email","Can I use AVIF in email?",[15,2248,2249],{},"No. Most email clients don't support AVIF. Use JPG for email.",[269,2251,2253],{"id":2252},"is-avif-free-to-use","Is AVIF free to use?",[15,2255,2256],{},"Yes! AVIF is royalty-free and open source.",[269,2258,2260],{"id":2259},"should-i-convert-all-my-images-to-avif","Should I convert all my images to AVIF?",[15,2262,2263],{},"For websites targeting modern browsers, yes. Keep JPG/WebP fallbacks for broader compatibility.",[51,2265,2267],{"id":2266},"the-future-of-avif","The Future of AVIF",[15,2269,2270],{},"AVIF adoption is growing rapidly:",[137,2272,2273,2279,2285,2291],{},[140,2274,2275,2278],{},[19,2276,2277],{},"2020:"," Chrome support",[140,2280,2281,2284],{},[19,2282,2283],{},"2022:"," Safari support",[140,2286,2287,2290],{},[19,2288,2289],{},"2024:"," CMS native support",[140,2292,2293,2296],{},[19,2294,2295],{},"2026:"," Approaching universal support",[15,2298,2299],{},"By 2027, AVIF will likely be the default format for web images, similar to WebP's trajectory.",[51,2301,2303],{"id":2302},"conclusion","Conclusion",[15,2305,2306],{},"AVIF offers the best compression available today. Use it for:",[15,2308,2309],{},"✅ Modern websites (with fallbacks)\n✅ Performance-critical applications\n✅ HDR content\n✅ Photography portfolios",[15,2311,2312],{},"Avoid it for:\n❌ Email marketing\n❌ Universal compatibility needs\n❌ Real-time encoding scenarios",[15,2314,2315,2318],{},[19,2316,2317],{},"Start using AVIF today"," with proper fallbacks, and enjoy the performance benefits.",[51,2320,2322],{"id":2321},"convert-your-images","Convert Your Images",[137,2324,2325,2331,2337],{},[140,2326,2327,2330],{},[40,2328,2329],{"href":1843},"AVIF to JPG"," - Universal compatibility",[140,2332,2333,2336],{},[40,2334,2335],{"href":1858},"AVIF to PNG"," - Lossless conversion",[140,2338,2339,2342],{},[40,2340,2341],{"href":47},"All Converters"," - Every format",[2344,2345],"hr",{},[15,2347,2348],{},[2349,2350,2351],"em",{},"Last updated: February 2026",[2353,2354,2355],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":383,"searchDepth":384,"depth":384,"links":2357},[2358,2359,2364,2367,2373,2378,2383,2388,2394,2395,2401,2409,2410,2411],{"id":433,"depth":384,"text":434},{"id":465,"depth":384,"text":466,"children":2360},[2361,2362,2363],{"id":469,"depth":394,"text":470},{"id":542,"depth":394,"text":543},{"id":563,"depth":394,"text":564},{"id":682,"depth":384,"text":683,"children":2365},[2366],{"id":768,"depth":394,"text":769},{"id":786,"depth":384,"text":787,"children":2368},[2369,2370,2371,2372],{"id":790,"depth":394,"text":791},{"id":815,"depth":394,"text":816},{"id":833,"depth":394,"text":834},{"id":851,"depth":394,"text":852},{"id":869,"depth":384,"text":870,"children":2374},[2375,2376,2377],{"id":873,"depth":394,"text":874},{"id":894,"depth":394,"text":895},{"id":915,"depth":394,"text":916},{"id":933,"depth":384,"text":934,"children":2379},[2380,2381,2382],{"id":937,"depth":394,"text":938},{"id":1092,"depth":394,"text":1093},{"id":1171,"depth":394,"text":1172},{"id":1382,"depth":384,"text":1383,"children":2384},[2385,2386,2387],{"id":1386,"depth":394,"text":1387},{"id":1410,"depth":394,"text":1411},{"id":1575,"depth":394,"text":1576},{"id":1827,"depth":384,"text":1828,"children":2389},[2390,2391,2392,2393],{"id":1831,"depth":394,"text":1832},{"id":1847,"depth":394,"text":1848},{"id":1862,"depth":394,"text":1863},{"id":1874,"depth":394,"text":1875},{"id":1886,"depth":384,"text":1887},{"id":1966,"depth":384,"text":1967,"children":2396},[2397,2398,2399,2400],{"id":1970,"depth":394,"text":1971},{"id":2033,"depth":394,"text":2034},{"id":2081,"depth":394,"text":2082},{"id":2167,"depth":394,"text":2168},{"id":2220,"depth":384,"text":2221,"children":2402},[2403,2404,2405,2406,2407,2408],{"id":2224,"depth":394,"text":2225},{"id":2231,"depth":394,"text":2232},{"id":2238,"depth":394,"text":2239},{"id":2245,"depth":394,"text":2246},{"id":2252,"depth":394,"text":2253},{"id":2259,"depth":394,"text":2260},{"id":2266,"depth":384,"text":2267},{"id":2302,"depth":384,"text":2303},{"id":2321,"depth":384,"text":2322},"2026-02-01T00:00:00.000Z","Everything you need to know about AVIF image format: browser support, compression quality, how to use it, and when to convert to other formats.",false,"/blog/avif-guide.jpg",{},"/blog/en/avif-format-complete-guide",{"title":421,"description":2413},"blog/en/avif-format-complete-guide",[582,2421,2422,2423],"Image Formats","Web Performance","Next-Gen Images",[2425],"/image/converter/jpg-to-avif","V4GhBCDBk52Iom-EGUIO5yct4dc0P3muHf9d0SZomg8",{"id":2428,"title":2429,"author":6,"body":2430,"category":401,"date":402,"description":2794,"extension":404,"featured":405,"image":406,"meta":2795,"navigation":405,"path":2796,"readingTime":409,"seo":2797,"stem":2798,"tags":2799,"tools":2802,"__hash__":2803},"content/blog/en/best-image-format-for-email-attachments.md","Best Image Format for Email Attachments: JPG, PNG, or WebP?",{"type":8,"value":2431,"toc":2778},[2432,2435,2451,2462,2466,2522,2531,2535,2538,2552,2558,2562,2567,2581,2584,2587,2598,2606,2610,2615,2618,2631,2634,2637,2641,2646,2649,2660,2663,2667,2671,2676,2680,2684,2688,2692,2696,2702,2706,2715,2719,2722,2725,2739,2742,2746,2749,2767,2770],[11,2433,2429],{"id":2434},"best-image-format-for-email-attachments-jpg-png-or-webp",[15,2436,2437,2438,2441,2442,2444,2445,2447,2448,2450],{},"If you send images by email often, the best format is usually the one that keeps the file small ",[19,2439,2440],{},"without"," making the image look broken or unreadable. In most cases, that means ",[24,2443,26],{}," for photos, ",[24,2446,30],{}," for screenshots or graphics with text, and ",[24,2449,34],{}," only when you know the recipient can open it easily.",[15,2452,2453,2454,2457,2458,2461],{},"If you need to prepare an image before sending, start with the ",[40,2455,2456],{"href":42},"Image Compressor"," to reduce size or the ",[40,2459,2460],{"href":47},"Image Converter"," to switch formats quickly.",[51,2463,2465],{"id":2464},"quick-answer","Quick answer",[56,2467,2468,2481],{},[59,2469,2470],{},[62,2471,2472,2475,2478],{},[65,2473,2474],{},"Image type",[65,2476,2477],{},"Best format for email",[65,2479,2480],{},"Why",[75,2482,2483,2492,2502,2512],{},[62,2484,2485,2487,2489],{},[80,2486,82],{},[80,2488,26],{},[80,2490,2491],{},"Small files and broad compatibility",[62,2493,2494,2497,2499],{},[80,2495,2496],{},"Screenshots with text",[80,2498,30],{},[80,2500,2501],{},"Sharp text and edges",[62,2503,2504,2507,2509],{},[80,2505,2506],{},"Transparent graphics",[80,2508,30],{},[80,2510,2511],{},"Keeps transparency intact",[62,2513,2514,2517,2519],{},[80,2515,2516],{},"Very small web-friendly exports",[80,2518,34],{},[80,2520,2521],{},"Efficient compression, but compatibility can vary",[15,2523,2524,2525,2527,2528,2530],{},"If you are unsure, send ",[24,2526,26],{}," for photos and ",[24,2529,30],{}," for screenshots.",[51,2532,2534],{"id":2533},"why-format-choice-matters-in-email","Why format choice matters in email",[15,2536,2537],{},"Email attachments still have practical limits:",[137,2539,2540,2543,2546,2549],{},[140,2541,2542],{},"large files take longer to upload and download",[140,2544,2545],{},"some inboxes reject oversized attachments",[140,2547,2548],{},"compressed screenshots can become hard to read",[140,2550,2551],{},"not every recipient has the same software support",[15,2553,2554,2555,128],{},"That is why the best format is not just about quality. It is about ",[19,2556,2557],{},"size, clarity, and compatibility together",[51,2559,2561],{"id":2560},"when-jpg-is-the-best-choice","When JPG is the best choice",[15,2563,2564,2566],{},[24,2565,26],{}," is usually the best image format for email attachments when you are sending:",[137,2568,2569,2572,2575,2578],{},[140,2570,2571],{},"photos from a phone or camera",[140,2573,2574],{},"product images",[140,2576,2577],{},"event pictures",[140,2579,2580],{},"marketing visuals without transparency",[15,2582,2583],{},"JPG uses lossy compression, which means it removes some image data to make the file smaller. For normal photos, that trade-off is often worth it.",[15,2585,2586],{},"Use JPG when your priority is:",[137,2588,2589,2592,2595],{},[140,2590,2591],{},"smaller attachment size",[140,2593,2594],{},"faster sending",[140,2596,2597],{},"reliable opening across devices",[15,2599,2600,2601,2603,2604,128],{},"If your original image is too large, compress it first with the ",[40,2602,2456],{"href":42}," or convert it from PNG using the ",[40,2605,2460],{"href":47},[51,2607,2609],{"id":2608},"when-png-is-the-better-option","When PNG is the better option",[15,2611,2612,2614],{},[24,2613,30],{}," is better for email attachments when visual clarity matters more than file size.",[15,2616,2617],{},"Good examples:",[137,2619,2620,2623,2626,2628],{},[140,2621,2622],{},"screenshots with interface text",[140,2624,2625],{},"charts and diagrams",[140,2627,228],{},[140,2629,2630],{},"graphics that need transparency",[15,2632,2633],{},"PNG keeps sharp edges and text cleaner than JPG. That makes it a safer option for instructions, bug reports, and UI reviews.",[15,2635,2636],{},"The downside is file size. PNG attachments can become much heavier than JPG, especially if the image is large.",[51,2638,2640],{"id":2639},"should-you-use-webp-in-email","Should you use WebP in email?",[15,2642,2643,2645],{},[24,2644,34],{}," can produce very small files with strong image quality, but email is not the best place to rely on it.",[15,2647,2648],{},"Why?",[137,2650,2651,2654,2657],{},[140,2652,2653],{},"some recipients may not recognize WebP immediately",[140,2655,2656],{},"older desktop tools may handle it poorly",[140,2658,2659],{},"the person receiving the image may need to convert it before using it elsewhere",[15,2661,2662],{},"WebP is fine if you control both sides of the workflow or know the recipient can open it. Otherwise, JPG and PNG remain safer choices for email.",[51,2664,2666],{"id":2665},"best-format-by-common-email-scenario","Best format by common email scenario",[269,2668,2670],{"id":2669},"sending-photos-to-a-client-or-teammate","Sending photos to a client or teammate",[15,2672,2673,2674,128],{},"Use ",[24,2675,26],{},[269,2677,2679],{"id":2678},"sending-a-screenshot-with-ui-text","Sending a screenshot with UI text",[15,2681,2673,2682,128],{},[24,2683,30],{},[269,2685,2687],{"id":2686},"sending-a-logo-with-a-transparent-background","Sending a logo with a transparent background",[15,2689,2673,2690,128],{},[24,2691,30],{},[269,2693,2695],{"id":2694},"trying-to-stay-under-an-attachment-limit","Trying to stay under an attachment limit",[15,2697,2698,2699,2701],{},"Start with ",[24,2700,26],{},", then compress further if needed.",[269,2703,2705],{"id":2704},"sending-images-to-non-technical-recipients","Sending images to non-technical recipients",[15,2707,2708,2709,2711,2712,2714],{},"Prefer ",[24,2710,26],{}," or ",[24,2713,30],{}," over WebP for better compatibility.",[51,2716,2718],{"id":2717},"how-to-make-email-image-attachments-smaller","How to make email image attachments smaller",[15,2720,2721],{},"Choosing the right format helps, but so does reducing unnecessary size.",[15,2723,2724],{},"Before sending:",[328,2726,2727,2730,2733,2736],{},[140,2728,2729],{},"resize oversized images",[140,2731,2732],{},"export photos as JPG when transparency is not needed",[140,2734,2735],{},"keep screenshots as PNG only if text must stay crisp",[140,2737,2738],{},"compress the final file before attaching it",[15,2740,2741],{},"A common mistake is emailing a huge original image straight from a phone. In many cases, a smaller export looks the same in an inbox but sends much faster.",[51,2743,2745],{"id":2744},"final-recommendation","Final recommendation",[15,2747,2748],{},"If you want the safest default, use this rule:",[137,2750,2751,2757,2762],{},[140,2752,2753,2754,2756],{},"choose ",[24,2755,26],{}," for photos",[140,2758,2753,2759,2761],{},[24,2760,30],{}," for screenshots, graphics, and transparency",[140,2763,2753,2764,2766],{},[24,2765,34],{}," only when compatibility is not a concern",[15,2768,2769],{},"That approach gives you the best balance between quality, file size, and ease of opening.",[15,2771,2772,2773,2711,2775,2777],{},"If the current file is too big or in the wrong format, use the ",[40,2774,2456],{"href":42},[40,2776,2460],{"href":47}," before you send it.",{"title":383,"searchDepth":384,"depth":384,"links":2779},[2780,2781,2782,2783,2784,2785,2792,2793],{"id":2464,"depth":384,"text":2465},{"id":2533,"depth":384,"text":2534},{"id":2560,"depth":384,"text":2561},{"id":2608,"depth":384,"text":2609},{"id":2639,"depth":384,"text":2640},{"id":2665,"depth":384,"text":2666,"children":2786},[2787,2788,2789,2790,2791],{"id":2669,"depth":394,"text":2670},{"id":2678,"depth":394,"text":2679},{"id":2686,"depth":394,"text":2687},{"id":2694,"depth":394,"text":2695},{"id":2704,"depth":394,"text":2705},{"id":2717,"depth":384,"text":2718},{"id":2744,"depth":384,"text":2745},"Learn which image format is best for email attachments, when to use JPG, PNG, or WebP, and how to reduce file size before sending.",{},"/blog/en/best-image-format-for-email-attachments",{"title":2429,"description":2794},"blog/en/best-image-format-for-email-attachments",[2800,26,30,34,2801],"Email Attachments","Image Compression",[416],"e31qoBW98YJ3Hu3pkoW_hCy_RfyTjSODSMqFVeN84XA",1781687303273]