Use <picture> for homepage cover image

As discussed in issue #3, the cover image on the homepage is currently 5000px wide and 2.2mb in size. This is not ideal.

This introduces the [Picturefill]() js library to polyfill the new `<picture>` element and associated features, allowing us to deliver the most appropriate image for a users device and current viewport. 

As the cover image takes up the entire viewport width, I have opted more the more concise `srcset` & `size` attributes inside an `<img>` element rather than the full blown `<picture>` element.

I have generated four different dimensions of the image for most common screen sizes and ran then through ImageOptim:
- 640
- 1024
- 2048
- 4096

#### Next steps:
- Add to all content images across site, i.e. talk thumbnails etc
- Automate image optimisation and cropping batch processing via a gulp task
- Test in common browsers.

#### Further reading:
- srcset and sizes: http://ericportis.com/posts/2014/srcset-sizes/
- Picture documentation and examples: http://scottjehl.github.io/picturefill/#getting-started
https://github.com/guardian/developers-site/blob/master/.jshintrc

Don't have a linter plugin installed for your IDE? Get out :-P

Oliver Joseph Ash
Software Engineer


On 21 July 2014 11:08, Patrick Hamann <notifications@github.com> wrote:

> In src/js/app.js:
>
> > @@ -1,6 +1,7 @@
> >  import moment from 'moment';
> >  import reqwest from 'github:ded/reqwest';
> >  import ejs from 'npm:ejs';
> > +import Picturefill from 'github:scottjehl/picturefill/src/picturefill';
>
> Linter? What linter? [image: :wink:]
>
> —
> Reply to this email directly or view it on GitHub
> <https://github.com/guardian/developers-site/pull/34/files#r15161659>.
>

-- 

------------------------------
Visit theguardian.com. On your mobile and tablet, download the Guardian 
iPhone and Android apps theguardian.com/guardianapp and our tablet editions 
theguardian.com/editions.  Save up to 57% by subscribing to the Guardian 
and Observer - choose the papers you want and get full digital access. 
 Visit subscribe.theguardian.com

This e-mail and all attachments are confidential and may also be 
privileged. If you are not the named recipient, please notify the sender 
and delete the e-mail and all attachments immediately. Do not disclose the 
contents to another person. You may not use the information for any 
purpose, or store, or copy, it in any way.  Guardian News & Media Limited 
is not liable for any computer viruses or other material transmitted with 
or as part of this e-mail. You should employ virus checking software.
 
Guardian News & Media Limited is a member of Guardian Media Group plc. Registered 
Office: PO Box 68164, Kings Place, 90 York Way, London, N1P 2AP.  Registered 
in England Number 908396