The Foundation Image stack explained.

We have had a lot of people wonder why Foundation’s Image stack has 3 drop zones for images and how that benefits the people viewing their sites.

The images are loaded dynamically via JS. If you have “Always load mobile image” chedked that image will be downloaded for all devices first. This will ensure that an image is always there. Once the Javascript runs, it will discover she size device you are on and replace the mobile image with a tablet or desktop image. Obviously, if you are on mobile, then nothing else is downloaded. If you need help understanding how to use the Image stack, see our Using the Image Stack FAQ

Now go forth and make your websites great