Create a Desktop Icon for your Website with Gears

Create a Desktop Icon for your Website

Let your users create Desktop, Start Menu and Quick Launch Bar icons to take them straight to your website

by Tom June 2008

Try it out! Create a shortcutCreate Desktop Shortcut - (Requires Gears - don't worry I'll explain below.)

It's amazing how many people seem to only visit a couple of websites, perhaps Facebook and YouTube and to find them they load up Google each time, do a search for the URL and click on the top result. The Google search box has become ubiquitous with finding websites. The average user doesn't seem to know (or care) that they can just type the same URL straight into the location bar of their browser to visit the site directly; they seem compelled to use Google.

We were pondering over this when we came up with the idea of creating a way for people to add a link directly on their desktop to their favourite sites. This would avoid them having to load a browser manually in the first place at all, and would surely also circumnavigate the requirement to rely on Google to find their website for them.

Creating a short-cut link on your desktop is a very simple process. All you have to do is right click on the desktop, select 'New' => 'Shortcut', then follow the step by step process of entering the URL, locating a suitable icon and creating the link. Or you can just drag and drop the location from your browser to your desktop but that just gives you the default browser icon - not a specific one for your site.

This is all very well for an experienced user, but quite a lot of hassle for your average YouTube/Facebook user. They'd have to resize a png for a start... We needed to find some quick and easy way of simplifying and automating the whole process. This immediately made me think of writing something with Javascript; you often find links on websites that let you add the site to your favourites, but this isn't possible as I'm pretty sure you can't change anything outside of the browser. A bit of Googling threw up one possible way which would involve developing a Java Applet to run and install. But users would be very skeptical (and rightly so) of downloading a potential virus and giving it free access to their computers.

Then, literally at the point of defeat, I happened to come across Gears (formerly Google Gears) and their Desktop API which had only been in existence for 14 days. Although still in Beta it seemed to offer exactly the functionality I was looking for!


Google Gears

I'd heard about Gears just after it was released in 2007, but it had seemed to go very quiet since then. The idea behind the project is to super-charge the user's browser to allow them to take entire web applications offline and use exactly as if online. Then once an Internet connection is re-established, sync all updates made offline with the online version.

It's all very clever stuff and I found watching their 30 minute introduction very helpful, so I've included it below.

Installing Gears

So I'd managed to find a solution that worked, the only caveat being that the user requires a 'Gears' enabled browser, and this remains the problem. There may come a time in the future when the Gears add-on (as it's known for Firefox users) is all-but built in as standard, as more and more people realise the benefits of having their applications offline (increased portability and speed; see the video). But until then the system simply directs the user to the 'Gears' installation page with the instruction to install in order to use this feature.

Whether this will put off a large percentage of users is still to be seen, but the finished code works like a charm and I'm still going to add it to all my sites and let users create Desktop, Start Menu and Quick Launch Bar icons to take them directly to my websites - Add to favourites!? That's so 2007! I want to add a BIG LOGO to my users desktops!



Try it out below

Want to see the end result? Click the link below and assuming you're running a half decent browser you should either be taken to the Gears installation page, or if you're one of the smart kids and have Gears already installed, you'll get a cool little popup asking which links you'd like to create. Go on, add them all, they look really cool and you can always delete them if you don't think so.



Code Generator - Now it's Your Turn

Want to let all your users create desktop, start menu and quick launch bar icons to your website?

So this is where it gets really interesting, just fill in the form below and you'll get a tidy bit of javascript to add to your site that does exactly the same for your site as the link above does for 18a. You even get to add your own title, url and logo. It's very cool, give it a whirl to see what I mean.

To make things quicker and easier we've taken all the complexity away for you, just enter your details and logo and our generator will resize it for you and provide you with a handy bit of code. If you like to look 'under the hood' check out the Gears developer site where you can pick up the code directly.

Any problems - even down to you don't have a png - and you'd like us to step in and make a Desktop Icon for your website, please just contact us and we'll be happy to help!

Create your own Shortcut Code

Where would you like your bookmark to go? This must be somewhere within the same origin as the page the shortcut is shown on. Eg. if the shortcut is on www.18aproductions.co.uk, the bookmark can only go to www.18aproductions.co.uk/some-url.
Upload your logo, this must be square .PNG and between 128 pixels and 500 pixels in size.

Please tick the box above to confirm you've read the Terms of Use for your Desktop Icon.
 

Comments

Got something to say? That's why we have a blog. Check it out and leave us a message to let us know if you found this helpful. It's certainly interesting at the very least. :)