Digital Documents

1. Digital Documents Introducing XML, CSS, XSLeXtensible Markup LanguageCascading Style Sheets XML Style Language Gisle HannemyrAutumn 2002

2. Outline of lectures • Act 1: The Resource Discovery Problem • Why the Internet is not a library • Act 2: Introducing Semantic Markup: XML, CSS, XSL • XML: eXtensible Markup Language • CSS: Cascading StyleSheets • XSL: eXtensible Stylesheet Language • Act 3: XML vocabularies and technologies • Xlink, XML Base, Xpointer, Xpath • XML DOM, Xschema • XTM: XML Topic maps • RDF: Resource Description Framework Gisle Hannemyr

3. XML:eXtensible Markup Language • W3C har definert XML som den foretrukne standard fra for å definere dokument-markeringer. • Fleksibelt format. Er utall bruksområder, eks.: • Elektroniske dokumenter (EDI), ressursoppdagelse, tjenesteoppdagelse, objektutveksling • XML er kompakt (44 sider), men er omgitt av en lang rekke avledede/tilknyttede teknologier Gisle Hannemyr

4. SGML, HTML, XML og XHTML • SGML • syntaks for markeringsspråk for dokumenter • primært utviklet for trykkeribransjen (bøker og kataloger) • utviklet av Charles Goldfarb et al. ca. 1974-tallet • standardisert av ISO (ISO 8879) ca. 1986 • strengt strukturelt orientert • dokumentmarkeringer i form av tags • tags beskrives gjennom en DTD (Document Type Definition) • utvikling av tagsets overlatt til brukerene Gisle Hannemyr

5. SGML, HTML, XML og XHTML • HTML • markeringsspråk for definisjon av websider • definert av Tim Berners-Lee ca. 1990 • statisk syntaks, tagset (DTD) nå definert av W3C • applikasjon av SGML (Standard Generalized Markup Language) • «Laget av noen som hadde hørt om SGML, men som aldri sett det.» • blanding av struktur, <h1></h1>, og presentasjon, <blink></blink> • kaoset toppet seg med HTML 3.2 (1996) • Returnert til strukturell markup, supplert av CSS for presentasjon i m4d HTML 4.0 (1998) Gisle Hannemyr

6. SGML, HTML, XML og XHTML • XML • syntaks for definisjon av markeringsspråk, og tagsets som er velformet i forhold til denne • utviklet med tanke på nettpublisering og utveksling av strukturerte data over nett • definert av W3C 1998 (XML 1.0) • i all hovedsak basert på SGML, men forenklet og tilpasset nettpublisering • det utvikles spesfikke tagset for spesifikke XML applikasjoner • XML «erstatter» SGML (ikke HTML) Gisle Hannemyr

7. SGML, HTML, XML og XHTML • XHTML • en redefinering av HTML 4.0 fra en SGML-applikasjon til en XML-applikasjon • XHTML 1.0 er for alle praktiske formål funksjonelt det samme som HTML 4.0 • «strammere» syntaks: • ¬<H1>, men <h1> • ¬<table border=0>, men < table border="0"> • ¬<br>, men <br /> • ¬<p><b>foo</p></b>, men <p><b>foo</b></p> Gisle Hannemyr

8. CSS XML/XHTML SGMLXML/XHTML: Tidslinje HTML1.0 HTML4.0 Semantiskstruktur HTML3.2 SGML(w. FOSI) Presentasjons-struktur XSLetc. 1974 1991 1996 1997 1998 Gisle Hannemyr

9. XML vs SGML • XML = SGML-light + hypertext + applications • SGML was too complicated, too many rules • SGML difficult to parse • SGML does not handle encodings very well. • SGML had no notion of hypertext • SGML did not evolve into an application framework • Hottest buzzword of 2002:«Web Services»  RPC using XML-defined objects • Asynchrounous, Course grained, Loosely coupled computing Gisle Hannemyr

10. XML vs. HTML HTML – visual markup: <b>29.99</b> XML – semantic markup: <price currency=”NOK”>29.99</price> Gisle Hannemyr

11. Hva XML er: • XML er en enkel, portabel, standardisert måte å beskrive data på • XML-formaterte dokumenter er tekst, og kan skapes, endres og leses med et hvilket som helst program som lar deg redigere tekst • XML-formatet kan leses og forstås av mennesker så vel som dertil egnede programmer. Gisle Hannemyr

12. Hva XML ikke er: • XML er ikke en protokoll • XML-data transporteres med andre protokoller (typisk FTP eller HTTP – SOAP er vanligvis «bakt inn» i HTTP). • XML er ikke en database • en database kan inneholde XML-data eller du kan lage et program som tilgjengeliggjør data fra en database i XML-format • XML-aware databaser som Oracle tillater bruk av lagring og spørring direkte mot XML-strukturer • XML kan ikke representere alle typer informasjon • XML forutsetter informasjonen lar seg representere i en hierarkisk trestruktur med elementer og attributter Gisle Hannemyr

13. XML applications • en XML application er ikke et bruker-progam (engelsk: application) som bruker XML • isteden er den spesifikk anvendelse (engelsk: application) av XML rettet inn mot et bestemt formål, som for eksempel ressursoppdagelse eller vektorgrafikk • en XML application er som regel dokumentert i form av en anvendelsesspesifikk DTD Gisle Hannemyr

14. Some XML vocabularies,standards and technologies • For transformations: • XSL –eXtensible Stylesheet Language • For semantic web: • RDF – Resource Description Framework • XTM –XML Topic Maps • Application oriented: • ebXML –electronic business XML • MathML – Mathematical Markup Language Gisle Hannemyr

15. More XML vocabularies, standards and technologies • Technologies for Web Services(Web Services  Standard component or application exposed through standard XML and Internet protocols) • WSDL –Web Services Description Language • Metadata that (in principle) can be used to generate client-side proxy code for accessing the service. • UDDI –Universal Description, Discovery and Integration • Service discovery through standardized registrys maintained by portals/brokers • SOAP –Small Object Access Protocol • SOAP  RPC where messages are encoded using XML (transported embedded in HTTP) Gisle Hannemyr

16. Web Services Model(CORBA reborn?) Consumer Find UDDI Bind/Carry SOAP Broker Publisher Publish WDSL Gisle Hannemyr

17. “Valid” og “Well formed” • “Valid” (gyldig) • innebærer at det eksisterer en spesifikk DTD som beskriver det tagset som er brukt til å beskrive dokumentet. • “Well formed” (velformet) • kan brukes uten en tilhørende DTD • må likevel følge bestemte syntaktiske regler Gisle Hannemyr

18. Well formed XML • Startmarkering er <xxx> og sluttmerkeringer er </xxx> (så langt akkurat som HTML) • I HTML er det imidlertid lov å utelate sluttmarkeringen (og overlate til parseren å finne ut hvor elemented terminerer). Det er det ikke i XML. • Tomme elementer (elementer uten tegndata) må derfor skrives slik: <br></br>, <hr></hr>. • XML tillater imidlertid at de også skrives slik: <br/>, <hr/>. • I motsetning til HTML er små og store bokstaver forskjellige i XML (<navn><NAVN>). • Bruk fortrinnsvis små bokstaver. Gisle Hannemyr

19. Well formed XML • Unlike HTML, nearly all XML markup is case-sensitive, including element tag names and attribute names and values. • All XML names must begin with a letter, underscore ‘_’ or colon ‘:’. Inside names you can also use digits, hyphen ‘-’ and full stops ‘.’. • In practice, the colon should only be used as a namespace delimiter. • Letters are not limited to ASCII characters. Gisle Hannemyr

20. XML: Hallo Verden! Et svært enkel eksempel på et velformet XML-dokument er vist nedenfor. Det viser de den fundamentale komponenten som et XML-dokument er bygget opp av: elements (elementer). <?xml version="1.0"?><hilsen> hallo, verden!</hilsen> Akkurat dette dokumentet består av et enkelt element som er av type hilsen. Elementet er avgrenset av den markering (tag) som omgir det, nemlig startmarkering <hilsen> og sluttmarkeringen </hilsen>. Teksten mellom markeringene kalles for tegndata (character data). Gisle Hannemyr

21. XML:Dokumentstruktur XML-dokumenter har en trestruktur: Elementer kan kun forekomme nøstet inne i andre elementer, eller som en sekvens. <person> <navn> <fornavn>Peter Wessel</fornavn> <etternavn>Zapffe</etternavn> </navn> <yrke>filosof</yrke> <yrke>jurist</yrke> <yrke>forfatter</yrke></person> Gisle Hannemyr

22. fornavn etternavn person yrke yrke yrke navn filosof Zapffe jurist forfatter Peter Wessel XML:Dokumentstruktur NB: Kun ett rotelement pr dokument. For et XHTML-dokument er dette HTML. Rotelement Gisle Hannemyr

23. XML:Attributter XML-elementer kan ha attributter: <person født="1899" død="1990"> <navn> <fornavn>Peter Wessel</fornavn> <etternavn>Zapffe</etternavn> </navn> <yrke>filosof</yrke> <yrke>jurist</yrke> <yrke>forfatter</yrke></person> Gisle Hannemyr

24. XML:Attributter vs. tegndata I dette eksemplet bruker vi attributter i stedet for tegndata for å kode mer eller mindre samme informasjon som på forrige lysbilde. <person født="1899" død="1990"> <navn fornavn="Peter Wessel" etternavn="Zapffe"/> <yrke verdi="filosof" /> <yrke verdi="jurist" /> <yrke verdi="forfatter" /></person> Gisle Hannemyr

25. XML:Entitetsreferanser En del tegn kan ikke forekomme i tegndata fordi de har spesielle betydninger. Fra SGML har XML arvet en begrenset versjon av det som kalles for enititetsreferanser (entity references). Dette er symboler som refererer til andre data. De innledes med & og avsluttes med ;. I XML er bare 5 slike predefinert (men du kan definere nye i DTDen). &amp; ampersand, (og) &&lt; less then (mindre enn) <&gt; greater than (større enn) >&quot; quotation marks (gåseøyne) "&apos; apostrophe (apostroff) ' Gisle Hannemyr

26. XML:Tegndataseksjoner En spesiell syntaks brukes for å spesifisere at alt i et område er tegndata (character data) og at spesialtegn ikke skal tolkes: <p> Et svært enkel eksempel på et velformetXML-dokument er vist nedenfor.</p><pre><![CDATA[<hilsen> hallo, verden!</hilsen>]]></pre> Dette er i første rekke praktisk når man skal legge eksempler på XML inn i en tekst slik at den blir vist (og ikke tolket av parseren). Gisle Hannemyr

27. XML:Prosesseringsinstruksjoner XML tilbyr en mekanisme som gjør det mulig å sende informasjon til spesielle programmer som kan finne på å tolke siden. Dette kalles for prosessetingsinstruksjoner (processing instructions). En slik instruksjon innledes med <?navn og avsluttes med ?>. Navnet identifiserer hvilke programmer instruksjonen er beregnet på. Eks.: <?robots index="yes" follow="no"?> Denne instruksjonen er en beskjed til søkemotorroboter. Det første attributtet (index) sier at siden skal indekseres av søkemotoren, men at ingen hyperlenker på siden skal følges videre. Gisle Hannemyr

28. XML:ProsesseringsinstruksjonerKan inneholde hele programmer <?php$c = mysql_connect($my_host, $my_login, $my_password);if (!$c) { echo "<p>FEIL: Får ikke forbindelse med database.</p>"; exit;}if (!mysql_select_db ($my_database)) { echo "<p>FEIL, klarer ikke åpne DB \"$my_database\"!" . "*** FEIL: " . mysql_error (); exit;}?> Gisle Hannemyr

29. XML-Deklarasjon Et XML-dokument kan (og bør) starte med en XML-deklarasjon: <?xml version="1.0"?> (NB: Ikke en prosesseringsinstruksjon. Kan bare forekomme i starten av dokumentet.) Dersom vi ikke angir tegnsett-enkoding antas Unicode. Det er to valgfrie attributter. encoding brukes for å angi tegnsett, og standalone om en ekstern DTD er nødvendig. <?xml version="1.0" encoding="ISO-8859-1" standalone="yes"?> Gisle Hannemyr

30. XML:Kommentarer Kommentaer i XML bruker samme syntaks som SGML: <!-- Dette er eksempel på en kommentar. Den strekker seg over to linjer. --> Kommentarer kan brukes hvor som helst i tegndata, og også før eller etter rotelementet, men ikke inne i en markering eller en annen kommmentar. NB: Det er heller ikke lov å ha to bindestreker noe sted inne i en kommentar. Gisle Hannemyr

31. DTD:Document Type Definition • En DTD for det gjennomgående eksemplet vårt: • <!ELEMENT person (navn, yrke*)><!ELEMENT navn (fornavn, etternavn)><!ELEMENT fornavn (#PCDATA)><!ELEMENT etternavn (#PCDATA)><!ELEMENT yrke (#PCDATA)> Gisle Hannemyr

32. XML Namespaces • XML tilbyr navnerom for to formål: • Å skille mellom elementer og attributter fra ulike XML appliksjoner som deler samme navnerom. • Å gruppere alle elementer og attributter fra samme XML applikasjon sammen så vi lett kan kjenne dem igjen. • xmlns:rdf="http://www.w3.org/TR/REC-rdf-syntax#" • xmlns:dc="http://purl.org/dc/elements/1.0/" Gisle Hannemyr

33. Styles and transformations • Cascading Style Sheets (CSS) • Extensible Stylesheet Language (XSL) Gisle Hannemyr

34. Presentasjon av ensemantisk vev (XML) • Løsning 1: Cascading Style Sheets (CSS) • Enkel, presentasjonsdreven modell • Fungerer best i Opera 6.0 • Løsning 2: Extensible Stylesheet Language (XSL) • Kompleks, regelbasert modell, tuftet på transformasjon fra semantisk orientert XML til en annen (typisk presentasjonsorientert) XML • Fungerer i MSIE 5.0 Gisle Hannemyr

35. To eksempler • Skal gå først gå gjennom to eksempler på hvordan dette kan gjøres i hhv. CSS og XSL (med utgangspunkt i et enkelt XML-dokument). • Skal deretter gå gjennom CSS og XSL i mer detalj. Gisle Hannemyr

36. XML-dokument ?xml version="1.0"?><!DOCTYPE Bios SYSTEM "biographies.dtd"><!-- her refereres til relevant stilark --> <bios> <person born="1861" died="1930"> <navn> <fornavn>Fridtjof</fornavn> <etternavn>Nansen</etternavn> </navn> <yrke>forfatter</yrke> <yrke>idrettsmann</yrke> <yrke>polarforsker</yrke> <yrke>politiker</yrke> <yrke>zoolog</yrke></person> … forts. på neste lysbilde Gisle Hannemyr

37. XML-dokument (forts.) forts. fra forrige lysbilde … <person born="1899" died="1990"> <navn> <fornavn>Peter Wessel</fornavn> <etternavn>Zapffe</etternavn> </navn> <yrke>filosof</yrke> <yrke>jurist</yrke> <yrke>forfatter</yrke></person> </bios> Her har vi altså XML-markerte data md mini.biografier av de to personene Fridtjof Nansen og Peter Wessel Zapffe. Gisle Hannemyr

38. XML-dokument ?xml version="1.0"?><!DOCTYPE Bios SYSTEM "biographies.dtd"><?xml-stylesheet type="text/css" href="style.css"?> <bios> <person born="1861" died="1930"> <navn> <fornavn>Fridtjof</fornavn> <etternavn>Nansen</etternavn> </navn> <yrke>forfatter</yrke> … osv. Vi har nå føyd til en konkret referanse til et stilark av type CSS. Gisle Hannemyr

39. CSS stilark & resultat person { display: block; margin: 1em; }yrke { display: block; text-indent: 1em; }etternavn { font-weight: bold; } Gisle Hannemyr

40. XML-dokumentet på nytt ?xml version="1.0"?><!DOCTYPE Bios SYSTEM "biographies.dtd"><?xml:stylesheet type="text/xsl" href="style.xsl"?> <bios> <person born="1861" died="1930"> <navn> <fornavn>Fridtjof</fornavn> <etternavn>Nansen</etternavn> </navn> <yrke>forfatter</yrke> … osv. Eneste endring er at vi nå peker til et stilark av type XSL. Gisle Hannemyr

41. XSL stilark (template) <?xml version="1.0"?><xsl:stylesheet xmlns:xsl="uri:xsl"><xsl:template match="/"><html><body><h1>Biografier</h1><xsl:for-each select="bios/person"><dl><dt><b><xsl:value-of select="navn/etternavn" />,</b><xsl:value-of select="navn/fornavn" /></dt>(<xsl:value-of select="@born"/>-<xsl:value-of select="@died"/>)<dd><xsl:for-each select="yrke"><xsl:value-of select="." /></xsl:for-each></dd></dl></xsl:for-each></body></html></xsl:template></xsl:stylesheet> Gisle Hannemyr

42. Resultat NB: Opera støtterikke XSL ennå MSIE tolker XSL (ogXSLT) og konstruereren formatert side.Legg merke til at ogsåattributtene kan vises. Gisle Hannemyr

43. Introduksjon til CSS • Utviklet av Håkon Wium Lie og Bert Bos for W3C. • Tar utgangspunkt i deklarativ formatering (separasjon av innhold og form). • Brukes vanligvis til å endre format på predefinerte HTML (og XHTML) tags. • Kan også brukes sammen med velformet XML. • Er utviklet pre-XML og er derfor ikke definert som en XML-applikasjon. Gisle Hannemyr

44. Hvorfor «cascading» cascade: […] something arranged in a series • En av grunntankene bak CSS er at mer enn ett stilark skal kunne påvirke formatet på en webside • designeren av websiden • brukeren • nettleseren (særlig med tanke på spesielle lesere, som lydlesere for blinde, små portable enheter, og særlige anvendelser, som lysbilder) Gisle Hannemyr

45. Regler for multiple stilark • Vanligvis brukes følgende presedens: • Designer • Bruker • Utstyret • Ansvaret ligger imidlertid i nettleseren, slik at denne (evt. styrt av brukeren – jf. author mode og user mode i Opera) har ansvar for hvordan evt. konflikter blir løst. Gisle Hannemyr

46. Hvor kan stiler defineres • Standardverdier innbakt i nettleseren. • Brukerpreferanser angitt til nettleseren. • Fra designeren: • Ved å lenke til et eksternt stilark • Globalt for hele dokumentet (i et <style>-element). • Lokalt til et element (som verdi tilordnet et style-attributt) Gisle Hannemyr

47. Eksempel på CSS (global) Global redefinering av <h1>: <head><style>h1 { color: green; text-align: center; }</style></head> Gisle Hannemyr

48. Eksempel på CSS (element) Lokal redefinering av <h1>: <body><h1 style="color: blue;text-align: right">Introduksjon</h1> ... </body> Stilangiveksen er et attributt til h1– elementet. Bortsett fra at det står i gåseøyne er syntaksen identisk til når det defineres globalt. Gisle Hannemyr

49. CSS og klasser Definerer en klasse red av <h1>: <head><style>h1.red { color: red; }</style></head> Eksempel: <h1 class=”red”>Rød overskrift</h1> Gisle Hannemyr

50. Anonyme CSS-klasser Definerer en anonym klasse red: <head><style>.red { color: red; }</style></head> Eksempel: <p class=”red”>Rødt avsnitt</o> Gisle Hannemyr