What is a Web Slice?**

One of the most interesting features in Internet Explorer 8 is the ability to subscribe to information you frequently check on a website. This is called a web slice (). I find myself frequently checking sports scores and news on ESPN, weather on the Weather Channel, stocks at various online sites (and searches), and auctions at eBay. Now these sites could easily serve content without me having to visit the site. If you have Internet Explorer 8 installed, you can visit a website such as msn.com to see what a Web Slice looks like to the end user. I’ve attached two screenshots below to show how one would subscribe to a webslice:

  • screen01
  • Screen02

Notice in the top image, there’s a green box around the center news item. This is web slice content that will be displayed. You can subscribe by clicking the green icon or by clicking the feed with the green icon under the Feeds menu item shown in the second image.

  • screen03

After we subscribe, we can then see the content from any instance of Internet Explorer by clicking on the web slice:

Building Our Own Web Slices

So, now that you understand what a web slice is, you’re probably thinking it’s really difficult to create one, right? Not exactly. In fact, web slices are quite easy to build and they are independent on the language you are using for your web site or web application.

I wanted to see how difficult it was for myself, so I created a basic HTML page with the two necessary attributes: a parent element with hslice specified as the value of the class attribute and a sub-element with entry-title specified as the value of the class attribute. I also added a third element and attribute to my source, which ended up like this:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns\="http://www.w3.org/1999/xhtml" >
<head\>
    <title\>My First Web Slice</title\>
</head\>
<body\>
    <div class\="hslice" id\="firstSlice">
        <h3 class\="entry-title">My First Web Slice</h3\>
        <div class\="entry-content"- The content of my first Web Slice would go here. For now,
            because I'm boring, nothing will be placed here. Too bad.
        </div\>
    </div\>
</body\>
</html\>

In the browser, it looks like this:

  • screen05

As a Web Slice, it looks like this:

  • screen06

That’s It?

Of course not! There’s tons of options when building Web Slices such as specifying alternative update sources, the ttl (time to live) value for the content, and more! For a more in depth look, be sure to check out the Internet Explorer 8 Web Slice overview and tutorials found on the MSDN website.