https://github.com/MattWilcox/Adaptive-Images

Automatically adapts your existing HTML images for mobile devices. No mark-up changes needed.
https://github.com/MattWilcox/Adaptive-Images

Last synced: 4 months ago
JSON representation

Automatically adapts your existing HTML images for mobile devices. No mark-up changes needed.

• Host: GitHub
• URL: https://github.com/MattWilcox/Adaptive-Images
• Owner: MattWilcox
• Created: 2011-08-26T17:31:26.000Z (over 13 years ago)
• Default Branch: master
• Last Pushed: 2020-01-28T15:28:13.000Z (about 5 years ago)
• Last Synced: 2024-04-14T04:38:45.531Z (10 months ago)
• Language: HTML
• Homepage: http://adaptive-images.com/
• Size: 1.91 MB
• Stars: 1,764
• Watchers: 99
• Forks: 231
• Open Issues: 53
• Metadata Files:
  • Readme: readme.textile
  • Changelog: changelog.txt

Awesome Lists containing this project

README

        
h1. Adaptive Images

Is a solution to automatically create, cache, and deliver device-appropriate versions of your website's content images. It does not require you to change your mark-up. It is intended for use with "Responsive Designs":http://www.abookapart.com/products/responsive-web-design and to be combined with "Fluid Image":http://unstoppablerobotninja.com/entry/fluid-images/ techniques.

h2. Project status

I am not maintaining this project any longer.

This is an old project, and still works as intended, with little need for new features (hence the lack of updates). That said; if you are building a new website I would *strongly recommend* looking into HTLM's new 'picture' tag, and the srcset and sizes properties now available on regular img tags. These were not available at the time of making AI, have since become a standard, and in many cases these are more appropriate solutions today.

h2. Benefits

* Ensures you and your visitors are not wasting bandwidth delivering images at a higher resolution than the vistor needs.

* Will work on your existing site, as it requires no changes to your mark-up.

* Is device agnostic (it works by detecting the size of the visitors screen)

* Is CMS agnostic (it manages its own image re-sizing, and will work on any CMS or even on flat HTML pages)

* Is entirely automatic. Once added to your site, you need do no further work.

* Highly configurable

** Set the resolutions you want to become adaptive (usually the same as the ones in your CSS @media queries)

** Choose where you want the cached files to be stored

** Configure directories to ignore (protect certain directories so AI is not applied to images within them)

Find out more, and view examples at "http://adaptive-images.com":http://adaptive-images.com

h2. Legal

Adaptive Images by Matt Wilcox is licensed under a "Creative Commons Attribution 3.0 Unported License":http://creativecommons.org/licenses/by/3.0/