Restructure image processing

[mattstratton]

This is a meta-issue that will contain smaller issues.

The overall workflow as I see it is that we'll have the following:

1. All images going forward with be jpg.
2. The content/episode directory should only contain markdown files.
3. All images related to episodes will go into the static/img/episode directory (in the site, not in the theme)
4. Inside static/img there will be subdirectories for each episode, i.e., static/img/episode/blameless. This subdirectory must be named the same as the filename as the .md file in content/episode
5. Inside the episode image directory, there are two files - square.jpg and banner.jpg. The square.jpg file should be 500 px x 500 px. The banner.jpg should be 1200px by 630px.
6. During production build time, we will do retina processing on banner.jpg with a 1x resolution of 800px by 420 px. We will also do a non-retina, but same resolution processing of the banner.jpg to social.jpg which will be used for open graph image tags.
7. For backward compatibility, if the images frontmatter exists, it will use that for the OG tags.
8. For backward compatibility, if the static/img/episode/EPISODE directory does not exist, it will use the old-style to find the image.

• Change static directory to have a subdirectory for each episode
• Create gulp task for responsive image/resizing