CLT132 Johdanto verkkosivuteknologioihin (viikko 1)

Esitys aiheesta: "CLT132 Johdanto verkkosivuteknologioihin (viikko 1)"— Esityksen transkriptio:

1 CLT132 Johdanto verkkosivuteknologioihin (viikko 1)

2 CLT132 – kevät 2008Sauli Nurmi HTML + XHTML HyperText Markup Language Extensible HyperText Markup Language Näillä WWW pyörii… (ainakin ulosnäkyvä osa, suurimmilta osin)

3 CLT132 – kevät 2008Sauli Nurmi wiki Aluksi kuitenkin lähestymme HTML- asiaa toisin: wiki “A wiki is software that allows users to create, edit, and link web pages easily.” Lähde: http://en.wikipedia.org/wiki/Wiki

4 CLT132 – kevät 2008Sauli Nurmi wiki & HTML ??? wiki-systeemit periaatteessa suuria HTML- editoreita HTML tosin piilotettu jonnekin käyttäjän silmien taakse Kuitenkin, (lähes) jokainen wiki-järjestelmä osaa tulkita HTML-koodia suoraan! Oikeastaan wiki ei edes tulkitse sitä, vaan se menee muuttumattomana selaimelle…

5 CLT132 – kevät 2008Sauli Nurmi wikien hyödyllisyys Kyseenalaista ja kiisteltyä... Kuitenkin näitä käytetään wikit tarjoavat hyvän ensituntuman verkkosivujen luomiseen ja käsittelyyn!

6 CLT132 – kevät 2008Sauli Nurmi Sairaan hyvä selitys Structured wiki Lähde: http://en.wikipedia.org/wiki/Structured_wiki

7 CLT132 – kevät 2008Sauli Nurmi Kieliteknologille kiinnostavaa Semantic wiki Lähde: http://en.wikipedia.org/wiki/Semantic_wiki

8 CLT132 – kevät 2008Sauli Nurmi Tässä yhteydessä tarpeellista Wikien filosofia voidaan nyt unohtaa (pohtikoon kukin omalla ajallaan) Oleellista: wikit ovat rakenteellisia dokumentteja Oleellista: wikit tuottavat HTML:ää (muodossa tai toisessa) Oleellista: wiki-editoinnin perusteet ovat suunnilleen samat kuin HTML-koodauksen (Käytännön eroja toki on… paljon)

9 CLT132 – kevät 2008Sauli Nurmi Erilaisia wiki-toteutuksia Niitä on paljon, PALJON ja sitten vielä muutama Katso lista: http://en.wikipedia.org/wiki/List_of_wiki_software Kuten yleensä avoimen lähdekoodin kanssa, joukko on sekalainen ja moninainen

10 CLT132 – kevät 2008Sauli Nurmi Erilaisia wikejä maailmalla Wikipedia (avoin ensyklopedia) en.wikipedia.org fi.wikipedia.org Kaikki tietää tämän? KitWiki forums.csc.fi/kitwiki/ Tätä tulette tarvitsemaan jatkossa, tod.näk. (ei tällä kurssilla kuitenkaan)

11 CLT132 – kevät 2008Sauli Nurmi Wikejä maailmalla, jatkoa Memory Alpha memory-alpha.org/en/wiki/Main_Page Star Trek (  )  wiki Wookieepedia starwars.wikia.com Star Wars (  )  wiki Battlestar Wiki www.battlestarwiki.org Battlestar Galactica (  )  wiki Jne. Osv. Etc. Usw.

12 CLT132 – kevät 2008Sauli Nurmi Kielten perusfilosofiat Karkeasti jaoteltuna on kolmenlaisia ”ohjelmointi”kieliä: Käännettävät kielet (esim. C, C++) Tulkattavat kielet (esim. Java) Kuvauskielet (esim. HTML)

13 CLT132 – kevät 2008Sauli Nurmi Perusfilosofiat, jatkoa Näiden yhteenliittäminen samaan asiaan jossain määrin keinotekoista... Eri kielillä eri tehtävät… Esim. C:llä pääsee laitteistoon “kiinni” Javalla toimitaan laitteistosta riippumatta HTML ei periaatteessa ole ohjelmointia ollenkaan!

14 CLT132 – kevät 2008Sauli Nurmi Sivunkuvauskielet Nimensä mukaisesti vain kuvaavat sitä, mitä halutaan Esim. ”Haluan sinistä tekstiä, kiitos.” Ei ohjelmoida sinistä tekstiä! Kuvataan, mitä halutaan. Selain (tai vastaava) tulkitsee kuvauksen visuaaliseksi presentaatioksi Tästä johtui aikoinaan se, että sama sivu näytti erilaiselta eri selaimilla – ne tulkitsivat saman kuvauksen erilaiseksi lopputulokseksi!

15 CLT132 – kevät 2008Sauli Nurmi Eroja oikeaan ohjelmointiin Ohjelmointikieli Päämääränä toiminta Muuttujia Virheet estävät ohjelman toiminnan Suoritus alkaa, ja useimmiten myös loppuu Ohjelmointikielissäkin mahdollista tuottaa sivunkuvausta Sivunkuvauskieli Päämääränä ulkoasu Ei muuttujia Käytännön tasolla selain sietää virheet Mitään ei suoriteta, sivu vain näytetään tai ei Sivunkuvauskielissäkin mahdollista käyttää ohjelmointia (skriptikielet yms.)

16 CLT132 – kevät 2008Sauli Nurmi wiki markup wikin tapa ottaa vastaan sivunkuvausta Vrt. *ML-kielet (markup languages) Eri wikeillä eri koodaukset (valitettavasti) Esim. lihavointi Wikipediassa: ’’’sana’’’ Esim. lihavointi KitWikissä: *sana*

17 CLT132 – kevät 2008Sauli Nurmi wiki markup, jatkoa Esim. kursivointi Wikipediassa: ’’sana’’ Esim. kursivointi KitWikissä: _sana_ Molempien tuottama (X)HTML on kuitenkin samaa, eli sana ja sana

18 CLT132 – kevät 2008Sauli Nurmi Tärkeitä havaintoja Periaate eroista huolimatta sama Ulosnäkyvä lopputulos sama Koodin tasolla lopputulos sama Huomiokeinot wikeissä ja ”normaaleilla” www-sivuilla samoja wiki-kieli on eri asia kuin HTML- sivunkuvauskieli on eri asia kuin ihmisten luonnollinen kieli

19 CLT132 – kevät 2008Sauli Nurmi Mitä tästä opimme? (X)HTML:n näkökulmasta emme paljoakaan... mutta ideatasolla paljonkin Voidaan ajatella, että wikit ovat sivunkuvauskielen ylempi abstraktiotaso (eli ihmiskäyttäjä näkee vain wiki- liittymän, ei editoi suoraan HTML- koodia)

20 CLT132 – kevät 2008Sauli Nurmi Ylhäältä alas Kun on oppinut luomaan sivun editorilla, seuraava askel on oppia luomaan se käsin Tällä kurssilla ensi askeleen editorit ovat wikit, koska tieto on suoraan hyödyllistä (esim. KitWiki) Wiki on rakenteellinen dokumentti ja sivunkuvauskieli itsessään

21 CLT132 – kevät 2008Sauli Nurmi Viikon oleellisin asia Sisäistää sivunkuvauskielen toiminnan perusperiaate Ymmärtää editorien (esim. wikit) sisäisen notaation ja standardin WWW-notaation (HTML) välinen periaatteellinen ero Jos oppii jotain syvällisempää wikeistä, niin hyvä – jatkossa keskitymme kuitenkin nimenomaan (X)HTML:ään kooditasolla