Grow your store with our weekly podcasts, videos, and letters. JOIN NOW
Ethercycle logo
When someone bookmarks a website to their homescreen, iOS creates an icon for it. The most direct way to accomodate this feature is to create a larger version of your favicon. iOS will look for one of four different file names in the your root directory depending on the device:

apple-touch-icon-114x114.png (114px x 114px)
apple-touch-icon-72x72.png (72px x 72px)
apple-touch-icon-57x57.png (57px x 57px)
apple-touch-icon.png (57px x 57px)

When you save them to web & devices in Photoshop, use 24bit PNG, non interlaced. You shouldn't add any effects or even rounded corners, just square. iOS will add rounded corners and a gradient on its own.

If you need to store the touch icons in someplace other than the root directory, you can specify the new location in your metatags.

The iOS developer library has more information on specifying icons



In April we launched CalmingManatee.com. The site features pictures of sea cows with inspirational captions presented in typical LOLcat-style. It started as a Friday afternoon joke sparked by a misunderstanding between "matinee and manatee" on Twitter.

In its first 30 days, it had over one million page views. The site has been tweeted by Peewee Herman, and we've even been interviewed by the Huffington Post about it. What did we do to promote it? We tweeted it. Once. That's all. It’s giving us a lot of insight into the power of social media and how we can leverage it.

What we learned about going viral:
  1. If something is compelling enough, people will share it. You can't force people to share crappy content.

  2. Enable frictionless sharing. Simple buttons with recognizable icons is all you need. No need for obnoxious pop-up windows.

  3. Facebook drives more traffic than any other social network. Seven times as much as Twitter.

  4. While all of the manatees have ended up on Pinterest, Pinterest drives the least amount of traffic. It's drive-by pinning.

  5. If you want to be social, you have to be mobile friendly. 1 in 5 visitors are using a mobile device. Over half of these are iPhones.

  6. Be prepared for the traffic. CloudFlare, our content delivery network, allowed our VPS hosting to easily keep up with the sudden popularity.





These are tools we use every day as developers. If you're a Mac-owning web developer, you should consider these apps for your toolkit.

Adobe Shadow - Development tool
Wirelessly connect multiple iOS & Android devices to your computer then synchronously browse, inspect & debug on devices.

ColorSnapper - Color Picker
A global, hotkey accessible color picker for OSX with magnifying loupe. Easily grab hex values for anything.

LiveReload - Development tool
Never hit refresh again. As soon as you save a file, it is preprocessed as needed, and the browser is refreshed.

Patterns - Regular expression editor
Regular expressions made easy with this editor. See matches and replacements in real time while you edit your pattern.

Pixelmator - Image editor
The first solid replacement for Photoshop. Beautifully designed, easy-to-use, fast, and powerful image editing.

TextMate - Text editor
The gold standard for editing code. Syntax highlighting plus extensibility via Bundles makes TextMate the best coding experience on any platform.

Transmit - FTP client
The closest thing you'll ever have to fun in an FTP client. It's elegant, flexible, and easy to use.
"We want people doing white hat search engine optimization (or even no search engine optimization at all) to be free to focus on creating amazing, compelling web sites. As always, we’ll keep our ears open for feedback on ways to iterate and improve our ranking algorithms toward that goal."
–Matt Cutts, head of Google's Webspam tool.

Continue reading on the Official Google Webmaster Central blog.
Our friend and client Joe Reichert at Amlings Cycle told me this anecdote about pricing:

A man comes in to a bike shop with a wobbly wheel, asking if it can be repaired. The bike mechanic looks at the wheel a moment, and then tightens one spoke. The wheel is straight again. "That'll be forty dollars, sir," says the mechanic. Aghast, the customer replies, "Forty dollars? You turned one spoke!" The mechanic replies, "It's $1 for the labor, and $39 for knowing which spoke to turn."



When saving images for the web, we need to strike a balance between file size and quality. For most images, the above settings when used in Adobe Photoshop CS5 will yield excellent quality within minimal file sizes. If you select "optimized" you may get a slightly smaller file size. Resist the temptation. We know that progressive JPEGs (while bigger) will appear to load faster to the user.