在当今互联网环境下，响应式网页设计已经各网站必不可少的标准配置了，我们要用响应式的技术来应对不同尺寸的屏幕。网页设计师是完成响应式网站过程中的关键人物，而网页设计师们要如何出色的完成图片和图库的响应式设计呢？带着这个疑问，我们来聊聊如何轻松搞定响应式网页中的图片设计。

1、  尺寸和比例的一致性

桌面端网页和移动端网页如何保持一致的浏览体验呢？图片缩小之后信息是否完整？图片是否被拉伸？为解决这些问题，控制图片的尺寸和比例就尤为重要了。只要控制好了图片尺寸和比例，设计出来的通尽量合理的适应屏幕，这样同时可以避免响应式断点多，而需上传过多的图片。

 2、  宽高比一致

首先，我们都知道桌面端的图片浏览体验和移动端是完全不同的，对于绝大多数网站而言，图片展示的位置都大同小异，如何做到图片的展示不会因为页面变化过程中而变得奇怪和失真，是设计师们最重要的任务。

这个时候，务必始终牢记图片的高宽比，在所有设计中保持图片宽高比例一致。

 3、  轮播图及图库

网站中最常见的图片控件是轮播图及图库，使用控件可以自如的管理图片。第三方控件虽然方便，但使用这些控件的时候，一定要记得之前提到的图片宽高比及尺寸比例一致，否则一样会让网页显示效果大打折扣。

除此之外，控件的选择也是很重要的。如果你需要展示许多高品质图片或者是推广文章和专题，这时你需要使用幻灯片控件。如果你需要展示大量图片，适当的缩小图片之后也不会影响到展示效果的话，那么你可以使用图库插件，这种插件经常被使用在作品集类网站上。

 4、  高画质的图片

这一个道理其实很简单，但仍然是反复提醒到的。如果没有高画质的图片，倒不如不展示图片。在当前互联网环境下，高清、高品质、高分配率是网站的基本要素。一个整体画质低下的网站，会给用户带来极差的用户体验，用户不会愿意花时间去浏览这样的网站。在追求顶尖视觉效果的时代，那么高画质的图片是最最基本的必需品。