Apple Touch Icon

The iPhone and iPad have been out for quite awhile already and you might have noticing requests in your website log for a file called apple-touch-icon.png. If you have congratulations your website is getting traffic from iPhone and iPad users, the bad news is their mobile web browser is looking for a file to create a custom icon on their devices that you don’t have.

The good news is it is an easy fix. The Apple mobile browser is looking for a file called apple-touch-icon.png to create a fancy Apple styled icon on the iPhone or iPad. The easy way to fix it is to create or add a file called apple-touch-icon.png to your root folder of your website. The PNG image should be at least 45 pixels by 45 pixels.

If you can’t save a file to your root folder, perhaps because you are on free hosting or simply do not have access you can point the Apple mobile browser to another location using the following code:

<link rel="apple-touch-icon" href="/folder/iphone-ipad-icon.png" />

Like the favicon code you will need to add the code to the head section of your HTML.

Once you have either have a apple-touch-icon.png or have pointed the browser to another location using the link code your visitors will be able to save your website on their Apple mobile devices with a nifty icon on their iPhone and iPad devices. It will definitely make your website stand out on their machines.

How to Add Your Favicon to Blogger

The original post on How to Add Your Favicon to Blogger is the most popular post here on FreeFavicon. It was time I wrote a new post about the topic because Blogger has improved considerably and those instructions are no longer needed.

To add your favicon to your Blogger blog is now a simple three step process.
Step 1: Goto your layout in Blogger.
Step 2: Click Edit on the box that says Favicon. A new window will open.
Step 3: In the new window that opened up select your image for your favicon and click save. Blogger upload your image and use it as your favicon.

Nice to see how Blogger has improved adding your own custom favicon to their sites. No need to edit code anymore.

Hosting Your Favicon with Dropbox

Dropbox is a fantastic service. I use it regularly to sync files between my desktop and laptop. It does have other uses though, like sharing files with your friends and even hosting a website. While I would not recommend you host your main business website with a Public shared folder using Dropbox, using the service to host some images, like your websites favicon, has some advantages.

If you are using a service such as Blogger and want to add your own custom favicon you have several choices of where to host your favicon. You can upload it and host it on Google’s server, although last time I tried they did not accept the .ico format. That works until you want to change your favicon then you have to do it all over again including updating your code that points to your favicon.

You could host your favicon on an image hosting service, but then they might delete it at anytime. Again if you want to change your favicon you will be redoing all of the code.

Since Dropbox can host files that are publically accessable on the Internet you now have another option. Following the tips and tricks wiki to making your own website you can simple create a folder for your favicon, and copy your favicon into that folder. The advantage of hosting your favicon in your Dropbox public folder means you have more control over it. If you decide to change your favicon all you need to do is simply copy over your existing favicon and it will be replaced on your website. You don’t have to redo the code pointing to it, and you never have to worry about an image hosting service deleting it.

If you have not tried Dropbox, you really should give it a serious look. They offer 2gb of space for free, which is more than enough to share and sync files between computers.

They also have a great favicon if you are looking for some inspiration.

Dropbox Favicon

Favicons in Google Reader

I have been using Google Reader as my feed reader for a couple years now. It works well, but it is difficult to to find the feed you to read sometimes because they all tend to blend together. Well not anymore. Google announced on the Google Reader blog that Google Reader was now going to show websites favicons beside the feed.

If you have been holding off to create your own favicon, now you have another reason to create a favicon to help your RSS stand out in Google Reader.

favicons

Cashboard

I am a freelancer and one of the tasks that I have to admit I am not very good at is invoicing. Sure I keep good track of my time and projects, but I was often behind on my invoicing. A few months ago I made the switch from desktop invoicing software to Cashboard, and I have to tell you it has made a world of difference. Not only can I keep track of my project, time and invoicing all in one spot, but I can schedule my recurring invoices to be sent out regularly.

What does any of that have to do with a favicon website and blog? Well nothing really except they also have a great favicon.

cashboard

Their favicon comes from their logo and does a great job of branding their website and their twitter account. It also gives you a great idea of what the service does and makes it easy to recoginize.

If you are looking for a great online invoicing service I do recommend Cashboard, and not just because I like their favicon.