2 Rakenteisten dokumenttien perusteet

Koko: px
Aloita esitys sivulta:

Download "2 Rakenteisten dokumenttien perusteet"

Transkriptio

1 è è è Rakenteisten dokumenttien perusteet 2 Rakenteisten dokumenttien perusteet Kuten todettua, rakenteinen dokumentaatio tähtää tiedon mallintamiseen käytössä olevien välineiden mahdollisuudet huomioiden (tietokoneet!). Tavoitteet ovat yleensä pitkäjänteisiä. Merkittävä osa rakenteisuudella tavoiteltavista hyödystä realisoituu esim. dokumenttien hallinnan sovelluksissa vasta "pitkällä aikavälillä". Vrt. dokumentin kärjistetty elinkaari: Luonti Muokkaus Tarkastus Hyväksyntä Julkaisu Haku Katselu Arkistointi Poisto Kuva: Anttila,

2 è è è Rakenteisten dokumenttien perusteet 2.1 Välisoitto Ensimmäinen askel työn automatisoinnissa on prosessin haltuunotto Tämä tarkoittaa vähintäänkin eri työvaiheiden tunnistamista ja tietoa välittävien rajapintojen kuvaamista Mekaaniset tehtävät kannattaa yleensä jättää tietokoneiden tehtäväksi 25

3 è è è Rakenteisten dokumenttien perusteet 2.2 Mikä on rakenteinen dokumentti? Rakenteinen dokumentti ~ rakenteellinen dokumentti ~ dokumentti, jossa erotetaan toisistaan dokumentin a) sisältö, b) yleiskäyttöinen rakenne ja c) ulkoasu (tai esitystapa) jotakin systemaattista ja yksikäsitteistä menetelmää käyttäen. "Työvaiheet": Huomaa että dokumenttikäsite on suhteellinen: se esiintyy suhteessa työkaluihin ja käyttötapaukseen 1) Tietorakenteen valinta (dokumentin tyyppi) Muistio (DTD)..kertoo kirjatuista tiedotteista yms. "Kerron pomolle, että uusi tietokantamme on susi" 0) Asiasisällön määrittäminen (sovellusalue) 3) Käsittely (esim. ulkoasun valinta ja julkaiseminen) 2) Asiasisällön koodaus ("merkkaus") PENA OY Muistio To: Pentti Pomo Fr: Timo Työmies Uusi tietokantamme on susi! 4) Tulkinta / Käyttö sovelluksessa 26

4 è è è Rakenteisten dokumenttien perusteet 2.3 Huomautuksia Ilmeisestikin dokumenttien sisältö, rakenne ja ulkoasu voidaan eriyttää vain jos käytetyt välineet sen sallivat! (tietokoneet!) Tietokoneissa asiasisältö esitetään tietenkin aina suhteessa johonkin tietorakenteeseen Oikeissa sovelluksissa työvaiheiden (0-)1-2-3 tunnistaminen, suunnittelu, toteuttaminen ja ohjeistaminen on joskus hyvin vaikeaa - tarvitaan tietoa sovellusalueesta, tiedon käsittelytekniikoista ja mallintamisesta (sekä työn reunaehdoista ja rajoitteista) Käytännössä tietoa yritetään yleensä esittää tunnettujen dokumenttityyppien avulla, ts. tulos on aina kompromissi olemassa olevien sovellusten ja välineiden sekä mallinnuksen tarkkuuden välillä Käytännössä "tiedon tilaaja" (esim. kustantaja, asiakas) yleensä määrittelee missä muodossa tieto pitää toimittaa (!) 27

5 è è è Rakenteisten dokumenttien perusteet 2.4 Tyypillinen käyttötapaus: monikanavajulkaiseminen (Osa)tavoitteita: hallittavuus, siirrettävyys, yhteensopivuus, haettavuus, ohjelmistoriippumattomuus,... XML XHTML SVG SMIL PNG... XSL/FO PDF Sovellus #1 käsikirjoitus XSL CSS Sovellus #2 Mediaobjektit XLink XSL CSS Sovellus #3 28

6 è è è Rakenteisten dokumenttien perusteet 2.5 Rakenteinen teksti = merkkaus + merkkidata Rakenteisuuden perusidea: tekstinpätkän merkitys riippuu sen sijainnista dokumentissa (loogisen rakenteen suhteen) <a id="osoite" href="osoite/">osoite</a> Erityyppisen tiedon erottaminen toisistaan perustuu sopimukseen merkkauksesta (merkkauskielioppi) - teksti = merkkaus + merkkidata - esim. HTML-dokumentti ja CSS-tiedosto; molemmat ovat tekstitiedostoja - esim. XHTML-dokumentti ja SVG-dokumentti; molemmat ovat tekstitiedostoja ja molempien merkkauskielioppi sama (XML), mutta tyyppimääritysten ansiosta elementtien nimet ja merkitys ovat erilaisia (ns. itsensä kuvailevat dokumentit (self-describing)) Tietorakenne on "kaikki"; rakenteisella dokumentilla ei tarvitse olla sen kummempaa ulkoasua - vrt. RSS-tiedosto, lokitieto, viesti tietokoneohjelmien välillä (XML = Extensible Markup Language, SVG = Scalable Vector Graphics, CSS = Cascading Stylesheets) 29

7 è è è Rakenteisten dokumenttien perusteet 2.6 Looginen ja fyysinen rakenne Dokumentin käsittelyn kannalta keskeistä on sen looginen rakenne Tuttu esimerkki: XHTML-dokumentti (ks. musiikki.html, musiikki.xml) Dokumentin looginen rakenne on dokumentin jäsennys tietyn kieliopin suhteen (esim. XML-pohjainen XHTML 1.0 Strict dokumenttityyppi) - juurielementti, elementit, attribuutit,..., tuloksena esim. tietyn XHTML-dokumentin looginen jäsennyspuu - (jäsennys)puu on rekursiivinen tietorakenne (puun alipuu on puu)...tästä on suurta hyötyä ohjelmoinnissa Dokumentin fyysinen rakenne on kokoelma (loogisen) dokumentin taustalla vallitsevia tiedostoja, tietorakenteita, yms. entiteettejä tietokoneen muistissa - esim. tiedosto(t) joihin HTML-dokumentti on talletettu 30

8 è è è Rakenteisten dokumenttien perusteet 2.7 Dokumentin jäsennyspuu (XML) Esimerkki, listarakenne HTML-kielessä <ul lang="en"> <li>dire <br/> Straits</li> <li>pet Shop Boys</li> <li><img src="symbol.png" alt="prince"/></li> </ul> Tyhjämerkkien tulkinta Peruskäsitteitä: ul li li li Dire br Straits Pet Shop Boys lang="en" img src="symbol.png" alt="prince" - solmu, juurielementti, elementti(solmu), attribuutti(solmu), tekstisolmu, tyhjäsolmu,..., juuri, lapsi, vanhempi, seuraaja, edeltäjä, sisar, edeltävä sisar, seuraava sisar, lehti(solmu) Huomaa: merkkaus tuottaa loogisia rakenteita - käytännössä jäsennyspuu "näkyy" aina vain ohjelmointirajapinnan läpi - jäsennyspuille on useita merkitsemistapoja (esim. attribuutit ja tyhjäsolmut jätetään usein pois)...koska jäsennys suoritetaan aina jotakin tiettyä tehtävää silmälläpitäen (vrt. kommenttien näkyvyys jne.) 31

9 è è è Rakenteisten dokumenttien perusteet 2.8 Dokumentin jäsennyspuu, huomioita Jäsennyspuun tulisi aina olla yksikäsitteinen ("XML:n pulma, ei meidän") -...muuten dokumentin käsittely ei onnistu - ikävä kyllä tietorakenteiden (tulkinnan) määrittelyistä löytyy toisinaan epätarkkuuksia tai suoranaisia virheitä Yksi ja sama looginen jäsennyspuu voidaan usein tuottaa eri merkkausrakentein tai fyysisin rakentein -...tämä aiheuttaa toisinaan pulmia, koska ihmiselle merkityksellisiä merkkausrakenteita saattaa "unohtua" ohjelmallisessa prosessointiaskeleessa <b><div>ks. kuva A1: <img src="a1.png" alt="jalkapallo"/></div></b> jäsennys <!-- versio 2: --> <b> <div>ks. kuva A1: <img alt="jalkapallo" src="a1.png" /> </div> </b> jäsennys 32

10 è è è Rakenteisten dokumenttien perusteet 2.9 Dokumentti säiliöi ja välittää tiedon kirjoittajalta lukijalle Dokumentti on aistittavaksi ja ymmärrettäväksi tarkoitettu tietokokonaisuus, joka koostuu yhdestä tai useammista fyysisistä osista (esim. tiedostoista) ja voidaan sen loogisen rakenteen pohjalta jäsentää merkityksellisiksi osiksi Dokumenttien käsittelyssä (prosessoinnissa) erotetaan yleensä - lähdedokumentti (joskus käsikirjoitus) ja kohdedokumentti (tai tulosdokumentti) - nämäkin ovat asiayhteydestä riippuvia, suhteellisia käsitteitä d Sovellus / prosessointi d'..... Dokumentti voi olla paitsi staattinen (pysyvä) myös dynaaminen tai virtuaalinen (esim. koottu vasta pyyntöhetkellä jonkin ohjeen mukaisesti) 33

11 è è è Rakenteisten dokumenttien perusteet 2.10 Teksti, dokumentit, tulkinta ja käsittely Tarkoituksesta riippuen, (nyt lähinnä tekstimuotoinen) informaatio on mahdollista jäsentää tai tulkita dokumenteiksi usein eri tavoin, käsittelyn eri tasoilla <!ELEMENT <!ENTITY AB "Abe Lincoln"> Tulkinta (kenties koostaminen, ajonaikainen tuotanto) <?xml version="1.0"?> <!DOCTYPE poem [ <!ENTITY % names " %names; ]> <poem> There is no use of cursing darkness <author>&nn;</author> </poem> Prosessointi "There is no " Tekstidokumentteja (Unicode) XML-dokumentti Artikkeli, WWW-sivu, CD-rom, DVD, nauhoite,... Jokaiseen dokumenttiin liittyy aina jokin koodaus, sisältö, rakenne ja ulkoasu sekä ajatus sen käsittelystä (ns. oletus- tai luonnollinen tulkinta) Dokumenttilähtöisessä tiedon mallinnuksessa luonnollinen tulkinta on yleensä "rajaavampi" kuin datalähtöisessä tiedon mallinnuksessa 34

12 è è è Rakenteisten dokumenttien perusteet 2.11 Dokumentin tyyppi ja dokumenttiluokka Tietojenkäsittelyn järkevöittämiseksi dokumentit ovat yleensä tietyn tyyppisiä - "HTML-sivua käsitellään/sovelletaan eri tavalla kuin SVG-kuvaa" -...ohjelmoinnin tarpeet! Dokumentin tyyppi(määritys) on ohje joka kuvaa samantyyppisten dokumenttien dokumenttiluokan - yksittäisiä dokumentteja (tai näiden esiintymäosaa...) kutsutaan toisinaan (tietyn dokumenttiluokan) esiintymiksi (instance) tietyntyyppinen dokumentti, "esiintymä" (esim. "HTML-sivu") tietty dokumenttityyppi (esim. HTML, SVG, DocBook tai RDF/XML) tyyppimäärityskieli (esim. XML 1.0 tai XML Schema) merkkauskieli(oppi) (esim. XML 1.0) merkistö (esim. Unicode) Dokumenttiluokkien ja dokumenttien käsittely sisältää useita tekniikoita - esim. "saman" dokumenttiluokan voi periaatteessa määritellä useilla tyyppimäärityskielillä (Esim. XML DTD, XML Schema ja Schematron) (DTD = Document Type Definition, dokumentin tyyppimääritys) 35

13 è è è Rakenteisten dokumenttien perusteet 2.12 Esimerkki, XHTML Tuottajan näkökulma Tulkitsijan ja käsittelijän näkökulma Huomioita - rajapinta-ajattelu ("pienen yhteinen tekijä") - sovellus voi käytännössä [typedef] music.html [typedef] home.html DTD XHTML 1.0 Strict tuotanto käsittely (sovellus) [implements] toteuttaa dokumenttityypin käsittelyn usein eri tavoin Dokumentin tyyppi on vain (pieni) osa koko systeemiä - ohjeistus ja (ihmisille tarkoitettu) määrittely - arkisissa sovelluksissa tarvitaan yleensä useita dokumenttiluokkia (joiden välillä on riippuvuuksia) 36

14 è è è Rakenteisten dokumenttien perusteet 2.13 Dokumenttijärjestelmistä Rakenteisia dokumentteja käytetään toki muuhunkin kuin "vain" julkaisemiseen, mutta ideatasolla tästä on hyvä lähteä liikkeelle Pelkistetyn dokumenttijärjestelmän osat: Dokumenttiprosessori(t) Dokumenttistandardi(t) Tuotantoprosessin suunnittelu- ja hallintavälineet Dokumenttitietokanta Dokumenttieditori Tyyppimääritystietokanta Sovellukset (esim. mediakohtaiset ulkoasut) Objektitietokanta Objekti-editori Jäsennin ja validaattori Tyylitietokanta Käytännössä tarvitaan siis 1) standardeja, 2) ohjelmistoja, 3) teknisiä alustoja, 4) menetelmiä sekä 5) oikeita sovelluksia ja käyttötapoja 37

15 è è è Rakenteisten dokumenttien perusteet 2.14 Dokumentti- vs. datalähtöinen mallintaminen Dokumenttilähtöinen mallintaminen jäsentää tiedon kokonaisuuksiksi jolla on tyypillisesti hierarkkinen rakenne - dokumentit muodostavat kokonaisuuksia ja käsitellään kokonaisuuksina - esim. Web-sivu, muistio, kirja, vektorikuva Datalähtöinen mallintaminen tarkastelee tietoa "pieninä dokumentteina" (tai tietueina) joiden tietosisältöä yhdistellään sovelluksessa melko vapaasti - esim. uutistieto, CD-levyn kappaletiedot, yhteystieto, metatieto, viesti Rajanveto on häilyvä; yleensä kyse on tavasta jolla tietoa tuotetaan - "käsin kirjoitettavaksi" tarkoitettu tieto on yleensä dokumenttilähtöistä ja sovellusalueeltaan melko rajattua - datalähtöistä tietoa käsitellään yleensä hakujen tai loogisesti kuvailtujen prosessien puitteissa (jolloin tietoa tarvitaan esim. tietyn säännön aktivoituessa) 38

16 è è è Rakenteisten dokumenttien perusteet 2.15 Rakenteettomat dokumentit? Kommunikoinnin näkökulmasta rakenteettomia dokumentteja ei tietenkään ole olemassakaan (ja perinteisten tietokoneohjelmien tapauksessa rakenteiden on oltava ainakin luettavissa yksikäsitteisesti) Rakenteisuudessa on siis kyse lähinnä - kenen tai minkä tehtävän näkökulmasta rakenteita merkataan & kuka merkkauksen ymmärtää - miten yksityiskohtaisesti ja miten rakenne esitetään Tietokoneen näkökulmasta rakenteisuus tarkoittaa käytännössä sitä, että tietoa lukeva järjestelmä osaa sijoittaa luetun tietoalkion oikeaan paikkaan omassa tietorakenteessaan (tai osaa sivuuttaa sen tarpeettomana) Rakenteellisuus ei toki ole vain staattisten dokumenttien ominaisuus; esimerkiksi yksinkertaiset sähköpostiviestit voidaan koodata tarkkaa SMTPetikettiä (protokollaa) noudattaen (Simple Mail Transfer Protocol) 39

17 è è è Rakenteisten dokumenttien perusteet 2.16 Esimerkki: SMTP-keskustelusta S: MAIL R: 250 OK S: RCPT R: 250 OK S: RCPT R: 550 No such user here S: RCPT R: 250 OK S: DATA R: 354 Start mail input; end with <CRLF>.<CRLF> S: Blah blah blah... S: <CRLF>.<CRLF> R: 250 OK Huomioita: - tarkkaan sovittu rakenne, erikoismerkkien pulma ja <CRLF>.<CRLF> - voitaisiin hoitaa (vieläpä paremmin?) myös lähettämällä rakenteisia dokumentteja osapuolten välillä (...Web Services) 40

18 è è è Rakenteisten dokumenttien perusteet 2.17 "Muuntyyppisiä tietorakenteita kuin dokumentteja" Erotinmerkkeihin perustuvat tekstitiedostot (CSV jne.): # seuraavat ovat kappaleiden tietoja Sultans of swing 3: Dire Straits Dire Straits Yesterday, When I Was Mad 3: Very Pet Shop Boys Relaatiotietokannat (esim. taulu tai relaatio Track [tyyppitiedot!]): name len year album artist Sultans of swing 3: Dire Straits Dire Straits Yesterday, When I Was Mad 3: Very Pet Shop Boys Tavoite sama, keskeisiä eroja rakenteisiin dokumentteihin verrattuna - tietorakenteen monimutkaisuus - käsittelyn ja ohjelmoinnin monimutkaisuus - ohjelmallinen käsittely ja std-sovellukset - haut, tehokkuus, optimointi, tarvittavat ohjelmat - kysy käsitellä dataa vs. dokumentteja - pyörän uudelleen keksiminen (toistuvat pulmat: jäsennys, merkkikoodaus, kieli, metatiedot, ohjelmointi,...) 41

19 è è è Rakenteisten dokumenttien perusteet 2.18 Esimerkki relaatiotietokannan rakenteesta (vertaa!) Peruskäsitteitä: taulu/relaatio, monikko/tietue, mallinnus ja normalisointi, kytkös vs. redundanssi, anomaliat (päivitys, poisto), avaimet, kuuma taulu, optimointi, kysely Artist aid name style a1 Dire Straits rock a2 Pet Shop Boys pop Album rid artist name year r1 a1 Dire Straits 1978 r2 a1 Alchemy 1984 r3 a2 Very 1993 Track tid album name len_ t1 r1 Sultans of Swing 5:34 t2 r1 In the gallery 6:14 t3 r3 Yesterday, when I was mad.? t4 r3 Go West.? 42

20 3 XHTML-dokumenttien anatomia XHTML tarjoaa tutun esimerkin rakenteisten dokumenttien opiskelun alkutaipaleelle. Erityisesti, koska XHTML on XML-sovellus: - havainnollistaa se tiedon teknistä merkkausta (merkkauskielioppi), - osoittaa merkkauksen ja dokumentin tyypin välisen suhteen, sekä - tarjoaa esimerkin erään dokumenttiluokan suunnittelusta....ainakin periaatteessa. Käytännössä, eri syistä johtuen, kaikki XHTMLsovellukset (esim. verkkoselaimet) eivät toteuta kaikkia XML:n edellyttämiä piirteitä, vaikka tästä olisikin soveltajalle melkoista hyötyä 43

21 3.1 Varoitus! XHTML ei ole rakenteisten dokumenttien "maali", vaan nyt "vain" hyvä opiskelun lähtökohta koska kielen sovellukset ja idea oletetaan periaatteessa tunnetuksi 95% Web-sivuja joskus tehneistä ei kuitenkaan osaa XHTML-kieltä eikä sen merkkausta pintaa syvemmältä...suhtaudu siis tähän(kin) aiheeseen vakavissasi, vaikka olisitkin sitä mieltä että osaat jo HTML-kielen "varsin hyvin" 44

22 3.2 Esimerkki: XHTML-dokumentti XHTML-dokumentti on XML-dokumentti joka rakenteellisesti noudattaa tiettyä dokumentin tyyppimääritystä (DTD),..joka kirjoitetaan tyyppiesittelynä (tai -deklaraationa) <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " <html xmlns=" xml:lang="en" lang="en"> <head> <title>virtual Library</title> </head> <body> <p>check <a href=" </body> </html> <!-- Mod. --> XML "näkyy läpi" XHTML-sanaston pohjalla: fyysinen ja looginen rakenne (tiedosto ja elementit), kommentit yms., nimiavaruuden käsite, jne. XHTML-dokumentin kirjoittajan ei tarvitse tietää "kaikkea" XML:stä 45

23 3.3 Hypertext Markup Language, HTML HTML on tarkoitettu verkkosivujen sisällön kuvailemiseen, tehtävä on: - sisällön loogisen rakenteen kuvailu (ulkoasu on sovelluksen heiniä) Useita suosituksia (ks. - vanhat HTML-versiot (2.0, 3.2) ja HTML XHTML-perhe - XHTML 1.0 The Extensible HyperText Markup Language (Second Edition) (Kolme versiota: Strict - Transitional - Frameset) - Modularization of XHTML - XHTML Module-based XHTML - XHTML Basic - Suositus "XHTML 2.0" kehitteillä Huom! (X)HTML on "vain julkaisuformaatti" ja hyvin rajoittunut sellainen 46

24 3.4 XHTML Basic, se pieni & järkevä XHTML-sanasto XHTML Basic määrittelee HTML:n kuvailevan ytimen Rajaus ja moduulijako on hyödyllinen, vaikkei kirjoittaisi varsinaisesti XHTML Basic - dokumentteja Jatkossa XHTML kehittynee entistä selvemmin juuri moduulien suuntaan - yhdisteltävyys ja profilointi - XML-tekniikoiden hyödyntäminen 47

25 3.5 XHTML-dokumenttityypin määrittely XHTML (DTD HTML 1.0 Strict) -tyyppisten dokumenttien elementtirakenne kerrotaan tyyppimäärityksessä formaaleina sääntöinä (ja sekä tarvittaessa esim. sanallisina rajoitteina), vrt. <!ELEMENT img EMPTY> <!ATTLIST img %attrs; src %URI; #REQUIRED alt %Text; #REQUIRED longdesc %URI; #IMPLIED height %Length; #IMPLIED width %Length; #IMPLIED usemap %URI; #IMPLIED ismap (ismap) #IMPLIED > Määritys kertoo asiat formaalin kielen (so. tietorakenteen) näkökulmasta, merkitys ja käyttö pitää tietenkin ohjeistaa muutenkin! 48

26 3.6 XHTML-dokumentin esittelyosa <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " Huomautuksia - kertoo dokumentissa käytetyn XML-standardin version (nyt 1.0) sekä mahdollisesti tekstitiedoston merkkikoodauksen (+ muutakin) - kertoo dokumentin tyypin (nyt DTD XHTML 1.0 Strict) Huom. XML-standardin mukaan, esittelyosa voisi sisältää myös muitakin osia, esim. sisäisen DTD-osajoukon, vrt. dokumentin paloittelu <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " [ <!ENTITY copy_decl SYSTEM "copy.txt"> ]> 49

27 3.7 XHTML-dokumentin esiintymäosa <html xmlns=" xml:lang="en" lang="en"> <head> <title>virtual Library</title> </head> <body> <p>check <a href=" </body> </html> Kertoo oleellisesti dokumentin asiasisällön - yksikäsitteinen juurielementti (nyt html; vrt. tyyppiesittely) - aidosti sisäkkäinen elementtirakenne - XHTML-dokumentissa pitää kertoa myös dokumentin nimiavaruus Dokumenttiluokkakohtainen rakenne määräytyy dokumentin tyypin mukaan (tai sitten dokumentti on "virheellinen", ts. ei ole validi) - esim. XHTML-dokumentissa aina head- ja body-osat, nimi title tarkoittaa head-osassa pakollista elementtiä tai "useimpia" elementtejä kuvailevaa attribuuttia jne. 50

28 3.8 Elementtien merkkaaminen Elementti merkitsee nimetyn tekstilohkon (on myös nimettömiä!) - voi sisältää merkkidataa ja toisia elementtejä (rekursio määritelmässä) - voi myös sisältää muitakin merkkausrakenteita (esim. kommentteja) - sovellus päättää tyhjämerkkien tulkinnan - alkutagi, elementin nimi, sisältö, lopputagi, tyhjän elementin tagi <head> <!-- HTML-dokumentin otsikko-osa --> <title>musiikkityyleistä</title> <link rel="stylesheet" type="text/css" href="music.css" /> </head> Tiedon mallintamisen perusidea: "elementit esittävät konkreettisia asioita, joille attribuutit antavat abstrakteja määreitä" - DTD sanoo mitkä nimet ja rakenteet nyt sallittuja, isot ja pienet kirjaimet merkitseviä, useita merkkaustapoja (muttei lyhennemerkintöjä) Huom. elementtien merkkaus varaa käyttöönsä erikoismerkin '<' 51

29 3.9 Erikoismerkeistä: entiteetit ja merkkiviittaukset Koska merkki '<' on tietenkin tarpeellinen myös asiasisällössä, pitää vastaava merkki pystyä liittämään dokumenttiin merkkauksen avulla, esim. entiteettiviittauksena HTML määrittelee suuren joukon vakioentiteettejä, mm. < ~ < > ~ > & ~ & " ~ " (vaikkei HTML määrittele, sanotaan jo nyt että &apos; ~ ') Entiteettiviittauksen saa kirjoittaa sinne minne merkkausta voi kirjoittaa (ts. elementit ja attribuutit) Yksittäisiä merkkejä voi liittää dokumenttiin myös merkkiviittausten avulla A ~ A 52

30 3.10 Attribuuttien merkkaaminen Elementin alkutagi (tai tyhjän elementin tagi) voi sisältää attribuutteja - attribuutin nimi ja arvo erotetaan '='-merkillä, arvo ympäröidään heitto- tai lainausmerkein, sovellus päättää tyhjämerkkien tulkinnan (ns. normalisointi attribuutin tyypin mukaan) - attribuutin arvo voi sisältää tekstiä (jossa siis voi esiintyä entiteetti- ja merkkiviittauksia) - attribuuteilla ei ole loogista järjestystä, attribuutti ei saa toistua <a href="list.php?id=1&cmd='a b'" title="listaus">l1</a> Attribuutit esiintyvät aina suhteessa elementteihin Huomionarvoisia attribuutteja: - id, href, lang, xml:lang, xml:space 53

31 3.11 Muu merkkaus: kommentit Koska kyse on XML-dokumentista, XHTML-dokumentista voi löytyä myös muita merkkausrakenteita, nimittäin - kommentteja - (sekä prosessointiohjeita ja merkkidatalohkoja; nämä sivuutamme toistaiseksi) Kommentti on yleensä merkkaajan oma muistiinpano, mutta saattaa välittyä myös lukijoille (sovelluksesta riippuen) <!-- Pitäisikö tämä luku poistaa? ( :ON) --> Huom. Kommentit ovat osa merkkausta ja voidaan siten jäsentää loogisena osana dokumentin asiasisältöä (!), X(HT)ML ei salli sisäkkäisiä kommentteja (!), eikä merkkijonoa "--" 54

32 3.12 HTML:n kehityksestä ja merkkauksesta (1/2) XHTML on kehittynyt rakenteiseksi dokumenttistandardiksi ajan kuluessa - esim. DTD XHTML 1.0 Strict rajaa laajemmasta (Transitional) sanastosta pois formatointiin liittyviä piirteitä (esim. elementti font) Motivaatio on se, että XHTML-dokumenteilla ja esim. CSS-tyyleillä on selvä työnjako: - XHTML sisältää dokumentin asiasisällön kuvailevan tai deskriptiivisen merkkauksen keinoin, joka kertoo mitä loogisia osia dokumentista löytyy sen asiasisällön näkökulmasta - käytännössä CSS-tyyli formatoi dokumentin, ehdottaen fontit, värit, vahvennukset, jne. Kuvaileva merkkausta pidetäänkin yleensä formatoivan merkkauksen vastakohtana (tarkka rajanveto hankalaa; suhteessa tiettyyn sovellukseen) 55

33 3.13 HTML:n kehityksestä ja merkkauksesta (2/2) Miksi pyrkimys deklaratiiviseen merkkaukseen? Hallittavuuden takia: koska... - (lähde)dokumentti voidaan mallintaa sovellusalueen luonnollisten käsitteiden näkökulmasta (nyt XHTML ~ WWW-hypertekstin julkaisukieli); tästä on hyötyä myös kirjoittamisen ja käsittelyn työnjaon näkökulmasta - sama sisältö voidaan tuotantoprosessin keinoin esittää eri tavoin (vrt. WWW-sivu [pc pda], paperituloste, PDF-sivu) -...ts. dokumenttien asiasisältö ja ulkoasu voidaan erottaa prosessoinnissa, nojautuminen formatointiin johtaa helposti informaation katoamiseen tietoa merkatessa (esim. tiedonhaku) 56

34 3.14 Rakenteiden merkitsemistapoja ja termejä (1/3) Hierarkkiset elementtirakenteet ~ sisäkkäisiä elementtimäärityksiä, joiden jäsentäminen tuottaa elementtien puurakenteen (properly nesting elements) Limittäiset lohkorakenteet ~ "päällekkäisiä rakennemääritelmiä", jotka eivät (välttämättä) määritä selvärajaisia elementtejä <b>fat</b> <i>and</i> <i><b>lean</b></i> <b>fat</b> <i>and <b>lean</i></b> <!-- ei siis XHTML-merkkausta! --> Limittäisiä lohkorakenteita käytetään toisinaan esim. hakujen ja dokumenttien elementtirajat ohittavan annotoinnin takia (ei suositeltavaa); <p>... Dire straitsin <revision/> pitkäsoitto <em>dire Straits: <revisionend/>dire Straits</em> ilmestyi jo </p> Hierarkkisuuden keskeisin etu on rakenteen selkeys käsittelyn näkökulmasta 57

35 3.15 Rakenteiden merkitsemistapoja ja termejä (2/3) Deklaratiivinen tai kuvaileva merkkaus ~ abstrakti kuvaus elementin roolista tai merkityksestä dokumentissa (siis juuri XHTML:n idea) <blockquote>think twice before walking on ice</blockquote> <!-- (1) --> Proseduraalinen tai spesifi merkkaus ~ tarkat ohjeet elementtien käsittelemiseksi tietyssä yksittäisessä sovelluksessa (tyypillinen juuri formatoinnissa) <i><font face="arial" size="12"> Think twice before walking on ice</font></i> <!-- (2) --> Erittäin hyviä huomioita: - dokumentin (1) perusteella on paljon helpompi mekaanisesti tuottaa dokumentti (2) kuin päinvastoin -...ts. "abstrakti" (1) tavoittaa tekstinpätkän merkityksen jotenkin "osuvammin ja niukemmin" kuin "konkreettinen" tai "sovelluskohtainen" (2) - tapa (2) on huono myös koska muukin kuin blockquote-tyyppinen tieto formatoidaan kenties i- ja font-elementein (..."tietoa hukkuu vahingossa") 58

36 3.16 Rakenteiden merkitsemistapoja ja termejä (2/3) Kontekstivapaa merkkaus ~ naapurielementit eivät vaikuta tulkintaan (löyhästi ymmärrettynä) <b>fat</b> <i>and</i> <i><b>lean</b></i> Kontekstuaalinen merkkaus ~ elementtien tulkinnalla on jokin tietty rakenteesta riippuva konteksti <ul> <li>yksi</li> <li>kaksi</li> <li>kolme</li> </ul> Kontekstivapaan merkkauksen verraton etu on tulkinnan helppous sekä mahdollisuus paloitella dokumentti melko vapaasti Kontekstuaalisen merkkauksen edut liittyvät lähinnä mallintamiseen (esim. attribuuttitieto voi periytyä elementin jälkeläisille, mikä vähentää esim. merkkaustyötä) 59

37 3.17 Pari sanaa CSS-tyylikielestä Kuten tunnettua Cascading Stylesheets (CSS) on tyylikieli esim. XHTMLsivujen ulkoasun määrittämiseen. Se määrittelee mm. - (formatointimallin, mediaryhmiä,...) - formatointiominaisuuksia sekä kieliopin tyylisääntöjen esittämiseen. Vaikka CSS on verraten rajoittunut tyylikieli, jo CSS-säännöt havainnollistavat XHTML-dokumentin loogisen rakenteen merkitystä konkreettisesti, vrt. seuraavien sääntöjen tulkinta: body { color: red; } p img.diagram { border: 1px solid black; } 60

38 3.18 CSS2-valitsimet pähkinänkuoressa Tässä vaiheessa on hyvä miettiä lähinnä sitä, minkälaisiin loogisiin rakenteisiin ao. valitsimet pystyvät viittaamaan X(HT)ML-dokumenteissa... (tietorakenteisiin viittaaminen on tiedonkäsittelyn perusta) * Matches any element. Universal selector E Matches any E element (i.e., an element of type E). Type selectors E F Matches any F element that is a descendant of an E element. Descendant selectors E > F Matches any F element that is a child of an element E. Child selectors E:first-child Matches element E when E is the first child of its parent. The :first-child pseudo-class E:link E:visited Matches element E if E is the source anchor of a hyperlink of which the target is not yet visited (:link) or already visited (:visited). The link pseudo-classes 61

39 E:active ja E:hover ja E:focus Matches E during certain user actions. The dynamic pseudo-classes E:lang(c) Matches element of type E if it is in (human) language c (the document language specifies how language is determined). The :lang() pseudo-class E + F Matches any F element immediately preceded by an element E. Adjacent selectors E[foo] Matches any E element with the "foo" attribute set (whatever the value). Attribute selectors E[foo="warning"] Matches any E element whose "foo" attribute value is exactly equal to "warning". Attribute selectors E[foo~="warning"] Matches any E element whose "foo" attribute value is a list of space-separated values, one of which is exactly equal to "warning". Attribute selectors E[lang ="en"] Matches any E element whose "lang" attribute has a hyphen-separated list of values beginning (from the left) with "en". Attribute selectors DIV.warning HTML only. The same as DIV[class~="warning"]. Class selectors E#myid Matches any E element ID equal to "myid". ID selectors 62

40 3.19 Huomautuksia Kuten esimerkeistä kävi ilmi (?), XHTMLdokumenttien tekninen merkkaus on verraten yksinkertaista Haasteita syntyy lähinnä - "mallintamisesta", ts. nyt kyvystä kuvailla valittu tietosisältö XHTML-dok. tyypin mukaan niin rikkaasti kuin tarpeen (erit. elementit div, span ja class-attribuuttien käyttö?) - sovelluksista, esim. tyylien kirjoittamisesta (esim. CSS2-säännöt ovat monimutkaisempia kuin itse elementtirakenteet [esim. "seuraava sisar"]) Ts. haaste ei ole se miten merkataan, vaan mitä merkataan ja miksi Huom. dokumenttien validointikaan ei tietenkään takaa että tieto on asiasisällöllisesti virheetöntä merkkauksen sisällölliset virheet tietenkin kaivavat maata rakenteisten dokumenttien alta (kun ei tulkintaa!) 63

41 3.20 Hei, minun nimeni on Ossi. Olen tagien väärinkäyttäjä SGML-maailma tuntee leikkimielisen termin TAS: Tag Abuse Syndrome (~tagien väärinkäyttösyndrooma). "Väärinkäytön" ominaisia piirteitä ovat: 1) elementin valinta sen ulkoasun perusteella sovelluksessa (esimerkki: merkataan h3 kun tarkoitetaan "korostettua tekstiä") 2) jätetään käyttämättä spesifejä elementtejä kun niitä olisi saatavilla (esimerkki: kirjoitetaan kaikki aineisto p-elementteihin vaikka olisi käytössä myös elementit dfn, kbd, ja code) 3) käytetään sekaisin eri merkkausta saman asian esittämiseen (esimerkki: käytetään toisinaan elementtiä blockquote ja toisinaan em) 4) valitaan merkkaus väärin ymmärtämättä sen merkitystä (esimerkki: merkataan dfn kun "tarkoitettiin" var) Tunnistitko omasi? Pulmat ovat yleensä seurasta merkkauksen monimutkaisuudesta, vähäisestä koulutuksesta tai välinpitämättömyydestä 64

42 3.21 Lopuksi Myös XHTML-osaamista tarvitaan käytännössä tälläkin kurssilla...mutta osana tuotantoprosessia! Useissa sovelluksissa XHTML on julkaisuformaatti (tulosdokumentteja) joka tuotetaan ohjelmallisesti esim. muunnostyyleillä sovelluksen tietomallin perusteella, ei suoraan nodepadilla kirjoittamalla (!!) Ei-triviaalien Web-palvelujen koodaaminen XHTML-käsityönä on useimmissa tapauksissa lyhytnäköistä (turhaa käsityötä, virhealtista, tulos on heikosti hallittavissa, jne.) 65

2.17 Esimerkki järkevän relaatiotietokannan rakenteesta

2.17 Esimerkki järkevän relaatiotietokannan rakenteesta Rakenteisten dokumenttien perusteet 2.17 Esimerkki järkevän relaatiotietokannan rakenteesta Peruskäsitteitä: taulu/relaatio, monikko/tietue, mallinnus ja normalisointi, kytkös vs. redundanssi, anomaliat

Lisätiedot

2 Rakenteisten dokumenttien perusteet

2 Rakenteisten dokumenttien perusteet 2 Rakenteisten dokumenttien perusteet Kuten todettua, rakenteinen dokumentaatio tähtää tiedon mallintamiseen käytössä olevien välineiden mahdollisuudet huomioiden (tietokoneet!). Tavoitteet ovat yleensä

Lisätiedot

Tutkitaan sitten HTML-dokumenttien anatomiaa, jotta päästään käsiksi rakenteisten dokumenttien käsitteistöön esimerkkien kautta.

Tutkitaan sitten HTML-dokumenttien anatomiaa, jotta päästään käsiksi rakenteisten dokumenttien käsitteistöön esimerkkien kautta. 3 HTML ja XHTML Tutkitaan sitten HTML-dokumenttien anatomiaa, jotta päästään käsiksi rakenteisten dokumenttien käsitteistöön esimerkkien kautta.

Lisätiedot

Johdatus rakenteisiin dokumentteihin

Johdatus rakenteisiin dokumentteihin -RKGDWXVUDNHQWHLVLLQGRNXPHQWWHLKLQ 5DNHQWHLQHQGRNXPHQWWL= rakenteellinen dokumentti dokumentti, jossa erotetaan toisistaan dokumentin 1)VLVlOW, 2) UDNHQQHja 3) XONRDVX(tai esitystapa) jotakin systemaattista

Lisätiedot

3 XHTML-dokumenttien anatomia

3 XHTML-dokumenttien anatomia 3 XHTML-dokumenttien anatomia XHTML tarjoaa tutun esimerkin rakenteisten dokumenttien opiskelun alkutaipaleelle. Erityisesti, koska XHTML on eräs XML-sovellus: - havainnollistaa se tiedon teknistä merkkausta

Lisätiedot

3 Verkkosaavutettavuuden tekniset perusteet

3 Verkkosaavutettavuuden tekniset perusteet 3 Verkkosaavutettavuuden tekniset perusteet Saavutettavuuden toteuttaminen edellyttää lähtökohtaisesti tietoa laitteista ja sovelluksista, käyttäjistä ja käyttötavoista, sekä tekniikasta. Tekniikasta on

Lisätiedot

Rakenteiset dokumentit, kevät 2006

Rakenteiset dokumentit, kevät 2006 Johdanto Rakenteiset dokumentit, kevät 2006 MATHM-47150 Rakenteiset dokumentit, 6 op, kevään 4-5 periodeilla Kotisivu: Luennot: Harjoitukset: Suoritustapa: http://matriisi.ee.tut.fi/hmopetus/rd/index.html

Lisätiedot

Proseduraalinen dokumentti: sisältö, rakenne ja ulkoasu yhdessä, esim. worddokumentti

Proseduraalinen dokumentti: sisältö, rakenne ja ulkoasu yhdessä, esim. worddokumentti 1 XHTML - aloitus Sisältö: s.2 Taustaa s.4 Elementin rakenne s.7 XHTML dokumentti s.8 DOCTYPE s.11 html s.13 head s.14 meta s.16 title s.17 link s.18 style s.19 body s.22 Lohko- ja inline-elementit s.23

Lisätiedot

XHTML - harjoitus. Tehtävä1: Tee xhtml tiedosto käyttäen notepad (muistio) ohjelmaa. Tiedoston tallennus notepad (muistio) ohjelmassa:

XHTML - harjoitus. Tehtävä1: Tee xhtml tiedosto käyttäen notepad (muistio) ohjelmaa. Tiedoston tallennus notepad (muistio) ohjelmassa: XHTML - harjoitus Tehtävä1: Tee xhtml tiedosto käyttäen notepad (muistio) ohjelmaa Tiedoston tallennus notepad (muistio) ohjelmassa: Jokaisen XHTML-dokumentin tulisi alkaa XML-määrittelyllä(engl.XML-prologue),

Lisätiedot

HTML & CSS. HTML (HyperText Markup Language) Antti Koivisto. ! HTML on sivujen kuvauskieli.

HTML & CSS. HTML (HyperText Markup Language) Antti Koivisto. ! HTML on sivujen kuvauskieli. HTML & CSS Antti Koivisto HTML (HyperText Markup Language)! HTML on sivujen kuvauskieli.! Se ei ole ohjelmointikieli.! HTML on merkintäkieli, joka koostuu monista merkintä tägeistä ().! Voidaan

Lisätiedot

WWW-ohjelmoinnin kokonaisuus. WWW-OHJELMOINTI 1 Merkkauskielet. Merkkauskielten idea. Merkkauskielet (markup languages) Merkkauskielten merkitys

WWW-ohjelmoinnin kokonaisuus. WWW-OHJELMOINTI 1 Merkkauskielet. Merkkauskielten idea. Merkkauskielet (markup languages) Merkkauskielten merkitys WWW-OHJELMOINTI 1 WWW-ohjelmoinnin kokonaisuus SGML, XML, HTML WWW-selaimen sovellusohjelmointi WWW-palvelimen sovellusohjelmointi Eero Hyvönen Tietojenkäsittelytieteen laitos Helsingin yliopisto 26.10.2000

Lisätiedot

Sisältö. XML, XHTML ja CSS XML XML. XML:n ja HTML:n ero. XML kieliä XML XHTML CSS XSL. T Hypermediadokumentin laatiminen 2002

Sisältö. XML, XHTML ja CSS XML XML. XML:n ja HTML:n ero. XML kieliä XML XHTML CSS XSL. T Hypermediadokumentin laatiminen 2002 , XHTML ja CSS T-111.361 Hypermediadokumentin laatiminen 2002 XHTML CSS XSL Sisältö EXtensible Markup Language W3C Recommendation helmikuu 1998 SGML:n osajoukko Standard Generalized Markup Language Kevyempi

Lisätiedot

XML johdanto, uusimmat standardit ja kehitys

XML johdanto, uusimmat standardit ja kehitys johdanto, uusimmat standardit ja kehitys Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: on W3C:n suosittama

Lisätiedot

H T M L eli kuinka laadin itselleni päheät kotisivut. Janne Käki 13.9.2006

H T M L eli kuinka laadin itselleni päheät kotisivut. Janne Käki 13.9.2006 H T M L eli kuinka laadin itselleni päheät kotisivut Janne Käki 13.9.2006 Mikä ihmeen HTML? HyperText Markup Language hypertekstiä eli toisiinsa linkitettyjä dokumentteja merkintäkieli, perustuu erilaisiin

Lisätiedot

Vaasan yliopiston toimintaa tukevat informaatiopalvelut ovat käytettävissä WWW:n kautta.

Vaasan yliopiston toimintaa tukevat informaatiopalvelut ovat käytettävissä WWW:n kautta. 1. Julkaisutoiminnan peruskysymyksiä a) Mieti kohderyhmät b) Mieti palvelut c) Mieti palvelujen toteutus Vaasan yliopiston toimintaa tukevat informaatiopalvelut ovat käytettävissä WWW:n kautta. PALVELUKOKONAISUUDET:

Lisätiedot

W3C-teknologiat ja yhteensopivuus

W3C-teknologiat ja yhteensopivuus W3C-teknologiat ja yhteensopivuus Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), Hypermedialaboratorio W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: W3C asettaa

Lisätiedot

Verkkosivut perinteisesti. Tanja Välisalo 11.2.2009

Verkkosivut perinteisesti. Tanja Välisalo 11.2.2009 Verkkosivut perinteisesti Tanja Välisalo 11.2.2009 WWW-sivujen vieminen omaan kotisivutilaan yliopiston mikroverkossa https://salasana.jyu.fi Klikkaa painiketta Activate WWW Klikkaa painiketta Activate

Lisätiedot

3 WWW-hypermedian perusta: HTML

3 WWW-hypermedian perusta: HTML 3 WWW-hypermedian perusta: HTML Hypertext Markup Language HTML (Hypertext Markup Language) on tapa koodata (merkata) rakenteisia (teksti)dokumentteja WWW:ssä Esimerkki: Tästä kaikki alkaa

Lisätiedot

XML, XHTML ja CSS. T-111.361 Hypermediadokumentin laatiminen. Mikko Pohja

XML, XHTML ja CSS. T-111.361 Hypermediadokumentin laatiminen. Mikko Pohja XML, XHTML ja CSS T-111.361 Hypermediadokumentin laatiminen Mikko Pohja Sisältö XML Yleensä Eri kieliä XHTML CSS XSL XML EXtensible Markup Language W3C Recommendation helmikuu 1998 SGML:n osajoukko Standard

Lisätiedot

10 Tiedostot, dokumentit, tieto (&h-media)

10 Tiedostot, dokumentit, tieto (&h-media) 10 Tiedostot, dokumentit, tieto (&h-media) Tietokoneet käsittelevät tietoa tiedostojen muodossa Tietokoneiden yhteydessä dokumentilla tarkoitetaan tiedosto(je)n avulla esitettävää asiakokonaisuutta, joka

Lisätiedot

H T M L eli kuinka laadin itselleni päheät kotisivut. Janne Käki

H T M L eli kuinka laadin itselleni päheät kotisivut. Janne Käki H T M L eli kuinka laadin itselleni päheät kotisivut Janne Käki 13.9.2006 Mikä ihmeen HTML? HyperText Markup Language hypertekstiä eli toisiinsa linkitettyjä dokumentteja merkintäkieli, perustuu erilaisiin

Lisätiedot

XML prosessori. XML prosessointi. XML:n kirjoittaminen. Validoiva jäsennin. Tapahtumaohjattu käsittely. Tapahtumaohjattu käsittely.

XML prosessori. XML prosessointi. XML:n kirjoittaminen. Validoiva jäsennin. Tapahtumaohjattu käsittely. Tapahtumaohjattu käsittely. XML prosessointi Miten XML dokumentteja luetaan ja kirjoitetaan XML prosessori lukee ja välittää XML dokumentin sovellukselle. Se sisältää entieettikäsittelijän (mahdollisesti) XML jäsentimen Sovellus

Lisätiedot

W3C & verkkojulkaisun standardit

W3C & verkkojulkaisun standardit W3C & verkkojulkaisun standardit Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: World Wide Web Consortium (W3C)

Lisätiedot

3 Verkkosaavutettavuuden tekniset perusteet

3 Verkkosaavutettavuuden tekniset perusteet 3 Verkkosaavutettavuuden tekniset perusteet Saavutettavuuden toteuttaminen edellyttää lähtökohtaisesti tietoa laitteista ja sovelluksista, käyttäjistä ja käyttötavoista, sekä tekniikasta. Tavoitteenamme

Lisätiedot

Code Camp for Girls. Sanna Nygård. Lokakuussa 2015 www.frantic.com/codecamp/

Code Camp for Girls. Sanna Nygård. Lokakuussa 2015 www.frantic.com/codecamp/ Code Camp for Girls Sanna Nygård Lokakuussa 2015 www.frantic.com/codecamp/ HTML? HTML? HyperText Markup Language Ei ole nettisivua ilman HTML:ää Rakenteinen, hierarkkinen dokumentti Vain rakenne ja sisältö,

Lisätiedot

Tiedon esitys tietokoneessa. Jyry Suvilehto T-110.1100 Johdatus tietoliikenteeseen ja multimediatekniikkaan kevät 2010

Tiedon esitys tietokoneessa. Jyry Suvilehto T-110.1100 Johdatus tietoliikenteeseen ja multimediatekniikkaan kevät 2010 Tiedon esitys tietokoneessa Jyry Suvilehto T-110.1100 Johdatus tietoliikenteeseen ja multimediatekniikkaan kevät 2010 Luennon sisältö 1. Kurssin loppupuolen rakenne 2. Tiedon binääriluonne AD-muunnos 3.

Lisätiedot

4. Lausekielinen ohjelmointi 4.1

4. Lausekielinen ohjelmointi 4.1 4. Lausekielinen ohjelmointi 4.1 Sisällys Konekieli, symbolinen konekieli ja lausekieli. Lausekielestä konekieleksi: - Lähdekoodi, tekstitiedosto ja tekstieditorit. - Kääntäminen ja tulkinta. - Kääntäminen,

Lisätiedot

2. PEHMEÄ XHTML XRAJAHTML

2. PEHMEÄ XHTML XRAJAHTML Luennot 1. Intro 2. PEHMEÄ XHTML XRAJAHTML Dokumentin (matalan tason) rakenne DOCTYPE ja merkistökoodaukset Elementtien syvät rajat 3. CSS 4. JavaScript 5. JavaScript-kirjastot & AJAX 6. Käytettävyys &

Lisätiedot

Tutkija Mikko Salmenperä. huone: sd109. TTY / Systeemitekniikan laitos. puh: 040-849 0061. email: mikko.salmenpera@tut.fi

Tutkija Mikko Salmenperä. huone: sd109. TTY / Systeemitekniikan laitos. puh: 040-849 0061. email: mikko.salmenpera@tut.fi Tutkija Mikko Salmenperä huone: sd109 TTY / Systeemitekniikan laitos puh: 040-849 0061 email: mikko.salmenpera@tut.fi Luennon sisällys Historiaa ja pohjatietoa Miksi XML tekniikkaa tarvitaan? XML dokumentin

Lisätiedot

Luento 12: XML ja metatieto

Luento 12: XML ja metatieto Luento 12: XML ja metatieto AS-0.110 XML-kuvauskielten perusteet Janne Kalliola XML ja metatieto Metatieto rakenne sanasto Resource Description Framework graafikuvaus XML Semanttinen Web agentit 2 1 Metatieto

Lisätiedot

XHTML aloitus. Sisällys

XHTML aloitus. Sisällys XHTML aloitus XHTML-dokumentin rakenne, metatieto, kommentit, tekstit Mirja Jaakkola Sisällys 3. Taustaa 4. Selain palvelin 5. Elementin rakenne 6. Attribuutti 7. XHTML-dokumentin rakenne 8. XHTML:n DOCTYPE-määrittely

Lisätiedot

TIEDEJUTTUKURSSI 29.9.2011 FM VILLE SALMINEN

TIEDEJUTTUKURSSI 29.9.2011 FM VILLE SALMINEN TIEDEJUTTUKURSSI 29.9.2011 FM VILLE SALMINEN YLEISTÄ LUENNOT (8 H) & TYÖPAJA (2 H) YHTEYSTIEDOT ville.salminen@oulu.fi VÄLINEET Tekstieditori Mieluummin Windowsin Notepad kuin esimerkiksi Microsoft Word

Lisätiedot

Semanttinen Web. Ossi Nykänen Tampereen teknillinen yliopisto (TTY), DMI / Hypermedialaboratorio W3C Suomen toimisto

Semanttinen Web. Ossi Nykänen Tampereen teknillinen yliopisto (TTY), DMI / Hypermedialaboratorio W3C Suomen toimisto Semanttinen Web Ossi Nykänen ossi.nykanen@tut.fi Tampereen teknillinen yliopisto (TTY), DMI / Hypermedialaboratorio W3C Suomen toimisto Esitelmä "Semanttinen Web" Sisältö Konteksti: W3C, Web-teknologiat

Lisätiedot

XML johdatus: DTD. Jaana Holvikivi

XML johdatus: DTD. Jaana Holvikivi XML johdatus: DTD Jaana Holvikivi Dokumenttityypin rakennemäärittely DTD = kielioppi esim. XML- esitykselle Elementit Attribuutit Entiteetit ja notaatiot Prosessointikomennot DTD:n suunnittelu 19.1.2013

Lisätiedot

13 Tiedostot, dokumentit, tieto (&h-media)

13 Tiedostot, dokumentit, tieto (&h-media) 13 Tiedostot, dokumentit, tieto (&h-media) Esimerkki: HTML-dokumentti Tietokoneet käsittelevät tietoa tiedostojen muodossa Tietokoneiden yhteydessä dokumentilla tarkoitetaan tiedosto(je)n avulla esitettävää

Lisätiedot

6 DTD ja dokumentin tyyppimääritys

6 DTD ja dokumentin tyyppimääritys 6 DTD ja dokumentin tyyppimääritys Tietojenkäsittelyssä päähuomio ei yleensä ole tiedon matalan tason formaatissa vaan sovelluksissa joissa tietoa käytetään loogisesti jäsennettynä. XML-merkkaus tarjoaa

Lisätiedot

www.hohde.com Hohde Consulting 2004

www.hohde.com Hohde Consulting 2004 Luento 14: Kertaus AS-0.110 XML-kuvauskielten perusteet Janne Kalliola Kertaus XML nimiavaruus validointi XML:n käyttö tietorakenteiden kuvaus ohjelmointi XML-pohjaiset kielet peruskielet muut kurssilla

Lisätiedot

Tiedonlouhinta rakenteisista dokumenteista (seminaarityö)

Tiedonlouhinta rakenteisista dokumenteista (seminaarityö) Tiedonlouhinta rakenteisista dokumenteista (seminaarityö) Miika Nurminen (minurmin@jyu.fi) Jyväskylän yliopisto Tietotekniikan laitos Kalvot ja seminaarityö verkossa: http://users.jyu.fi/~minurmin/gradusem/

Lisätiedot

Rakenteisen oppimateriaalin tuottaminen verkossa esimerkki Rhaptos. Antti Auer Koordinaattori, HT Jyväskylän yliopisto Virtuaaliyliopistohanke

Rakenteisen oppimateriaalin tuottaminen verkossa esimerkki Rhaptos. Antti Auer Koordinaattori, HT Jyväskylän yliopisto Virtuaaliyliopistohanke Rakenteisen oppimateriaalin tuottaminen verkossa esimerkki Rhaptos Antti Auer Koordinaattori, HT Jyväskylän yliopisto Virtuaaliyliopistohanke Rakenteisuus kahdella tasolla Oppimisaihiot ( Learning Objects

Lisätiedot

Tyylien käyttö. <LINK href="mystyle.css" rel="stylesheet" type="text/css"> 5 WWW-hypermedian perusta: HTML

Tyylien käyttö. <LINK href=mystyle.css rel=stylesheet type=text/css> 5 WWW-hypermedian perusta: HTML Tyylien käyttö Tyylien (style) ideana on HTML:n tapauksessa erottaa toisistaan dokumentin rakenne ja ulkoasu Tavoitteena on, että dokumentin loogisen rakenteen ja ulkoasun koodaus erotetaan toisistaan

Lisätiedot

W3C, Web-teknologiat ja XML

W3C, Web-teknologiat ja XML W3C, Web-teknologiat ja XML Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), Hypermedialaboratorio W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: XML on W3C:n

Lisätiedot

Avoimet standardit ja asiakirjamuodot Suomen julkisessa hallinnossa: teoriasta käytäntöön

Avoimet standardit ja asiakirjamuodot Suomen julkisessa hallinnossa: teoriasta käytäntöön Avoimet standardit ja asiakirjamuodot Suomen julkisessa hallinnossa: teoriasta käytäntöön Airi Salminen Jyväskylän yliopisto http://www.cs.jyu.fi/~airi/ Julkisen alan OS-seminaari 6.4.2006 Airi Salminen,

Lisätiedot

Paikkatiedot ja Web-standardit

Paikkatiedot ja Web-standardit Paikkatiedot ja Web-standardit Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), Hypermedialaboratorio W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: World Wide

Lisätiedot

Digitaalisen median tekniikat. Luento 3: CSS

Digitaalisen median tekniikat. Luento 3: CSS Digitaalisen median tekniikat Luento 3: CSS Luennot 1. Intro 2. XHTML 3. CSS Box Model Selektorit Esimerkkiä yms. 4. JavaScript 5. JavaScript-kirjastot & AJAX 6. Käytettävyys & saavutettavuus 7. Palvelinohjelmointi

Lisätiedot

Entiteetit erotetaan muusta tekstistä & ja puolipiste. esim. copyright-merkki näkyy sivulla

Entiteetit erotetaan muusta tekstistä & ja puolipiste. esim. copyright-merkki näkyy sivulla 1 ENTITEETIT Tehtävä 1. Tietokoneet ja käyttöjärjestelmät käyttävät erilaisia merkkijärjestelmiä ja varsinkin Internetin alkutaipaleella aiheutti sen, että jotkut merkit eivät näkyneet kaikilla oikein.

Lisätiedot

XML-pohjaiset rakennemäärittelyt

XML-pohjaiset rakennemäärittelyt -pohjaiset rakennemäärittelyt Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: -perustainen kommunikointi edellyttää

Lisätiedot

HTML ja CSS. Tästä se lähtee: portfolio-sivusto. Sivuston pääkansio, jonka sisällä on kaikki sivustoon kuuluvat alikansiot ja tiedostot.

HTML ja CSS. Tästä se lähtee: portfolio-sivusto. Sivuston pääkansio, jonka sisällä on kaikki sivustoon kuuluvat alikansiot ja tiedostot. HTML ja CSS Tästä se lähtee: portfolio-sivusto Sivuston pääkansio, jonka sisällä on kaikki sivustoon kuuluvat alikansiot ja tiedostot. index.html Sivuston pääsivu, joka avautuu selaimeen ensimmäisenä sivujen

Lisätiedot

HTML5 & CSS3 perusteet

HTML5 & CSS3 perusteet Verkkokurssin tuotantoprosessi kurssin harjoitustyönä suunniteltu toteutettavissa oleva verkkokurssi. HTML5 & CSS3 perusteet Sisältö: 1. Ideointi 2. Tausta-analyysi 3. Sisällön suunnittelu 4. Pedagoginen

Lisätiedot

Digitaalisen median tekniikat. JSP ja XML Harri Laine 1

Digitaalisen median tekniikat. JSP ja XML Harri Laine 1 Digitaalisen median tekniikat JSP ja XML 28.4.2004 Harri Laine 1 JSP hyvin lyhyesti JSP on Java-pohjainen skriptikieli JSP:llä laadittu sivu käännetään java-servletiksi (sivun toteutus vastaa servlettiluokan

Lisätiedot

P e d a c o d e ohjelmointikoulutus verkossa

P e d a c o d e ohjelmointikoulutus verkossa P e d a c o d e ohjelmointikoulutus verkossa XML-kielen perusteet Teoria ja ohjelmointitehtävät XML-kielen perusteet 3 Sisältö YLEISKATSAUS KURSSIN SISÄLTÖIHIN... 7 YLEISKATSAUS KURSSIN SISÄLTÖIHIN...

Lisätiedot

CSS - tyylit. 13.11.2000 Seppo Räsänen

CSS - tyylit. 13.11.2000 Seppo Räsänen CSS - tyylit 13.11.2000 Seppo Räsänen Sivu 2 1 CSS-tyylit Dynaaminen HTML tai DHTML on standardi, joiden käyttöä tukevat uusimmat Netscapen ja Microsoftin selaimet. DHTML:n ominaisuuksia ovat tyylitiedostot

Lisätiedot

XML - perusteet. Ctl230: Luentokalvot Miro Lehtonen

XML - perusteet. Ctl230: Luentokalvot Miro Lehtonen XML - perusteet Ctl230: Luentokalvot 4.10.2004 Miro Lehtonen Johdanto Mikä on merkkauskieli? 3Merkkaus (markup): lisätieto dokumentissa Erilaiset kirjasintyylit ja -koot 3Säännöt merkkaukselle Miten merkataan?

Lisätiedot

Rakenteisten dokumenttien jatkokurssi, syksy 2006

Rakenteisten dokumenttien jatkokurssi, syksy 2006 Rakenteisten dokumenttien jatkokurssi, syksy 2006 MATHM-57200 Rakenteisten dokumenttien jatkokurssi, 5 op opetetaan syksyn 1-2 periodeilla Kotisivu: http://matriisi.ee.tut.fi/hmopetus/rdj/index.html Luennot:

Lisätiedot

9.16 XSLT ja nimiavaruudet (1/3): literaali oletusnimiavaruus

9.16 XSLT ja nimiavaruudet (1/3): literaali oletusnimiavaruus 9.16 XSLT ja nimiavaruudet (1/3): literaali oletusnimiavaruus XSL-muunnos voi tietenkin tuottaa myös tiettyyn nimiavaruuteen liittyviä kohdedokumentteja (tarvitaan aina jo esim. XHTML-sovelluksissa!) Helpoimmillaan

Lisätiedot

XML / DTD / FOP -opas Internal

XML / DTD / FOP -opas Internal XML / DTD / FOP -opas Internal Reviewed: - Status: pending approval Approved by: - Author: Sakari Lampinen Revision: 1.0 Date: 15.10.2000 1 Termit DTD (data type definition) on määrittely kielelle, niinkuin

Lisätiedot

XML kielioppi. Elementtien ja attribuuttien määrittely. Ctl230: Luentokalvot Miro Lehtonen

XML kielioppi. Elementtien ja attribuuttien määrittely. Ctl230: Luentokalvot Miro Lehtonen XML kielioppi Elementtien ja attribuuttien määrittely Ctl230: Luentokalvot 11.10.2004 Miro Lehtonen Dokumenttien mallinnus Säännöt dokumenttityypeille 3Mahdollisten dokumenttirakenteiden määrittely Samassa

Lisätiedot

8 XSLT-muunnoskieli XSLT-muunnoskieli

8 XSLT-muunnoskieli XSLT-muunnoskieli 8 XSLT-muunnoskieli 51 8 XSLT-muunnoskieli XML-dokumentti kuvaa siis vain tiedon sisältöä eikä määritä ulkoasua mitenkään. CSS on suunniteltu HTML-dokumenttien ulkoasun kuvaamiseen eli tiedon esittämiseen

Lisätiedot

Semanttinen Web. Ossi Nykänen. Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), Hypermedialaboratorio W3C Suomen toimisto

Semanttinen Web. Ossi Nykänen. Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), Hypermedialaboratorio W3C Suomen toimisto Semanttinen Web Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), Hypermedialaboratorio W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: Semanttinen Web (SW) on

Lisätiedot

Digitaalisen median tekniikat Harri Laine 1

Digitaalisen median tekniikat Harri Laine 1 Digitaalisen median tekniikat 30.4.2004 Harri Laine 1 Kurssin sisällöstä Digitaalinen media on laaja käsite pitäen sisällään erilaisia digitaalisessa muodossa olevia dokumentteja ja niiden käsittelyä tekstiä

Lisätiedot

http://www.microsoft.com/expression/

http://www.microsoft.com/expression/ Verkkojulkaisuharjoitus1 TAVOITE Harjoituksen tarkoituksena on opiskella käyttämään verkkojulkaisueditoria (Microsoft Expression Web) ja käynnistämään verkkosivu internetissä. VERKKOSIVUEDITORIN KÄYTTÖOHJEITA

Lisätiedot

6 XML-työkalut 1. 6 XML-työkalut

6 XML-työkalut 1. 6 XML-työkalut 6 XML-työkalut 1 6 XML-työkalut XML:n periaatteiden tutustumisen jälkeen on helpompi tutustua XML-dokumenttien käsittelyyn ja katseluun suunniteltuja työkaiuja. XML:n yleistymisen pahin pullonkaula on

Lisätiedot

6 DTD ja dokumentin tyyppimääritys

6 DTD ja dokumentin tyyppimääritys 6 DTD ja dokumentin tyyppimääritys Tietojenkäsittelyssä päähuomio ei yleensä ole tiedon matalan tason formaatissa vaan sovelluksissa joissa tietoa käytetään loogisesti jäsennettynä. XML-merkkaus tarjoaa

Lisätiedot

Ajatus kaiken taustalla

Ajatus kaiken taustalla HTML ja tyylit Ajatus kaiken taustalla Perimmäisenä tarkoituksena tarjota formatointi- ja taittokieli, jonka avulla elementtirakenteisten dokumenttien ulkoasun määrittely voidaan irrottaa sisällön ja rakenteen

Lisätiedot

3 Sivupolku: metaforat & selittäminen

3 Sivupolku: metaforat & selittäminen 3 Sivupolku: metaforat & selittäminen 3 Sivupolku: metaforat & selittäminen Ennen WWW:n sisältötuotannon perustekniikoiden esittelyä luonnehditaan lyhyesti metafora-käsitettä. Yhteys aiheeseen löytyy ajatuksesta,

Lisätiedot

Digitaalisen median tekniikat. JSP ja XML

Digitaalisen median tekniikat. JSP ja XML Digitaalisen median tekniikat JSP ja 28.4.2004 Harri Laine 1 JSP hyvin lyhyesti JSP on Java-pohjainen skriptikieli JSP:llä laadittu sivu käännetään java-servletiksi (sivun toteutus vastaa servlettiluokan

Lisätiedot

Ulkoasun muokkaus CSS-tiedostossa

Ulkoasun muokkaus CSS-tiedostossa Ulkoasun muokkaus CSS-tiedostossa Nellin ulkoasun muokkaus CSS-tiedostossa Lähes kaikki on muokattavissa css-tyylitiedosta käsin. Jokaiselle kieliversiolle on oma tyylitiedostonsa: www_v_fin/metalib.css

Lisätiedot

Rakenteiset dokumentit Mitä hyötyä niistä on?

Rakenteiset dokumentit Mitä hyötyä niistä on? Rakenteiset dokumentit Mitä hyötyä niistä on? AIPA-hankeseminaari Helsinki 28.1.2011 Airi Salminen Jyväskylän yliopisto http://users.jyu.fi/~airi/ Airi Salminen, Rakenteiset dokumentit. Mitä hyötyä? 28-01-2011

Lisätiedot

XML - mahdollisuudet ja kehitys

XML - mahdollisuudet ja kehitys XML - mahdollisuudet ja kehitys Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: W3C on kansainvälinen konsortio

Lisätiedot

Ohjelmointikielet ja -paradigmat 5op. Markus Norrena

Ohjelmointikielet ja -paradigmat 5op. Markus Norrena Ohjelmointikielet ja -paradigmat 5op Markus Norrena Ko#tehtävä 4 Viimeistele "alkeellinen kuvagalleria". Käytännössä kaksi sivua Yksi jolla voi ladata kuvia palvelimelle (file upload) Toinen jolla ladattuja

Lisätiedot

Alkuun HTML5 peliohjelmoinnissa

Alkuun HTML5 peliohjelmoinnissa Paavo Räisänen Alkuun HTML5 peliohjelmoinnissa www.ohjelmoimaan.net Tätä opasta saa vapaasti kopioida ja levittää ei kaupallisissa tarkoituksissa. Sisällysluettelo 1: Alkusanat 2: Alkuun 3: Pelinäkymä

Lisätiedot

JWT 2016 luento 11. to 21.4.2016 klo 14-15. Aulikki Hyrskykari. PinniB 1097. Aulikki Hyrskykari

JWT 2016 luento 11. to 21.4.2016 klo 14-15. Aulikki Hyrskykari. PinniB 1097. Aulikki Hyrskykari JWT 2016 luento 11 to 21.4.2016 klo 14-15 Aulikki Hyrskykari PinniB 1097 1 Viime luennolla o AJAX ja JSON, harjoitustyön tehtävänanto, vierailuluento avoimesta datasta Tänään o APIt rajapinnoista yleisesti

Lisätiedot

HTML-ohjeet. Sivun perusrakenne <HTML> <HEAD> <STYLE TYPE="text/css"> ...tänne tulee CSS-koodi eli sivun ulkonäkö määritykset...

HTML-ohjeet. Sivun perusrakenne <HTML> <HEAD> <STYLE TYPE=text/css> ...tänne tulee CSS-koodi eli sivun ulkonäkö määritykset... HTML-ohjeet Sivun perusrakenne ...tänne tulee CSS-koodi eli sivun ulkonäkö määritykset... ...tänne tulee javascript-koodi...

Lisätiedot

Kuvat. 1. Selaimien tunnistamat kuvatyypit

Kuvat. 1. Selaimien tunnistamat kuvatyypit Kuvat Kuvia voi liittää xhtml-sivulle -elementillä -elementillä -elementillä lomakkeiden yhteydessä lähinnä painikenappeja taustakuvina -elementin background-attribuutilla tai

Lisätiedot

6 DTD ja dokumentin tyyppimääritys

6 DTD ja dokumentin tyyppimääritys 6 DTD ja dokumentin tyyppimääritys XML-merkkaus tarjoaa yhteensopivan ja yksinkertaisen perustan rakenteisten dokumenttien tms. rakenteisen tiedon käsittelyyn. Tietojenkäsittelyn sovelluksissa päähuomio

Lisätiedot

M. Merikanto 2012 XML. Merkkauskieli, osa 2

M. Merikanto 2012 XML. Merkkauskieli, osa 2 XML Merkkauskieli, osa 2 Esimerkki: XML-dokumentti resepti maitokaakao

Lisätiedot

12 Dokumenttiluokan toteuttamisesta

12 Dokumenttiluokan toteuttamisesta 12 Dokumenttiluokan toteuttamisesta Tyypillisiä XML-sovellutuksia ovat esimerkiksi: - annettuun käyttötarkoitukseen räätälöity dokumenttityyppi (esim. painotalon ABC malli käsikirjoituksen rakenteelle)

Lisätiedot

4 Johdanto XML-maailmaan

4 Johdanto XML-maailmaan 4 Johdanto XML-maailmaan Rakenteisia dokumentteja ei voi "ymmärtää" osamaatta niiden perustekniikkaa. Niinpä seuraavaksi kohdistamme huomion tekniikoihin. Rakenteisten dokumenttien yleisiin menetelmiin

Lisätiedot

Proseduraalinen dokumentti: sisältö, rakenne ja ulkoasu yhdessä, esim. worddokumentti

Proseduraalinen dokumentti: sisältö, rakenne ja ulkoasu yhdessä, esim. worddokumentti 1 XHTML - aloitus Sisältö: s.2 Taustaa s.4 Elementin rakenne s.7 XHTML dokumentti s.8 DOCTYPE s.11 html s.13 head s.14 meta s.16 title s.17 link s.18 style s.19 body s.22 Lohko- ja inline-elementit s.23

Lisätiedot

Digitaalisen median tekniikat css tyylimääritykset

Digitaalisen median tekniikat css tyylimääritykset Digitaalisen median tekniikat css tyylimääritykset 26.3.2004 Harri Laine 1 Sisällön ja ulkoasun erottaminen toisistaan tavoiteltavaa sama sisältö pitäisi voida esittää erilaisilla alustoilla esim. esittää

Lisätiedot

Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8.

Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8. Kylänetti projektin sivustojen käyttöohjeita Dokumentin versio 2.10 Historia : 1.0, 1.2, 1.6 Tero Liljamo / Deserthouse, päivitetty 25.8.2012 Hakemisto 1. Sivustot internetissä... 2 2. Yleistä... 2 3.

Lisätiedot

W3C ja Web-teknologiat

W3C ja Web-teknologiat W3C ja Web-teknologiat Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: World Wide Web Consortium (W3C) on kansainvälinen

Lisätiedot

Heikki Helin Metatiedot ja tiedostomuodot

Heikki Helin Metatiedot ja tiedostomuodot Heikki Helin 6.5.2013 Metatiedot ja tiedostomuodot KDK:n metatiedot ja tiedostomuodot KDK:n tekniset määritykset ja niiden väliset suhteet Aineistojen valmistelu ja paketointi on hyödyntäville organisaatioille

Lisätiedot

Eero Hyvönen. Semanttinen web. Linkitetyn avoimen datan käsikirja

Eero Hyvönen. Semanttinen web. Linkitetyn avoimen datan käsikirja Eero Hyvönen Semanttinen web Linkitetyn avoimen datan käsikirja WSOY:n kirjallisuussäätiö on tukenut teoksen kirjoittamista Copyright 2018 Eero Hyvönen & Gaudeamus Gaudeamus Oy www.gaudeamus.fi Kansi:

Lisätiedot

Dokumenttien tietosisällön hallinta

Dokumenttien tietosisällön hallinta Dokumenttien hallinta & Tietojohtaminen 3. rinnakkaisteema: Dokumenttien tietosisällön hallinta Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto

Lisätiedot

selector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård

selector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård selector { CSS property: value; property2: value; Code Camp for Girls 2015 - Sonja Jaakkola & Sanna Nygård CSS selectorit Elementti HTML CSS otsikko h1 { color: pink; Luokka HTML CSS

Lisätiedot

W3C ja alueellinen standardointi

W3C ja alueellinen standardointi W3C ja alueellinen standardointi Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: W3C on kansainvälinen konsortio

Lisätiedot

8 Hypermedian suunnitteleminen

8 Hypermedian suunnitteleminen 8 Hypermedian suunnitteleminen 8 Hypermedian suunnitteleminen Mietitään seuraavaksi hypermediaa teknisen suunnittelun näkökulmasta. Käytettävyyteen liittyvään suunnitteluun palataan myöhemmin kurssilla.

Lisätiedot

Sivupohja flat file julkaisujärjestelmälle. Kirjoittanut Jari Sarja (www.jarisarja.fi)

Sivupohja flat file julkaisujärjestelmälle. Kirjoittanut Jari Sarja (www.jarisarja.fi) 1 Sivupohja flat file julkaisujärjestelmälle Versio 1.1 /syyskuu 2011 Kirjoittanut Jari Sarja (www.jarisarja.fi) 2 Sisältö 1. Johdanto... 4 2. Ruudukkopohjainen taitto... 5 2.1. 960 Grid System... 5 2.2.

Lisätiedot

9 XML perusteet

9 XML perusteet 9 XML 1.0 - perusteet XML jakaa dokumenttien käsittelyn kaksitasoiseksi prosessiksi, jossa XMLprosessori ([processor]) lukee XML-tiedoston ja välittää tämän parsittuna sovellukselle ([application]). Käytännössä":

Lisätiedot

Ctl160 Tekstikorpusten tietojenkäsittely p.1/15

Ctl160 Tekstikorpusten tietojenkäsittely p.1/15 Ctl160 490160-0 Nicholas Volk Yleisen kielitieteen laitos, Helsingin yliopisto Ctl160 490160-0 p.1/15 Lisää säännöllisistä lausekkeista Aikaisemmin esityt * ja + yrittävät osua mahdollisimman pitkään merkkijonoon

Lisätiedot

Digitaalisen median tekniikat css tyylimääritykset Harri Laine 1

Digitaalisen median tekniikat css tyylimääritykset Harri Laine 1 Digitaalisen median tekniikat css tyylimääritykset 30.4.2004 Harri Laine 1 Sisällön ja ulkoasun erottaminen toisistaan tavoiteltavaa sama sisältö pitäisi voida esittää erilaisilla alustoilla esim. esittää

Lisätiedot

Digitaalisen median tekniikat css tyylimääritykset

Digitaalisen median tekniikat css tyylimääritykset Digitaalisen median tekniikat css tyylimääritykset 18.9.2007 Harri Laine 1 Sisällön ja ulkoasun erottaminen toisistaan tavoiteltavaa sama sisältö pitäisi voida esittää erilaisilla alustoilla esim. esittää

Lisätiedot

Kotisivuohjeet. Eteläpohjalaiset Kylät ry. Sivupohjien rakenne

Kotisivuohjeet. Eteläpohjalaiset Kylät ry. Sivupohjien rakenne Kotisivuohjeet Tässä ohjeessa käydään läpi kotisivujen tekemisen perusteet keskittyen html-koodiin ja sen ominaisuuksiin. Sivupohjissa ulkoasu ja rakenne on pääasiassa jaettu erilliseen css-tyylitiedostoon,

Lisätiedot

Lisätehtävät. Frantic 2015 sivu 1 www.frantic.com

Lisätehtävät. Frantic 2015 sivu 1 www.frantic.com Lisätehtävät Frantic 2015 sivu 1 www.frantic.com Fontit - Google fonts Fonttien käyttäminen verkossa ilman uusien fonttien lataamista on melko rajattua, sillä koskaan ei voi tietää mitä fontteja vastaanottajan

Lisätiedot

QT tyylit. Juha Järvensivu 2008

QT tyylit. Juha Järvensivu 2008 QT tyylit Juha Järvensivu juha.jarvensivu@tut.fi 2008 Sisällys QStyle Style sheet Tyyli (QStyle) Kapseloi widgettien Look And Feel ominaisuudet Toteutettu QT:ssa QStyle luokkaan Sisäänrakennettuja tyylejä

Lisätiedot

W3C, XML ja tietojenkäsittely: Ihmisen ja tietokoneen yhteinen ymmärrys suoritettavasta tehtävästä ja XML-standardien merkitys tietosysteemeissä (MH)

W3C, XML ja tietojenkäsittely: Ihmisen ja tietokoneen yhteinen ymmärrys suoritettavasta tehtävästä ja XML-standardien merkitys tietosysteemeissä (MH) W3C, XML ja tietojenkäsittely: Ihmisen ja tietokoneen yhteinen ymmärrys suoritettavasta tehtävästä ja XML-standardien merkitys tietosysteemeissä (MH) Ossi Nykänen Tampereen teknillinen yliopisto (TTY),

Lisätiedot

XML Technologies and Applications - harjoitustyö -

XML Technologies and Applications - harjoitustyö - XML Technologies and Applications - harjoitustyö - TURUN YLIOPISTO Informaatioteknologian laitos Tietojenkäsittelytiede Harjoitustyö Helmikuu 2009 Jyri Lehtonen (72039) jyri.lehtonen@utu.fi (yksin tehty

Lisätiedot

SQL-perusteet, SELECT-, INSERT-, CREATE-lauseet

SQL-perusteet, SELECT-, INSERT-, CREATE-lauseet SQL-perusteet, SELECT-, INSERT-, CREATE-lauseet A271117, Tietokannat Teemu Saarelainen teemu.saarelainen@kyamk.fi Lähteet: Leon Atkinson: core MySQL Ari Hovi: SQL-opas TTY:n tietokantojen perusteet-kurssin

Lisätiedot

Johdatus XML teknologioihin

Johdatus XML teknologioihin Johdatus XML teknologioihin Metropolia J. Holvikivi XML metakieli Extensible Markup Language rakenteellinen esitystapa tiedon vaihtoon, talletukseen, yhdistämiseen ja julkaisemiseen yleinen rakenteenkuvauskieli,

Lisätiedot

FED G F H?> FCQ FCQ I EO ba` _^] 86 2 mlk * % $,, * Oheisessa kuvassa on eritelty dokumentin sisältö, koodaus, rakenne ja ulkoasu I HG CB LG KJ I H

FED G F H?> FCQ FCQ I EO ba` _^] 86 2 mlk * % $,, * Oheisessa kuvassa on eritelty dokumentin sisältö, koodaus, rakenne ja ulkoasu I HG CB LG KJ I H = rakenteellinen dokumentti dokumentti, jossa erotetaan toisistaan dokumentin 1), 2) ja 3) (tai esitystapa) jotakin systemaattista ja yksikäsitteistä menetelmää käyttäen erusidea: yhden ja saman "tekstinpätkän"

Lisätiedot