Guidelines on optimizing images for mobile, tablets accessing the website

1

Not directly related to Meteor (more in general) but …

Does anyone know a tool or some guidelines on how to resize an image that was originally done for MacBook retina screens down to iPad and iPhone size (again retina screens)?

Further, in order to optimize loading times (some of my customer might have slower connection) and especially for those visiting my website from their phones, what is the guidelines to downscale images?

Any help is appreciated!

PS: for loading retina images I’m looking at this package right now: http://imulus.github.io/retinajs/

2

Found this article: http://www.noupe.com/design/html5-and-css3-get-your-website-ready-for-high-resolution-displays-90409.html which is relatively recent. Still not sure if this is the best solution to optimize for loading times and quality of images.