메뉴 건너뛰기

Dev tips

HTML / CSS Web Slices - IE 8.0

taknim 2008.09.22 20:27 조회 수 : 9097 추천:2174

http://www.microsoft.com/windows/internet-explorer/beta/readiness/developers-new.aspx

Web Slices

Web Slices is a new feature enabling websites to connect to their users by subscribing to content directly within a webpage. Web Slices behave just like feeds where clients can subscribe to get updates and notify users of changes.

A Web Slice is a section of a webpage that is treated like a subscribable item, just like a feed. To enable a Web Slice on your website, annotate your webpage with class names for the title, description, and other subscribable properties.

Users can discover Web Slices within a webpage and add them to the Favorites bar, a dedicated row below the Address bar enabling easy access to links. Internet Explorer 8 subscribes to the webpage, detects changes in the Web Slice, and notifies the user of updates. Users can preview these updates directly from the Favorites bar and click through to the website to get more information.

WebSlice Authoring

Web Slices are enabled by adding HTML annotations directly to the webpage. Web Slices use a combination of the hAtom Microformat and the Web Slice format to describe a subscribable portion of a webpage.

The Basics

The basic properties of a Web Slice are the Web Slice container, title, and content.

WebSlice

  • Required
  • Uses class name hslice
  • The Web Slice element must include an ID
  • Represents the entire region of a Web Slice that contains the title, description, and other WebSlice properties

Entry Title

  • Required
  • Uses class name entry-title as defined in the hAtom Microformat
  • There can be multiple instances of Entry Title

Entry Content

  • Optional
  • Uses class name entry-content as defined in the hAtom Microformat
  • If the Entry Content is missing, assume it is the empty string
  • There can be multiple instances of Entry Content

This is an example of how to mark up an auction item with the link, title, and description properties

http://www.auction.microsoft.com/item

<div class="hslice" id="1">
  <p class="entry-title">item - $66.00</p>
  <div class="entry-content">high bidder:buyer1
    …
  </div>
</div>
 

For more information, please see Web Slices on MSDN and Web Slice Style Guide.