Widget this!

From weather bars to news boxes, widgets are attractive little boxes on your desktop that allow you to get the most out of your user-experience and customise it to suit your needs. But where can you get them and how can you make your own? WINDOWS reveals all about these valuable tools.

What is a widget?

A desktop widget is a wonderful little creation that sits snugly on a user's desktop, freeing up space and displaying customised information. It barely uses up any hard disk space and drains hardly any RAM. With these widgets, PC users can have the ability to view information on demand, whether it's the latest news, weather reports, updates on their favourite sports team, blog entries and more. Everything from the data presented and the presentation of the widget itself can be fully customised.

Widgets have become an intrinsic part of PC life, as user-friendliness becomes increasingly important and programmers and software developers hone in on the Web 2.0 experience. There are many websites in which widgets can be downloaded for free, and there are also many tips on how to design your own. All you need is a smattering of HTML skills and the time and effort required to write 50 or so lines of code.

Some of the first widgets were seen on the dashboard of Apple Macs. MacBook owners will be all too familiar with widgets like Stickies - which allows users to make Post-It Note-style reminders on their desktops. Also available are items like the Calculator, Calendar and Weather Update, although more popular are the widgets giving your direct access to YouTube, Google or Apple Movie Trailers. Nowadays, Windows Vista and Windows Live also incorporates these in the form of Microsoft Gadgets. Widgets come as a bundle of files - this bundle ends in the extension .wdgt, and is managed as a single file by the PC's OS. The main file is the aforementioned HTML file, which defines the look of the user interface. A PNG image file provides the default background image that is displayed by Dashboard while it loads the Widget.

According to Apple, the PNG format is used as it has excellent support for alpha channel transparency. The other two files needed are an icon image, also in PNG format, to represent the Widget and load it, and a property list file called Info.plist. This contains the widget's identifier, name, version information, size and all the other information needed for use.

Where to get them

One of the first stops in finding a widget should be Yahoo! Widgets (http://widgets.yahoo.com). You can browse through thousands of widgets by user ratings, see how many times they have been downloaded, or search by category - including utilities, games, webcams, plugins, radio, clocks, communication, shopping and much more. When starting with Yahoo! Widgets, the first widget downloaded will appear in the Widget Dock - which is an easy and quick way of launching and browsing through one's widget library.

It also allowis users to have an unlimited number of widgets at their disposal. To add more widgets, all you need to do is right-click on the dock and select ‘Get More Widgets'.

Internet browsers have also turned widget-friendly in recent years, with Opera's web browser widgets being a primary example. In that browser, there is a specific tab for users to download, manage and organise their widgets. Check out http://widgets.opera.com for more information. Mozilla's improved Adds-ons section in Firefox 3.0 is also a great show of the popularity and usefulness of these bits of HTML coding.

Making your own widget

With HTML code, if you know how to write content for the web, you can write a Widget and it's generally recommended you create content that complies with the XHTML 1.0 to adhere to web standards. Creating a new Widget needn't be overly difficult - all you need to do is follow these basic steps:

• Create a directory for your widget.

• Define the widget's Info.plist file, setting the necessary parameters.

• Create the HTML file using a text or HTML editor.

• Open the file in your web browser so that you can view the widget.

• Reload the widget in your browser to see updates and changes you have made to the widget.

However, this process can be made simpler if you copy a similar widget's HTML and use it as a starting point, borrowing the necessary coding so that you don't even need to type out the majority of it. Because widgets are open-source files, they can be shared at will and distributed freely at all times. Simply download the widget that you think is similar to what you want to design, and open the widget bundle in your browser.

This will list all the files in that .wdgt bundle. To get the HTML coding, open the HTML file and copy and paste the code into your editor. To do this in Firefox 3.0, click on View Source under the View tab, and copy and paste from there. From here, just tinker with the appearance code and the parameters of the widget to suit your needs.