Es ist noch ein weiter Weg hin zum Semantic Web, so wie das W3C es sich vorstellt. Kleine Schritte gehen können wir heute mit Mikroformaten, RDFa und den erweiterten Möglichkeiten von (X)HTML 5. Dieser Vortrag auf der webinale 09 zeigt praktische Beispiele und den Nutzen der Anwendung dieser Techniken und wagt einen Blick in die nahe Zukunft.
- 1. Michael Jendryschik 26. Mai 2009 Websemantik Die nchsten
Schritte
2. 3. 4. Dokumente
Dasist ein wichtiges Dokument, sagen wir gern zu Vertrgen,
Geschftsbriefen, Zeugnissen oder beglaubigten Schriftstcken. Wir
alle kennen den Begriff Word-Dokument, Webentwickler sprechen von
HTML-Dokumenten. Aber was sind Dokumente eigentlich?
5. Kontaktdaten? Buchrezensionen? Termine? CD-Sammlungen?
Tagebcher? Rezepte? Dialoge? Kochbcher? Bildergalerien?
Bibliographische Daten? Geodaten?Copyright und
Lizenzen?Mietvertrge? Gebrauchsanleitungen? ... 6.
Feinstrukturierung
7. Mikroformate itemis AG
Am Brambusch 1524
44536 Lnen
Telefon: +49 231 9860-210
Fax : +49 231 9860-211
E-Mail: [email protected] 8. Skripting 9. WAI-ARIA (teilweise) 10.
Neue Standards braucht das Land! und zwei davon stelle ich jetzt
vor. 11. 12. Das Semantische Web ist eine Erweiterung
desherkmmlichen Webs, in der Informationen miteindeutigen
Bedeutungen versehen werden, umdie Arbeit zwischen Mensch und
Maschine zuerleichtern. Tim Berners-Lee 13. Formale Sprache zur
Beschreibung von Eigenschaften beliebiger Daten in einer Form, die
sowohl Menschen als auch Maschinen lesen und verstehen knnen. 14.
Das Buch mit der ISBN 3-8273-2739-3 hat den Titel Einfhrung in
XHTML, CSS und Webdesign. 15. Das Buch mit der ISBN 3-8273-2739-3
hat den Titel Einfhrung in XHTML, CSS und Webdesign. sprachlich
formal Subjekt Das Buch mit der ISBN 3-8273-2739-3
urn:isbn:3-8273-2739-3 Prdikat hat den Titel
http://purl.org/dc/elements/1.1/title Objekt Einfhrung in XHTML,
CSS und Webdesign Einfhrung in XHTML, CSS und Webdesign 16. Das
Buch mit der ISBN 3-8273-2739-3 hat den Titel Einfhrung in XHTML,
CSS und Webdesign. sprachlich formal Subjekt Das Buch mit der ISBN
3-8273-2739-3 urn:isbn:3-8273-2739-3 Prdikat hat den Titel
http://purl.org/dc/elements/1.1/title Objekt Einfhrung in XHTML,
CSS und Webdesign Einfhrung in XHTML, CSS und Webdesign 17. Das
Buch mit der ISBN 3-8273-2739-3 hat den Titel Einfhrung in XHTML,
CSS und Webdesign. Einfhrung in XHTML, CSS und Webdesign 18.
RDFa
- RDFanutzt Attribute, um (X)HTML-Dokumente mit RDF anzureichern
19. Seit Mitte 2004 Teil des W3C Arbeitsentwurfs XHTML 2.0 20.
April 2007: XHTML+RDFa 1.0
21. RDFa
- XHTML 1.0 22. @content @href @rel @rev @src 23. XHTML 2.0
Metainformation Attributes Module 24. @about @datatype @property
@resource @typeof
25. RDFa Subjekt Prdikat Objekt Zeichenkette als Objekt @about
@property @content (oder bestehende Zeichenkette URI als Objekt
@about @rel @rev @resource @href @src 26. RDFa Subjekt Prdikat
Objekt Zeichenkette als Objekt @about @property @content (oder
bestehende Zeichenkette URI als Objekt @about @rel @rev @resource
@href @src 27. RDFa Einfhrung in XHTML, CSS und Webdesign Subjekt
Prdikat Objekt Zeichenkette als Objekt @about @property @content
(oder bestehende Zeichenkette URI als Objekt @about @rel @rev
@resource @href @src 28. Johann Wolfgang von Goethe wurde am 28.
August 1749 in Frankfurt am Main geboren. 29. Johann Wolfgang von
Goethe wurde am 28. August 1749 in Frankfurt am Main geboren.
Johann Wolfgang von Goethe wurde am 28. August 1749 in Frankfurt
am Main geboren.
30. Johann Wolfgang von Goethe wurde am 28. August 1749 in
Frankfurt am Main geboren. sprachlich formal Subjekt Johann
Wolfgang von Goethe
http://dbpedia.org/page/Johann_Wolfgang_von_Goethe Prdikat wurde
geboren am http://dbpedia.org/property/dateOfBirth Objekt 28.
August 1749 1749-08-28 31. Johann Wolfgang von Goethe wurde am 28.
August 1749 in Frankfurt am Main geboren. sprachlich formal Subjekt
Johann Wolfgang von Goethe
http://dbpedia.org/page/Johann_Wolfgang_von_Goethe Prdikat wurde
geboren am http://dbpedia.org/property/dateOfBirth Objekt 28.
August 1749 1749-08-28 sprachlich formal Subjekt Johann Wolfgang
von Goethe http://dbpedia.org/page/Johann_Wolfgang_von_Goethe
Prdikat wurde geboren in http://dbpedia.org/property/birthPlace
Objekt Frankfurt am Main http://dbpedia.org/page/Frankfurt_am_Main
32. Johann Wolfgang von Goethe wurde am 28. August 1749 in
Frankfurt am Main geboren.
Johann Wolfgang von Goethe wurde am 28. August 1749 in Frankfurt
am Main geboren.
33. 34. Web Applications 1.0
- Mitte 2004: Erster Entwurf 35. Mai 2007: Startpunkt zur
Diskussion und Weiterentwicklung von HTML
36. Web Applications 1.0HTML5
- Mitte 2004: Erster Entwurf 37. Mai 2007: Startpunkt zur
Diskussion und Weiterentwicklung von HTML 38. Januar 2008: W3C
verffentlicht den ersten Arbeitsentwurf von HTML5 39. Juni 2008:
Zweiter Arbeitsentwurf mit Integration von Web Forms 2.0 40. Mai
2009: Aktueller W3C-Arbeitsentwurf
41. Eine Sprache, mehrere Ausprgungen
- Definition eines abstrakten Dokumentmodells: HTML5-DOM 42.
Derzeit zwei Serialisierungen:
- HTML-Syntax: HTML5 43. XML-Syntax: XHTML5
44. XHTML 1.0 Kochbar
Absatz
45. HTML5 Kochbar
Absatz 46. HTML5 Kochbar
Absatz
47. XHTML5 Kochbar
Absatz
48. XHTML5 Kochbar
Absatz
49. Neue Elemente article aside audio bb canvas command datagrid
datalist details dialog embed figure footer header keygen mark
meter nav output progress rp rt ruby section time video 50. Neue
Elemente article asideaudio bb canvas command datagrid datalist
details dialog embed figurefooter headerkeygen mark meternavoutput
progress rp rt rubysectiontime video 51. Elemente zur
Strukturierung Quelle:
http://www.alistapart.com/articles/previewofhtml5 52. Elemente zur
Strukturierung Quelle:
http://www.alistapart.com/articles/previewofhtml5 53. Neue Elemente
article aside audio bb canvas command datagrid datalist details
dialog embedfigurefooter header keygen mark meter nav output
progress rp rt ruby section time video 54. Elementunterschriften:
Das Elementfigure
Opera 9.5
Opera 9.5 55. Elementunterschriften: Das Elementfigure
Listing 2: Header horizontal zentrieren
div#header { margin: 0 auto; width: 75%; }
Listing 2: Header horizontal zentrieren div#header { margin: 0
auto; width: 75%; } 56. Neue Elemente article aside audio bb canvas
command datagrid datalist detailsdialogembed figure footer header
keygen mark meter nav output progress rp rt ruby section time video
57. Dialoge: Das Elementdialog Einige Handwerksbursche: Warum denn
dort hinaus? Andre: Wir gehn hinaus aufs Jgerhaus. Die Ersten: Wir
aber wollen nach der Mhle wandern. Ein Handwerksbursch: Ich rat
euch, nach dem Wasserhof zu gehn. 58. Neue Elemente article aside
audio bb canvas command datagrid datalist details dialog embed
figure footer header keygen markmeternav output progress rp rt ruby
section time video 59. Angabe eines begrenzten Ma: Das Elementmeter
7 70% 60. 61. Neue Elemente article aside audio bb canvas command
datagrid datalist details dialog embed figure footer header keygen
mark meter nav outputprogressrp rt ruby section time video 62.
Fortschrittsbalken: Das Elementprogress Task Progress
Progress: 0%
var progressBar = document.getElementById('p'); function
updateProgress(newValue) { progressBar.textContent = newValue; }
63. Neue Elemente article aside audio bb canvas command datagrid
datalist details dialog embed figure footer header keygenmarkmeter
nav output progress rp rt ruby section time video 64. Markierung:
Das Elementmark
Am Ende der markierten Deklaration fehlt das Semikolon:
mark { color: black; background-color: yellow font-weight: bold;
} 65. 66. Neue Elemente article aside audio bb canvas command
datagrid datalist details dialog embed figure footer header keygen
mark meter nav output progress rp rt ruby sectiontimevideo 67.
Datums- und Zeitangaben: Das Elementtime
Der Muttertag ist ein Feiertag zuEhren der Mutter und der
Mutterschaft.
Die Veranstaltung beginnt um 18:30 Uhr.
68. Erweitertesa -Element Was macht Eclipse attraktiv fr den
Embedded-Markt?
Was bietet Eclipse, wie schafft man durchgngige
Werkzeugkettenauf Basis der offenen Tool-Technologie und warum
wurde itemis als Top Arbeitgeber 2009 ausgezeichnet?
itemis-Vorstand Wolfgang Neuhaus im Gesprch.
69. Web Forms 2.0 70. 71. Pflichtfelder und Autofocus 72.
Pflichtfelder und Autofocus 73. Datumsangaben 74. Datumsangaben 75.
Zeitangaben bitte whlen... 12:00 12:30 23:30 76. Zeitangaben bitte
whlen... 12:00 12:30 23:30 77. Schieberegler 12 35 610 1015 mehr
als 15 78. Schieberegler 12 35 610 1015 mehr als 15 79. Liste mit
Vorschlgen 12 35 610 1015 mehr als 15 80. Liste mit Vorschlgen 12
35 610 1015 mehr als 15 12 35 610 1015 mehr als 15 81. 82. HTML5
Microdata
- Editor's Draft vom 11. Mai 2009 83. Neue Attribute:@item
@itemprop @subject
84. Beispiel Einfhrung in XHTML, CSS und Webdesign 85. Beispiel
Einfhrung in XHTML, CSS und Webdesign Einfhrung in XHTML, CSS und
Webdesign 86. Veranstaltung
Websemantik: Die nchsten Schritte
26. Mai 2009, Berliner Congress Center, Berlin
87. Veranstaltung (Microdata) Websemantik: Die nchsten
Schritte
26. Mai 2009, Berliner Congress Center, Berlin
88. 89. Kontakt itemis AG
Am Brambusch 1524
44536 Lnen
Telefon: +49 231 9860-210
Fax +49 231 9860-211
E-Mail: [email protected] 90. Kontakt (Microformat) itemis AG
Am Brambusch 1524
44536 Lnen
Telefon: +49 231 9860-210
Fax : +49 231 9860-211
E-Mail: [email protected] 91. Kontakt (RDFa) itemis AG
Am Brambusch 1524
44536 Lnen
Telefon: +49 231 9860-210
Fax : +49 231 9860-211
E-Mail: [email protected] 92. Kontakt (Microdata) itemis AG
Am Brambusch 1524
44536 Lnen
Telefon: +49 231 9860-210
Fax : +49 231 9860-211
E-Mail: [email protected] 93. Michael Jendryschik [email_address] 26.
Mai 2008 Diskussion 94. Weiterfhrende Ressourcen
- RDF Primer (W3C
Recommendation):http://www.w3.org/TR/REC-rdf-syntax/ 95. RDFa
Primer (W3C Working Group
Note):http://www.w3.org/TR/xhtml-rdfa-primer/ 96. Representing
vCard Objects in RDF/XML (W3C Note):http://www.w3.org/TR/vcard-rdf
97. Eingebettete Semantik: Webseiten mit RDFa anreichern.
Webstandards-Magazin, Ausgabe 01/2009, S. 4854
98. Weiterfhrende Ressourcen
- HTML 5 (W3C Last Editor's
Draft):http://dev.w3.org/html5/spec/Overview.html 99. HTML 5
differences from HTML 4 (W3C Working
Draft):http://www.w3.org/TR/html5-diff/ 100.
HTML5:http://www.peterkroener.de/html5-was-geht-heute-schon-was-geht-nicht-der-grosse-ueberblick/
101. New elements in HTML
5:http://www.ibm.com/developerworks/library/x-html5/ 102.
Wikipedia: Comparison of layout engines (HTML
5):http://en.wikipedia.org/wiki/Comparison_of_layout_engines_(HTML_5
) 103. XHTML wird zu Grabe getragen
:http://molily.de/weblog/xhtml-ist-out
104. Bildnachweis
- Folie 2:http://www.hiphopstore.ch/images/semantik_album.jpg
105. Folie
5:http://upload.wikimedia.org/wikipedia/commons/2/2d/Marokko_W%C3%BCste_02.JPG
106. Seite 69:http://bilder.afterbuy.de/images/50195/60609.jpg 107.
Seite
12:http://upload.wikimedia.org/wikipedia/commons/4/43/Spider_web_Luc_Viatour.jpg
108. Seite
23:http://www.kunstkreiseutin.de/FOTOS/tischbein---goethe-gross.jpg
109. Seite
57:http://www.bischofshofen.sbg.at/jpg/formulare_bauamt/formular_kopie.jpg
