Interaktiivinen lukion pitkän matematiikan kurssin 7 materiaali

(1)

Interaktiivinen lukion pitkän matematiikan

kurssin 7 materiaali

Pro-gradu tutkielma

Leo Martio

(2)

Matemaattis-luonnontieteellinen

Matematiikanja tilastotieteenlaitos

LeoMartio

Interaktiivinenlukion pitkän matematiikankurssin 7materiaali

Matematiikka

Pro gradu -tutkielma

Huhtikuu2015 61s.

verkko-opetus, interaktiivinenoppimateriaali,lukionpitkänmatematiikan7-kurssi Tutkielman aiheena on ollut tutkia onko mahdollista tuottaa sellainen

interak-tiivinen verkkosivu lukion pitkän matematiikan 7. kurssille (Derivaatta), missä

teorian lisäksi opiskelija pystyy tekemään kurssiin liittyviä tehtäviä ja saada niistä

automaattista palautetta. Sivustoltavaadittavia ominaisuuksia ovat matemaattisen

tekstin editori tehtävien tekemiseen sekä piirto-ja animaatio-ohjelmamatematiikan

havainnollistamiseen.

Sivustoa varten käytiin läpi useita jo olemassa olevia ohjelmia, joiden

perus-teella matemaattisen tekstin editori päätettiin tehdä itse ja piirto-ohjelmaksi

valittiin Geogebra-ohjelma. Geogebra on suunniteltu matemaattiseksi

havainnollis-tamisvälineeksi, jolla on helppo luoda matematiikan ongelmia visualisoivia kuvia

ja animaatioita. Lisäksi se on helppo upottaa internetsivustolle. Matemaattista

tekstiä tuottavaa editoria varten päädyttiin luomaan oma MathML-kieleen

perus-tuva tekstieditori, jolla voi kirjoittaamatemaattista tekstiä internetsivuilla. Sivusto

pitää sisällään teoriaosuudet raja-arvosta, jatkuvuudesta sekä derivaatasta ja pitää

sisällään 30 näihin liittyvää tehtävää. Jokaisesta tehtävästä on kolme eri versiota,

joistakäyttäjällearvotaansatunnaisesti yksi. Käyttäjä tekee tehtävän

matemattiik-kaeditoriin, jonka vastauksen ohjelma tarkistaa. Kun tehtävä saadaan suoritettua

hyväksytysti, saa käyttäjä pisteen. Editori on selainkohtainen, joten selain muistaa

jälkikäteenkin mitkä tehtävät käyttäjä on tehnyt. Käyttäjä voi myös tallentaa

tekemänsäratkaisut selaimenomaan muistiin myöhempää tarkasteluavarten.

Tutkimuksen tuloksena saatiin, että Derivaatta-kurssia varten on mahdollista

tuottaa kokonainen sivusto, jonka avulla koko kurssin suorittaminen verkossa on

mahdollista. Tutkielman sivusto ei käsitä koko kurssia, mutta kun siihen lisätään

kokokurssinteoriaja tehtävätsekäniidentarkistukseen tarvittavaohjelmisto(esim.

STACK), kokeet, keskustelualueen sekä oppilaiden hallintaan liittyvät sivut on

verkkokurssin läpikäyntiin tarvittava kokonaisuus olemassa. Tämän lisäksi sivustoa

varten laadittu matematiikkaeditori ja tehtävät mahdollistavat opiskelijoiden

har-joittelun tietokoneellatapahtuvaan matematiikankirjoittamiseen,jota vuonna 2019

suoritettavasähköinen matematiikanylioppilaskirjoitusvaatii. Tiedekunta/OsastoFakultet/SektionFaulty LaitosInstitutionDepartment

TekijäFörfattareAuthor

TyönnimiArbetetstitelTitle

OppiaineLäroämneSubjet

TyönlajiArbetetsartLevel AikaDatumMonthandyear SivumääräSidoantalNumberofpages

TiivistelmäReferatAbstrat

AvainsanatNykelordKeywords

(3)

1 Johdanto 1

2 Interaktiivisetmatematiikkasivustot 3

2.1 Internetsivustot . . . 3

2.2 Matemaattiset tehtäväsivut . . . 4

2.3 Matemaattiset pelit . . . 6

2.4 Matemaattiset animaatiotja piirto-ohjelmat . . . 7

3 Matemaattisen tekstin tuottaminen internetsivuille 7 3.1 CSS ja JavaSript . . . 8 3.2 MathML . . . 11 3.3 L A T E X . . . 14 3.4 Matematiikkaeditori . . . 14

4 Sivuston käyttötarkoitus ja valitut ohjelmat 15 4.1 Sivuston käyttötarkoitus . . . 15

4.2 Työjärjestys ja käytettyjen ohjelmienvalintaperusteet . . . 16

4.3 Ohjelmistonkoodi . . . 20 4.3.1 Sivuston HTML-koodi . . . 21 4.3.2 Sivuston CSS-tyyli . . . 26 4.3.3 JavaSript-koodit . . . 27 4.3.4 Matematiikkaeditorintoiminta. . . 28 4.3.5 Ohjelman MathML-koodi . . . 29 4.3.6 Geogebraosiot . . . 31

5 Ohjelman materiaalit, tehtävät ja käyttö 32 5.1 Wilsonin taksonomia . . . 33

5.2 Tehtävät . . . 34

5.3 Ohjelmantoimintakäyttäjän kannalta . . . 51

6 Pohdintaa 53 6.1 Sähköisen oppimateriaalintarve . . . 53

6.2 Matematiikkaeditorinmahdollisuuksia ja rajoituksia . . . 53

6.3 Tietokoneenkäyttö tulevaisuuden opetuksessa . . . 56

(4)

Liite A: Ohjelmaan sisältyvättiedostot

Liite B : Tehtävien ratkaisut ja tietokoneen hyväksymät vastaukset

(5)

Tutkimuksen tarkoituksena on ollut tutkia voiko lukiotasoiselle opiskelijalle

toteuttaa interaktiivisen verkkosivun, jossa opiskelija voi itsenäisesti tehdä

tehtäviäja saadatekemiseensä palautettasuoraantietokoneelta.Jos

verkko-sivun voi toteuttaa, niin tarkoitus on myös pienimuotoisesti tehdä tällainen

sivusto. Tutkimusta varten käytiin läpi useita jo olemassa olevia ohjelmia

ja päädyttiin rakentamaan niiden ja omien intressien pohjalta osittain oma

ohjelmisto sivuston toteuttamiseksi.

Kurssimateriaaliksivalikoitui lukionpitkänmatematiikankurssi 7

(Deri-vaatta)sen haastavanmatemaattisenkirjoitustavantakia.Kurssivaatii

teh-tävientekoavartenkunnollisenkirjoitusalustanmatemaattiselletekstille.

Li-säksi kurssissa tarvitaan havainnollistavia kuvia ja animaatioita,mitkä taas

vaativat hyvää piirto-ohjelmaa. Sivuston vähimmäisvaatimuksena oli siten

hyvänkirjoitusalustan ja piirto-ohjelmanlöytäminen/rakentaminen.

Tutkimusjakaantuu kuuteen lukuun, joissaluvussa 2esitellään

yleiskat-saus olemassa olevista matemaattisista sivustoista ja niiden toimintavoista.

Luvussa 3esitelläänmatemaattisentekstin tuottamiseensoveltuvia

editorei-ta ja niiden toimintaperiaatteita sekä esitellään matematiikan verkossa

ole-vanmatemaattisentekstin esittämiseen soveltuvia ohjelmointikieliä.Luku4

esittelee oppimateriaaliin valitun ohjelman toimintaa tietokoneen kannalta

ja luku 5 esittelee itse ohjelman toimintaa käyttäjän kannalta ja sivustoon

liittyvät tehtävät. Luvussa 6 on pohdintaa ohjelman mahdollisuuksista ja

rajoituksista sekä esitetään ajatuksia tulevaisuudesta. Lukujen jälkeen ovat

tutkielman viitteet 7 ja liitteet ohjelmakoodiin liittyvistä tiedostoista A ,

tehtävien vastauksistaratkaisuineen B ja matematiikkaeditorin

pääohjelma-koodista C .

Matemaattisia ohjelmistoja on paljon, mutta niiden, kuten esimerkiksi

Mathematia-ohjelman [1℄, käyttö on lukiotasoiselle opiskelijalle usein

tur-han hankalaa. Toisena ääripäänä ovat ylen abitreenien [2℄ kaltaiset

teksti-kenttiin perustuvatohjelmat,joissamonimutkaistenkäsitteiden kanssa

työs-kenteleminen on vaikeaa. Useat matemaattiset ohjelmat, kuten edellä

mai-nittu Mathmematia,ovat lukio-opiskelijoillemyösliiankalliita.

Matemaattisentekstintuottamiseeninternetissäeiolesaatukunnon

stan-dardia, jota selainohjelmat yhteisesti tukisivat [3℄. Erilaisia järjestelmiä on

tämän takia paljon. Suosituin matemaattisen tekstin tuottamiseksi

käytet-ty järjestelmä on L A

T

E

X-ladontajärjestelmä[4℄, sillä se tuottaa hyvin

selkeä-tämatemaattistatekstiä.Järjestelmäperustuu vapaankoodin T

E

(6)

X-ladonta-useimmillatietokoneilla samalta.Tähän perustuen on kehitetty erilaisia

oh-jelmia, jotka lukevat L A

T

E

X-koodia ja tekevät niistä sitten esimerkiksi kuva

tai PDF-tiedostoja, joita voidaan lisätä internetsivuille. L A

T

E

X-järjestelmä

ei kuitenkaan suoraan sovellu internetsivujen käyttöön, sillä internetsivuilla

käytettävä HTML-kielieiosaa lukeaL A

T

E

X-koodia.

Internetsivuihinliitettäväänmatemaattiseentekstiinonkehitelty

MathML-kieli[5℄,jokaonuusimmaninternetsivuihintarkoitetunHTML5[6 ℄-kielen

stan-dardoitu perusosa. HTML5-kielen standardiin ovat sitoutuneet kaikki

mer-kittävimmät verkkoselaimet: Google Chrome[7℄, MozillaFirefox[8℄, Internet

Explorer[9℄,Safari[10℄jaOpera[11℄.KoskaHTML5-kielieivieläolevalmis,

ei-vätselaimettuekaikkiaHTML5-kielenominaisuuksia,kutenMathML-kieltä.

Tällä hetkelläsitä tukevat vainMozillaFirefox- ja Safari-selaimet.

Useillainternetsivuillakäytetäänmatemaattisentekstintuottamiseenmyös

CSS-kieltä(CasadingStyleSheets).Tästäonesimerkkinämonellasivustolla

käytössä oleva Mathjax-ohjelmisto [17℄. CSS-kieltä tukevat kaikki

verkkose-laimet. Sitä ei kuitenkaan ole suoranaisesti kehitetty matemaattisen tekstin

esittämiseen, joten puhtaan matemaattisen tekstin tuottaminen pelkästään

CSS-kieltä käyttäen on melkohankalaa.

Vanhoja,pelkkääntekstiinperustuviaohjelmistoja,eienääjuurikäytetä.

Niidenongelmaonvaikeidenmatemaattistenlausekkeidenluettavuus,joskin

niiden käyttö tietokoneen kannalta on helppoa ja tätä menetelmää tukevat

kaikkiselainohjelmat.

Kaikkiin tekniikkoihin liittyy hyviä ja huonoja puolia, mutta tulin

it-se valinneeksi MathML-kieleen perustuvan sivuston. Suurin syy tähän oli

WYSIWYG-editorin(Whatyouseeiswhatyouget)helpohkototeutus,

jon-kaavullamatemaattisentekstin tuottaminenonhelppoamyös

lukiotasoisel-leopiskelijalle.Suurimpanaongelmanaratkaisussavoidaanpitääsen huonoa

yhteensopivuuttauseiden selainten kanssa.

Piirtämisohjelmia,jotkasopivatverkossa työskentelyyn,onuseita.Näistä

suosituimpana ainakin Suomessa voidaan pitää Geogebraa[19℄. Valitsin

tä-mänmyösitsesivustonhavainnollistamisohjelmaksi.Yksisuurisyytähänoli

sen helppo liittäminen omiin internetsivuihin. Tosin ohjelman käyttäminen

esimerkiksi kaupallisiin tarkoituksiin on kielletty ja sen lisensointi maksaa

useita tuhansiaeuroja.

Itse internetsivustossa käydään läpi lukion pitkän matematiikan kurssin

7 peruskäsitteitä: raja-arvo, jatkuvuus ja derivaatta. Koko kurssia ei käydä

(7)

teriaalissa on teoriaosuuksia sekä 30 tehtävää näistä aiheista, jotka

opiske-lija pystyy tekemään ja tarkastamaan itsenäisesti. Omat ratkaisut on myös

mahdollista tallentaa selaimen muistiin ja siten päästä niihin käsiksi myös

myöhemmin.

2 Interaktiiviset matematiikkasivustot

2.1 Internetsivustot

Internetsivut luodaan siihen suunnitellulla HTML-kielellä (Hypertext

Mar-kupLanguage),jonkakoodiainternetselainohjelmatosaavattulkita.Itse

koo-diavoidaan kirjoittaamillätahansatekstieditorilla taisilleerikseen

suunni-telluilla ohjelmilla. Koodi sisältää tietoa tekstin rakenteesta ja hierarkiasta.

Se voi sisältää myös hyperlinkkejä toisiin tiedostoihin. HTML-kielen uusin

versio onvuonna2014ilmestynytHTML5-kieli,jonkaapunainternetsivuilla

käytetään myösCSS- ja JavaSript-kieliä.

HTML-kielenrakenneosatkirjoitetaantunnisteiden(tagien)avulla.Tagit

merkitään kulmasulkeiden < > sisään. Tageilla voidaan kuvata monia eri

sivuilleliitettäviäelementtejä.

Esimerkki 1. Seuraavassa lyhyt HTML5-koodi,jokakuvailee kuvassa 1

olevaninternetsivun. <!DOCTYPE html> <html lang="fi"> <head> <meta harset="UTF-8"> <title>Sivun otsikko</title> </head> <body> <h1>1. tason otsikko</h1>

<p>kappale, jossa on tekstiä.

<br/>

<a href=" ">Linkki</a></p>

</body>

(8)

Vaikka HTML-kieli sisältää paljon matemaattisia merkkejä, ei sillä

pys-ty suoraan esittämään monimutkaisempia matemaattistamuotoiluja, kuten

murtolausekkeita,juurilausekkeitajadierentiaalilausekkeita.Pelkkä

HTML-kielitulkitseenevainmerkkijonoiksijatulostaaneselaimeentekstinä.

Moni-mutkaisemmat matemaattisettekstit pitää joko tulostaa kuvinatai käyttää

niitä varten kehitettyjä muotoilutekniikoita: CSS-, JavaSript- ja

MathML-kieliä.Näiden avullainternetsivulle voidaan myöslisätädynaamisuutta,

jot-ka tekevät sivuista monipuolisempia ja käyttäjän kanssa parempaan

vuoro-vaikutukseenpystyviä.

2.2 Matemaattiset tehtäväsivut

Internettiin onjulkaistu useita lukiotasoisiamatemaattisiasivustoja. Monet

niistä esittelevät matemaattistateoriaatekstien ja kuvienmuodossa.

Kehit-tyneemmätsivustotsaattavatsisältäämyösteoriaanliittyviätehtäviä,mutta

suurimmassa osassa niistä tehtävät ovat monivalintatehtäviä tai niiden

rat-kaisut on tehtävä käsin ja tarkastusta varten vastaus on annettu sivustolla

kirjallisesti tavallisten kirjojen tapaan. Joihinkin sivustoihin voidaan

tehtä-vienratkaisutkirjoittaatekstimuodossajakonetarkistaaannetutvastaukset.

Näistäesimerkkeinä ovatmm. (15.3.2015)

•

http://www.openmatikka.fi/

•

https://vw4.viope.om/

•

http://oppiminen.yle.fi/abi tree nit/

(9)

•

http://math.fi/pages/home

Lisäksi joillakin yrityksillä, kouluilla, yliopistoilla ja kustantamoilla on

omia kirjautumisen takana oleviasivuja, joissa voi tehdä interaktiivisia

ma-tematiikantehtäviä.

Tehtäviä voi tehdä myösjoillakin ulkomaisillasivustoilla. Näissäkin

suu-rin osa perustuu monivalintaan tai puhtaisiin tekstikenttiin eikä

monimut-kaisten matemaattisten ratkaisujen esittäminenniissä onnistu. Lisäksi

mak-sullisia ulkomaisia ohjelmistoa on paljon, mutta näihin en juurikaan

tutus-tunut.

Matemaattistakirjoittamistainternetissävoitehdäsilletarkoitetuilla

edi-toreilla, mutta niitä käyttäviä sivustoja oli hyvin vähän. Yksi esimerkki

täl-laisesti onemath.eu[26℄, jostavoiladata matemaattisiamateriaalejaja

teh-täviä omalle selaimelleen.Ohjelma sisältää seuraavat materiaalit

•

E-Math 1: Funktiot ja yhtälöt

•

E-Math 2: Polynomit

•

E-Math 3: Geometria

•

E-Math 4: Analyyttinen geometria

Tämäohjelma eikuitenkaan toimitehtävienosalta kuinMozilla

Firefox-selaimessa. Materiaaliavoi lukea milläselaimellatahansa.

Yhtenä syynä matemaattisen tekstin tuottamisen huonoon tilanteeseen

on, ettei siihen sopivaa standardia ole ja verkossa käytettävät selaimet

to-teuttavatstandardeja hyvinkin vaihtelevasti[3℄. Koska standardia eiole

on-nistuttuluomaan,onkehitettyerilaisiajärjestelmiä,jotkaeivättietenkäänole

yhteystyössä toistensa kanssa. Siten toisessa ympäristössä kirjoitettu

mate-maattinentekstieioleluettavissatoisessajärjestelmässäilmankoodin

muun-nostöitä. Tämä on johtanut monimutkaisiin ohjelmistoihinja tehnyt

mate-maattisen tekstin tuottamisen internettiin vaikeaksi.

Koodin tuottamisen vaikeus on johtanut myös siihen, että pitkän

mate-maattisen päättelyketjun tarkastaminenonvaikeaa.Oikeaanlopputulokseen

voidaanpäästä montakautta jatietokoneen tarkastaessakäyttäjän tekemää

tehtävääsenpitäisiollatietoinenkaikistanäistäerimahdollisuuksista.

Myös-kään pelkänvastauksentarkistaminen ei anna oikeaa kuvaakäyttäjän

päät-telystä. Käyttäjänajatusonvoinutollaaivanoikeajavirheonsyntynyt

(10)

taminenvaatiisitenmonimutkaistenalgoritmienperustan.Tällaisiaohjelmia

on myös kehitetty, kuten STACK [31℄, AIM [32℄ja Maple T.A. [33℄.

2.3 Matemaattiset pelit

Matemaattisiapelejäoninternetissärunsaasti.Neperustuvatkuitenkin

yleen-sähyvinyksinkertaisiinperiaatteisiin kuten yhteen-, vähennys, kerto- tai

ja-kolaskuun. Tehtävätyyppeihin kuuluvat usein myös geometrista

hahmotta-mista vaativat tehtävätsekä laskutoimitustenja geometrian sovellukset.

Monimutkaisempia tehtäviä tai muita pelaajia vastaan sisältäviä

sivus-toja on huomattavan vähän taine ovattasoltaan ala-kouluikäisille. Joitakin

http://www.rayonphysis.o m/

Edelläolevistapeleistäyksikääneiolepelkästäänmatematiikkaan

perus-tuva eikä niissä pysty pitkiämatemaattisiapäätelmiätallentamaanmuualle

kuin omaan päähän. Niiden käyttö perustuukin lähinnä nopeaan

päättely-taitooneikäomaanrauhallisestisuoritettuun päättelyketjuun, jota

matema-tiikassausein tarvitaan.

Pelkästäänlukiotasonmatematiikkaansuunnattujatietokonepelejäei

löy-tynyt lainkaan. Syynä tähän on varmasti myös sellaisen peli-idean

löytämi-nen, jotta siinä voitaisiin hyödyntää lukiotasoistamatematiikkaa.Vastaavia

oppitunneilla pelattavia pelkästään lukiotasolle suunnattuja

(11)

Internetissä olevia erilaisia piirto-ohjelmia on paljon. Suoraan

matemaatti-seenpiirtämiseen,kutenfunktioidenkuvaajienjageometristenmuotojen

piir-tämiseensuunnattuja ohjelmia onvähemmän ja niiden tasoon vaihtelevaja

usein hinnastariippuvainen. Kuitenkinuseita hyviä ilmaisia

materiaa-lin havainnollistamiseen. Itsepäädyin omassa sivustossaniGeogebraan, sillä

se oli minulle entuudestaan tuttu ja sitä käytetään myös useassa koulussa

matemaattisena apuvälineenä.

Geogebra ondynaaminen matematiikka ohjelmisto,jolla voi piirtää,

kir-joittaa, luoda animaatioita ja tehtäviä sekä ratkaista monia

matemaatti-sia ongelmia. Ohjelma perustuu Java-kieleen ja se tukee sekä L A

T

E

X- että

MathML -kieliä.Silleonolemassamyössuomenkielisetohjeet[34℄. Sen

eduk-sivoidaanhinnan(0

e

)lisäksilaskease,ettäsiinätehdytpiirrokset,tehtävät ja animaatiot on mahdollista upottaa helposti omille internetsivuille.

Geo-gebranlisenssitosinvaatii,ettäohjelmankäyttörajataanvainomaan

henki-lökohtaiseenkäyttööntailuokkahuoneessa tapahtuvaan opetustarkoitukseen

[28℄, joten sivuston käyttäminen luokkahuoneen ulkopuolella on kiellettyä.

Koska Geogebra oli tarkoituksiini tarpeeksi hyvä, en tutustunut muihin

oh-jelmiinkovinkaanmonipuolisesti.Onmahdollista,ettäniitäolisivoinutmyös

käyttääsivuston pohjana olevana graikkaohjelmana.

3 Matemaattisen tekstin tuottaminen

internet-sivuille

Matemaattista tekstiä ei voi suoraan tuottaa internetsivuille, sillä

(12)

CSS[12℄, JavaSript[13℄, MathML [5℄ja L A T E X[4℄. 3.1 CSS ja JavaSript

Internetin monimutkaiset tyylit, animaatiot, tekstikentät, lomakkeiden

hal-linnatjainteraktiivisetkomponentittarvitsevatHTML-kielenavuksilisäosia.

TärkeimmätnäistäovatnykyisenHTML5-kielenstandarditCSS-tyylitiedostot

[12℄ja JavaSript-komentokieli[13℄.

CSS-tyylitiedostolla voidaan antaa tyyliehdotuksia rakenteellisiin

doku-mentteihin,kutenHTML-dokumenttiin. HTML-dokumenttiinvoidaan

itses-sään lisätätagi<style>,jollavoidaanmuokata dokumenttiinliittyviä

tyyle-jä.Toinenvaihtoehtoonlisätätagi<linkrel="stylesheet"href="styles.ss"/>,

jolla ilmoitetaan, että dokumenttiin liittyy ulkoinen tyylitiedosto styles.ss.

CSS -tyylitiedosto on sitten yksinkertainen tekstitiedosto, jossa kerrotaan

mitä eri rakenneosiin liittyviä tyylejä käytetään.

Esimerkki 1.CSS-tiedoston teksti

h1 { olor:#0000FF; text-align:enter; font-family:Arial; font-size:32px; margin-bottom:0; }

kertoo, että HTML-dokumentin otsikko-tagille <h1> annetaan väriksi

nu-mero:#0000FF;(sininen), teksti tasataankeskelle, fonttinakäytetään

Arial-fonttia,fontinkokoon32pxjakentänmarginaalialhaallaon0px.Niitä

tyy-litietoja mitä CSS-dokumentissa ei anneta, ottaa alkuperäinen dokumentti

ne HTML-kielen oletusarvoista.

CSS-tyylitiedostoja voi antaa kokonaiselle sivulleja sivun osilletai

vaik-kapavainyksittäisillekappaleillejajopayksittäisillekirjaimille.Sillävoidaan

muokata myösMathML-kielentageja,jotensenavullapystyymuokkaamaan

koko matematiikan esitysasua internetsivuilla. Esimerkissä 2 on sivustolle

laaditun CSS-tiedoston editoriintarkoitetunMathML-koodin rakenteen

(13)

.mat { font-family:STIX-Regular; font-style:inherit; font-size:inherit; vertial-align:inherit; mathbakground:white;}

kuvaamat-nimisenluokanmuotoilua(Tämäonsivuston editorin

matemaat-tisentekstinmuotoiluunliittyväCSS-tyyli).FonttinakäytetäänSTIX-fontteja

jataustanakäytetäänvalkoistaväriä.Fontintyyli,kokojatekstinpystysuora

tasaus peritään ylemmältäluokalta.

CSS-tyylitiedostoillavoidaannykyääntehdähyvinmonimutkaisiakin

tyy-lejä ja sen avulla voidaan jopa kirjoittaa puhdasta matemaattista tekstiä.

KaikkinykyaikaisetselaimettukevatCSS-tyylejä,jotenniidenkäyttöei

juu-rikaan rajoita sivuston toimintaa millään selaimella. Selaimet tosin

toteut-tavatCSS-tyylejä hiukan erilailla,joten saman CSS-tyylin näkymä saattaa

vaihdellaselaimesta toiseen, kuten esimerkki 3 osoittaa.

Esimerkki 3.Allaolevassa kuvassa onpelkälläCSS-tiedostollaaikaansaatu

matemaattinen teksti neljälläeri selaimella.

Kuva 2:Matemaattista tekstiä pelkälläCSS-kielelläFirefox ja IE-selaimilla.

(14)

kaan kaikille selaimille yhteensopivaa tyyliä. HTML5-kielen standardin

ke-hittyessätyylivaihteluteriselainten välilläsaadaantulevaisuudessa

todennä-köisesti pienenemään.

HTML-kieleen voidaan upottaa myös JavaSript-komentokielen koodia.

JavaSript lisää internetsivujen toiminallisuutta, sallii käyttäjän rajoitetun

selaimen hallinnan ja antaa käyttäjälle mahdollisuuden muokata omaa

si-vunäkymää. Kaikki uudenaikaiset selaimet osaavat JavaSript-kieltä, joten

sen käyttäminen internetsivuilla on hyvin yleistä. Javasript-kieli lisätään

HTML-koodiin<sript> ja </sript> tagienväliin.

Esimerkki4.SeuraavaJavaSript-koodilisääHTML-sivuillehuomio-nimellä

merkittyyn kohtaan tekstin: Terve!

<sript>

doument.getElementById("hu omio ").i nner HTML = "Terve!";

</sript>

Myös muita toiminnallisuuden lisäämiseen tarkoitettuja tekniikoita on,

kutenPHP-,SQL-jaJQuery-kielet.Nämäperustuvatkuitenkin

palvelinpuo-lentekniikkaan,kuntaasJavasriptintoimintaperustuuasiakkaan(oman

ko-neen) puolella tapahtuvaan toimintaan. Palvelinpuoleen perustuvissa

kielis-säselain lähettääpalvelimellepyynnön toteuttaakielen pyytämäasia,jonka

palvelinsittentoteuttaaja lähettäätoteutuksen tuloksentakaisinselaimelle.

Itse tapahtuma siis tehdään palvelimella eikäkäyttäjän omassa koneessa.

Dynaamistenelementtien tuottamiseenJavaSripton kuitenkin kaikkein

yleisemmin käytetty kieli, sillä se on HTML5-kielen standardi. Yksi

suosit-tu JavaSriptiinja CSS:n perustuva ohjelma on MathJax [17℄, jonka avulla

on mahdollista tuottaa sellaista matemaattista tekstiä, jota kaikki selaimet

pystyvät näyttämään.

MathJax on avoimen koodin JavaSript ja CSS-kielten ohjelmisto,

jo-ka antaa käyttäjälle mahdollisuuden lisätä joko L A

T

E

X, MathML tai

Asii-Math koodilla kirjoitettua matematiikkaa internetsivuille. Sen tuottamaa

HTML-koodiaosaavatlukeakaikkiJavaSript-kieltätukevatselainohjelmat.

MathJaxin toiminta perustuu siihen, että se tunnistaa sivulla olevan

koo-din ja muokkaa sen selaimen tunnistettavaan HTML-muotoon. Tätä

var-ten MathJax-sripti onliitettäväsivulle, jossasitähalutaankäyttää.Tämän

voi tehdä suoraan internetin kautta lisäämällä oman sivun HTML-koodin

(15)

MathJax.js?onfig=TeX-AMS-M ML_H TMLo rMML '></ sri pt>

Tämähakee MathJax-objektin, joka muuttaatunnistamansa L A

T

E X,

MathML ja AsiiMath kooditselaimellesopiviksi.

Koko MathJax-ohjelmiston voi myösladata omalle koneelleen, joten sitä

ei tarvitse käyttää ulkoisen palvelimenkautta. Koodion myös

muokattavis-sa, joten sen tuottamaa koodia ja tyylejä on mahdollista muuttaa

halua-mansa näköiseksi. MathJax on kuitenkin suhteellisen raskas ohjelma ja sen

käyttäminensivustollahidastaasivunlatautumista.MathJax tekee

muutos-työnsä aina sivun latauduttua,joten sen käyttäminen dynaamisten

HTML-tekstikenttien ja -editorien apunavälineenä onvaikeaa [21℄.MathJax on

kui-tenkinsuosituinohjelmamatemaattisentekstinesittämiseeninternetissä,jos

sivuston halutaannäkyvänkaikilla selaimilla.

3.2 MathML

MathML-kieli [5℄(MathematialMarkup Language) on eräs XML-kielen[14℄

sovellus. XML-kieli on yleisstandardi merkkauskielistä, joilla tieto voidaan

kuvata rakenteellisesti.XML-kielelläilmoitetaanitse tiedonlisäksimyös sen

rakenteellinen osa: tiedon nimi, tyyppi ja sen ominaisuudet. XML-kieli

pe-rustuudataa kuvaavienelementtien janäidenominaisuuksienmäärittelyille.

Koodiltaan se on samantapaista kuin internetsivujen tekemiseen

tarkoitet-tuHTML-kieli.Erosiihen onkuitenkinsuuri, silläHTMLonmerkkauskieli,

jolla kuvataan tekstin rakenne ja sevoi sisältäähyperlinkkejä. XML-kielellä

taas luodaanmerkkauskieliä, joistayksi sovellus on juuriMathML-kieli.

MathML-kielellä on tarkoitus esittää matemaattista tekstiä siten, että

sen koodiavoidaanlaittaaHTML-kielen sekaan.Se onWC3-ryhmän (World

Wide Web Consortium)[16℄ suositus matemaattisen kielen esittämiseksi

in-ternetsivuilla. Se myös sisältyy HTML5-kielen standardeihin, joka taas on

vuodesta 2014 alkaen suosituskieli kaikille internetsivuille ja jota kaikki

se-lainohjelmat pyrkivät ensisijaisesti tukemaan. MathML-kielen uusin versio

on MathML3, joka yksinkertaistaa vuonna 2001 ilmestynyttä

MathML2.0-kieltä.MathML3-kielen ensimmäinenversio julkaistiin vuonna 2009[15℄.

VaikkaMathML-koodion samantyyppistä kuin HTML-koodi,on se

kui-tenkin tiukempaa (strit)kuin HTML-kieli,jota voikirjoittaa melkoväljien

(loos) sääntöjen mukaan. Tämä tarkoittaa sitä, että MathML-kielessä

(16)

petetaantagilla </math>.

Esimerkki 5.SeuraavassaMathML-koodi,jokaesittäämatemaattista

teks-tiä

1

2

x

2

: <math> <mfra> <mn>1</mn> <mn>2</mn> </mfra> <msup> <mi>x</mi> <mn>2</mn> </msup> </math>

Tagilla <mfra> ilmoitetaan, että tästä alkaa jakolasku. Siihen kuuluu

aina kaksi osaa: ensimmäinen on osoittaja, toinen nimittäjä. Tagilla<mn>

(math number) ilmoitetaan, että kyseessä on numero tai vakio. Muita

vas-taavia merkintöjä ovat <mi> (math identier) ja <mo> (math operator).

Tagilla<msup> ilmoitetaan, että tästäalkaaylätunniste. Tähänkinkuuluu

aina kaksi osaa: ensimmäinen ilmoittaa ylätunnisteen perusosan ja

jälkim-mäinen itse ylätunnisteen.

Useammanrivintiedotkerätään<mrow></mrow>-tagienväliin,kuten

esimerkin 6 MahtML-koodi osoittaa. MathML-koodilla on kaikki

tarvitta-vat elementit kuvaamaan mitä tahansa matemaattista tekstiä. Tarvittavat

(17)

Esimerkki 6.Jakolasku

x

+1

x

−

1

esitetään muodossa: <math> <mfra> <mrow> <mi>x</mi> <mo>+</mo> <mn>1</mn> </mrow> <mrow> <mi>x</mi> <mo>-</mo> <mn>1</mn> </mrow> </mfra> </math>

Selainohjelma joko osaa tai ei osaa lukea MathML-koodia.

MathML-koodin tunnistava selain sijoittaa MathML-koodin mukaisen tekstin siten

kuin seon matemaattisestitarkoitettu. Josselain ei tunnistakoodia, se

jät-tää tagit huomiottaja tulostaatekstin pelkkänä tekstinä.Esimerkin6.

jako-laskun

x

+1

x

−

1

tekstistä se tulostaisix+1x-1.

MathML-kielessäonpaljontoimintoja,joillavoiitse muokata

matemaat-tisenesitysmuodontulostustapaa.Yläindeksejä,alaindeksejä,matriisienosia

jamoniamuitamerkkejävoidaanesittäämonellatavallaohjelmoijanniin

ha-lutessa.EsitystavoillaonHTML-kielenmukaisestialkuarvot,joitakäytetään,

jos ohjelmoijaei tee niihin muutoksia.

MathML-koodiin voi lisätä myös CSS-muotoiluja, jolloinkoodin

käsitte-leminen helpottuu. Yhdistelemällä HTML, CSS ja MathML-kieliä saadaan

internetsivuilleaikaiseksi melkotasokasta matemaattistatekstiä (Kuva4).

(18)

ta tue tällä hetkellä kuin kaksi selainta: Mozilla Firefox ja Safari-selaimet,

joistaSafaristakinvainkaksiuusintaversiota Safari7jaSafari8.Muille

selai-milleonkinkehitelty erilaisiamenetelmiäesittääMathML-koodia

internetsi-vuilla.Yleisimminkäytössä onaiemminesilläollutMathJax-ohjelmisto,joka

muokkaaMathML-koodin kaikilleselaimillesopivaksi.

3.3 L A T E X L A T E

X[4℄ on ladontajärjestelmä, joka on kehitetty juuri matemaattisen

teks-tin tuottamiseen.Tämäkin tutkimus onkirjoitettu käyttäen L A

T

E

Xladontaa.

Se sisältääpaljontoimintoja,jotkahoitavatkirjoittajanpuolestaulkonäköön

liittyvät asiat, kuten automaattiset rivi- ja sivujaot, kuvien ja taulukoiden

asettelut, viittaukset ja sisällysluettelon. Käyttäjä voi halutessaan

muoka-ta näitä, mutta L A

T

E

X:lla on automaattisesti useita eri dokumenttityyppejä

hoitamaan nämä asiat.

L A

T

E

X-dokumenttikirjoitetaansitätukevallatekstieditorilla.Dokumentti

sitten käännetään käännösohjelmalla, joka tuottaa tekstistä DVI-tiedoston.

Tämävoidaanedelleen muuntaaPDF-taiPS-tiedostoksi.Näitävoidaan

sit-ten katsoa erilaisillakatseluohjelmilla.

Matemaattisen tekstin tuottamiseen L A

T

E

Xon selvästi suosituin

menetel-mä,silläsen tuottamamatemaattinenteksti onselkeääjakaunista.

Internet-sivuilla sitä ei kuitenkaan voi käyttää, sillä selaimet eivät osaa suoraan

liit-tää L A

T

E

X:ntuottamiaDVI-, PDF- eikä PS-tiedostoja HTML-koodiin. Tätä

varten niistä on muodostettava kuvatiedostoja, jotka sitten voidaan liittää

HTML-koodiin. Nykyään tosin on ohjelmistoja, jotka pystyvät

JavaSript-tai Java-kielellä muuttamaan L A

T

E

X-koodin selaimen luettavaan muotoon,

joista suosituinonedellä mainittuMathJax.

3.4 Matematiikkaeditori

Internetsivuillakirjoitettavanmatemaattisentekstin tuottamiseen

tarkoitet-tuun editoriinvoidaankäyttääHTML-ja JavaSript-kielten kanssa

yhteys-työssä sekäCSS-, MathML-,ja L A

T

E

X-kieliäsekänäidenyhdistelmiä.

Useim-matjoolemassaolevatsivustotkäyttävätL A

T

E

X-kieltäpääasiallisena

esitysta-pana matemaattiselletekstille.PelkästäänCSS- ja MathML-kieliäkäyttäviä

(19)

LT

E

X:in perustuvat sivustot tuottavat kaunista matemaattista tekstiä,

mutta ongelmana on, että kirjoittaja ei itse tuota kirjoittamaansa tekstiä

vaan tietokone tekee kirjoittajan tekstistä (yleensä) kuvatiedoston, joka

sit-ten tulostetaan kuvaruudulle. Tällainen eroaa useimmille käyttäjille

tutus-ta WYSIWYG-editorista (What you see is what you get) ja tuottaa siten

hankaluuksia varsinkin pidemmissä matemaattisissateksteissä. Lisäksi

teks-tin tekeminen onsuhteellisenhidasta, silläkirjoittaja joutuu kirjoittaessaan

katsomaansekäkirjoittamaansatekstiäettätietokoneenmuokkaamaakuvaa

tekstistä.Hyvänä puolenaonnäidenohjelmiensopivuususeimmille

selaimil-le.

MathML-koodiinperustuvia sivujaonvainkourallinen,silläniiden

käyt-täminen kaikillaselaimilla eionnistu. Myöskään CSS-kieleen perustuvia

oh-jelmiaeiolemontaa,silläkuten MathML-kielen,niinmyösCSS-kielen

stan-dardointionvieläkesken. Näitäonkuitenkinviimeisenvuoden aikana

ilmes-tynyt joitakinkuten esimerkiksi MathQuill[18℄

4 Sivuston käyttötarkoitus ja valitut ohjelmat

4.1 Sivuston käyttötarkoitus

Tutkimuksen aiheena oli, jos mahdollista, tuottaa lukion pitkän

matematii-kan kurssi 7 (Derivaatta) opiskelumateriaalia ja sellaisia tehtäviä, joita voi

ratkaista verkossa työskennellessä. Tietokoneen pitäisi pystyä tarkistamaan

käyttäjän antamattehtävienratkaisutantaen niistä hetipalautetta.

Opiske-lijalla pitäisi olla myös mahdollisuus tallettaa ratkaisunsa mahdollista

myö-hempäätarkasteluavarten.Sivustollapitäisimyösollapiirtämistävarten

ole-vaohjelmisto,jota voisikäyttääteorianja esimerkkien havainnollistamiseen

sekä tehtävientekemiseen.

Sivustontehtävienolisitarkoitustoimiapelinkaltaisestielisuoritettuaan

tehtävänhyväksytysti olisiosiosuoritettuja siitäsaisipisteitä.Tehtäväksiei

ainamyöskäänsaisisamaatehtäväävaan konevalitsisisatunnaisestiannetun

tehtävän tietyistä tehtäväkokoelmista. Näin materiaalin uudelleen

läpikäyn-nissävoisisaadauudentehtävän,jokatekisiuudelleenlaskemisen

mielenkiin-toisemmaksi.Tämä pakottaisi myös oppitunnillaoppilaiden tekemään omat

ratkaisunsa, sillä vieressä olevilla oppilailla ei välttämättä olisikaan samaa

tehtävää.

(20)

mukai-joitustehtäviä, kuvaajien tulkintaa ja/tai niiden avulla ratkaistavia tehtäviä

sekä pidempiä funktioiden aukikirjoittamiseen liittyviä tehtäviä. Näin

saa-taisiin selville,mitkätehtävätsopivattällaiseentietokoneellakirjoitettavaan

editoriin jamitkä eivät.

Aloitinedellämainittujenominaisuuksientutkimisenjovalmiinaolevista

ohjelmista, joista oli tarkoitus valita käyttötarkoitukseen sopivimmat

ohjel-mat ja yhdistää ne sivustollatoimivaksikokonaisuudeksi.

4.2 Työjärjestys ja käytettyjen ohjelmien

valintaperus-teet

Koska tehtävät on tarkoitus ratkaista ja kirjoittaa tietokoneella, oli

ensim-mäisenä tehtävänä löytää sivustonpohjaksisellainentekstieditori, jota voisi

käyttää matemaattisentekstin tuottamiseen verkkotyöskentelyssä. Tällaisia

editoreja olipaljon, joskin niiden hinnatvaihtelevat suuresti.

Aloitineditoreihin tutustumisen toukokuussa 2014. Tutustuin 27 eri

oh-jelmaan,joistauseat hylkäsin nopeastiniidenhinnan,

verkkotyöskentelyomi-naisuuksien tai huonon käytettävyyden takia. Tutustuessani ohjelmistoihin

tulin ainakin itse johtopäätökseen, että parhaiten toteutetut editorit olivat

ns. WYSIWYG-editoreita, joiden käyttämiseen ei tarvinnut osata lainkaan

tekstin latomiseen tarkoitettuja kieliäkuten L A

T

E

Xtai MathML. Tämä

aina-kin helpottaa lukiotasoisen opiskelijankirjoittamista,kun voikeskittyä vain

matematiikankirjoittamiseeneikä kielen koodin opetteluun.

Hyväänohjelmaankuuluisimahdollisimmanlaajanmatemaattisten

merk-kien ja muotoilujen kattaminen sekä tekstin tallentaminen ja avaaminen.

Koska tekstiin pitäisi myös päästä käsiksi tehtävien tarkistuksen kannalta,

pitäisi editorintekstiin päästäkäsiksi,jottasitävoitaisiintutkia esimerkiksi

JavaSript-kielellä.

Seuraavansivuntaulukossa ovateditorit,joihintutustuin sekäniiden

(21)

(22)

min:

•

Alfred's equationeditor

•

Fmath Editor

•

Mathdox Formulaeditor

Lähetinohjelmienoikeuksienomistajillesähköpostiakesäkuun2014

alus-sa mahdollisista editoriin liittyvistä maksuista ja lähdekoodin saamiseksi.

Näihin vain yhteen vastattiin kaksi kuukautta myöhemmin, jolloin Alfred's

equation editorinhinnaksi ilmoitettiin6000$/sivusto. Hylkäsin tämän

vaih-toehdonsilloin, vaikkaeditori muuten tuntuikintoimivalta.FmathEditorin

jätin kesän aikana myös pois sen hieman hankalalta tuntuvan

käyttöliitty-män takia.Ainoaksi tutkittavaksi jäi siten Mathdoxin Formulaeditor, jonka

lähdekoodiolivapaastiinternetissäladattavissaja käyttäjänuudelleen

muo-kattavissa.

Aloitin MathDox Formulaeditorin lähdekoodin tutkimisen kesäkuun

ai-kana. Ohjelmakoodi oli laadittu ilman ohjeita, joten sen tutkimiseen meni

paljonaikaa.Enmyöskään saanutvastauksiasähköpostilla lähetettyihin

tie-dusteluihin,jotenkoodin tutkiminenjäiomantietotaitonivaraan.Ohjelman

kehittäminen oli tosin tehty jo vuosina 2007-2008 eikä sitä sen jälkeen ole

enää kehitetty.

OhjelmaolitehtysekäHTML-ettäJavaSript-kielellä.Enkuitenkaanitse

ollutaikaisemminJavaSript-kielelläohjelmoinut,jotenlähdekoodin

tutkimi-seen meni useampikuukausi. Kesänloppuessa olinjooppinutkieltäsen

ver-ran, että ymmärsin pääpiirteittäin ohjelman toiminnan. En kuitenkaan

on-nistunutmuokkaamaansitähaluamallanitavalla.Enesimerkiksi onnistunut

lisäämääneditorin valikoimiin kurssilla 7 vaadittavaaraja-arvonmerkintää:

lim

x

→

0

f

(

x

)

.

Lisäksi editorin käyttämä HTML-kielen anvas-toiminto sitoi editorin

teks-titilan pieneksi, jotaen onnistunutsuurentamaan.

Syyskuussa 2014 olin oppinut JavaSript-kieltä sen verran hyvin, että

ymmärsin miten HTML5-kielen ja sen yhteistoiminnalla voitaisiin

toteut-taa käyttäjän muokattavissa oleva kenttä, joka lukee ja kirjoittaa

(23)

nen tätä tuli kuitenkin ratkaistavaksi,kannattaako editorin tekeminen

lain-kaan, silläongelmaksi saattaisi tulla editorin huono käytettävyys ja sen

yh-teensopimattomuus selainohjelmien kanssa.

VaikkaHTML5onkaikkienselainohjelmienkäyttämästandardi, tukevat

selaimet sen osia sekalaisesti. MathML-kieli on WC3[16℄ -ryhmän suositus

HTML5-kielen matemaattisentekstin tueksi.Kuitenkinvainkaksi

merkittä-vääselaintatukee MathML-kieltä:MozillaFirefoxsekäSafarijaSafaristakin

vainuusimmatversiot7ja8(Maaliskuu2015).Myösjotkutharvinaisemmat

selaimetlukevatMathML-kieltä.Hyvänäpuolenataasolise,ettäsuurimpaan

osaanlaitteistaonsaatavissailmaiseksijokoMozillaFirefoxtaiSafari.

Mozil-laFirefoxinvoiasentaakaikkiinWindows-tietokoneisiinsekäuusimpiin

Win-dows8puhelimiinjapadeihin.SensaaasennettuamyösAndroid-järjestelmän

laitteisiin(puhelimiinjapadeihin).Applen tekemiinlaitteisiin(iPad,iPhone

jaMa-tietokoneet)MozillaFirefoxiaeisaasopimussyistäasennettua.Tähän

ollaan kuitenkin yrittämässä muutosta vuoden 2015 aikana[22℄. Vastaavasti

Applen laitteisiinsaa kuitenkin asennettua Safari-selaimen, joten

MathML-kieltäpystyylukemaanläheskaikkienvalmistajienlaitteilla.Koskaselainten

valmistajatovatsitoutuneetpysymäänHTML5-kielenstandardissa,onsiten

mahdollista, että tulevaisuudessa yhäuseampi selain tukee MathML-kieltä.

Elokuun aikana onnistuin tekemään testejä, joiden avulla onnistuin

pää-semäänerooneditorinsuurimmistakäytettävyysongelmista.Sitenpäätin

ko-konaan luopua MathDox Formulaeditorin liittämisestä sivuille ja aloin

ra-kentamaankokonaanomaamatematiikkaeditoria,jokaperustuisiedellä

mai-nittuihinMathML- ja JavaSript-kieliin.

Syyskuussa 2014aloitinkoodaamaan editoria,jonkaensimmäiset

käyttö-kelpoiset versiottulivatvalmiiksimarraskuun loppuun mennessä. Olin tässä

vaiheessa jo kirjoittanut kurssin matemaattisen teorian ja esimerkit lähes

kokonaan, sillä olin jo aikaisemmin valinnut havainnollistavaksi

ohjelmak-si Geogebra-sovelluksen. Tämäauttoi kuvien, animaatioidenja piirtämiseen

liittyvientehtävien suunnittelussa.

Geogebra oli havainnollistamisvälineenvalintana helppo. Muita yhtä

kä-teviäomillesivuilleliitettäviäpiirto-ohjelmiaeiollut.LisäksiGeogebra

sisäl-tää MathML-tuen, joten tulevaisuudessa tekemäni matematiikkaeditorin ja

Geogebranyhdistäminenkinvoisiollamahdollista.TosinGeogebran

liittämi-nen omillesivuillevaatiilissensoinnin,jonkahintaonuseita tuhansiaeuroja.

Tämä täytyisi tehdä,jos sivusto on tarkoitus julkaista yleiselle palvelimelle.

(24)

silläpystyi tuottamaan kelvollista matemaattistatekstiä.

Tammikuussa2015 editorinlopullinenmuoto olivalmislukuun

ottamat-ta pieniä yksityiskohtien muutoksia ja saman kuun loppuun mennessä

kaik-ki materiaali kurssia varten oli valmiina. Editorin testaus jäi kohtuullisen

pienelle, joten se saattaa edelleen joissakin tilanteissa mennä sekaisin.

Li-säksi Safari-selaimen testaus jäi kokonaan, sillä tein koodaustyön kokonaan

Windows-käyttöjärjestelmällä eikä tähän ole mahdollisuutta saada

Safari5-selaintauudempaaversiota.Editoriakehittämistävoisiedelleenjatkaasiten,

että setuottaakauniimpaa matemaattistakoodia,muttaparempaanei ajan

ja taitojen puutteen takia ainakaan vielä päästy. Sivuston nykyinen muoto

tuli valmiiksi15.3.2015.

4.3 Ohjelmiston koodi

Ohjelmakäyttääkolmeaeritietokonekieltä:HTML5jaMathML-kieliä

merk-kaukseenjaJavaSript-kieltädynaamisuudensaamiseensivuille.Lisäksi

käy-tössä onmyösCSS-tyylitiedostoerilaisilletyyleille.Nämätiedostotkokoavat

sivuston sitten yhtenäiseksi kokonaisuudeksi.

Sivuston perustana on HTML5-koodi, jolla luodaan teoria ja

tehtäväsi-vut. MathML-koodia käytetään tekemään sivuston matemaattiset esitykset

sekä teoria- että tehtäväsivuille. JavaSript-koodi lisää sivustolle

dynaami-suuden, kuten matematiikkaeditorinja sen kaikki toiminnot. Se pitää myös

yllä tietoja käyttäjän tekemistä tehtävistä, pistelaskusta, ratkaisujen

tarkis-tamisestasekäniidentallettamisestajaavaamisesta.CSS-tyylitiedostoa

käy-tetään lähinnä sivuston samankaltaisen tyylin saamiseksi, joskin siellä on

myös erikoistyylejä matematiikkaeditorinavuksi.

Sivuston tyylit, kuvat ja koodaus ovat kokonaan allekirjoittaneen

käsia-laa lukuun ottamatta seitsemää editorin kuvakekuvaa sekä kahdeksaa

ääni-tiedostoa, jotkaon ladattuseuraavilta sivustoilta (15.3.2015):

•

http://www.ionarhive.om

•

http://www.freesfx.o.uk/

•

http://www.soundjay.om/

Sivustolla olevatkuvat ja äänet ovat täysin vapaassa käytössä ilman

(25)

Sivuston perustana on eriteoriasivujen ja tehtäväsivujen HTML5-koodi.

Si-vuston aloitus on, kuten yleensäkin, index.html-niminen tiedosto.Tämä

oh-jaa käyttäjän etusivu.html-nimisellesivulle. Sen hierarkkinen koodi on

seu-raava:

<!DOCTYPE html>

<head>

<title>Differentiaalilaske ntaa </ti tle>

</head>

<enter>

<span id="ylaotsikko">Different iaal ilas kent aa</ span >

</enter>

</div>

<h2>Tervetuloa Differentiaalilaskennan pariin</h2>

<p>

Näiden sivujen ...

</p>

<p>

(26)

</p>

<p>

Joissakin esimerkeissä ...

<a href="http://www.geogebra .org /" target="_blank">geogebra </a>

<a href="ohjeet.html">Ohjeet </a>

</p> <p> Sivut sisältävät... <NOSCRIPT> </NOSCRIPT> </p> <enter> <p>Paina tästä ...

<button onlik="nollaa();">Aloita pistelasku</button>

</p>

<p>

<br/>

<button onlik="if(onfirm('Tyhjen nät koko muistin!'))

{muistinnollaus();};">Tyhje nnä koko muisti

</button>

</p>

</enter>

</div>

&COPY Leo Martio

</div>

</body>

</html>

Koodin tuottama sivu selaimellaluettuna onkuvassa 5. Tämä sama

(27)

Dokumentinalussaoleva<!DOCTYPEhtml>kertoodokumentinolevan

HTML5-spesikaation mukainen. Seuraava tagi ilmoittaakäytettävän

html-ja xml-kielen olevan suomi. Tagi <head> ilmoittaa, että tästä alkaa

doku-mentinotsikkotiedotjaneloppuvatmyöhemmin</head>tagiin.Tämä

kos-kee kaikkiatageja elikaikillatageillaon</>tag, sillädokumentissa voiolla

myös MathML-koodia, joka vaatii tagiensulkemiset. Tagi<title> ilmoittaa

otsikonnimenja<meta>tagitkuvailevattiedostonyleisiätietoja,joista

tär-keimpänänäistätietoharset=UTF-8,jokailmoittaa,ettäkäytetty

merkis-tö on UTF-8 -standardin mukainen (Universal Charrater Set - 8Bit). Tätä

merkistöä käyttää suurin osa nykyisistä internetsivuista [23℄ ja se käsittää

yhteensä

1112064

merkkiä. Näihinsisältyy myösuseitamatemaattisia

merk-kejä. Tagi<link> liittää dokumenttiin käytettävän CSS-tyylitiedoston

graf-fat.ss. Tämän jälkeen ovat toiminallisuuteen liittyvät JavaSript-tiedostot

pisteet.js, nollaus.js ja muistintyhjennys.js.

Head-osion jälkeen alkaa itse dokumentin sisältö, jonka käyttäjä näkee

internetsivustolla. Se alkaa <body> tagilla, jossa on myös

toiminallisuu-teen liittyvä käsky onload, jolla ilmoitetaan, että ladatessa sivusto tehdään

Alkutoimet()-niminen JavaSript-funktio. Tämä löytyy aikaisemmin

sivus-toonliitetystäpisteet.js tiedostosta.

Sivusto on jaettu viiteen eri päälohkoon <div> tageilla. Ensimmäinen

(28)

id=otsake>,jokamääritteleesivustonotsikonosuuden.Seuraavanaon

<s-ript sr=menu>, joka tulostaa valikko-tiedoston sivuston vasempaan

reu-naan. Tämä tehdään erikseen JavaSriptillä siksi, että valikko-tiedosto on

kaikille sivuston sivuille sama ja sen koodin muuttaminen vaatisi

muutta-mista jokaiselle sivulle erikseen, joka vaatisi paljon töitä ja lisäisi virheiden

mahdollisuutta.Valikonjälkeentuleesivustonsisältö<divid=sisalto>,

jo-hon etusivun asiat tulevat. Tähän kohtaan avautuvat myös muiden

menu-valikonlinkit.Etusivullasepitää sisällääntekstiä (kappaletagit<p>),

teks-tin muotoiluja (<span> ja <enter> tagit), linkkejä (<a> tagit) sekä

nap-puloita (<button> tagit. Viimeinen lohko on alareunan määrittelevä <div

id=alake>. Lopuksi dokumenttisuljetaan </html> tagilla.

Sivuston ohje ja teoriasivut ovat määrittelyiltään hyvin samankaltaisia

kuin etusivu. Ero on ainoastaan sisällössä, sillä siellävoi olla näiden lisäksi

myös MathML-koodia, kuvia sekä Geogebra-sovelluksia.

Tehtäväsivut hiemanpoikkeavat etusivusta, silläniissä on enemmän

toi-minallisuutta kuvaavia JavaSript-tiedostoja. Esimerkkinä tästä tehtävän 1

kooditehtava1.html,jonka tuottama sivu onkuvassa 6.

(29)

<head>

<title>Tehtävä 1</title>

</head>

<enter>

<span id="ylaotsikko">Different iaal ilas kent aa</ span >

</enter>

</div>

<div lass="tehtava">Tehtävä 1</div>

<p>

</span>

</p>

</div>

&COPY Leo Martio

</div>

</body>

(30)

tieto saadaankahdesta <head>-lohkossa ja yhdestä <body>-lohkossa

mää-ritellyistä JavaSript-tiedostoista:

•

editori.js - sisältääkaikkieditorin toimintaan liittyvätfunktiot

•

t1ab.js - sisältää kolme eri tehtävävaihtoehtoa (joista yksi satunnai-sesti valitaan) sekä niitä vastaavat editorin vastausvaihtoehdot ja

tar-kistukset.Nämäonnimettyv1a.js,t1a.js,v1b.js,t1b.js,v1.jsjat1.js.

•

edprintti.js - tulostaaeditorinsivulle

Nämätiedostot tuottavat käyttäjälle tehtävät, editorin ja tehtävien

tar-kistukset.Näidenlisäksionmääriteltymyösdynaamisuuttalisäävätpisteet.js

ja äänet.js sriptit, jotka lisäävätsivustolle pistelaskunja äänet.

LiitteessäA onnimetty kaikki sivustoonliittyvättiedostot.

4.3.2 Sivuston CSS-tyyli

SivustollakäytetääntyylitiedostonaHTML5-kielenstandardiosaaCSS:ä,

jo-ka luodaan yhdellä CSS-tiedostolla graat.ss. Siellä määritellään koko

si-vuston tyylitniintaustavärien, kappaleiden,otsikoiden,kuvien, taulukoiden

kuin editorinkinosalta.

CSS-tiedostosta löytyy määrittelyjä myös yksittäisille merkeille, kuten

editorintulostamilleintegraalimerkeille

R

,jakolaskuille

a

b

,juurimerkeille

x

√

n

ja muillematemaattisillemerkeille. JavaSript koodillavoidaanvaihtaa

jon-kin osion tyyliä käyttäjäntoimien mukaan. Tästäesimerkkinä menu-valikon

Tehtävä[numero℄-sanat,joillevaihdetaanväriäsen mukaanonkotehtävä

suo-ritettu vai ei.Näihin liittyvätkaksi CSS-määritystä:

a.t{olor:#FF0000;}

a.g{olor:#009900;}

JavaSript-koodilla voidaan vaihtaa linkkitagin <a> luokkaa t ja g

vä-lillä. Luokka t on väriltään #FF0000; (punainen, vastaa tekemätöntä

teh-tävää) ja luokka g on väriltään #009900; (vihreä, vastaa tehtyä tehtävää).

(31)

Sivuston JavaSript-koodit luovat sivuston toiminallisuuden. Ne valitsevat

satunnaisestitehtävät,tulostavatne sivustollejatarkistavatkäyttäjän

anta-mat vastaukset.Nemyösmahdollistavateditorintoiminnan,tuottavatäänet

ja toteuttavat pistelaskunoheistoimintoineen.

Ensimmäisenä kutsuna sivuilla on yleensä JavaSript-funktio

Alkutoi-met(). Tämä sijaitsee pisteet.js-nimisessä tiedostossa ja se tarkistaa mitä

selainta käytetään sekä toteuttaa pisteiden tulostuksen ja niihin liittyvien

värien muutokset.

Selaimentarkistustehdään,jottakäyttäjällevoitaisiinilmoittaa

käyttää-kö hän MathML-koodia tukevaa selainta. Ilman tätä tukea sivuston editori

eitoimieikätehtäviäpystysivustollatekemään.JosMathML-tukeaeilöydy,

lisää koodi sivustolle myös MathJax-sriptin, jotta sivuston teoria-osuudet

kuitenkin näkyisivät.Sivustoa voi sitenkäyttäämateriaalinosalta opiskelun

tukena, vaikka tehtäviä eipystyisi tekemään. Selaimentunnistukseen

käyte-tään JavaSriptin navigator.userAgent-nimistä ominaisuutta,joka ilmoittaa

käyttäjän selaimentiedot.Tämäeiolemitenkään täysinvarmatapa

määrit-tää käytettävää selainta, sillä userAgent-tietoja pystyy muuttamaan ilman,

että ominaisuussitähuomaa.Seonkuitenkinsuhteellisenyksinkertainen

to-teuttaa ja toimiiuseimmissa tapauksissa moitteettomasti.

Pisteet tulostetaan JavaSriptin innerHTML-ominaisuuden avulla

sivus-ton otsake-lohkoon. Samalla tarkastetaan, mitkä tehtävät on suoritettu

hy-väksytysti. Tämä tarkastetaan HTML5-kielen ominaisuuteen perustuvaan

loalStorage-muistiin. LoalStrorage on selaimen oma muisti, johon

mah-tuuvähintään5Mbtallennustilaa[20℄.Tänneontallennettutieto

suoritetuis-ta tehtävistätehtävän tunnisteen mukaan. Esimerkiksi tehtävästä 1 ontieto

loalStorage.t1,missäilmoitetaan onko tehtävä tehty (t1=k) vai ei(t1=

e). Muistit loalStorage.t[numero℄luodaan etusivulla,kun käyttäjä painaa

nappia Aloitapistelasku.

LoalStorage tietoa käytetään apuna myös käyttäjän halutessa

tallen-taa tekstejäänmuistiin.Käyttäjänpainaessatehtävässä 1editorin

tallennus-nappulaa, luodaan, riippuen mikä satunnaisesti valittu tehtävä on,

esimer-kiksi loalStorage.t1b (valittu b-tehtävä) ja tallennetaan siihen editorissa

oleva teksti. Tekstin saa takaisin painamallaeditorin avaa-nappulaa, jolloin

muistista haetaan tehtävää vastaava loalStorage-tieto (esimerkiksi

loalS-torage.t1b) ja tulostetaan seeditoriin.Nämätoteutukset löytyvät

(32)

funktioita. Valitse()-funktio valitsee käyttäjälle annetun tehtävän

satunnai-sesti kolmesta eri vaihtoehdosta (a,b tai ). Tämä funktio löytyy

tiedostos-ta t[numero℄ab.js-tiedostosta. Samalla sivulle liitetään myös sitä

vastaa-vat ratkaisut, esimerkiksi tehtävän t1b osalta t1b.js ja v1b.js.

Tiedostos-ta v[numero℄.js löytyvä funktio annaVastaus() tulostaa käyttäjälle editoriin

vastausrivin Vastaus:, johon käyttäjä kirjoittaa vastauksensa. Tiedostosta

t[numero℄.jslöytyväfunktiotarkista()tarkistaakäyttäjäntähänkohtaan

an-taman vastauksen.

Funktio alustaDo() tekee tarvittavat toimet editorin saamiseksi

sellai-seen tilaan, että käyttäjä voi kirjoittaasiihen matematiikkaa.Tämäfunktio

löytyy editori.js tiedostosta. Funktiolla luodaan tekstialue <div

ontentedi-table=true> ja tehdään siihen alustus luomalla siihen <pre>-lohko, joka

luo esiformatoidun lohkon. Tämä tarkoittaa sitä, että lohko säilyttää

vä-lit ja rivinvaihdot, mitä HTML-koodi ei yleisesti ottaen tee.

AlustaDo()-funktiollaluodaanmyöseditoriinkirjoitetuntekstin html-versio,jonka

käyt-täjä saa näkyviin painamalla Näytä HTML-koodi valintaruutua. Jos

käyt-täjä osaa HTML-koodin käsittelyä, voi myös täällä muokata omaa tekstiä.

Tähän liittyy tietysti myös vaaroja, sillä jos HTML-koodausta ei osaa, voi

täällä muokata koodin sellaiseksi, ettei editori osaa sitä enää lukea, jolloin

kirjoitettu teksti voidaan menettää kokonaan.

4.3.4 Matematiikkaeditorin toiminta

SivustonmatematiikkaeditoritoimiikahdenJavaSript-tiedostonedprintti.js

jaeditori.jsavulla.Tiedosto edprintti.jskoostuupelkistädoument.writeln()

funktioista, jotka tulostavatriveittäin dokumenttiin sulkeiden sisällä olevan

HTML-koodin. Nämä sisältävät editorin HTML-osuudet, joiden avulla

edi-tori tulostetaan käyttäjän kuvaruudulle. Siihen kuuluvat tekstialue,

kuvak-keet,valikotjanäppäimet.CSS-tiedostoagraat.sskäytetäänapunanäiden

tyylejä määriteltäessä.

Tiedostoeditori.jstoteuttaafunktioidensaavullaeditorindynaamisen

toi-minnan. Editori.jskoodija sen toimintaon selitetty liitteessäC.

Ohjelmamyös tarkistaa käyttäjän antamat vastaukset. Muita

tarkistuk-sia,kuten vastaukseen johtavanpäättelyntarkistamistaohjelma eitee.

Vas-tausten tarkistus tehdään sekä säännöllisten lausekkeiden (regular

expres-sion) että MathML-koodin tutkimisen avulla, jotta löydettäisiin

(33)

oikeaa vastausvaihtoehtoa, että kaikkia oikeita vaihtoehtoja ei ole

mahdol-listakäydä säännöllistenlausekkeidenavulla.Sitenjotkin oikeatkin

vastauk-set saattavat olla ohjelman mielestä vääriä. Jotta tarkistaminen olisi vielä

tehokkaampaa, pitäisi sivuilleliittää tähän tarkoitettuja ohjelmistoja kuten

STACK[31℄,AIM[32℄taikaupallinenMapleT.A[33℄.Tässävaiheessaolevaa

sivustoa varten näiden ohjelmienkäyttöön eikuitenkaan olevielä tarvetta.

4.3.5 Ohjelman MathML-koodi

Sivuston matemaattiset muotoilut on tuotettu MathML-kielellä. Sivuston

teoriaosiot on tehty täysin suositellun MathML-koodin mukaisesti [5℄.

Kui-tenkin editorissa on tehty yksinkertaistuksia koodiin, jotta editori selviäisi

koodin tuottamisessaja sen tarkistamisestamahdollisimmanhelpolla.

Yleiseen MathML-koodiin kuuluvat tagit <mo> (operaattori), <mn>

(lukutaivakio)ja<mi>(muuttuja),joistaeditorissaonpyrittykäyttämään

vain<mn> tagia. Tämä siksi, että <mn>-tagi eimuuta tekstin muotoiluja

ja siten <mn></mn>tagien sisällevoidaankirjoittaakuinkamonta

merk-kiä ilman, että niiden muotoilu muuttuu. Toisin on tagien <mo> ja <mi>

kanssa, joissa jokainen merkki tarvitsee oman taginsa, jotta ne näkyisivät

oikein. Tämännäkee esimerkistä7.

Esimerkki 1. Kuvassa 7 onseuraavien MathML-koodien tulokset

selai-messa: <math> <mi>y</mi> <mi>x</mi> <mo>=</mo> <mo>-</mo> <mn>a</mn> <mn>b</mn> </math> ja <math> <mi>yz</mi> <mo>=-</mo> <mn>ab</mn> </math>

(34)

geissa, jolloinmatemaattisetmuotoilutmuuttuvat<mi>-ja<mo>-tageilla.

Kuvasta nähdään, että sekä <mi> ja <mo> tagien muotoilut

muuttu-vat,kun aloitusja sulkemistagienväliinlaitetaanenemmän kuin yksi

merk-ki. Tätä ei kuitenkaan tapahdu <mn> tagin kanssa, jonka muotoilu pysyy

samana.MathML-kielenoletuson, että kaikillemerkeillepitäisi ollaoma

ta-ginsa. Koska <mn> tagi kuitenkin pitää muotoilunsa (tai oikeastaan sillä

ei ole muotoilua lainkaan), päätin tuottaa editorin mahdollisimmanpitkälle

<mn> tageilla. Koska <mn> tagit tuottavat normaalia fonttia eikä

kursi-voitua, mitä matematiikassa esimerkiksi tuntemattomille käytetään, päätin

lisätä editoriin erikseen kursiivi-muotoilun, joka voidaan toteuttaa

HTML-kielen <i>-tagin avulla. Käyttäjä voi siten itse määrittää mitkä kirjaimet

kirjoitetaan kursiivillaja mitkäei.Poikkeavia merkkejä ovatjuurimerkinnät

√

ja

n

√

, sulkeet

()

, integraalimerkinnät

R

,

R

b

a

ja

/

sekä summan

P

ja tu-lon

Q

merkinnät,joidenmuotoilujakäyttäjä eipystymuokkaamaan.Näiden

muotoilutontoteutettu CSS-kielen avulla.

Tagien <mn> käyttö mahdollistaa myös sen, ettei <mrow> tageja

tar-vita lainkaan, sillä koko rivi voidaan kirjoittaa yhden <mn> </mn> tagin

väliin. Editoria koodatessa tulin huomanneeksi, että tekstin kirjoittaja voi

joutua <mrow> tagienulkopuolellemikäaiheuttaa virhetilanteen

MathML-koodissa ja siten koko editorin toiminnassa. Kun <mrow> koodia on

mah-dollisimmanvähän, eivirhetilanteitakaan juuri esiinny.

Ainoat <mo>- tagit esiintyvät ala- ja yläsulkeiden kanssa, sillä <mn>

tagin kanssa ala-ja yläsulkeet olisivatvainmerkkejä ja siten pysyisivätvain

yhden merkinalla taipäällä.

Käyttäjän painaessa lisää matematiikkaanappulaa tai käyttäessä niiden

pikanäppäimiä tuottaa editori aina uuden <math> </math> koodin.

Si-ten koodiavoiollasisäkkäisesti vaikkakuinkapaljonja koodisiten hyvinkin

pitkää ja monimutkaista. Tähän on syynä se, että käyttäjän halutessa

pois-taa kirjoittamaansa matemaattista tekstiä, löytää editori poistettavan

koo-din helposti <math> </math> tagien välistä. Näin poistetaan aina

(35)

JavaSript-koodi löydetään MathML-koodin edessä ja jäljessä olevalla ei tulostuvalla

zwnj-merkillä (zero-width non-joiner). Jos käyttäjä poistaa tämän merkin,

huomaaeditorisen ja merkkaasilloinpoistettavanalueeneditori.js

funktioi-den avulla.Tagien <math></math> ulkopuolellaeditoritoimiinormaalin

tekstieditorin tavoin.

4.3.6 Geogebraosiot

Sivusto sisältää Geogebra-sovelluksella tuotettuja havainnollistuksiaja

teh-täviä. Geogebra-sovellus on upotettu HTML-koodin sisään <iframe> tagin

avulla.Tämäntekeminenonnistuuhelpostiwww.geogebratube.org-sivuston

kautta.Sivuilletehdyt geogebra-sovellukset ovatmyös kaikkiennähtävilläja

ladattavissakyseisellä sivustolla.

Olenpyrkinytpitämäänsovelluksetmahdollisimmanyksinkertaisinaniin,

että käyttäjä pääsee muokkaamaan sovelluksessa olevaa näkymää vain

etu-käteen sallituissapaikoissa. Tämä poistaa tietysti Geogebran hyviä

lisäomi-naisuuksia, mutta samalla yksinkertaistaa sovellusta niin, että tarkoituksen

mukainenhavainnollistaminentulisimahdollisimmanselkeästi esiin.Olen

si-ten poistanut sovelluksesta syöttörivin, funktion kuvaajanmuokkaamisenja

geogebran algebranäkymän. Siten tulee varmistettua,että käyttäjä ei pääse

tekemään sellaista toimintoa, että kyseinen havainnollistaminen tai tehtävä

katoaisijamenetettäisiin.Kuvassa8onjatkuvuuttaesitteleväinteraktiivinen

sovellus, missä käyttäjä voi siirtää pistettä A ja tutkia sen käyttäytymistä

funktion kuvaajalla. Vastaavanlaisilla sovelluksilla esitellään myös raja-arvo

ja derivaatta käsitteitä.

Geogebraan liittyvät tehtävät vastataan muiden tehtävien tavoin

edito-riin,vaikkaGeogebrassa olisikinominaisuus,jonkaavullatehtävien

vastauk-setvoitaisiinantaaitsesovelluksessa.Päädyintähänvalintaansivuston

yhte-näisyyden takia, minkälisäksi seantaa käyttäjälle mahdollisuuden tallettaa

ratkaisunsa muistiin hänen niin halutessaan. Tätä mahdollisuutta ei

(36)

5 Ohjelman materiaalit, tehtävät ja käyttö

Ohjelmassakäydään läpipitkänmatematiikankurssi 7käsitteistäraja-arvo,

siihen liittyvät peruskäsitteet, epäoleellinen raja-arvo, jatkuvuus,

derivaat-ta erotusosamäärän kautta sekä funktioiden derivaattaan liittyvät lauseet

yhteen-,vähennys-, kerto- jajakolaskuista.Jokaisestaosiostaonmyös

aihee-seen liittyviä tehtäviä. Tehtäviä on yhteensä 30, joista jokaisesta on kolme

eri vaihtoehtoa (a, b tai ). Näistä vaihtoehdoista käyttäjä tekee yhden

tie-tokoneensatunnaisesti valitsemantehtävän.

Sivustoon liittyy kaksiyleissivua: etusivu ja ohjeet-sivu, joissa esitellään

ohjelmakäyttäjälle.Itseteoriasivujaonseitsemän.Näidennimetovat

liittees-sä A. Teoriaosuudessa on selvennyksenä käytetty myös Geogebra-sovellusta

näyttämään kuvia ja toimimaankäyttäjän dynaamisena apuvälineenä.

Ma-teriaalit on suunniteltu lukion pitkän matematiikan kurssin 7

opetussuun-nitelman perusteella[24℄. Koko kurssin asioita ei käydä läpi vaan materiaali

onlähinnä raja-arvoa,jatkuvuutta ja derivaatan määritelmääselkeyttävä ja

niihin opiskelijalletukeaantava.

Sivustolla olevattehtävät antavat opiskelijalle mahdollisuuden

harjoitel-la teoriaosuuksissa esiteltäviä asioita. Opiskelija tekee tehtävät sivustolla

(37)

sesta. Oikein vastatessaan tehtävä merkitään tehdyksi ja opiskelija saa

pis-teen. Kun kaikki tehtävät on tehty oikein, ilmoittaa ohjelma opiskelijalle

tämän suorittaneenkaikki tehtävät.Tehtävät onlaadittuWilsonin

taksono-mian [38℄mukaisesti.

5.1 Wilsonin taksonomia

Professori James Wilson julkaisi vuonna 1971 oman matemaattisen

osaami-sen tason mittarinkehittäen sen yleisesti käytetystä Bloomintaksonomiasta

[35℄. Benjamin Bloomin vuonna 1956 kehittämä Bloomin taksonomian

aut-taa osaamisen tason ja kasvatustavoitteiden analysoinnissa. Bloomin

takso-nomiassa osaamisen taso jaetaan kuuteen hierarkiseen tasoon, jotka ovat

1. Tietäminen 2. Ymmärtäminen 3. Soveltaminen 4. Analyysi 5. Synteesi 6. Evaluaatio

Wilsonin taksonomiaon erityisestimatematiikkaan sovellettu osaamisen

tason mittari, jossakäytetään neljääerillistätasoa:

1. Laskeminen

2. Ymmärtäminen

3. Soveltaminen

4. Analyysi

Taksonomiaonkehitettymatematiikanopettajilletyökaluksikehittää

sel-laisiatehtäviä,joillavoidaanerotellaoppilaidenosaamisen tasoja.Seon

hiu-kanyksinkertaistettu versioBloomintaksonomiasta, jossakorkeimmattasot

menevätmatemaattisten tehtävienosalta usein sekaisin [37℄. Valitsintämän

taksonomian Bloomin taksonomian sijasta juuri tämän takia. Lisäksi

sivus-tolla olevien tehtävien taso ei mene juurikaan soveltamista korkeammalle,

joten Bloomin taksonomian viimeistentasojen eroja ei päästäisikuitenkaan

hyödyntämään. Sivustolla olevat tehtävät ovat pääosin peruslaskemisen ja

asioidenymmärtämisentasoavahvistaviaeikäsyvempääanalyysia

(38)

1.Laskeminen Yksinkertaiset muistamista tarvitsevat

teh-tävätja terminologian tunteminen.

2.Ymmärtäminen Periaatteen,säännön ja yleistyksensekä

ma-temaattisenrakenteentietäminen.Tehtävien

osien muuttaminenmuodostatoiseen.

3.Soveltaminen Vertailujen tekeminen, tietojen

erottelemi-nen ja mallienhyväksikäyttö.

4.Analyysi Ei rutiinitehtävien ratkaiseminen,

relaatioi-den löytäminen, todistuksen konstruointi ja

yleistyksen muodostaminen

Sivustolla olevat tehtävät ovat lähinnä derivaatta käsitteen

ymmärtämi-seen tähtääviä,jotensuurinosa tehtävistäonjokolaskemiseentai

ymmärtä-miseen liittyviä. Jos sivustolla olisi tarkoitus käydä läpi koko kurssi, pitäisi

varmastiviimeistentasojen 3ja 4 tehtäviä selvästilisätä.

5.2 Tehtävät

Ohjelmasisältääseuraavattehtävät(Tummallapainetutkonevalitsee

satun-naisti käyttäjälle). Tehtävän jälkeen on suluissa tehtävän luokka Wilsonin

+ 1)

Tehtävä 2.(1) Määritä a)

lim

x→

0

x

b)

lim

x→

0

2 x

x

)

lim

x

→

0

x

√

x

+ 5

Tehtävä 3.(2) Määritä a)

lim

x

→

3

x

2

₋

₉

x

₋

3

b)

lim

x→−

2

x

2

₋

₄

x

+ 2

)

lim

x→