首页 / 营销学院 / 建站资讯 / Shopify网站banner及产品图片要求 | Shopify教程

Shopify网站banner及产品图片要求 | Shopify教程

浏览数量:11     作者:本站编辑     发布时间: 2019-08-30      来源:本站

Shopify banner尺寸图片尺寸

Shopify支持的图片格式包括 


 JPEG / JPG Progressive 

 JPEG 

 PNG 

 GIF 

如果你上传的图片格式不是以上类型的图片,Shopify会自动将你上传的图片格式转换为以上类型 的图片,大部分其他格式的图片都会转化为JPEG,SVG格式的图片会被自动转化为PNG格式的文 件。 


以上几种类型的产品图片,在不同的使用环境中各有优势,Shopify官方的建议如下: 


JPEG / JPG格式的图片 


JPEG/JPG格式的图片适合用于显示色彩相对丰富复杂的静止图像,例如拍照的照片图片格式通常 为JPG格式的文件。JPEG/JPG格式的图片色彩丰富,同时可以在保证图片质量的前提下保证图片 的显示效果,就是对图片的无损压缩,这样既保证了图片的显示效果,对图片的无损压缩减小的 文件的大小从而保证了网站的打开速度。 


因此,JPEG/JPG格式的图片适用于 产品图片,网站的Banner图片,轮播图片,网站页面和博客 文章里面的图片。


PNG格式的图片 


PNG格式的图片是图形图标文件的理想格式,同时也支持透明度功能,因此在网站的里的Logo图 片,以及社交图标文件等等图片应用建议选择PNG格式的图片。 


Shopify对图片的自动压缩 为了提高网站的打开速度,减少网站页面的加载时间,同时将更多的图片存储在特定数量的磁盘 中,Shopify会在特定的条件下对满足特定要求的图片进行压缩。图片压缩之后可能会导致图像质 量的改变。压缩之后的图片的分辨率和你上传的图片的分辨率以及图片尺寸有关系。通常被压缩 之后的图片的分辨率DPI为 JPEG:65-90之间 PNG:90 GIF:不会被压缩 图片的具体分辨率设置可以使用PS查看与调整(快捷键Ctrl+Alt+I)


对JPEG格式的文件来说,压缩之后的图片的分辨率和你上传的图片的分辨率以及图片的尺寸有关系。 

Shopify图片尺寸要求

图片文件限制 


上传到Shopify网站的图片在网站的像素尺寸和文件大小方面都有限制,超过以下任意限制在上传 文件的时候会显示出错。 图片像素方面的限制为2000万像素, (图片长与宽像素的乘积) 文件大小方面的限制为20M 关于大尺寸图片在不同设备终端的显示问题 大部分的Shopify主题(例如Boundless,Brooklyn,Venture)支持使用全屏的Slideshow图片 或者Banner图片,在上传这些图片之前,你需要首先了解这些图片在不同设备上的显示问题,因 为Shopify是一个自适应的系统,会自动调整图片的显示尺寸以适应不同屏幕的大小,在电脑上可 以全屏显示的图片,当用户使用手机访问时显示的图片可能只是原图的一部分。 


因此为了保证你的图片能够在任意大小的屏幕上有最佳的显示效果,在制作大图时需要注意以下 几点: 1. 尽可能的将你想要展示给客户的重要图片信息显示在图片中间,以防止在电脑上可以正常显 示的图片在手机上访问时被截掉。如下图,Shopify系统对大图的截取示意:

WX20190830-165549@2x

2. 用于Banner或者Slideshow的图片在上传到Shopify上之前,请不要添加任何文字信息,以防止在手机上访问时文字别截掉。你可以在图片上传之后使用Shopify系统为图片添加文字 信息,这些文字是独立于图片的,是自适应的,不会被截掉。 


3. 图片不应该过于复杂,以防止你在后期添加文字的时候文字显示效果太差难以阅读,如果确 实无法避免使用太过复杂的图片,可以在图片上传之后使用Shopify的图片Overlay功能, 在图片上方蒙上一层可以调整透明度和颜色的涂层,以凸显文字的显示。 




营销学院

快速导航

产品服务

联系我们

工作时间:周一至周五 | 9:00-18:00
地址:福州市鼓楼区软件园B区
国家863基地5楼Google出海体验中心

电话: 18559271352| 厦门米


扫一扫,获取最新资讯
 
如果您有Google/Facebook广告开户、广告充值、广告优化方面的相关问题,可以通过【右下角表单】提交您的问题或者通过【电话联系我们】,我们24小时在线,表单提交最快1小时内可以回复您。

营销学院: 建站资讯    搜索引擎    社交媒体    网站更新    营销资讯    跨境电商    
 

我们联系您
 
Copyright  福建米多多网络科技有限公司 站点地图