3 Verkkosaavutettavuuden tekniset perusteet

Koko: px
Aloita esitys sivulta:

Download "3 Verkkosaavutettavuuden tekniset perusteet"

Transkriptio

1 è è è 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 on nyt paitsi luoda yleiskuvaus perustekniikoihin, myös pohjustaa konkreettisten saavutettavuusohjeiden tulkintaa. Web-arkkitehtuuri ja sen standardointi Sisällön kuvauskielten tekniikkaa ja ideoita (X)HTML ja CSS Huom. Käytännössä oletamme Web-tekniikan perusteet pitkälti tunnetuiksi; esim. XHTML/CSS-tekniikkaa ei yksityiskohtaisesti esitellä luennoilla 44

2 è è è Verkkosaavutettavuuden tekniset perusteet 3.1 Välisoitto Tekniikka on todellinen hengen voitto aineesta, mutta joskus tekniikka näyttää silti saavan ihmisistä yliotteen Teknologian tarjoamien mahdollisuuksien ja sisältämien rajoitteiden osaaminen on perusedellytys toimivan suunnittelun perustana Motto: on helppo kritisoida, hankalampaa on "tehdä oikein" 45

3 è è è Verkkosaavutettavuuden tekniset perusteet 3.2 Osatavoite, WCAG 1.0 pähkinänkuoressa (1/2) Verkkosisällön saavutettavuusohjeen (Web Content Accessibility Guidelines 1.0, WCAG 1.0 ) sisältö lyhykäisyydessään: 1. Tarjoa samansisältöinen vaihtoehto ääni- ja kuvaperustaiselle tiedolle. 2. Älä luota yksin värien käyttöön. 3. Käytä merkkaus- ja tyylikieliä ja käytä niitä oikein. 4. Koodaa tekstin luonnollinen kieli selvästi (dokumentin tekniseen otsikkoon). 5. Käytä taulukoita siten että ne voidaan esittää eri tavoin ja eri välineillä. 6. Varmista että uusia teknologioita hyödyntävät sivut toimivat hyvin myös vanhemmilla asiakasohjelmilla....jatkuu 46

4 è è è Verkkosaavutettavuuden tekniset perusteet 3.3 WCAG 1.0 pähkinänkuoressa (2/2) 7. Varmista että käyttäjä voi hallita sovelluksen aikariippuvia osia. 8. Varmista sulautettujen tai upotettujen käyttöliittymäosien suora saavutettavuus. 9. Suunnittele laiteriippumattomasti. 10. Käytä ratkaisuja jotka toimivat myös tällä hetkellä (käytä tarvittaessa väliaikaisia ratkaisuja) 11. Käytä W3C-teknologioita ja ohjeita. 12. Pidä käyttäjä jatkuvasti selvillä asiayhteydestä ja sijainnista sovelluksessa. 13. Tarjoa selkeä navigointimekanismi. 14. Varmista että dokumentit ovat selkeitä ja yksinkertaisia. Ilmeisestikin ohjeen toteuttaminen edellyttää (myös) teknistä osaamista 47

5 è è è Verkkosaavutettavuuden tekniset perusteet 3.4 Tekniikka, ohjeet ja standardointi, peruskysymyksiä Tietotekniikasta kirjoitetaan "teknisiä määrityksiä", saavutettavuutta "ohjeistetaan" miksi? Koska... - toimiva tietotekninen standardi jättää paljon liikkumavaraa sen soveltamiseen - esim. asiakirjan sisällön liian tiukka standardointi koetaan yleensä luovuutta rajoittavaksi tekijäksi Miksi standardeista kannattaa puhua? Koska... - standardiin tukeutuminen tuo olemassa olevia sovelluksia ja välineitä - standardointi tarjoaa (liike)taloudellisesti järkevän tavan kehittää sovelluksia (erityisesti PK-yritysten näkökulmasta!) 48

6 è è è Verkkosaavutettavuuden tekniset perusteet 3.5 World Wide Webin (WWW) tekninen yhteensopivuus Perusidea: Web nimeää ja välittää resursseja joiden esitystapa (voi siis olla useita) voidaan tarvittaessa valitaan päätelaitteen tms. mukaan - nimi (verkko-osoite), resurssi (entiteetti, "thing"), esitystapa Yhtenäinen nimeämiskäytäntö URI ja tiedonsiirtoprotokollat (HTTP) asettavat yhteensopivan Webin teknisen perustan - Uniform Resource Identifier - Hypertext Transport Protocol "Arkikielessä" resurssi ja sen esitystapa usein samaistetaan (mutta oikeasti ei 1:1-suhdetta!) Kuva: W3C/TAG

7 è è è Verkkosaavutettavuuden tekniset perusteet 3.6 Tiedon esitystavan yhteensopivuus Web välittää dokumentteja jotka voivat koostua useasta tiedostosta - (tarkemmin: Web välittää yksittäisiä tiedostoja, yhteen loogisesti kuuluvia tiedostoja ja/tai entiteettejä, "XML-fragmentteja") Sisällön näkökulmasta keskeistä on tiedon käyttötapauksista (prosesseista) sopiminen; tekniikan näkökulmasta erilaisista tietorakenteista sopiminen Koska tekninen standardointi tähtää mahdollisimman laajaan sovellettavuuteen, pitää esim. sovellusten saavutettavuus käytännössä ohjeistaa erikseen Webin Perusinfrastruktuuri on käsitteellisesti erittäin yksinkertainen - dokumenttien koostaminen, yhteyden tilan käsite, tietoturva, versiointi, yms. hoidetaan sovellusten tasolla 50

8 è è è Verkkosaavutettavuuden tekniset perusteet 3.7 Standardoinnin tasot, luonnehdinta Toimiva Web-standardointi koostuu eritasoisesta työstä Saavutettavan suunnittelun todellinen haaste on kokonaisuuden (ei yksittäisen tekniikan) monimutkaisuus Erityisen pulman muodostavat käytännöt: toteutuksen tekniseen suunnitteluun saatetaan (kukaties ajattelematta) uhrata enemmän resursseja kuin esim. prosessien saavutettavuuden suunnitteluun 51

9 è è è Verkkosaavutettavuuden tekniset perusteet 3.8 Webin standardipinon yleisrakenne Sovellusten sanastot yms. Rakdoktekniikka yms. Tiedonsiirto 52

10 è è è Verkkosaavutettavuuden tekniset perusteet 3.9 Pari sanaa XML:n ideoista Webin merkkauskielten melko yhtenäinen tekninen perusta helpottaa - eri sovellusten teknistä ja semanttista yhdistämistä, - Web-sovellusten opiskelua sekä - välineiden ohjelmointia (siirrettävyys). Sisällöllisesti keskeinen standardoinnin muoto ovat eri sovelluksiin tarkoitetut merkkauskielet Extensible Markup Language eli XML tarjoaa perustan eri sovelluksiin kehitettävien merkkauskielten tekniikalle - yhtenäinen merkistö ja merkkauskielioppi (<e a="v"><!-- elem. --></e>) - sovelluskohtaiset XML-tekstiformaatit ja yleiskäyttöiset välineet 53

11 è è è Verkkosaavutettavuuden tekniset perusteet 3.10 Esimerkki: XHTML-dokumentti XHTML-dokumentti on XML-dokumentti joka rakenteellisesti noudattaa tiettyä dokumentin tyyppimääritystä (DTD) <?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ä (koska XML DTD ohjaa teknistä yhteensopivuutta) 54

12 è è è Verkkosaavutettavuuden tekniset perusteet 3.11 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 55

13 è è è Verkkosaavutettavuuden tekniset perusteet 3.12 Standardit, käytännöt ja perustason määrittely Standardi ei (yleensä) ole laki Historiallisesti esim. Web-standardien ja selainten (tms. prosessorien) kehitystyö on osoittanut että standardien käyttöönotto vaihtelee suuresti - "ellei laki pakota, markkinat ohjaavat" Standardien asettajat (ja työtä seuraavat sidosryhmät) saattavat projisoida standardeihin myös toiveita tai (yltiö)optimistisia odotuksia... Käytännössä tämä tarkoittaa esim. sitä että - kaikkia HTML & CSS -piirteitä ei toteuta yksikään selain -...kaikkia saavutettavuusohjeiden piirteitä ei yksinkertaisesti voi toteuttaa Saavutettavan palvelun tekninen toteutus on ilmeisesti sitä helpompaa mitä tarkemmin perustasosta (baseline) voidaan sopia 56

14 è è è Verkkosaavutettavuuden tekniset perusteet 3.13 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 57

15 è è è Verkkosaavutettavuuden tekniset perusteet 3.14 Tärkeää: dokumenttien ja tiedon korrekti rakenne Koska tietokoneet eivät ymmärrä sisältöjä, niiden käsittelemien tietorakenteiden tulee olla rakenteeltaan täsmälleen määriteltyjä (X)HTML-dokumentin validoimisella tarkoitetaan testiä jossa valitun dokumentin rakenteen oikeellisuus selvitetään vertaamalla sitä (X)HTMLdokumentin tyyppimäärittelyyn ("malli tai muotti") Huom #1. Validius ei takaa että - dokumentti olisi sisällöllisesti mielekäs, tai että - dokumentti olisi saavutettava...koska dokumenttien rakenteella ja esim. tekstisisällöllä (merkkidata) on validiuden puitteissa varsin runsaasti liikkumavaraa (esim. kieli) Dokumentin tietojen järkevyys on siis tarkistettava muuten - Huom. #2 validointi on abstrakti XML-prosessi sopiva sovellusta ymmärtävä apuohjelma voi kuitenkin tukea myös sisällön tarkastamista 58

16 è è è Verkkosaavutettavuuden tekniset perusteet 3.15 HTML-dokumentin ulkoasu? Rakenteisen dokumentin perusidea: - HTML-dokumentin rakenne kuvailee dokumentin tietosisällön -...jonka ulkoasun ja toiminnallisuuden (tai esitystavan!) sovellus päättää (esim. selain) Esim. XHTML: - tiedon esitysrakenne: otsikot ja kappaleet - toiminnallisuus: linkit ja lomakkeet - yhteydet muihin dokumentteihin: kuvat, objektit, yms. (HTML ~ Webin liimakieli) Muista puhesyntetisaattoriesimerkki! 59

17 è è è Verkkosaavutettavuuden tekniset perusteet 3.16 Esimerkki: XHTML & CSS XHTML-dokumentin esitystapa voidaan ohjeistaa esim. CSS-tyyliohjeen avulla (Cascading Style Sheet): body { background: yellow; /* Pohja */ font-family: "Arial", sans-serif; color: rgb(0,0,50); } p { text-align:right; } p a { background: white; font-size: 150%; } a:active { background: black; color: white; } <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " <html xmlns=" xml:lang="en" lang="en"> <head> <title>virtual Library</title> <link rel="stylesheet" type="text/css" href="pc-yell.css"/></head> <body> <p>check <a href=" </body> </html> <!-- Mod. --> 60

18 è è è Verkkosaavutettavuuden tekniset perusteet 3.17 HTML-dokumentin ulkoasu ja tyylit, huomioita HTML-dokumentin esitystapa voidaan siis ohjeistaa esim. ns. tyylin (stylesheet) avulla CSS-tyyli voidaan päällekirjoittaa sovelluksessa, ts. esim. selain voi päättää tulkitako CSS-tyyliä vai ei (ja miltä osin) Tyyli kertoo miten rakenteinen dokumentti esitetään valitussa mediassa - tyyliohje määrittelee formatointiobjektit sekä näiden attribuutit (abstrakti käsite!) - yleisessä tapauksessa tyyliohje on tietokoneohjelma joka voi tehdä rakenteisella dokumentilla "mitä tahansa" Myös CSS-tieto pitää validoida 61

19 è è è Verkkosaavutettavuuden tekniset perusteet 3.18 Cascading Style Sheets, ja esitystavan idea CSS jäsentää rakenteisen dokumentin tarjoten formatointimallin (tai malleja) johon sisältöä formatoidaan Visuaalinen formatointimalli: Viewport, block (display), property Yleisemmin, CSS-formatointiominaisuudet jaotellaan mediatyypeittäin: - all, aural, braille, embossed, handheld, print, projection, screen, tty, tv ( mediavalitsimien käyttö) CSS määrittelee seuraava mediaryhmät: - continuous tai paged; visual, aural tai tactile; grid tai bitmap; interactive tai static; all 62

20 è è è Verkkosaavutettavuuden tekniset perusteet 3.19 CSS, taulukot ja tuotettu sisältö CSS osaa (periaatteessa) jäsentää rakenteisen dokumentin myös taulukkona (a la HTML 4) Vastaavasti elementtien formatoinnin yhteydessä tulosdokumenttiin voidaan liittää myös esim. numerointitietoja ja vakiotekstiä Em. ominaisuuksien hyödyntäminen on kuitenkin sovelluksissa pulmallista, johtuen esim. selaintoteutusten vajavaisuuksista Vastaavasti ääniselainominaisuuksia yms. ei toistaiseksi ole yleisesti toteutettu (kehitystyötä: Voice Browser) CSS-suosituksen kehityskaari: CSS 1.0, , 3 ( moduulit) 63

21 è è è Verkkosaavutettavuuden tekniset perusteet 3.20 Standardit tyylikielet, tyylikieli ja tieto Tyyliohjeita silmälläpitäen on kehitetty omia standardejaan: esim. XHTMLdokumentti voidaan esittää useilla eri tekniikoilla: - esim. CSS (Visual, Aural, Paged Media, Print, TV,...), XSL (XSLT, XSL-FO), mallikielet,... Käytännössä tyyliohje voi myös sisältää osan dokumentin välittämästä informaatiosta - esim. XSL-tyyli voi olla funktionaalinen kuvaus: T:XHTML XHTML - esim. rakenne-elementtien asemointi, vakiotekstit, sivun ylläpitäjän tiedot, päivämäärä, kappaleiden numerointi, jne. - käytännössä esim. verkkopalvelun navigoinnin käyttöliittymä (linkit ja nappulat) tuotetaan tyypillisesti tyyliohjeen tai mallipohjan (template) avulla (yleensä "dynaamisesti", ylläpidollisista syistä) 64

22 è è è Web & tekstiformaatit 4 Web & tekstiformaatit Verkkopalvelun käyttöliittymä ja sisältö eivät yleensä käsitä pelkästään (X)HTML-muotoisia dokumentteja. Tämä asettaa suuria haasteita teknisen saavutettavuuden suunnittelulle (riippuvuudet!) ja toteutukselle. Toisinaan verkkosivut tarjoavat vain pääsyn lähinnä "toimisto-ohjelmien" ymmärtämiin dokumenttityyppeihin (esim. PDF, RTF, PPT, PS) Luonnehditaan seuraavaksi lyhyesti vektorikuvien ja videoesitysten taustalta löytyviä tekstiformaatteja ja pohditaan mitä dokumenttien skriptiohjelmointi tarkoittaa saavutettavuuden näkökulmasta. 65

23 è è è Web & tekstiformaatit 4.1 Välisoitto Sovellusten tekniset vaatimukset näkyvät selkeimmin tilanteissa joissa kaikki ei toimi toivotusti Teknologiavalinta on vaikea osa suunnittelua (koska asioiden tulee toimia käytännössä) Saavutettavuuden näkökulmasta kehitystyö on tasapainoilua tekniikan mahdollisuuksien ja legacymaailman kanssa 66

24 è è è Web & tekstiformaatit 4.2 Jonosta (teksti) avaruuteen (grafiikka): SVG XHTML on "vain eräs" XML-tekstiformaatti Samalla perustekniikalla (XML) voidaan kuitenkin kuvailla (tai prosessoida) mitä tahansa tietoa - "yleisesti käytössä olevia" XML-tekstiformaatteja on satoja; "kuka tahansa" voi kehittää niitä lisää (mutta hyvän tekeminen...) Tyyppiesimerkki hyödyllisestä graafisten objektien (ja animaatioiden, yms.) kuvailuformaatista on SVG (Scalable Vector Graphics) Myös SVG-grafiikan saavutettavuuteen voi kiinnittää huomiota - käytännössä: objektirakenteen miettiminen, tekstivastineiden liittäminen objekteihin Kuvat: I. Herman 67

25 è è è Web & tekstiformaatit 4.3 SVG-dokumentin rakenne SVG-dokumentti on kuten XHTMLdokumentti, mutta XHTML-sanaston ja hypertekstin yms. sijaan puhuu SVG-sanaston avulla grafiikasta, filttereistä, jne. <?xml version="1.0" encoding="iso " standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" " <svg width="12cm" height="4cm" viewbox=" " xmlns=" version="1.1"> <ellipse cx="600" cy="200" rx="550" ry="175" fill="yellow" stroke="blue" stroke-width="20"/> <rect x="1" y="1" width="1198" height="398" fill="none" stroke="blue" stroke-width="2" /> <polygon fill="red" stroke="blue" stroke-width="10" points="350,75 379, , , , , , , , ,161" /> <polygon fill="lime" stroke="blue" stroke-width="10" points="850,75 958, , , , ,137.5" /> <text x="470" y="240" font-size="70">tekstiä</text> </svg> 68

26 è è è Web & tekstiformaatit 4.4 Skriptatut dokumentit XML-sovellukset tarjoavat tyypillisesti mahdollisuuden liittää dokumentteihin (esim. XHTML tai SVG) myös tapahtumaohjattuja selaimessa ajettavia skriptejä (esim. Ecmascript [Javascript], VBScript) - esim. hiiren liike, napinpainallus, ajastettu tapahtuma DOM-manipulointi Yleensä skriptien käyttö heikentää dokumenttien saavutettavuutta (...koska skripti voi toimia "selaimen käyttöliittymän ohi" määrittelemättömyys) Skriptien käytölle on hyvin huonoja, huonoja ja melko hyviä perusteita - hyvin huono syy on turha erikoistehoste, esim. näyttöelementin liikuttelu - melko huono syy voi olla esim. käyttöliittymän hallittu laajentaminen, esim. fiksu statuskenttä (dokumentin loogista rakennetta rikkomatta) - ok- peruste on rajattu sovellus, jonka selain ja käyttäjäkunta on tarkkaan tunnettu (esim. Intranet); joskus käytetään myös esim. syötteiden esitarkistukseen, mutta vaatisi miettimistä (...mutta esim. XForms) 69

27 è è è Web & tekstiformaatit 4.5 Avaruudesta aikaan Saavutettavuuden luonne hieman muuttuu kun tarkastellaan ajassa muuttuvia esityksiä -...ts. kun "poistutaan kuolleen tekstin maailmasta" vrt. SVG-esimerkki "reversi"... Yleisessä tapauksessa käyttöliittymä voi koostua erilaisista mediaelementeistä jotka ovat aikariippuvaisia Saavutettavuus tarkoittaa tällöin - vaihtoehtoisia tiedon esitystapoja (vrt. tv-ohjelman tai elokuvan tekstitys huonokuuloiselle suomenkieliselle henkilölle vs. tekstitys kuurolle suomenkieliselle henkilölle) ja - mahdollisuutta "pysäyttää aika" (esim. näkövammainen henkilö tai henkilö joka on hidas lukemaan tai haluaa pysäyttää esityksen esim. taustatietojen haun ajaksi) 70

28 è è è Web & tekstiformaatit 4.6 Synkronoitu multimedia ja SMIL Standardin synkronoidun multimedian koostamiseen määrittelee esim. SMIL (Synchronized Multimedia Integration Language) Edellyttää yleensä erillistä soitto-ohjelmaa (esim. RealPlayer) Myös SMIL sisältää saavutettavuuspiirteitä - vaihtoehtoinen sisältö, hakemistot,... Kuva: CSC -...mutta käytännössä soittoohjelman (käyttöliittymän) saavutettavuus sinänsä voi muodostua esteeksi 71

29 è è è Web & tekstiformaatit 4.7 SMIL-dokumentin rakenne <?xml version="1.0"?> <!DOCTYPE smil PUBLIC "-//W3C//DTD SMIL 2.0//EN" " <smil xmlns=" xml:lang="en" title="picture-in-picture Television"> <head> <layout> <toplayout width="320px" height="240px"> <region id="main-video" left="0%" top="0%" width="100%" height="100%"> <region id="corner-video" left="67%" top="67%" width="33%" height="33%" fit="scale" soundlevel="0%"/> </region> </toplayout> </layout> </head> <body> <par> <video id="chameleon-video" src="chameleon.mpg" alt="an animated chameleon" region="main-video"/> <video id="earthquake-video" src="earthquake.mpg" alt="san Fransisco earthquake aftermath" region="corner-video" end="chameleon-video.end"/> </par> </body></smil> Kuva ja esimerkki: C. Forno 72

30 è è è Web & tekstiformaatit 4.8 Lopuksi: tekniset menetelmät ja saavutettavuustyö Käyttäjien, käyttötapojen ja käyttökelpoisten sovellusten tuntemus on saavutettavuustyön perusta, mutta se ei vielä yksin riitä: tarvitaan suunnitteluosaamista koska - kyse on myös esim. verkkosovellusten menetelmien tuntemisesta teknisellä tasolla (esim. monikanavajulkaisu) ja esim. XMLtekstiformaattien teknisten saav.ominaisuuksien osaamisesta (esim. SVGdokumentin suunnittelu tekstivastineiden näkökulmasta)...muuten käy niin että juututaan puhumaan saavutettavuudesta yläkäsitteiden tasolla, tavalla, jolla ei ole merkittäviä vaikutuksia (verkko)sovelluksen loppukäyttäjän näkökulmasta -...eikä osata esim. arvioida tuotantotyön todellisia kustannuksia Standardoitujen XML-tekstiformaattien ja esim. näiden selaintoteutusten asteittainen kehittyminen (eri tahdissa) asettavat erittäin suuria haasteita käytännön saavutettavuustyölle 73

31 è è è Web & tekstiformaatit 4.9 Rajaus (tenttilukijoille tiedoksi) Keskeistä on nyt ymmärtää verkkosovellusten teknisen perustan ja tuotantotyön, sekä saavutettavuusohjeistuksen välinen suhde (muuten saav. jää yläkäsitteiden tasolla ohueksi) Itse saavutettavuusohjeet eivät kuitenkaan juuri opeta menetelmätason osaamista (koska ne on rajattu lopputuloksen arviointiin) - vrt. XHTML-perhe vs. HTML-perusteet ("kotisivun osaavat kaikki tehdä") Tentissä ei oleteta/vaadita seuraavien tekniikoiden yksityiskohtaista hallintaa - PHP, XML/XSL/XSLT, XForms, SVG, SMIL, tiedon formaali mallinnus...mutta koko homman idea ja riippuvuudet olisi syytä ymmärtää Asioita opetetaan tarkemmin osana esim. opintojaksoja HM ohjelmointi, Rakenteiset dokumentit ja Rakenteisten dokumenttien jatkokurssi 74

32 è è è Pari sanaa palvelutuotannosta 5 Pari sanaa palvelutuotannosta Palvelun tarkastelu "yksittäisten verkkosivujen tai tekniikoiden tasalla" ei luo kovin realistista kuvaa informaation saavutettavuuden haasteista. Tarkastellaan seuraavaksi palvelutuotannon lähtökohtia pelkistettyjen esimerkkien valossa. 75

33 è è è Pari sanaa palvelutuotannosta 5.1 Välisoitto (Verkkopalvelun) tuotanto kiteytyy viime kädessä lukuisten yksityiskohtien hoitamiseksi (joista eräs on WWW-sivujen tuottaminen) Pienen sovelluksen voi toteuttaa "lähes miten vain" Realistisen kokoisten sovellusten tuottamisessa keskeistä on työpanoksen kohdistamisen oikein (lue: turhaa käsityötä tulee välttää) 76

34 è è è Pari sanaa palvelutuotannosta 5.2 Verkkopalvelun toteutuksesta (vrt. "Salivaraani") Tyypillinen verkkopalvelu perustaa palvelunsa johonkin perusjärjestelmään (ei merkitty ao. kuvaan) ja tarjoaa palveluun näkymän sopivan asiakasohjelman ymmärtämässä muodossa Esim. XHTML+CSS -tekniikka toimii siten lähinnä rajapintana selaimelle 77

35 è è è Pari sanaa palvelutuotannosta 5.3 Verkkopalvelun toteutusstrategioita 1. Staattinen palvelu käsityönä: kirjoitetaan "sivut" esim. käsin tekstieditorilla (tai sivupohjaisesti Web-editorilla) ja julkaistaan suoraan httpdokumenttihakemistossa 2. Dynaaminen palvelu template-tekniikalla: sovellus tuotetaan dynaamisesti skripti/template-kielen avulla (esim. PHP+MySQL) 3. Vapaasti ohjelmoitu sovellus: suunnitellaan sovellus ohjelmointikielellä X ja hyödynnetään jotakin sopivaa Web-sovelluskehystä (esim. Java+JavaServer Faces, Python+Django, ) 4. Sovellus julkaisuprosessin tuloksena: kuten edellä, mutta sovellusta (tai sen osaa; käyttöliittymää, dokumentaatiota, "lähdekoodia", ) ylläpidetään esim. rakenteisina dokumentteina joista sisältö prosessoidaan julkaisun yhteydessä sopivaan muotoon (esim. XML+XSLT HTML+PHP) Käytännössä sovelluksissa yo. toteutusstrategioita yhdistellään eri tavoin 78

36 è è è Pari sanaa palvelutuotannosta 5.4 Ettei totuus unohtuisi: verkkosivuista verkkopalveluun Verkkopalvelun toteuttamisessa on poikkeuksetta kaksi näkökulmaa: - sovellus toimii loppukäyttäjän näkökulmasta ( saavutettavuus ja käyttökelpoisuus) - toteutus- ja ylläpitokustannukset ovat järkeviä ( palvelutuotannon menetelmät) Verkkopalvelu on aina osa suurempaa kokonaisuutta, mistä seuraa omia reunaehtojaan (erit. tekn. tuotannon ja taustaprosessien/ylläpidon skaalautuvuus palvelutuotannon osalta) Toiminta verkossa Verkkopalvelu Verkkopalvelun tuottaminen Toiminta verkon takana (lue: sisältö) Taustaorganisaation palvelu Taustaorganisaation palvelutuotanto 79

37 è è è Pari sanaa palvelutuotannosta 5.5 Palvelutuotanto (RUP-jäsennys) ja saavutettavuus Development process (recursive step) Inception - rationale - scope - success criteria Elaboration - requirements - analysis & design - baseline architecture - construction plan Construction Transition - testing, tuning, training "Kaikkien muutostöiden hinta" nousee tuotantoprojektin edetessä Jos haluamme optimoida resurssien käytön ja maksimoida lopputuloksen: - saavutettavuus (WAI-ohjeet) tulee selkeästi ottaa jo määrittelyssä huomioon yhtenä tavoitteena muiden mukana (myös ylläpidon osalta) - suunnittelussa on huomioitava sekä WAI-ohjeet että WAI-tekniikat (reunaehdot ja rajoitteet) - perustason kysymykset ja testaamisen mittarit selvitetään jo aluksi (!) 80

38 è è è Pari sanaa palvelutuotannosta 5.6 Verkkopalvelun tyypillinen suunnittelu Harva palvelu koostuu yhdestä sivusta. Verkkopalvelu jäsennetään usein (käyttäjälle tarjotulta näkymältään) puumaiseksi rakenteeksi osioittain tai toiminnoittain (ylläpidon ja ymmärrettävyyden takia). Tulos: - palvelulla on tietty yleisjäsennys ja esim. hakutoiminto ( "navigointi") - asiasisältö (esim. aihealueittain) välittyy sivupohjien osoittaman jäsennyksen keinoin ( "viestiminen") - palvelu sisältää dynaamisia osia: palvelun jäsennys, esitystapa, sisältö tai toiminnallisuus saattaa vaihdella tai muuttua ( "vuorovaikutus") Uutiset Ohjelmoitava palvelualusta <?...?> Etusivu Artikkelit Uutiset Artikkelit Ryhmätyö... Ryhmätyö <?...?> <?...?> <?...?> 81

39 è è è Pari sanaa palvelutuotannosta 5.7 Tuotantotyön laskuoppia (mihin resurssit menevät?) Miksi palvelutuotannon mekaaninen hallittavuus on tärkeää? Triviaali esimerkki: palveluorganisaation yksinkertainen verkkopalvelu jossa työntekijöiden käyntikortit, tehtäväkuvaukset ja organisaation yleisinfo - N työntekijää, M tehtävää, kukin hoitaa T tehtävää, yleisinfossa etusivu, ohje, tehtäväkuvaukset ja sivukartta (sisällysluettelo), ts. 3 perussivua Peruskoulun laskuoppia, arvioidaan alarajoja (esim. N=5, M=15, T=4): - palvelussa on N+M+3 sivua tms. (23) - kunkin työntekijän sivulla on 1+T linkkiä (4), tehtävissä 1+N*T/M linkkiä (~2.3) ja sivukartassa N+M+2 linkkiä (22) - palvelussa on N*(1+T) + M*(1+N*T/M) + (N+M+2) linkkiä (127) - laskuissa ei ole mukana murupolkuja, hakutoimintoa, jne. (!) Tuotannon resursointi (versiointi ja muutokset?), ylläpito (sisällön eheys ja virheettömyys?),...mihin aikaa jää? Jääkö saavutettavuustyölle? 82

40 è è è Pari sanaa palvelutuotannosta 5.8 Huomioita saavutettavuustyöstä Matkaketjun hengessä, saavutettavuuden tulisi tietenkin toteutua koko palvelun osalta; - "saavutettava verkkopalvelu" voi hyvin hyödytön ellei palvelun varsinainen sisältö ole saavutettavissa (riippuvuudet vrt. esim. transaktion vahvistaminen paperikirjeellä johon allekirjoitus rapussa B2) Teknisen suunnittelun rakenteita kannattaa tietenkin hyödyntää saavutettavuustyössä: - verkkopalvelun arviointia ja kehittämistä kannattaa järkeistää arvioimalla saavutettavuutta sovelluksen verkkosivujen ja sivupohjien perusteella - (kognitiivinen) saavutettavuusarviointi kannattaa jakaa osiin myös esim. yleisrakenteen ja aihealueittaisen sisällön kesken, jne. Palvelutuotannon hyvä hallittavuus ("ohjelmoitavuus") mahdollistaa palvelun saavutettavuuden systemaattisen ja taloudellisen kehittämisen (profilointi?) 83

41 è è è Pari sanaa palvelutuotannosta 5.9 Ai niin -- toteutustapa #1: Staattinen sivu käsityönä Suoraviivaisin tapa on kirjoittaa sovellus käsin tai sopivalla WWW-editorilla sivu sivulta (edistynyt tuotantoympäristö voi myös sisältää mallipohjia tms.) Perusidea: Tuotetaan (X)HTML-koodia esim. tekstieditorilla Kysymyksiä: - Kuinka paljon sisältöä on, onnistuuko tuotanto ja ylläpito käsin? - Osataanko kaikki suunnitella ennen käyttökokeita? (Saavutettavuus?) Hyviä ja huonoja puolia: - Nopeasti alkuun mutta sovellus heikosti hallittavissa volyymin kasvaessa - Kaikki sovelluksen piirteet periaatteessa täysin räätälöitävissä, mutta esim. resurssisyistä johtuen, sovellus rämettyy helposti (esim. päivitykset ja versiointi, korjaukset, systemaattiset muutokset) - Tiedon esitystapa pitää käytännössä suunnitella täysin valmiiksi ennen toteutusta, täysin staattinen toteutus 84

42 è è è Pari sanaa palvelutuotannosta 5.10 Toteutustapa #2: Dynaaminen sivu template-tekniikalla Sovelluksen "ohjelmoitavuus" paranee esim. mallipohjien käytöllä Perusidea: sovellus tuotetaan dynaamisesti skriptikielen avulla (esim. PHP) Kysymyksiä: - Minne sivuilla näytettävä tieto talletetaan? (Tietokantaan) - Tarvitaanko dynaamisuutta? Riittääkö palvelimen teho? Mitä lisäarvoa ohjelmakoodilla haetaan? (Keksitäänkö pyörä uudelleen?) Hyviä ja huonoja puolia: - Nopeasti alkuun, lisäarvot suunnittelun myötä, volyymin kasvaessa työn painopiste siirtyy palvelun abstrahointiin ja esim. tietokantaohjelmointiin - Sovelluksen piirteet räätälöitävissä, myös vuorovaikutteisuus (yleisessä tapauksessa sivupohja-ajattelu on vain esim. ohjelmistonäkymä [view]) - Raja toteutustapojen 2 ja 3 välillä hämärtynyt vuosien varrella "koska Template-kielet lähentyvät jatkuvasti oikeaa ohjelmointia ja päinvastoin" 85

43 è è è Pari sanaa palvelutuotannosta 5.11 Toteutustapa #3: Vapaasti ohjelmoitu sovellus Sovelluksen toteutusta rajaa vain sovelluskehyksen valinta (mutta ohjelmointikieli ja kehitysvälineet ovat yleensä "parhaat mahdolliset") Perusidea: sovellus tuotetaan "yleisen" ohjelmointikielen avulla Kysymyksiä: - Mikä kehys valitaan? Mitä palvelimelle pitää asentaa tätä varten "lisää"? - Millä välineellä sovellusta/ohjelmistoprosessia viedään läpi? Hyviä ja huonoja puolia: - Saman ohjelmointikielen/teknologian käyttö verkkopalvelun ja perusjärjestelmien (yms.) toteutuksessa yleensä helpottaa työtä ja välinevalintoja - Alkuun pääsy edellyttää usein "enemmän" selvittelyä, tuotantoprosessi (ja tuote) saattaa muodostua aiottua raskaammaksi/monimutkaisemmaksi - Kehyksen käyttöikä (esim. päivitykset) saattaa muodostua ongelmaksi 86

44 è è è Pari sanaa palvelutuotannosta 5.12 Toteutustapa #4: Sivu julkaisuprosessin tuloksena Erityisesti dokumentaation osalta hyvä lähestymistapa on ottaa sovellus haltuun julkaisuprosessin osalta (sopii rajoitetusti myös logiikan ylläpitoon) Idea: Mallinnetaan data, määritellään esitystavat ja ohjelmoidaan tarvittavat muunnokset Kysymyksiä: - Miten käsikirjoituksen (lähdedokumentin) tai tietokannan tiedot valitaan? - Onko sovellus tarpeeksi laaja jotta systemaattisen lähestymistavan edut realisoituvat? (Vrt. sopivan sovelluskehyksen valinnat.) Hyviä ja huonoja puolia: - Työ alkaa selkeällä suunnitteluvaiheella, sovelluksen piirteet keskitetysti hallittavissa, mutta vuorovaikutteisuuden toteuttaminen edellyttää yhä esim. mallipohjatekniikoita, "ei räätälöintiä, geneerinen ratkaisu" - "Esiprosessoinnin" hyvät ja huonot puolet ohjelmoinnissa 87

45 è è è Pari sanaa palvelutuotannosta 5.13 #4 ja analogia: hallittu sisällöntuotantoprosessi Vaikka HTML-dokumentteja voi kirjoittaa suoraan tekstieditorilla, laajemmat sivustot tuotetaan hallittuun sisällöntuotantoprosessiin nojautuen: - sisältö kuvataan mediariippumattomasti sopivalla XMLsanastolla (+mediaobjektit) - kutakin julkaisumediaa (esim. HTML) kohti kirjoitetaan formatointiohje(lma tai tyyli) - käsikirjoitus formatoidaan kunkin median mukaisesti julkaisuprosessin yhteydessä ( monikanavajulkaisu) - jälkikäsittelyä pyritään välttämään, ylläpito, versiointi jne. hoidetaan keskitetysti 88

46 è è è Pari sanaa palvelutuotannosta 5.14 Monikanavajulkaisun perusidea Keskitetty ja hallittu sisällöntuotanto ja ylläpito, mekaaninen julkaisu Voi sisältää myös interaktiivisia osia yms. (Multi-Channel Publishing, Single Sourcing,..) XHTML käsikirjoitus Mediaobjektit SMIL XML 1.0 SVG PNG XLink XQuery XSL/FO XSLT XSLT CSS PDF CSS Sovellus #1 Sovellus #2 Sovellus #3 89

47 è è è Pari sanaa palvelutuotannosta 5.15 Saavutettavuusohjeistus vs. tekniikan mahdollisuudet Verkkopalvelun toteuttamisen menetelmät asettavat esim. verkkosisällön saavutettavuusohjeistuksen oikeaan perspektiiviin: - periaatteelliset mahdollisuudet (menetelmät, tekniikat, laitteet) - käytännölliset rajoitukset (tuotannon optimointi, mainstreaming, inhorealismi esim. sisällön ja ylläpidon rämettymisen suhteen, jne.) Normatiivinen verkkosisällön saavutettavuusohjeistus on pitkälti kirjoitettu "toteutustavan #1 hengessä" -...koska standardoinnin näkökulmasta rajaus on perusteltu -...mutta toteuttajan (ja arvioijan) pitää ottaa kantaa prosesseihin (ts. WAI-mittaristoa tarvitaan mutta se ei vielä yksin riitä) 90

48 è è è Pari sanaa palvelutuotannosta 5.16 Lopuksi: lisää saavutettavuuden tekijöitä 91

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

3.27 "Tuotantoesimerkkien" rakenne ja viittaukset (1/2)

3.27 Tuotantoesimerkkien rakenne ja viittaukset (1/2) 3.27 "Tuotantoesimerkkien" rakenne ja viittaukset (1/2) Tietomalli ja tiedon esitystapa Käsityön määrä ja laatu Palvelinpään vaatimukset Saavutettavuusohjeistuksen ala! #1: Käsityö ope-kkortti.html ope-kkortti.css

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

4 Web & tekstiformaatit

4 Web & tekstiformaatit è è è Web & tekstiformaatit 4 Web & tekstiformaatit Verkkopalvelun käyttöliittymä ja sisältö eivät yleensä käsitä pelkästään (X)HTML-muotoisia dokumentteja. Tämä asettaa suuria haasteita teknisen saavutettavuuden

Lisätiedot

3.11 HTML-dokumentin ulkoasu?

3.11 HTML-dokumentin ulkoasu? 3.11 HTML-dokumentin ulkoasu? Rakenteisen dokumentin perusidea: - HTML-dokumentin rakenne kuvailee dokumentin tietosisällön -...jonka ulkoasun ja toiminnallisuuden (tai esitystavan!) sovellus päättää (esim.

Lisätiedot

Verkkosaavutettavuuden tekniset perusteet. 3.1 Välisoitto

Verkkosaavutettavuuden tekniset perusteet. 3.1 Välisoitto 3.1 Välisoitto Tekniikka on todellinen hengen voitto aineesta, mutta joskus tekniikka näyttää silti saavan ihmisistä yliotteen Teknologian tarjoamien mahdollisuuksien ja sisältämien rajoitteiden osaaminen

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

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

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

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

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

Verkkopalveluiden saavutettavuus

Verkkopalveluiden saavutettavuus Verkkopalveluiden saavutettavuus Puhuja: Ossi Nykänen Tampereen teknillinen yliopisto, Hypermedialaboratorio, W3C Suomen toimisto Paikka: Helsinki, Tieteiden talo, 24.3.2011 Johdanto Verkkopalvelun saavutettavuus

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

Verkkosisällön saavutettavuusohjeet 2.0: hyviä ohjeita monimuotoisen sisällön suunnitteluun ja arviointiin

Verkkosisällön saavutettavuusohjeet 2.0: hyviä ohjeita monimuotoisen sisällön suunnitteluun ja arviointiin Verkkosisällön saavutettavuusohjeet 2.0: hyviä ohjeita monimuotoisen sisällön suunnitteluun ja arviointiin Ossi Nykänen Tampereen teknillinen yliopisto, Hypermedialaboratorio, W3C Suomen toimisto Terveyden

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

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

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

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

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

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

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

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

W3C: teknologia ja (tieto)yhteiskunta

W3C: teknologia ja (tieto)yhteiskunta W3C: teknologia ja (tieto)yhteiskunta Ossi Nykänen Tampereen teknillinen yliopisto (TTY), Digitaalisen median instituutti (DMI), W3C Suomen toimisto Esitelmä Hyvin lyhyt versio: World Wide Web Consortium

Lisätiedot

4 Verkkosisällön saavutettavuus

4 Verkkosisällön saavutettavuus 4 Verkkosisällön saavutettavuus Verkkosisällön saavutettavuus on informaation saavutettavuuden erikoistapaus. Verkkosisällön saavutettavuus kohdistaa huomionsa verkkopalvelun käyttöliittymärajapintaan

Lisätiedot

XML, standardointi ja kehitys

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

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

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

10 Pieni datalähtöinen sovellusesimerkki

10 Pieni datalähtöinen sovellusesimerkki 10 Pieni datalähtöinen sovellusesimerkki XSL mahdollistaa erilaisten XML:ää tukevien välineiden hyödyntämisen osana omia sovelluksia. Julkaisutoiminnan näkökulmasta mielenkiintoisia (ja opiskelun kannalta

Lisätiedot

Laajuus 5 op Luennot: 12 x 2t Harjoitukset: 7 viikkoharjoitusta harjoitusten tekemiseen saatavissa apua 2 ryhmää / harjoitus

Laajuus 5 op Luennot: 12 x 2t Harjoitukset: 7 viikkoharjoitusta harjoitusten tekemiseen saatavissa apua 2 ryhmää / harjoitus Laajuus 5 op Luennot: 12 x 2t 11.3.2014 29.4.2014 Harjoitukset: 7 viikkoharjoitusta harjoitusten tekemiseen saatavissa apua 2 ryhmää / harjoitus Lähiopetuksen jäkeen harjoitustyö ja tentti Aulikki Hyrskykari

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

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

T-111.361 Hypermediadokumentin laatiminen. Sisältö. Tavoitteet. Mitä on www-ohjelmointi? Arkkitehtuuri (yleisesti) Interaktiivisuuden keinot

T-111.361 Hypermediadokumentin laatiminen. Sisältö. Tavoitteet. Mitä on www-ohjelmointi? Arkkitehtuuri (yleisesti) Interaktiivisuuden keinot T-111.361 Hypermediadokumentin laatiminen -Ohjelmointi Peruskäsitys www-ohjelmoinnin kentästä Tekniikat interaktiivisuuden toteuttamiseen tekniikat tekniikat Tietokannat Juha Laitinen TKK/TML juha.laitinen@hut.fi

Lisätiedot

Ohjeita informaation saavutettavuuteen

Ohjeita informaation saavutettavuuteen Ohjeita informaation saavutettavuuteen Tarkoitus Kasvattaa tietoisuutta ja lisätä esteettömän informaation aiheen näkyvyyttä ja sen merkitystä elinikäisen tasapuolisen oppimisen mahdollisuuksista Tukea

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

Saavutettavuus > Tapio Haanperä Saavutettavuusasiantuntija tel

Saavutettavuus > Tapio Haanperä Saavutettavuusasiantuntija tel Saavutettavuus > Tapio Haanperä Saavutettavuusasiantuntija tel. 0505588666 www.papunet.net/saavutettavuus GOOD DESIGN ENABLES BAD DESIGN DISABLES WCAG 2.x - Verkkosisällön saavutettavuusohjeet World Wide

Lisätiedot

Mitä direktiivi käytännössä velvoittaa?

Mitä direktiivi käytännössä velvoittaa? Mitä direktiivi käytännössä velvoittaa? Web Content Accessibility Guidelines - Verkkosisällön saavutettavuusohjeet Timo Övermark Tapio Haanperä http://papunet.net/saavutettavuus WCAG 2.1 - Verkkosisällön

Lisätiedot

10 Nykyaikainen WWW-arkkitehtuuri

10 Nykyaikainen WWW-arkkitehtuuri 10 Nykyaikainen WWW-arkkitehtuuri è è è 10 Nykyaikainen WWW-arkkitehtuuri WWW on ylivoimaisesti suosituin hypertekstijärjestelmä. Käydään seuraavaksi läpi nykyaikaisen WWW-arkkitehtuurin perusteet. Vuonna

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 arkistointi

Avoimet standardit ja arkistointi Avoimet standardit ja arkistointi Ossi Nykänen ossi@w3.org Tampereen teknillinen yliopisto (TTY) Hypermedialaboratorio W3C Suomen toimisto 1 Esitelmä Hyvin lyhyt versio: World Wide Web Consortium (W3C)

Lisätiedot

Cascading Style Sheets

Cascading Style Sheets Cascading Style Sheets CSS - Cascading Style Sheets tyylikuvauskieli suunniteltu HTML:ää varten 1996, oma syntaksi CSS1 (1996), CSS2 (1998), CSS Mobile Profile CSS3 (tuleva) selaintuki nykyään hyvä, mutta

Lisätiedot

XML & CSS. WWW-sovellus??

XML & CSS. WWW-sovellus?? XML & Näkökulmia WWW-ympäristön sovelluksiin ja käyttöliittymiin ILKKA PALOLA Citec Information WWW-sovellus?? Informaationhallinta, julkaisutoiminta Verkkoviestintä ESIMERKKEJÄ käyttäjistä ja käyttökohteista:

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

Kurssin aloitus. AS-0.110 XML-kuvauskielten perusteet Janne Kalliola

Kurssin aloitus. AS-0.110 XML-kuvauskielten perusteet Janne Kalliola Kurssin aloitus AS-0.110 XML-kuvauskielten perusteet Janne Kalliola English Summary The lectures will be held in Finnish The slides are in Finnish, too All other material is in English The course book

Lisätiedot

StanForD-XML. Juha-Antti Sorsa, Tapio Räsänen, Vesa Imponen

StanForD-XML. Juha-Antti Sorsa, Tapio Räsänen, Vesa Imponen Projektiryhmä StanForD-XML Juha-Antti Sorsa, Tapio Räsänen, Vesa Imponen Rahoittajat Koskitukki Oy, Metsähallitus, Metsäliitto Osuuskunta, Pölkky Oy, Stora Enso Oyj, UPM- Kymmene Oyj, Vapo Timber Oy, Yksityismetsätalouden

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

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

Muutama sana saavutettavuudesta Virpi Jylhä, Näkövammaisten liitto ry

Muutama sana saavutettavuudesta Virpi Jylhä, Näkövammaisten liitto ry Muutama sana saavutettavuudesta 22.10.2018 Virpi Jylhä, Näkövammaisten liitto ry Esteettömyys - saavutettavuus Esteettömyys Rakennettu ympäristö Laitteet Saavutettavuus Verkkosivut Käyttöliittymät Sovellukset

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

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

XPages käyttö ja edut Jarkko Pietikäinen toimitusjohtaja, Netwell Oy

XPages käyttö ja edut Jarkko Pietikäinen toimitusjohtaja, Netwell Oy IBM Collaboration Forum ٨.٣.٢٠١١ XPages käyttö ja edut Jarkko Pietikäinen toimitusjohtaja, Netwell Oy ٢٠١١ IBM Corporation Domino-sovelluskehitys Nopea kehitysympäristö (Rapid application development,

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

Saavutettavat verkkosivut Miten ne tehdään?

Saavutettavat verkkosivut Miten ne tehdään? Saavutettavat verkkosivut Miten ne tehdään? Timo Övermark Kehitysvammaliitto Kuntamarkkinat 13.9.2018 Sisältö Lainsäädännön vaatimusten taustaa Saavutettavuusvaatimukset Sivuston suunnittelu alusta asti

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

ARVO - verkkomateriaalien arviointiin

ARVO - verkkomateriaalien arviointiin ARVO - verkkomateriaalien arviointiin Arvioitava kohde: Jenni Rikala: Aloittavan yrityksen suunnittelu, Arvioija: Heli Viinikainen, Arviointipäivämäärä: 12.3.2010 Osa-alue 7/8: Tekninen toteutus Edellinen

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

IT-OSAAJA, TIETOJENKÄSITTELYN ERIKOISTUMISOPINNOT

IT-OSAAJA, TIETOJENKÄSITTELYN ERIKOISTUMISOPINNOT IT-OSAAJA, TIETOJENKÄSITTELYN ERIKOISTUMISOPINNOT KOULUTUKSEN KOHDERYHMÄ SISÄLTÖ Koulutuksen tavoitteena on antaa opiskelijalle valmiudet uusien tietoteknisten menetelmien ja välineiden hyödyntämiseen.

Lisätiedot

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

WWW-Sivustojen suunnittelu

WWW-Sivustojen suunnittelu WWW-Sivustojen suunnittelu Miten WWW toimii Web-selain hakee Web-sivun HTML-kielisen kuvauksen Sivuun liittyvät kuvat (jpeg, gif, png) Sivuun liittyvät muut elementit Palvelimen URL-osoite esim. http://www.metropolia.fi

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

WWW-Sivustojen suunnittelu. Miten WWW toimii. Suunnittelun lähtökohdat 14.10.2010

WWW-Sivustojen suunnittelu. Miten WWW toimii. Suunnittelun lähtökohdat 14.10.2010 WWW-Sivustojen suunnittelu Miten WWW toimii Web-selain hakee Web-sivun HTML-kielisen kuvauksen Sivuun liittyvät kuvat (jpeg, gif, png) Sivuun liittyvät muut elementit Palvelimen URL-osoite esim. http://www.metropolia.fi

Lisätiedot

HTML5 -elementit jatkuu

HTML5 -elementit jatkuu HTML5 -elementit jatkuu Harjoitus: xhtml.htm -> html5.htm Muuta tämä xhtml dokumentti HTML5:ksi: http://users.metropolia.fi/~norrm/s12/kalasu/xhtml.htm Validoi myös koodisi: http://validator.w3.org/ "Mallivastaus"

Lisätiedot

XML-evoluutio ja kestävä kehitys

XML-evoluutio ja kestävä kehitys XML-evoluutio ja kestävä kehitys Ossi Nykänen Tampere University of Technology (TUT), Digital Media Institute (DMI), W3C Finnish Office Esitelmä Hyvin lyhyt versio: XML on W3C:n suosittama perhe tekstiformaatteja

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

Järjestelmäarkkitehtuuri (TK081702)

Järjestelmäarkkitehtuuri (TK081702) Järjestelmäarkkitehtuuri (TK081702) yleistyvät verkkopalveluissa Youtube Google... Avaavat pääsyn verkkopalvelun sisältöön. Rajapintojen tarjoamia tietolähteitä yhdistelemällä luodaan uusia palveluja,

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

VYPEdit verkkosivualusta SVY-toimijoille

VYPEdit verkkosivualusta SVY-toimijoille VYPEdit verkkosivualusta SVY-toimijoille www.vy.fi/admin/vypedit TieVie 26.8.2005 Hely Lahtinen VypEdit sisällönhallintajärjestelmällä voi www.vy.fi/admin/vypedit tuottaa ja ylläpitää www-sivustoja SVY:n

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

Järjestelmäarkkitehtuuri (TK081702) Avoimet web-rajapinnat

Järjestelmäarkkitehtuuri (TK081702) Avoimet web-rajapinnat Järjestelmäarkkitehtuuri (TK081702) SOA yleistyvät verkkopalveluissa Youtube Google... Avaavat pääsyn verkkopalvelun sisältöön. Rajapintojen tarjoamia tietolähteitä yhdistelemällä luodaan uusia palveluja,

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

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

ARVO - verkkomateriaalien arviointiin Arvioitava kohde: Excel-Esitystapa, Arvioija: Juha Kuula, Arviointipäivämäärä:

ARVO - verkkomateriaalien arviointiin Arvioitava kohde: Excel-Esitystapa, Arvioija: Juha Kuula, Arviointipäivämäärä: Arvioitava kohde: Excel-Esitystapa, Arvioija: Juha Kuula, Arviointipäivämäärä: 3.9 Informaation esitystapa p. Jäsennetty esitystapa 4.4 p. [1 Looginen järjestys 4.0 p. [1 Tiiviis muoto 4.8 p. [1 Sivuston

Lisätiedot

Ulkopuolisen tyylitiedoston käyttö

Ulkopuolisen tyylitiedoston käyttö 1 CSS - aloitus Sisältö: s. 2. Ulkopuolisen tyylitiedoston käyttö s. 3. Tyyliohjeen kirjoittaminen s. 4. style-elementti s. 5. style-attribuutti s. 6. class-attribuutti s. 7. id-attribuutti s. 8. Fontit

Lisätiedot

206 Verkkosivun tuottaminen finaalitehtävät

206 Verkkosivun tuottaminen finaalitehtävät TAITAJA2013 Finaalitehtävä 1 (6) 206 Verkkosivun tuottaminen finaalitehtävät YLEISTÄ -lajin finaalitehtävissä kilpailijat päivittävät ennakkoon julkaistuna finaalitehtävänä olleen Ekoripe tmi luontoyrittäjän

Lisätiedot

Maanmittauslaitos.fi ja saavutettavuus

Maanmittauslaitos.fi ja saavutettavuus 1 Maanmittauslaitos.fi ja saavutettavuus Miten saavutettavuus otetaan huomioon verkkosivu-uudistuksessa ja sen jälkeen Johanna Ujainen 16.11.2017, #saavuta2017-seminaari 2 Maanmittauslaitos Maa- ja metsätalousministeriön

Lisätiedot

Johdatusta selainohjelmointiin

Johdatusta selainohjelmointiin Johdatusta selainohjelmointiin Ohjelmat ja tyylit selaimessa ja HTML Jaana Holvikivi Selaimet ja HTML Selaimet: Internet Explorer, Exchange Firefox, Chrome Opera 10 Safari 4 Lukevat HTML sivuja ja asettelevat

Lisätiedot

ARVO - verkkomateriaalien arviointiin

ARVO - verkkomateriaalien arviointiin ARVO - verkkomateriaalien arviointiin Arvioitava kohde: Jenni Rikala: Aloittavan yrityksen suunnittelu, Arvioija: Heli Viinikainen, Arviointipäivämäärä: 12.3.2010 Osa-alue 5/8: Mediaelementit Edellinen

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

CSS aloitus. CSS Cascade Stylesheet Mirja Jaakkola

CSS aloitus. CSS Cascade Stylesheet Mirja Jaakkola CSS aloitus CSS Cascade Stylesheet Mirja Jaakkola Sisältö 3. Ulkopuolisen tyylitiedoston käyttö 4. Tyyliohjeen kirjoittaminen 5. style-elementti 6. style-attribuutti 7. class-attribuutti 8. id-attribuutti

Lisätiedot

TYPO3 - Open Source Enterprise CMS

TYPO3 - Open Source Enterprise CMS TYPO3 - Open Source Enterprise CMS TYPO3 on yritysten tarpeisiin suunniteltu avoimen lähdekoodin julkaisujärjestelmä. Verkkopalvelutoteutusten lisäksi TYPO3 toimii skaalautuvana web-sovellusten kehitysalustana.

Lisätiedot

SAS:in uudet grafiikkaominaisuudet. Ari Toikka 16.11.2009

SAS:in uudet grafiikkaominaisuudet. Ari Toikka 16.11.2009 SAS:in uudet grafiikkaominaisuudet Ari Toikka 16.11.2009 Grafiikan tuottamisessa SAS:illa on kysymys tuotannon automatisoinnista Idea SAS:sin käytössä grafiikan tuottamiseen on korvata käsityö SAS-ohjelmalla,

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

MAANMITTAUSLAITOS.FI JA SAAVUTETTAVUUS EMILIA HANNULA & KIRSI MÄKINEN

MAANMITTAUSLAITOS.FI JA SAAVUTETTAVUUS EMILIA HANNULA & KIRSI MÄKINEN MAANMITTAUSLAITOS.FI JA SAAVUTETTAVUUS EMILIA HANNULA & KIRSI MÄKINEN MAANMITTAUSLAITOS Maa- ja metsätalousministeriön alainen virasto Teemme maanmittaustoimituksia, ylläpidämme kiinteistöjen tietoja,

Lisätiedot

Neoxen Systems on suomalainen ohjelmistotalo. Olemme erikoistuneet tiedon- ja oppimisen hallinnan ratkaisuihin.

Neoxen Systems on suomalainen ohjelmistotalo. Olemme erikoistuneet tiedon- ja oppimisen hallinnan ratkaisuihin. Neoxen Systems Tietoja meistä Neoxen Systems on suomalainen ohjelmistotalo. Olemme erikoistuneet tiedon- ja oppimisen hallinnan ratkaisuihin. Perustettu 2002 Turku Science Parkissa Toiminta kansainvälistä

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

Kotisivujen teko. Jan Lindholm Kirkkonummen kansalaisopisto Syksy koodari.eu jsbin.com

Kotisivujen teko. Jan Lindholm Kirkkonummen kansalaisopisto Syksy koodari.eu jsbin.com Kotisivujen teko Jan Lindholm Kirkkonummen kansalaisopisto Syksy 2014 koodari.eu jsbin.com Käyttäjätunnus / Salasana aoppilas.01 / aoppilas#2013# aoppilas.02 / aoppilas#2013# aoppilas.03 / aoppilas#2013#

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

Ohjelmistojen suunnittelu

Ohjelmistojen suunnittelu Ohjelmistojen suunnittelu 581259 Ohjelmistotuotanto 154 Ohjelmistojen suunnittelu Software design is a creative activity in which you identify software components and their relationships, based on a customer

Lisätiedot

Web sovelluksen kehittäminen sähkönjakeluverkon suojareleisiin

Web sovelluksen kehittäminen sähkönjakeluverkon suojareleisiin TEKNILLINEN KORKEAKOULU / VAASAN YLIOPISTO Diplomityöesitelmä Web sovelluksen kehittäminen sähkönjakeluverkon suojareleisiin Timo Ahola 2006 Web sovellus Web palvelut joiden avulla laite voidaan liittää

Lisätiedot

582203 Tietokantasovellus (4 op) - Web-sovellukset ja niiden toteutus

582203 Tietokantasovellus (4 op) - Web-sovellukset ja niiden toteutus 582203 Tietokantasovellus (4 op) - Web-sovellukset ja niiden toteutus Sisältö Mikä on web-sovellus? Selaimen rooli web-sovelluksessa Palvelimen rooli web-sovelluksessa Aineistopyynnöt Tiedon välittäminen

Lisätiedot

ARVO - verkkomateriaalien arviointiin

ARVO - verkkomateriaalien arviointiin ARVO - verkkomateriaalien arviointiin Arvioitava kohde: Jenni Rikala: Aloittavan yrityksen suunnittelu, Arvioija: Heli Viinikainen, Arviointipäivämäärä: 12.3.2010 Osa-alue 8/8: Esteettömyys Edellinen osa-alue

Lisätiedot

Taustaa. CGI-ohjelmointi

Taustaa. CGI-ohjelmointi Taustaa CGI-ohjelmointi CGI = Common Gateway Interface Hyvin yksinkertainen ja helppo tapa toteuttaa dynaamisuutta ja interaktivisuutta htmldokumentteihin Kehitetty tiedon siirtoon palvelimen ja asiakasselaimen

Lisätiedot

Alkuraportti. LAPPEENRANNAN TEKNILLINEN YLIOPISTO TIETOJENKÄSITTELYN LAITOS Ti Kandidaatintyö ja seminaari

Alkuraportti. LAPPEENRANNAN TEKNILLINEN YLIOPISTO TIETOJENKÄSITTELYN LAITOS Ti Kandidaatintyö ja seminaari LAPPEENRANNAN TEKNILLINEN YLIOPISTO TIETOJENKÄSITTELYN LAITOS Ti5004000 - Kandidaatintyö ja seminaari Alkuraportti Avoimen lähdekoodin käyttö WWW-sovelluspalvelujen toteutuksessa Lappeenranta, 4.6.2007,

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

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

13/20: Kierrätys kannattaa koodaamisessakin

13/20: Kierrätys kannattaa koodaamisessakin Ohjelmointi 1 / syksy 2007 13/20: Kierrätys kannattaa koodaamisessakin Paavo Nieminen nieminen@jyu.fi Tietotekniikan laitos Informaatioteknologian tiedekunta Jyväskylän yliopisto Ohjelmointi 1 / syksy

Lisätiedot

AJAX-konsepti AJAX. Asynkronisuus. Nykyisten web-ohjelmien ongelmia. Asynchronous JavaScript And XML

AJAX-konsepti AJAX. Asynkronisuus. Nykyisten web-ohjelmien ongelmia. Asynchronous JavaScript And XML AJAX-konsepti AJAX Asynchronous JavaScript And XML Viimeisin muoti-ilmiö web-ohjelmoinissa, termi Ajax tuli käyttöön vuoden 2005 aikana Joukko teknologioita, joiden avulla voidaan toteuttaa uudenlaisen

Lisätiedot

ELM GROUP 04. Teemu Laakso Henrik Talarmo

ELM GROUP 04. Teemu Laakso Henrik Talarmo ELM GROUP 04 Teemu Laakso Henrik Talarmo 23. marraskuuta 2017 Sisältö 1 Johdanto 1 2 Ominaisuuksia 2 2.1 Muuttujat ja tietorakenteet...................... 2 2.2 Funktiot................................

Lisätiedot

WCAG 2.1 Uudet kriteerit

WCAG 2.1 Uudet kriteerit WCAG 2.1 Uudet kriteerit Web Content Accessibility Guidelines 2.1 Verkkosisällön uudet saavutettavuuskriteerit (WCAG 2.1) Kimmo Sääskilahti Tero Pesonen WCAG:n versiot 1.0 toukokuu 1999 2.0 joulukuu 2008

Lisätiedot

VisualStudio Pikaopas, osa 1: WEB sivujen suunnittelu

VisualStudio Pikaopas, osa 1: WEB sivujen suunnittelu HAAGA HELIA/IltaTiko ICT2TD005: Ohjelmisto suunnittelutaito 1 VisualStudio Pikaopas, osa 1: WEB sivujen suunnittelu Tämä pikaopas opastaa käyttämään VisualStudion web sivujen suunnittelu ja toteutusominaisuuksia.

Lisätiedot