WebAppers

/ best free open source web resources /

Shopify

Automatically Adapts Your Images for Mobile Devices

Posted · Category: CC License, Gallery

Adaptive Images automatically adapts your existing HTML images for mobile devices. No mark-up changes needed. Just drop it in and forget about it.

Your site is being increasingly viewed on smaller, slower, low bandwidth devices. Your desktop-centric images load slowly, cause UI lag, and cost your visitors un-necessary bandwidth and money. You’ve implemented a responsive design in CSS, and need something to adapt your <img>’s too.

A .htaccess rule on the server intercepts any requests for .jpg .gif or .png files which are not inside protected directories. Protected directories are configured in the .htaccess file so that the server does not resize any images which are not content images.

adaptive-images

Requirements: Javascript Enabled
Demo: http://adaptive-images.com/
License: Creative Commons 3.0 License

4 Comments
  • http://www.maggew.com WEB Suite

    This is a great find – thanks a bunch for the community contribution my friend. This will be an amazing feature to offer all future client web suites.

  • http://www.2021.com.au/ David

    This looks quite promising.

  • http://8gramgorilla.com 8 Gram Gorilla

    Wow. Very, very cool concept. Don’t suppose there’s a Rails version?

  • http://www.ethanhackett.com Ethan Hackett

    I decided to give this a try on a wordpress template/blog I’m working on. http://www.tincrate.com I mixed it in with some CSS media-query to present the content on mobile devises and thought I’d give it a try.

    It was really easy to implement. Almost to simple I was afraid I was doing it wrong lol.

    I’d like to see this as a wordpress plugin.

Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons