1、尽可能使用矢量图（svg）或者字体图标
2、鼓励人们上传最高质量的图片，屏幕向着高分辨率发展，方便以后改版
3、自动修改图片大小和压缩服务，最好能通过URL参数修改图片大小 （webP）
4、当同一张图片缩小看可以看不清楚，例如
这个时候应该显示下面这种
art direction use case. http://blog.cloudfour.com/a-framework-for-discussing-responsive-images-solutions/#artdirection
5、优化图片，选择合适的格式，下面为Google development建议
PNGs are almost always superior to GIFs and are usually the best choice. IE 4.0b1+, Mac IE 5.0+, Opera 3.51+ and Netscape 4.04+ as well as all versions of Safari and Firefox fully support PNG, including transparency. IE versions 4 to 6 don't support alpha channel transparency (partial transparency) but they support 256-color-or-less PNGs with 1-bit transparency (the same that is supported for GIFs). IE 7 and 8 support alpha transparent PNGs except when an alpha opacity filter is applied to the element. You can generate or convert suitable PNGs with GIMP by using "Indexed" rather than "RGB" mode. If you must maintain compatibility with 3.x-level browsers, serve an alternate GIF to those browsers.
Use GIFs for very small or simple graphics (e.g. less than 10x10 pixels, or a color palette of less than 3 colors) and for images which contain animation. If you think an image might compress better as a GIF, try it as a PNG and a GIF and pick the smaller.
Use JPGs for all photographic-style images.
Do not use BMPs or TIFFs.
拓展：JPEG2000可以让同一个图片文件展现出不同的分辨率 http://www.verypdf.com/pdfinfoeditor/jpeg-jpeg-2000-comparison.htm
响应式图片最大的冲突：
浏览器为了加快页面加载速度有pre-parse（在整个页面布局决定之前尽可能下载资源），而响应式图片则是希望在布局计算好之后才加载适合分辨率的图片
现在的做法一般是先加载一般分辨率的图片，然后再用javascript检测屏幕分辨率后替换为高分辨的图片