24
05

Mikroformat hreview

Um auf den rol­len­den Schnell­zug der Mikro­for­mate auf­zu­sprin­gen, habe ich ein einige Ein­träge nach­träg­lich ein paar schi­cke neue Zei­len Quell­code hin­zu­ge­fügt. Noch hat das Ganze den Cha­rak­ter eines Expe­ri­ments. Die Imple­men­tie­rung dau­ert keine Ewig­keit, die Tech­no­lo­gie hat einen gewis­sen Reiz und da mit der Zeit eini­ges an Inhal­ten zusam­men­kommt, lohnt es sich auch über die­sen Weg Ord­nung hin­ein zu brin­gen. Das offen­sicht­lich pas­sende For­mat für diese Sei­ten scheint hre­view zu sein.

Meine Anwen­dung und Ver­ständ­nis die­ser Tech­no­lo­gie beschränk sich noch rein auf die Ver­wen­dung als Meta-Daten, für die jewei­li­gen Ein­träge. Um Mikro­for­mate direkt in den Work­flow ein­zu­bin­den, reicht MT lange nicht mehr aus. Zwar scheint es das eine oder andere Plu­gin zu geben, aber ich möchte mich nicht noch wei­ter durch Plugins und Hacks an diese Platt­form bin­den. Schließ­lich sol­len noch Wün­sche offen blei­ben, um irgend­wann mal auf ein bes­se­res Sys­tem zu wech­seln. So wie die Seite momen­tan auf­ge­baut ist, macht es wenig Sinn bzw. wäre es nur sehr umständ­lich mög­lich, Mikro­for­mate als fes­ten Bestand­teil zu inte­grie­ren.

Auch hier gibt es nicht wirk­lich ein fest defi­nier­tes For­mat, was es gibt sind fest zuge­ord­nete CSS-Klassen, die Inhalte aus­zeich­nen. Nach­dem ich mir einige hreview-Formate ange­se­hen habe, bin ich bei mei­ner Ver­sion gelan­det. Die ist nun auch nicht die all­um­fas­sende Lösung, aber ein recht logi­scher und ver­ständ­li­cher Auf­bau, der Struk­tur.

1. <div class="hreview">
2.  <abbr class="dtreviewed" title="20060814T2117">Aug 14, 2006</abbr>
3.
4.  <span class="reviewer vcard">
5.      <span class="fn">Christian Mücke</span>
6.      <a class="url fn" href="http://coldheat.de/">Christian Mücke</a>
7.  </span>
8.
9.  <div class="item">
10.     <a lang="en" class="url fn" href="http://...">As good as it gets (<span lang="de">Besser geht's nicht</span>)</a>
11.     <img alt="photo of 'As good as it gets'" src="http://..." class="photo" />
12.     <span class="type">movie</span>
13.     <a class="item url fn" href="http://...">As good as it gets (<span lang="de">Besser geht's nicht</span>)</a>
14. </div>
15.
16. <div>Wertung: <span class="rating">5</span> von 5</div>
17. <div class="description">...</div>
18. </div>

kurze Erklä­rung zum Code

1. - hre­view mar­kiert, dass es sich um ein Mikro­for­mat han­del, genauer gesagt eben um das hre­view Format<br/> 2. - Mar­ker für das Datum des For­mats. Wann wurde das Review geschrie­ben. Diese Zeile ver­langt eine ISO-Codierung des Datums im Title. Die ein­fachste Lösung dafür bie­tet der hre­view Crea­tor.<br/> 4. - Hier geht ein For­mat im For­mat auf, wel­ches mehr Infor­ma­tio­nen zum Ver­fas­ser des Reviews ent­hält - eine Art Visitenkarte.<br/> 5. - Name des Schreiberlings<br/> 6. - Web­site des Schreiberlings<br/> 9. - Hier geht der Teil auf, der den Inhalt des Reviews beschreibt. Was wird hier reviewed?<br/> 10. - Titel des Review-Items (Orgi­nial samt deut­schem Titel) und Referenz-Link, bei mir IMDB-Links der jewei­li­gen Filmtitel.<br/> 11. - Bild des Pro­dukts, bei mir Thumbnail-Bild des Filmposters<br/> 12. - Wel­che Art Pro­dukt wird in die­sem Review bewer­tet? Musik? Buch? Film?<br/> 13. - Link zum Review<br/> 14. - Daten­con­tai­ner für das Review-Item wird hier geschlossen<br/> 16. - Wer­tung des Reviews in einer Skala von 1 bis 5<br/> 17. - der eigent­li­che Text des Reviews

Statt einen gesam­ten Ein­trag ins Description-Tag des For­mats zu packen, ste­hen bei mir dort nur die ganz rele­van­ten Sätze des Reviews. All diese Infor­ma­tio­nen sind noch schön getrennt vom eigent­li­chen Text pla­ziert und aus­ge­blen­det. Noch fehlt mir eine gute Lösung Bei­des mit­ein­an­der zu ver­bin­den, zumal ich noch ein paar zusätz­lich Daten für die Reviews plane ein­zu­set­zen.

Die bis jetzt sinn­vollste Lösung sehe ich darin, die­ses Mikro­for­mat dort auf der Seite zu pla­zie­ren, wo sowieso der Text des Description-Tag steht und anschlie­ßend alles außer die­sem Tag mit Hilfe von CSS aus­zu­blen­den. Dar­auf wird es wohl hin­aus­lau­fen. Es wird sich nicht loh­nen, die­ses For­mat kom­plett in die Tem­pla­tes ein­zu­ar­bei­ten, dafür schreibe ich zu wenig Reviews und zuviel Ande­res. Die Mög­lich­keit der Nut­zung kom­plett zu igno­rie­ren halte ich aller­dings auch für falsch. Dies mag dann keine Must­er­lö­sung sein, aber es bleibt eine sinn­volle Anwen­dung.

Ich wollte nur zei­gen, wie ein­fach sol­che For­mate am Ende doch struk­tu­riert sind. Wozu nun der Ganze Auf­wand um plötz­lich fol­gen­des Bild im Brow­ser­fens­ter zu haben und um mit einer hip­pen neue Tech­no­lo­gie prah­len zu kön­nen.

Bei instal­lier­ter Tails-Extension, signa­li­siert die­ses Tails Extension Icon Icon die Exis­tenz von Mikro­for­ma­ten. Viel mehr kann der nor­male Nut­zer noch nicht mit die­sen For­ma­ten anfan­gen.

Tails Extension Screenshot

Im Gegen­satz zum Ver­schlag­wor­tungs­wahn (Tag­ging) sehe ich in die­sen For­ma­ten wirk­lich einen Sinn. Google und andere Such­ma­schi­nen mögen eine reine Text­su­che pro­blem­los beherr­schen. Wenn ein Text das Wort bzw. Schlag­wort Design ent­hält, wir Google dies als Ergeb­nis zei­gen, aber Maschi­nen kön­nen nicht ana­ly­sie­ren, wel­che Wort­samm­lun­gen dem Sinn eines Reviews ent­spre­chen.

0 Kommentare

Für diesen Eintrag wurden die Kommentare geschlossen.