Diese Antwort lässt sich wohl nie abschließend klären, zumal es ohnehin eine Funktionalität ist, die derzeit nur in einem Browser, dem Internet Explorer 8, funktioniert. Wer aber jeden Trend auf seiner Webseite mit machen will, für den lohnt es sich, dass er sich mit diesem Thema einmal auseinander setzt. Doch wie implementiert man nun einen Webslice.
Im Internet fand ich zu diesem Thema zwei recht gute Beschreibungen. Zum einen hat sich
Klaus Bock damit in seinem Weblog befasst und auch
Daron Yöndem.
Im Wesentlichen reduziert sich die Definition von Webslices auf einen DIV Container mit mindestens einem bzw. zwei weiteren Child-Elementen. Was als Webslice vom Browser dabei erkannt und wie deren Funktionalität umgesetzt wird, bestimmen die Css-Klassennamen der Elemente. Für das Basiselement ist dabei der Klassenname
hslice zwingend. Als erstes Child-Element folgt in der Regel ein den Titel bestimmenden Container. Hierbei kann man nahezu jedes HTML-Element verwenden, wobei H1, DIV oder SPAN-Elemente am sinnvollsten erscheinen. Das Titel-Element erhält dann den Css-Klassennamen
entry-title. Das, was innerhalb des Titel-Tags angeben wird, verarbeitet der Browser dann in der Anzeige des Webslice. Das Titel-Element kann man in der Regel ausblenden mit der style-Anweisung "
display:none" (dazu weiter unten mehr).
Das zweite Element beinhaltet den eigentlichen Content. Hier sollte man ein DIV-Element wählen und muss diesem den Css-Klassennamen
entry-content zuweisen. Innerhalb dieses Containers kann man seinen HTML-Phantasien freien Lauf lasen, sprich gültiges HTML ist zulässig.
Also wenn man es sich recht betrachtet, ist es nicht wirklich viel Aufwand. Damit das ganze nun auch brav vom Browser erkannt wird, bedarf es noch einer Erweiterung im Head-Tag der Seite. Hierzu wird ein Link-Tag eingefügt, welches die Attribute
rel mit dem Wert
default-slice,
type mit dem Wert
application/x-hatom und
href haben muss. Der Wert für das href Attribute ist dabei die ClientID des DIV-Containers, der den Css-Klassennamen
hslice zugewiesen bekommen hat. Möchte man mehrere Webslices auf der Seite platzieren, so muss für jeden Webslice ein separater Link-Tag im Head der Seite vorhanden sein.
Hat man alles richtig gemacht, dankt es der Internet Explorer 8 mit einem kleinen grünen Symbol.
Wie Klaus und Daron schon beschrieben haben, kann man den Content des Webslice auch über eine separate Seite organisieren oder z.B. bei Verwendung innerhalb einer Masterpage über diese, wobei der
hslice-Container standardmäßig nicht sichtbar ist bzw. sein sollte.
In meinem Fall habe ich mich dafür entschieden, den Webslice entsprechend der darzustellenden Aufgabe sichtbar innerhalb des Seiteninhaltes zu platzieren. Der Webslice soll dabei immer den zuletzt veröffentlichten Beitrag darstellen. Die Vorgehensweise entspricht der oben beschriebenen, wobei es wichtig war, das HTML-Element mit dem Titel des Webslice auszublenden, da er sich sonst nicht in das bestehende Layout der Seite integrieren ließe. Ein weiterer Nebeneffekt bei dieser Form der Implementierung liegt in der Darstellung des Webslice selbst. Will man den Blogbeitrag weiterlesen, so muss man zwangsläufig mit der Mouse über den
hslice-Container sich bewegen. In genau diesem Moment erscheinen ein grüner Rahmen und das Webslice-Icon. Durch Anklicken des Icons kann man diesen Webslice abonnieren.
Nachteilig an den gesamten Webslice-Implementierungsmöglichkeiten finde ich jedoch die unzureichende Art der Nutzung von Javascript. Hier hätte ich mir mehr Möglichkeiten vorstellen können. Weiterhin habe ich noch keine Möglichkeit gefunden, dass der Flayout-Container scrollbar ist.
Vorteilhaft finde ich, dass trotz der Insellösung, nach der Implementierung die Seite immer noch den Anforderungen des W3C entspricht. Ebenso von Vorteil ist es, dass man das CSS des Webslice so gestalten kann, dass es noch an die Ursprungsseite erinnert und nicht nur einfache Links mit etwas Text möglich sind.
Unterm Strich kann man sagen:
kann man haben - muss man aber nicht (vor allem, weil es nur
derzeit in einem Webbrowser funktioniert).