AppStore，为什么网页版的应用图标会变形? [英] AppStore, why app icon is distorted in web version?

问题描述

自从上次更新以来，Web 版 Appstore 中的图标以奇怪的方式拉伸.我没有改变我的图标已经两个版本了.移动版图标是正确的，所以只有网页版有问题

Since last update icon is stretched in weird way in the web version of Appstore. I didn't change my icons already two releases. In mobile version icon is correct, so problem only with the web version

推荐答案

哈哈哈，很有意思，所以查了一下这个页面的源码.

hahaha, It's interesting, so I check up this page's source code.

这张照片的 HTML 显示如下:

the HTML show this photo is below:

<picture id="ember145" class="we-artwork ember-view product-hero__artwork we-artwork--fullwidth we-artwork--ios-app-icon" data-test-product-hero-artwork="">
          <source class="we-artwork__source" srcset="https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/230x0w.webp 1x, https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/460x0w.webp 2x" media="(min-width: 1069px)" type="image/webp">

          <source class="we-artwork__source" srcset="https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/230x0w.png 1x, https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/460x0w.png 2x" media="(min-width: 1069px)" type="image/png">

          <source class="we-artwork__source" srcset="https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/217x0w.webp 1x, https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/434x0w.webp 2x" media="(min-width: 735px)" type="image/webp">

          <source class="we-artwork__source" srcset="https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/217x0w.png 1x, https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/434x0w.png 2x" media="(min-width: 735px)" type="image/png">

          <source class="we-artwork__source" srcset="https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/246x0w.webp 1x, https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/492x0w.webp 2x" type="image/webp">

          <source class="we-artwork__source" srcset="https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/246x0w.png 1x, https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/492x0w.png 2x" type="image/png">
</picture>

使用 Chrome 加载此页面时，https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/230x0w.webp，这个url会被使用，而且是错误的图片

when load this page with Chrome, https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/230x0w.webp, this url will be used, and it is wrong image

和

当使用 Safari 加载此页面时，

when load this page with Safari,

https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-00-85-220.png/246x0w.png，会用到这个url，是正常的图片.

https://is2-ssl.mzstatic.com/image/thumb/Purple124/v4/6c/64/15/6c64153a-bfb8-f201-ad96-6b7a7ce47505/AppIcon-1x_U007emarketing-0-8-0-85-220.png/246x0w.png, this url will be used, and it normal image.

所以我认为这个页面在如何显示正确的应用程序图标方面存在浏览器兼容性问题.可以联系苹果修改.

So I think that this page has a browser compatibility issue about how to show right app icon. You can contact Apple to modify it.

这篇关于AppStore，为什么网页版的应用图标会变形?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！