From edeeed0468ec09eb0d4d7c6910a4c0b0ca6462e7 Mon Sep 17 00:00:00 2001 From: scottjehl Date: Sat, 2 Apr 2011 15:39:46 -0400 Subject: [PATCH] updated readme --- README.md | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 7be48f1..7504e3d 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,15 @@ # Responsive Images ### Mobile-First Images that Scale Responsively & Responsibly -#### What is this? +### What is this? The goal of this technique is to deliver optimized, contextual image sizes in [responsive web designs](http://www.alistapart.com/articles/responsive-web-design/) that utilize dramatically different image sizes at different resolutions. The approach enables developers to start with mobile-optimized image references in their HTML that automatically loads a full-size image on larger screen resolutions -- without requesting both image sizes, and without UA sniffing. +### What's new with this version? +There are two versions of Responsive Images; this version is currently in testing, while the [original version can be found here](https://github.com/filamentgroup/Responsive-Images). The original does not require cookies, but it also does not work in as many browsers as this cookie-based approach either, so we're evaluating which to use based on project needs & limitations. + +The cookie approach that this version uses was conceived by [Keith Clark](http://twitter.com/#!/keithclarkcouk/status/53807492957880320). This approach allows us to cut several workarounds out of our initial technique. + + ### [Live demo](http://filamentgroup.com/examples/responsive-images-2/demo.html): See demo.html for implementation, or [view it live](http://filamentgroup.com/examples/responsive-images-2/demo.html) @@ -13,11 +19,6 @@ After viewing the demo, view the following links to see it working: * Large image: [http://filamentgroup.com/examples/responsive-images-2/sample-content/running.large.jpg](http://filamentgroup.com/examples/responsive-images-2/sample-content/running.large.jpg) * Responsive image (size depends on your screen width): [http://filamentgroup.com/examples/responsive-images-2/sample-content/running.r.jpg](http://filamentgroup.com/examples/responsive-images-2/sample-content/running.r.jpg) -### Notes on this version & a hat tip -There are two versions of Responsive Images; this version is currently in testing, while the [original version can be found here](https://github.com/filamentgroup/Responsive-Images). The original does not require cookies, but it also does not work in as many browsers as this cookie-based approach either, so we're evaluating which to use based on project needs & limitations. - -The cookie approach that this version uses was conceived by [Keith Clark](http://twitter.com/#!/keithclarkcouk/status/53807492957880320). This approach allows us to cut several workarounds out of our initial technique. - ### New Instructions _Note: you'll need an apache web server for the redirect approach provided._