WebSlices für den Internet Explorer 8 (IE8) erstellen
WebSlices ermöglichen das Abonnieren von Seiteninhalten ähnlich wie RSS. Diese Funktion ist eine Neuerfindung des bald erscheinenden Internet Explorers 8.
Wird ein WebSlice abonniert, so erscheint ein entsprechender Eintrag in den Favoriten. Per Klick öffnet sich ein kleines Fenster und zeigt die herausgelösten Inhalte an. In diesem Artikel erkläre ich wie Ihr mittels Mikroformaten WebSlices erstellt.
Mikroformate zur Einbettung von WebSlices
WebSlices definieren sich über Microsofts neue Mikroformate „hslice“, „entry-title“ und „entry-content“. Diese drei Formate müssen vorhanden sein um ein WebSlice darzustellen. Ebenso muss das Element dem die Klasse „hslice“ zugewiesen wurde über eine ID verfügen.
- hslice
- Dieses Mikroformat muss die anderen beiden Mikroformate beinhalten. Es bildet den äußeren Rahmen des WebSlices.
- entry-title
- Dieses Mikroformat muss innerhalb von „hslice“ verwendet werden. Es stellt den Titel des WebSlices dar. Dieser erscheint in den Favoriten oder der Lesezeichen-/WebSliceleiste.
- entry-content
- Dieses Mikroformat beschreibt den Inhalt des Webslices. Es darf mehrfach verwendet werden und kann weitere HTML-Elemente enthalten.
Beispiel zur Verwendung
Folgendermaßen könnten die Mikroformate angewendet werden.
<div class="hslice" id="idname">
<h1 class="entry-title">Titel des WebSlice in den Favoriten</h1>
<div class="entry-content">
<h2>Überschrift</h2>
<p>Absatz</p>
</div>
</div>
Bei der Ausgabe des WebSlices wird um das Mikroformat „entry-content“ ein BODY generiert. Dieser hat jedoch leider die selben Eigenschaften wie die Mutter-Seite. Demzufolge werden auch per CSS vergebene Attribute angewendet. Microsoft „löst“ dieses Problem mit dem Vorschlag dem BODY der Website eine ID zuzuweisen und diese über CSS anzusprechen.
WebSlice ausprobieren
Nach diesem Absatz habe ich einen Test-WebSlice verlinkt. Sofern Ihr den Internet Explorer 8 nutzt, erscheint beim hovern des Bereichs ein entsprechendes Icon. Ein Klick auf dieses Icon abonniert den Inhalt.
Link: Testseite besuchen
WebSlice-Icon deaktivieren
Wie oben veranschaulicht, erscheint ein kleines Icon sofern ein Inhalt als WebSlice erkannt wird. Soll dies nicht geschehen, so kann die Icon-Anzeige über folgenden META-Header deaktiviert werden.
<meta name="slice" scheme="IE" content="off"/>
„Diese Funktion ist eine Neuerfindung des bald erscheinenden Internet Explorers 8. “
Die WebClips von Safari waren allerdings früher da und sehen den Webslices verblüffend ähnlich…
Hallo,
mir gefällt dieser Beitrag sehr gut und hat mir viel gebracht nur ein problem habe ich noch…ich bin mir nich ganz sicher welche Inhalte ich darüber anbieten will. :-)
@Kevin: Seeehr gut. Das Problem kenne ich :D
[…] WebSlices für den Internet Explorer 8 (IE8) erstellen […]
[…] WebSlices für den Internet Explorer 8 erstellt werden habe ich ja bereits in einem Artikel beschrieben. Nun stelle ich Euch das Firefox 3 Plugin “WebChunks” vor. Dieses Plugin ermöglicht […]
@Matt: Wer das braucht kann ich dir nicht sagen. Microsoft brauchte vllt einen pseudo USP um den IE8 besser zu vermarkten. Beworben wird die Funktion mit dem Verfolgen von Wetterberichten und ebay-Auktionen.
Wenn das Icon deaktiviert wurde erscheint es nicht mehr beim hovern, trotzdem wirst du oben im Browser informiert.
Zu deiner Anregung mit dem CSS: Wie oben erwähnt ist es sinnvoll eine BODY-ID zu vergeben (der echten Website). Dann musst du nicht das BODY-Tag im CSS ansprechen sondern eben diese ID. Sofern das geschieht, nutzt das WebSlice einen „sauberen“ body. Sprich: Weißer BG und schwarzer Text oder so. Hab ich allerdings aus Lust und Zeitmangel auch noch nicht gemacht.
Interessant. hab das grad mal eingebaut.
Fragen und Anregungen:
Wer braucht das bzw. warum nutzt man nicht einfach RSS dazu?
Wie kann man den Slice abonnieren, wenn das Icon abgeschaltet ist?
Man muss im CSS möglicherweise ein paar zusätzliche Regeln definieren, da das Slice isoliert aus dem Kontext gerissen wird und dadurch die eigentlich vorhandene Kaskadierung im Stylesheet nicht mehr greift. Ich hatte anfänglich nämlich nur schwarzen Text auf dunkelgrauem Hintergrund, was nicht so toll ist.