IE8 Web Slices in Action (a live example)

Yesterday saw the public release of Internet Explorer 8, which includes a new feature called Web Slices. We have integrated web slices in to one of our website, so lets take a look at how that benefits our users and how we did it.
You can download Internet Explorer 8 here.

What Are Web Slices

Web Slices are a slice (or chunk) of a web page that a user can ask to be notified of updates to. The user is notified of updates via a flashing button on their favourites bar. They can view the updated information, without changing the web page they are currently viewing by clicking on the button.

A Live Example

Visit our website EquiPortal - The Equestrian Homepage to see web slices in action on the homepage.

We have two prominent sections on our homepage. The first shows recent and popular updates to our forum and the second shows the latest and popular horse related news and blogs. If you hover your mouse over either of these areas when using IE8 you will see a green icon pop up to the left hand side of the content. Click the icon to add the Web Slice to your favourites bar.

Notice the new button in your favourites bar. Your browser will periodically check for updates and notify you when changes occur. If the button flashes, simply click on it to see the new forum postings or news items.

This means that our visitors can keep up to date with the information we provide regardless of the website they are browsing.

How To Add Web Slices To Your Website

Adding Web Slices is easy. There are a few variations on the theme, and we didn't opt for the simplest version, but the lists below show the steps we went through. This is intended to simply give you a flavour of what is involved so don't try and use it as a tutorial. For full instructions see Microsoft's guide.
On The Homepage

• Embed the HTML that represents the Web Slice in a DIV (<div class="hslice" id="forumUpdates" >)
• Add some HTML to give the Web Slice a name during the installation (<h2 class="entry-title" style="display: none;">Horses - Forums</h2>)
• Add a link to where the latest Web Slice contents can be found (<a rel="feedurl" href="http://scripts.equiportal.co.uk.s3.amazonaws.com/data/updateForums.html#forums-update" style="display: none;"></a>)

Create A Web Page To Host Web Slice Updates

• Embed the Web Slice in a DIV (<div class="hslice" id="forums-update">)
• Tell IE8 to take the user to our homepage if they ask to open the Web Slice (<a rel="bookmark" href="http://www.equiportal.co.uk" style="display:none;"></a>)
• Provide the name for the favourites bar button (<h2 class="entry-title" style="display: none;">Horses - Forums</h2>)
• Embed the HTML to display the Web Slice in the favourite bar in a DIV (<div class="entry-content">)
• Provide a default value for how often the Web Slice should be checked for updates (<p >This page is updated every <span class="ttl">15</span> minutes.</p>)

Conclusion

• It's quick and easy to implement Web Slices.
• You use standard HTML which doesn't break other web browsers.
• It benefits users and encourages them to come back to your website.

Given the above points I expect that users will come to expect Web Slices to be available on popular websites. However, the favourites bar will soon become cluttered so people will be picky about the slices they install. I imagine that regular members will be the only ones to make use of the feature. Given the amount of effort required to add the feature to your website, I highly recommend you give it a try.

Making your content work for you - top 5 tips

We have had a forum on one of our websites (www.EquiPortal.co.uk) for the past year together with news and blog feeds, an event calendar and more. However, having good content is not enough, you need to make your visitors aware of it and grab their attention before they move on.

We have just redesigned our whole website with the above sentiment in mind. Have a look to see how we are trying to ensure that visitors are made aware of new content.

Here are our top 5 tips:

1. Use your homepage to highlight new content
Don't just make your homepage a nice looking entry page to the rest of your website. Make it functional and show your visitors that you have lots of interesting things for them to see.

2. Don't make visitors dig for content
Think about what your visitors are most likely to be looking for and give it to them straight away. For example, our horse events page shows upcoming events on the first page and then allows them to browse the full event calendar at their leisure.

3. Emphasise popular content
The actions of visitors on your website can provide valuable feedback. Make your site more dynamic, emphasise content that other users have been reading. In our news section we highlight items that are getting more attention and move them nearer the top of the page.

4. Make your forums easier to use
Forums can be very ugly and the uninitiated find them intimidating. Check out our forum home page to see how we provide a clear categorisation and description of forums, using icons to quickly guide the user in the right direction. Notice that the latest postings are shown on the home page too.

5. Keep pushing your content
Make use of newsletters and blogs to keep your members informed of the latest and most popular content. Try to keep members coming back for more.