Responsive Email Templates
Justin asked earlier about some responsive email design templates, and I had a few bookmarked that I’ve used on earlier projects. Both are pretty solid, and can be built off of pretty easily.
InHarvest.com
- Initio designed
- Convert to responsive
- Fontawesome icons
- Composer style recipes and products, features, etc
- Cycle 2, fancybox 2, js height equalizer, the usual
- Color coded sections
Nothing too fancy here really. The color coding and a lot of different layouts made this a bit of a challenge, especially when making responsive, but nothing to crazy. We’ll see how it goes as they continue to edit content.
The Best favicon Generator
This has got to be the end all-be all of favicon generators.
http://realfavicongenerator.net/
Upload one image and it will generate all of the images for you as well as the required code.
Upload the highest quality icon you can, preferably 512×512 if possible.
<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png" /> <link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png" /> <link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png" /> <link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png" /> <link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png" /> <link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png" /> <link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png" /> <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png" /> <link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16" /> <link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32" /> <link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96" /> <link rel="icon" type="image/png" href="/favicon-160x160.png" sizes="160x160" /> <meta name="msapplication-TileColor" content="#da532c" /> <meta name="msapplication-TileImage" content="/mstile-144x144.png" /> <meta name="msapplication-square70x70logo" content="/mstile-70x70.png" /> <meta name="msapplication-square150x150logo" content="/mstile-150x150.png" /> <meta name="msapplication-wide310x150logo" content="/mstile-310x150.png" /> <meta name="msapplication-square310x310logo" content="/mstile-310x310.png" />
iOS 7 Icon Sizes
<!-- non-retina iPhone pre iOS 7 --> <link rel="apple-touch-icon" href="icon57.png" sizes="57x57"> <!-- non-retina iPad pre iOS 7 --> <link rel="apple-touch-icon" href="icon72.png" sizes="72x72"> <!-- non-retina iPad iOS 7 --> <link rel="apple-touch-icon" href="icon76.png" sizes="76x76"> <!-- retina iPhone pre iOS 7 --> <link rel="apple-touch-icon" href="icon114.png" sizes="114x114"> <!-- retina iPhone iOS 7 --> <link rel="apple-touch-icon" href="icon120.png" sizes="120x120"> <!-- retina iPad pre iOS 7 --> <link rel="apple-touch-icon" href="icon144.png" sizes="144x144"> <!-- retina iPad iOS 7 --> <link rel="apple-touch-icon" href="icon152.png" sizes="152x152">
Northland Capital
A decent redesign here, got a little whacky with a lot of changes, but still pretty solid.
- Responsive – Boilerplate-ish
- Concrete5 – Composer, Global Blocks
- Cycle2
- Composer style News, Home Slider, Inventory
- Inventory w/Designer Gallery + FancyBox2 galleries
- Some custom forms (Online Payments, Payment Calculator)
- Twitter feed with Twitter API and some js for display
Recent Comments