The Create Web Slice feature

Worried About Slicing Off More Than You Can Chew?

With the introduction of Internet Explorer 8, comes the concept of Web slices. A Web slice allows users to subscribe to a portion of a Web page.

Microsoft has taken a platform-based approach to Web slices. Any developer can create them by adding a few lines of code to existing pages. For example, eBay has built a Web slice that enables you to monitor an auction. Microsoft is working with partners to create more Web slices so before long they’ll be part of your favorite sites, if they’re not already.

The Web slice is based on the hAtom Microformat and a few other properties. The Web slice itself uses simple, semantic HTML markup to represent a portion of Web page that can be subscribed to. Annotations can be applied directly to content within the HTML page and additional files are not required.

The Solution

The Web Slice format consists of the minimum HTML annotations necessary for the publication and consumption of a mutable item on a Web page. Web publishers can use this format in conjunction with properties from hAtomMicroformat World Wide Web link.(Should this be a link?)

The Web Slice feature allows you to code specific portions of your content with the necessary Web slice tags.

The basic properties of a Web slice are the Web slice container, Entry Title, and Entry Content.

Web Slice

  • Required
  • Uses the class name hslice
  • Must include an id
  • Represents the entire region of the Web Slice that contains the title, description, and other Web Slice properties

Entry Title

Entry Content

  • Optional
  • Uses the class name entry-content as defined in the hAtom Microformat
Web Slice Screenshot

By either selecting an element or a portion of text, the Web Optimizer feature will code it with the necessary tags so that Internet Explorer 8 recognizes it as a Web slice.

Use the Web Slice feature over an object.

Before

The next version of the object
<img src="icon.jpg" alt="Accessibility">

After

<span class="hslice" id="myID">
   <span class="entry-title" style="display: none">The greatest object</span>
   <span class="entry-content">
      The next version of the object
      <img src="icon.jpg" alt="Accessibility" />
   </span>
</span>

Use the Web Slice feature over an element.

Before

<div class="myClass">
   <p class="content" id="title">
     <Content
   </p>
</div>

After

<div class="hslice myClass" id="myID">
   <span class="entry-title" style="display: none">Web Slice to display</span>
   <span class="entry-content">
      <p class="content" id="title">
         Content
      </p>
   </span>
</div>

Learn more about Web slices at: