diff --git a/TODO.txt b/TODO.txt
new file mode 100644
index 0000000..0b405ff
--- /dev/null
+++ b/TODO.txt
@@ -0,0 +1,6 @@
+- Merge the gh-pages branch
+- Update the readme
+- Release 2.0.0 on bower and GitHub
+- Try to improve performances again, caching the sourcesData object -> version 2.0.1
+- Add support to the src attribute, not only srcset -> version 2.0.2
+- Add automated tests!!!
diff --git a/index.html b/index.html
index ad733f6..e358b7c 100644
--- a/index.html
+++ b/index.html
@@ -5,27 +5,55 @@
 	<title>Responsive images using verlok/picturePolyfill - by Andrea Verlicchi</title>
 	<meta name="viewport" content="width=device-width">
 	<style>
-		body { margin: 0; padding: 0; text-align: center; }
-		.intro { padding: 0 16px; }
-		.outro { padding: 1px 16px; clear: both; }
+		body { margin: 0 0 2em 0; padding: 0; text-align: center; }
 		.element a, .element span, .element img { display: block; }
+		h2 { margin-top: 1.5em }
 		img { width: 100%; height: auto; border: 0; }
-		.element h2 { padding: 0 16px; }
-		.element:hover h2 { text-decoration: underline; }
 		@media screen and (min-width: 481px) {
 			.element { float: left; width: 50%; }
 		}
+		.cf:before,	.cf:after {	content: " "; display: table; }
+		.cf:after {	clear: both; }
 	</style>
 </head>
 <body>
 	<div id="container">
-		<div class="intro">
-			<h1>Responsive images using <a href="https://github.com/verlok/picturePolyfill">PicturePolyfill</a> - Demo</h1>
-			<p>The following link contains two <strong>responsive images</strong> created using a real <code>&lt;picture&gt;</code> element, and the <a href="https://github.com/verlok/picturePolyfill">picturePolyfill</a> script.</p>
+
+		<h1>Responsive images using <a href="https://github.com/verlok/picturePolyfill">PicturePolyfill</a> - Demo</h1>
+		<p>The following link contains two <strong>responsive images</strong> created using a real <code>&lt;picture&gt;</code> element, and the <a href="https://github.com/verlok/picturePolyfill">picturePolyfill</a> script.</p>
+
+		<div class="cf">
+			<div class="element">
+				<h3>With HD (Retina) display support</h3>
+				<picture data-alt="A beautiful responsive image" data-default-src="http://demo.api.pixtulate.com/demo/large-2.jpg?w=1440">
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=480, http://demo.api.pixtulate.com/demo/large-2.jpg?w=960 2x"/>
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=512, http://demo.api.pixtulate.com/demo/large-2.jpg?w=1024 2x" media="(min-width: 481px)"/>
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=720, http://demo.api.pixtulate.com/demo/large-2.jpg?w=1440 2x" media="(min-width: 1025px)"/>
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=960, http://demo.api.pixtulate.com/demo/large-2.jpg?w=1920 2x" media="(min-width: 1441px)"/>
+					<noscript>
+						<img src="http://demo.api.pixtulate.com/demo/large-2.jpg?w=1440" alt="A beautiful responsive image"/>
+					</noscript>
+				</picture>
+			</div>
+			<div class="element">
+				<h3>Without HD (Retina) display support</h3>
+				<picture data-alt="A beautiful responsive image" data-default-src="img/1440x1440.gif">
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=480"/>
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=512" media="(min-width: 481px)"/>
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=720" media="(min-width: 1025px)"/>
+					<source srcset="http://demo.api.pixtulate.com/demo/large-2.jpg?w=960" media="(min-width: 1441px)"/>
+					<noscript>
+						<img src="http://demo.api.pixtulate.com/demo/large-2.jpg?w=1440" alt="A beautiful responsive image"/>
+					</noscript>
+				</picture>
+			</div>
 		</div>
-		<div class="element">
-			<h2>With HD (Retina) display support</h2>
-			<a href="#someLink1">
+
+		<p>Real time server side scaling is provided by <a href="http://www.pixtulate.com">Pixtulate</a>.</p>
+
+		<div class="cf">
+			<div class="element">
+				<h3>With HD (Retina) display support</h3>
 				<picture data-alt="A beautiful responsive image" data-default-src="img/1440x1440.gif">
 					<source srcset="img/480x480.gif, img/480x480x2.gif 2x"/>
 					<source srcset="img/768x768.gif, img/768x768x2.gif 2x" media="(min-width: 481px)"/>
@@ -35,11 +63,9 @@ <h2>With HD (Retina) display support</h2>
 						<img src="img/768x768.gif" alt="A beautiful responsive image"/>
 					</noscript>
 				</picture>
-			</a>
-		</div>
-		<div class="element">
-			<h2>Without HD (Retina) display support</h2>
-			<a href="#someLink2">
+			</div>
+			<div class="element">
+				<h3>Without HD (Retina) display support</h3>
 				<picture data-alt="A beautiful responsive image" data-default-src="img/1440x1440.gif">
 					<source srcset="img/480x480.gif"/>
 					<source srcset="img/768x768.gif" media="(min-width: 481px)"/>
@@ -49,13 +75,9 @@ <h2>Without HD (Retina) display support</h2>
 						<img src="img/768x768.gif" alt="A beautiful responsive image"/>
 					</noscript>
 				</picture>
-			</a>
-		</div>
-		<!--
-		<div class="outro">
-			<p>Real time server side scaling is provided by <a href="http://www.pixtulate.com">Pixtulate</a>.</p>
+			</div>
 		</div>
-		-->
+
 	</div>
 	<script src="picturePolyfill.js"></script>
 </body>
