<meta name="viewport" content="width=device-width" />

  <img src="/images/small.jpg"
    srcset="/images/small.jpg 320w, /images/medium.jpg 720w, /images/large.jpg 2560w"
    alt="foo"
    style="width: 100%;"
    />

srcset requires sizes! http://blog.cloudfour.com/responsive-images-101-part-5-sizes/

http://modernizr.com/

http://selectivizr.com/

http://nicolasgallagher.com/about-normalize-css/

Flexslider

Inlineimages e.g. menu icon: http://www.polarfoundation.org/

http://www.elmastudio.de/programmierung/css/css-tipp-rem-als-einheit-fur-schriftgrose-nutzen/

http://scottjehl.github.io/picturefill/

http://blog.selfhtml.org/2006/09/22/css3-calc-vs-box-sizing/

Google Speed/Mobile

http://www.resonanz-marketing.com/de/blog/beitrag/ist-ihre-webseite-mobilfreundlich-fuer-mobilgeraete-optimiert.htm

http://www.responsivegridsystem.com/

http://stackoverflow.com/questions/12933356/change-div-order-on-responsive-design

http://www.stuffandnonsense.co.uk/projects/320andup/

320px
480px
600px
768px
900px
1200px

480, 600, 768, 992 and 1382

Wow: http://www.slideshare.net/bryanrieger/rethinking-the-mobile-web-by-yiibu

http://detectmobilebrowsers.com/

http://css-tricks.com/snippets/css/media-queries-for-standard-devices/

http://mislav.uniqpath.com/2010/04/targeted-css/

http://www.webkrauts.de/2011/12/21/ein-blick-durch-den-viewport/

html5 for IE:
http://code.google.com/p/html5shim/

html5/css3 example site
http://stunningcss3.com/code/bakery/index.html
http://www.alldesignstuffs.com/2011/creating-responsive-html5-page-using-media-queries/http://designmodo.com/responsive-design-examples/
http://mediaqueri.es/
http://www.enochs.co.uk/

multicolumn:
http://www.quirksmode.org/css/multicolumn.html

test mobile layouts:
http://mattkersley.com/responsive/

responsive images:
https://github.com/filamentgroup/Responsive-Images
better: http://adaptive-images.com/

html5 boilerplate:
http://html5boilerplate.com/mobile

http://www.netmagazine.com/features/50-fantastic-tools-responsive-web-design

! http://styletil.es/

How it works in ullright

Here's an old blog post about creating an iphone view:
http://www.symfony-project.org/blog/2008/06/09/how-to-create-an-optimized-version-of-your-website-for-the-iphone-in-symfony-1-1
Most of it is still valid and it works.

But there is one serious drawback: You have to provide a mobile template for each action.
That's why we created a tiny patch (for our "ullright" platform) to provide a fallback to normal templates in case there is no special mobile one.

Here are the required parts:

Mobile detection: This belongs into your project configuration:
http://trac.ullright.org/browser/trunk/plugins/ullCorePlugin/config/ullCorePluginConfiguration.class.php

Symfony patch enabling fallback to html templates: (Patches sfView.class.php)
http://trac.ullright.org/browser/trunk/plugins/ullCorePlugin/patch/sfView.patch.txt

Finally provide a mobile template (or not):
Normaly you would put your template in apps/frontend/modules/myModule/templates/myActionSuccess.php
Now you can provide a mobile template by creating the following file: apps/frontend/modules/myModule/templates/myActionSuccess.mobile.php

This also works for layouts, partials and components. Example: apps/frontend/modules/myModule/templates/_head.mobile.php