Special User Sections > Site/Forum Features
Publishers Can Customize iPhone Webclip
Curt:
Copyright © 2008 CyberNet:
Publishers Can Customize iPhone Webclip Icons
Posted: 16 Jan 2008 02:21 PM CST
Cybernet iPhone Icon
One of the big peeves that I had with the new iPhone and iPod Touch firmware update yesterday was that Apple doesn’t give much control over the webclip icons. That’s when you bookmark a website to the home screen, and the iPhone snaps a screenshot of the upper-left corner of the screen to assign as the icon.
As it turns out Apple also made a way for website publishers to customize the icon that gets used, and as you can see in the screenshot it works pretty well. I highly recommend that all website publisher take a few seconds to make their icon look pretty.
How do you do it? Create a PNG image (recommended 57×57 pixels), name it apple-touch-icon.png, and then throw it in the website’s root folder. You can also get a little more technical by adding a “link” attribute to the <head> portion of your site:
<link rel="apple-touch-icon" href="/imgs/apple-cybernet.png" />
Using this method you can place the icon in any directory you want. A larger image can be used if you so desire, and the iPhone will scale it down as needed. It should also work with other file formats, such as JPEG, but I didn’t test them all.
The only thing you need to watch out for is the clipping that Apple does to the icons. It’s really a matter of playing with it, but generally it looks like the iPhone shaves a few pixels off of each side for the icons. And don’t forget that the corners are automatically rounded in addition to the uncontrollable glassy appearance.
Now I’m just keeping my fingers crossed that more websites will catch on to this, because I love bookmarking the sites onto my home screen!
Apple Developer Center [via TUAW]
Copyright © 2008 CyberNet |
--- End quote ---
- seems like an easy way to further enhance DC's appeal?
jgpaiva:
"link"? Now that's a descriptive attibute name. Sure has everything to do with what that attribute is intended to contain...
I think that if apple decided not to use favicon nor let poeple custumize the icon, that's their fault, and it shouldn't be everyone else's responsibility to fix their error.
Curt:
How do you do it? Create a PNG image (recommended 57×57 pixels), name it apple-touch-icon.png, and then throw it in the website’s root folder. You can also get a little more technical by adding a “link” attribute to the <head> portion of your site: <link rel="apple-touch-icon" href="/imgs/apple-cybernet.png" />-Curt (January 17, 2008, 05:16 AM)
--- End quote ---
jgpaiva:
That's not what i meant, curt. I understood it was an option, but that doesn't change the fact that it's a stupid atribute name.
What i complained what that they want website designers to work for them because they didn't feel like adding a "configure this link" option.
Curt:
Ohh, I see. Them lazy donkeys!
Anyway, I merely imagined this would look 'nice' if anyone visited our site via their iPhone.
Navigation
[0] Message Index
[#] Next page
Go to full version