Take a look around the internet at any site that allows you to subscribe to an RSS feed and you will no doubt notice a little orange icon decorated with a few curved white lines. Obviously this has become the ‘icon of choice’ for web designers the world-over when it comes to adding RSS functionality to their sites. Apple on the other hand seem to want to go against the grain when it comes to iWeb and has stuck to their guns with the little blue icon.
One of the reasons web-sites use the orange RSS icon (although some may not realise it) is an accessibility issue. Imagine you visit a new blog for the first time and find the articles really interesting and you think to yourself ‘I want to be kept up-to-date with what is happening on this site’, what is the first thing you would look for? That little orange bundle of joy that is recognised internet wide, or a little blue icon that only appears on iWeb made web-sites?
Don’t get me wrong, there is nothing bad about the Apple icon, far from it. It does describe exactly what it does…RSS, but just take a look upwards towards your toolbar of your browser and do you see an orange icon or a blue icon built into your browser? Okay, that may be a bad example but most popular and modern browsers with built in RSS readers use the orange one.
By remaining with the little blue RSS badge, Apple have taken away, perhaps not on purpose, an iWeb users ability to build and maintain standard compliant web-sites. So in my first ‘proper’ tutorial post to you all I am going to show you how to change the standard iWeb RSS icon for a customised RSS icon thus that visitors to your site know where and how to subscribe to your RSS feeds.
To start with you will need to find an standard orange icon that you are happy with. You can find loads of free ones on the web, but here is a short list of some of the better ones.
Once you have found your icon of choice, you need to open your favourite image editor and create a new graphic 109 by 36 px and with a transparent canvas.
Next, insert your chosen icon, followed by some text such as ‘Subscribe’ or ‘Subscribe to our feed’. Then all you have to do is save the image as RSS.tiff. (You should now repeat this step using white text rather than black and save the image as RSS-white.tiff).
Now you have to open Finder and right-click (or Ctrl-Click) on the iWeb 08 icon. From the menu that appears select ‘Show Package Contents’.
Click on the ‘Contents’ folder, then the ‘Resources’ folder and then finally the ‘English.Iproj’ folder (you may have to scroll a bit). You will now see a selection of images and other objects that are used as a default across the iWeb themes.
Scroll down until you see ‘RSS.tiff’ (and RSS_white.tiff). These are the files you will be replacing.
Before we go any further, a point to remember is that this will change the default icon for all your web-sites from now on. You are going to change the image that iWeb uses for its RSS feeds. It will have the same path-name but when iWeb loads the page, it will load your new image instead.
If you like, rather than delete these 2 files you can simply rename them (eg. RSS2.tiff and RSS_white2.tiff). That way they will still be there if you change your mind and all you have to do delete the custom images and rename the old ones back again.
It is now a simple case of drag/drop or cut/paste the new images into this folder.
You can now open iWeb and create a new blog. Below is an example using the Doodles theme. You can see my example under the search bar.
Why not add your blog page to the comments so we can all take a look at your handy-work.