两招搞掂响应式的图片设计

运用响应式进行网页设计可以说是现在的标配之一,因为它可以更好地应对日渐碎片化的设备屏幕尺寸。而图片是响应式的难点,不妨看看下面两个重要因素:

  • 高宽比

桌面端的图片和移动端的图片对於用户体验来说,当然是有区别的。因此,图片设计的首要任务是能够保证图片的呈现,不会跟随者网页布局的伸缩变化而变得扭曲、失真。最直接的方法就是始终对高宽比的控制要到位!简单来说,就是控制原始图片不被拉伸,同时让部分的高宽比能够合理地匹配用户的屏幕。否则容易造成断点过多,需要设计师上传更多的图片,拖低加载的速度。

  • 尺寸和比例

断点是响应式的局限性之一。很多设计师仅仅只是将图片上传到CMS系统当中,这并不现实!要记住,每张需要使用到网页当中去的图片,都需要被裁剪得合理!

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/44546.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
Inspirr的头像Inspirr订阅用户
上一篇 2022年6月25日
下一篇 2022年6月25日

相关推荐

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息