Tag: apple

Categories
Best Of Explained

HOWTO: iPhone Webclip Icons

I remember, years ago, I was baffled by the little 16×16 icons that were showing up in my URL toolbar, and it took a surprising amount of searching to find out how to create one. I refuse to let this happen again.

So: if you want to make a custom icon for your website that will show up in the Springboard when a user makes a “webclip”, using their iPhone or iPod Touch, the dirt simple way is:

* Create a 57×57 PNG.
* Name it “apple-touch-icon.png”
* Throw it in the root folder of your website. (Not the root of your server, the root of your web documents.)

Boom. If you add a webclip for vjarmy.com, you’ll see my smiling mug.
If you want more flexibility – perhaps you don’t have access to the site root, perhaps you want to use a different file name or format – you can use a link tag in the head of the document, such as:

<head>
<title>iHelloWorld</title>
<link rel="apple-touch-icon" href="/whatever.jpg"/>
</head>

I’ve tested this with a slightly larger (75×75) JPEG, and it works without trouble – it just scales things down.

If you’re testing this on your iPhone, you may notice a pause of a few seconds before the icon appears when you press “Add To Home Menu”. I’d imagine the icon only downloads when you request to make a webclip, instead of the “request it every time” method used for fetching favicon.ico. (As for why it’s a few seconds – well, that’s EDGE for you. The lag goes away when you use WiFi.)

Apple has more info on their iPhone Dev Center; look at “Create a WebClip Bookmark Icon”.

And don’t worry if your icon design skills aren’t up to snuff, but do worry if you care about the sanctity of your image:

>Safari will automatically composite the icon with the standard “glassy” overlay so it looks like a built-in iPhone or iPod application.

Addendum @ 9PM: I should note another oddity: there’s some degree of clipping off the sides of the icon that can’t really be controlled. I found this by scaling down a circular logo (in EPS format) to 57×57, and there was a noticeable clip on the sides. With that in mind, I recommend adding a pixel or two on the sides if you’re using a circular design. Note that scaling the icon down under 57×57 does not solve this, it merely scales it up to fit the 57×57.

Addendum @ 10PM: Neil Epstein, Technology Director for Gothamist LLC, says 47×47 seems to be the usable area, and that he had best luck with 45×45.

Addendum @ 1/16 7AM: Playground Blues notes that because of the resolution of the iPhone screen, using an oversized image (such as his 158×158 image) may result in a crisper icon. [via HicksDesign]

Categories
Created Reflected

Apple Case Study

I am quoted to a ridiculous degree in the new Apple case study about our use of Apple storage products at Weill Cornell Medical College.

It is really odd to see my name in a pullquote on apple.com.

Fun “easter egg”: The picture on the top of the article is also mine.

Categories
Debated

Fact Checking A Call To Fact Check

There was a brief hullabaloo after the iPhone price drop where some strangle Google ads appeared when you search for “iphone price drop”.

> This is like salt in the wound for the early adopter while I was initially bummed by the price cut news, this makes it infuriating! I’m a big boy and made the choice to stand in line and have fun with the rest of the faithful on iPhone day. I can handle a price change or even a new product, but for the price to be cut so drastically so quickly and then to have it rubbed in my face like this by Apple is just wrong.

Today, Cory O’Brien over at Didn’t You Hear came clean and admitted to placing the ad allegedly from Apple. Which would have been fine if he didn’t try to pass the buck to the blogs who covered it for “misreporting” and failing to “fact check”:

> See how their address is apple.com/store, and mine was store.apple.com? Also, see where their ad is placed? That’s usually a pretty good clue about the source of an ad. Fortunately, some of the various blogs’ commenters picked up on the fact that this was an affiliate ad, and not one placed by Apple, and called it out as such. Unfortunately, many of the blogs themselves did not. Fact checking would have saved me quite a bit of worry in this situation, so my plea to the big boy blogs is this: Keep those journalistic integrities intact, and Check That Fact!

Of course, had Cory done a little more research, he would’ve realized his own “facts” are wrong.

Also, the yellow box that sometimes appears at the top of the page? It has nothing to do with the source of the ad.

> While there isn’t a way to ensure top placement, there are certainly some best practices that may well help your ads rise to the top. Really, there are no secrets: these are the same best practices that affect the positioning (or ranking) of your AdWords ads wherever they appear, and they also happen to be the same best practices we wrote about just a few days ago.

Never let the facts stop a badly planned joke.