ITKP101-Harjoitustyö Lassi Lehtinen. Esteettömän WWW-sivun toteuttaminen. Mikä on WWW-sivu? Helpottaako hyvä rakenne työtämme?

Koko: px
Aloita esitys sivulta:

Download "ITKP101-Harjoitustyö Lassi Lehtinen. Esteettömän WWW-sivun toteuttaminen. Mikä on WWW-sivu? Helpottaako hyvä rakenne työtämme?"

Transkriptio

1 ITKP101-Harjoitustyö Lassi Lehtinen ITKP101-Harjoitustyö Lassi Lehtinen Esteettömän WWW-sivun toteuttaminen Esteettömän WWW-sivun tekeminen on varsin yksinkertaista. Useimmiten meille on yksinkertaisempaa tehdä esteetön WWW-sivu kuin esteellisen WWW-sivu. Esteellisyys johtuu usein tarpeettomien ja monimutkaisempien tekniikoiden käytöstä. Tehdessämme esteettömiä WWW-sivuja meidän ei tarvitse osata kaikkein hienompia ja uusimpia tekniikoita, vaan voimme tehdä hyvän ja asiapitoisen perussivun. Toki erilaisten tekniikoiden käytöllä on oma hyvät puolensa, mutta niiden käyttö ei saa aiheuttaa ylimääräisiä esteitä sivujen käyttäjille. Mikä on WWW-sivu? WWW-sivu on tavallista muotoilematonta teksti, joka voidaan esimerkiksi kirjoittaa jollakin tekstieditorilla (esim. Notepad). Muotoilemattomasta tekstist ei erota siellä esiintyviä otsikoita tai muita rakenteita, kuten seuraavasta esimerkistä voit todeta. Tekstistä eivät myöskään erotu lauseista korostettavat sanat. Pelkkä teksti ei ole kovinkaan miellyttävää luettavaa rakenteen puuttumisen vuoksi. Tekstistä on kuitenkin aina erotettavissa erilaisia rakenteellisia osia, kuten esimerkiksi otsikoita, tekstikappaleita ja listoja. Rakenteellisten osien erottamisen voimme toteuttaa HTML-elementtien avulla, joita käyttämällä teemme muotoilemattomasta tekstistä HTML-sivun. HTML-elementeillä (eli tageilla) voimme määrittää tekstikappaleille tai niiden osille rakenteellinen merkitys. HTML-elementit eroavat muusta kirjoitetusta tekstist siten, että ne on kirjoitettu pienempi kuin -merkin (<) ja suurempi kuin -merkin (>) väliin (<siis tänne>). WWW-sivuilla käytettävissä olevat HTMLelementit on määritelty etukäteen, joten esimerkiksi WWW-sivun pääotsikon merkitsemme <h1>-elementin (Heading1) sisään. Vastaavalla tavalla tekstikappaleet merkitsemme <p>-elementin (Paragraph) sisään. Merkintöjä käyttämällä saamme edellisen esimerkin tekstin havainnollisempaan muotoon, koska nyt voimme erottaa selvästi otsikko ja tekstikappale toisistaan. HTML-elementti on yksinkertaisesti jokin englanninkielinen sana tai siitä tehty lyhenne, joka on laitettu pienempi kuin ja suurempi kuin -merkin väliin. Useimmat HTML-elementit tulevat tekstin sekaan pareittain eli niissä on sekä aloitus- että lopetuselementti. Seuraavassa esimerkissä tekstikappaleen sisältä löytyvä <strong>-aloituselementti kertoo, että sen jälkeen tuleva teksti täytyy korostaa (vahventaa). Vastaavasti lopetuselementti </strong> kertoo, että vastaavan aloituselementin vaikutus loppuu eli korostaminen täytyy lopettaa. HTML-elementin lopetuselementti on samanlainen kuin aloituselementti lukuun ottamatta kauttaviivaa (/) pienempi kuin -merkin jälkeen. Esimerkistä kannattaa myös huomata, että jotkin HTML-elementit voidaan lisätä toisten HTML-elementtien sisään. Helpottaako hyvä rakenne työtämme? Ehdottomasti! Jo alussa meidän kannattaa opetella ajattelemaan WWW-sivun rakennetta ulkoasun sijaan. Ikävä kyllä, monet WWW-sivujen tekijät unohtavat kokonaan rakenteen ulkoasun kustannuksella ja saavat varmasti kärsiä asiasta. Tällöin esimerkiksi ulkoasun muuttaminen voi olla todella työlästä. Hyvillä rakenteen määrittelyillä saamme aikaan selkeitä ja rakenteeltaan hyviä WWW-sivuja, joista löydämme etsimänsä helposti esimerkiksi sivuja päivitettäessä. Lisäksi hyvällä rakenteen määrittelyllä mahdollistamme ulkoasun muuttamisen mahdollisimman helposti ja kootusti. Tällöin voimme esimerkiksi muuttaa kaikkia WWW-sivun (tai sivuston) toisen tason otsikoiden kirjasintyyppiä muutamassa sekunnissa. Jos rakennetta ei ole määritelty oikein voi kirjasintyypin muuttamiseen mennä useita minuutteja jo yhdelläkin sivulla. Erityisen tärkeää on ajatella rakennetta graafisia HTML-editoreja käyttäessämme. Meidän ei kannata kiinnittää ulkoasuun mitään huomiota sivun rakenteen ja sisällön määrittämisen yhteydessä. Graafisia HTML-editoreja käyttäessämme rakenne kannattaa määritellä editoreista löytyvien rakenteellisten tyylien avulla. Tällaisia tyylejä ovat esimerkiksi: Otsikko 1 - Otsikko 6 (engl. Heading - Heading 6) -tyyleillä määritellään otsikot tasojen mukaisesti. Otsikko1 on korkeimman tason otsikko eli sivun pääotsikko. Normaali, leipäteksti (engl. Normal / Paragraph) -tyylillä määritellään kaikki tavalliset teksikappaleet. Luettelomerkeillä varustettu luettelo, järjestämätön lista (engl. Bulleted List, Unordered List) -tyylillä määritellään järjestämätön lista, jonka alkioilla ei ole tiettyä järjestystä. Numeroitu luettelo, järjestetty lista (engl. Numbered List, Ordered List) -tyylillä määritellään järjestettu lista, jonka alkioilla on tietty järjestys. Muotoiltu (engl. Formatted) -tyylillä määritellään teksti, jossa halutaan säilyttää kirjoitusmuotoilut, kuten välilyönnit ja rivinvaihdot. Tyyli soveltuu erityisesti käytettäväksi erilaisten ohjelmakoodien esittämiseen. Esimerkiksi tämän artikkelin esimerkkeissä on käytetty tätä tyyliä. Vahvennus (engl. Strong) -tyylillä määritellään tekstin joukosta erityisesti korostettavia asioita. Selainikkunassa vahvennus näytetään oletuksena lihavoituna. Korostus (engl. Emphasis) -tyylillä määritellään tekstin joukosta korostettavia asioita. Selainikkunassa korostettu teksti näytetään oletuksena kursivoituna. Tyylejä käyttäessämme kannattaa miettiä aina tyylin merkitystä WWW-sivun rakenteelle. Otsikoita ei siis saisi tehdä suurentamalla kirjasinta ja lihavoimalla tekstiä vaan se pitäisi tehdä merkitsemällä otsikko oikean tasoisella tyylillä. Kun sivun rakenne on kunnossa, voimme muuttaa sivun ulkoasua nopeasti ja yhtenäisesti. Hyvällä rakenteen määrittelyllä parannetaan samalla myös sivun esteettömyyttä. Kun rakenne on kunnossa emmekä ole kiinnittäneet ulkoasua WWW-sivuun, niin WWW-sivua voidaan lukea esteettömästi monenlaisilla selaimilla.

2 Eritasoiset elementit - erilaiset käyttökohteet Lohkotason eli kappaletason elementeillä tarkoitetaan yhtenäisen lohkon muodostavia elementtejä. Tällaisia lohkoja ovat esimerkiksi tekstikappaleet (pelemementin sisällä) ja listat (ul- tai ol-elementin sisällä). Yhden lohkotason elementin sisään (esim. div-elementti) voimme joissakin tapauksissa laittaa useitakin lohkotason elementtejä eli esimerkiksi tekstikappaleita. Tekstikappaleen tai otsikoiden sisään emme kuitenkaan voi laittaa muita lohkotasoisia elementtejä, vaan ainoastaan merkkitason elementtejä. Lohkotason elementeillä on monenlaista käyttöä, koska niillä voimme merkitä erilaisia WWW-sivun rakenteellisia osia tai voimme erotaa toisistaan WWW-sivun navigoinnin ja sisällön. Merkkitason elementit (esim. strong ja img) sijaitsevat aina jonkin lohkotason elementin sisällä. Kuvat ja vahvennukset sijaitsevat useinmiten tekstinkappaleen, listan tai taulukon sisällä. Merkkitason elementin sisällä voi sijaita toinen merkkitason elementti (vahvennuksen sisällä voi olla linkki), mutta ei koskaan lohkotason elementtiä. Rakenteellisesti epäilyttäviä ratkaisuja Monilla WWW-sivuilla on käytetty rakenteellisesti hyvin arveluttavia ratkaisuja. Näistä ratkaisuista aiheutuu ongelmia esimerkiksi käyttäjäryhmille, joilla on käytössään poikkeuksellinen pieni katselulaite tai selainikkunan koko. Seuraavassa on listattu pahimpia rakenteellisia ongelmia. Taulukkotaittaminen hankaloittaa olennaisesti sivun lukemista erikoisemmissa selaimissa. Esimerkiksi ääniselaimilla kokonaiskuvan muodostaminen on hankalaa tai jopa mahdotonta. Sivun varsinainen sisältö ja rakenne on tällöin piilotettu taulukkoon, joten sivun muuttaminenkin on työlästä. Taulukon käyttämisen voi usein korvata muilla rakenteellisilla määrittelyillä ja CSS-tyylien avulla. Oletukset selainikkunan koosta haittaavat monia käyttäjiä, jotka selaavat sivua oletuksista poikkeavilla asetuksilla. Esimerkiksi mobiililaitteilla selaavilla käyttäjillä on suuria ongelmia saada sivun sisältöä järkevässä muodossa, jos sivun koko on kiinnitetty. Usein juuri taulukkotaitetuilla sivuilla tehdään myös oletuksia käyttäjän selainikkunan tai katselulaitteen koosta. Sivun pitäisi antaa skaalautua käyttäjän selainikkunan koon ja asetusten mukaisesti. Kehyksien käyttö tuottaa vaikeuksia erityisesti selaajille, joilla ei ole kehyksiä tukevaa selainohjelmaa. Tällöin kehykset pilkkovat sivun pieniin palasiin, jolloin selaaminen on hankalaa ja perustuu ikävän usein arvailuun. Tällöin myös pienellä näytöllä selaajalla on ongelmia, koska kehykset laajentavat sivua paljon sivusuunnassa, joten sivua joutuu vierittämään vaakasuunnassa. Kehyksiä voi jäljitellä CSS:n avulla tarvittaessa, mutta useimmiten sekin on tarpeetonta. Selainkohtaisten HTML- tai muiden laajennuksien käyttö tuottaa vaikeuksia toisen valmistajan selainta käyttävälle. Tämän vuoksi sivujen sisältö voi jäädä kokonaan joidenkin käyttäjien ulottumattomiin, joten selainkohtaisia laajennuksia ei kannata käyttää. HTML-sivuilla kannattaa käyttää ainoastaan W3C:n suosituksen mukaisia HTML-elementtejä. Tässä artikkelissa esitellään XHTML 1.0 Strict -suosituksen mukaisia HTMLelementtejä. Kannattaako rakenteen ja ulkoasun erottaminen? Jos emme erota HTML-sivun rakennetta ja ulkoasua toisistaan, niin törmäämme ennemmin tai myöhemmin ongelmiin. Sivumme tai sivustomme ulkoasun muuttaminen on hidasta, koska ulkoasu on liian kiinteä osa HTML-sivua. Tällöin joudumme tekemään muutoksen kaikki sivuihin yksitellen. Sivujemme sisältö voi jäädä erilaisten selainten tai päätelaitteiden käyttäjien ulottumattomiin. HTML-sivun sisään tehtävät tiukat ulkoasun määrittelyt eivät mukaudu kaikkien käyttäjän päätelaitteen asetusten mukaisesti. Tällöin esimerkiksi kirjankoon kiinnittäminen HTML-sivuun voi aiheuttaa, ettei tekstistä saa selvää joillakin selaimilla. Näihin ongelmiin on olemassa hyvin yksinkertainen ratkaisu. Määrittelemme WWW-sivun rakenteen kunnolla ja pidämme ulkoasun kokonaan erillään sivujen rakenteesta! Tällöin WWW-sivun tekemisen alkuvaiheessa kuvaamme HTML-elementeillä (tai tyyleillä) ainoastaan WWW-sivun rakenteen. Tällöin emme kiinnittää huomiota ollenkaan WWW-sivun ulkoasuun. Ulkoasun määritykset teemme tämän jälkeen erilliseen CSS-tyylitiedostoon, jonka avulla voimme muuttaa kerralla esimerkiksi kaikkien HTML-sivun tekstikappaleiden kirjasimen tyypin toiseksi. Käyttämällä samaa tyylitiedostoa useammille sivuille mahdollistamme kokonaisen artikkelikokoelman (sivuston) ulkoasun muuttamisen keskitetysti ja nopeasti. Eriyttämällä WWW-sivun rakenteen ja ulkoasun sekä määrittelemällä WWW-sivun rakenteen olemme jo pitkällä esteettömien WWW-sivujen tekemisessä. Jos jo alkumetreillä teemme epäilyttäviä rakenteellisia ratkaisuja, niin myöhemmässä vaiheessa tehtävät toimenpiteet eivät välttämättä enää auta. Asiakirjan korjaaminen esteettömäksi myöhemmässä vaiheessa on aikaamme ja resurssejamme vievää. On tärkeää lähteä alusta pitäen tekemään esteetöntä WWW-sivua. Edellä luvussa "Esteettömän WWW-sivun rakenne" tarkastelimme WWW-sivun rakenteen vaikutusta sivun esteettömyyteen. Määrittelemällä WWW-sivulle hyvä rakenne ja erottamalla ulkoasu kokonaan WWW-sivun rakenteeesta saamme aikaan perussivun, jonka sisältöön pääsemme käsiksi esteettömästi erilaisilla selaimilla. Tässä luvussa toteutamme yksinkertaisen ja esteettömän perussivun. Opimme merkitsemään WWW-sivusta löytyvät otsikot, tekstikappaleet sekä erilaiset listat. Sivun esteettömyys tulee automaattisesti mukaan käyttämistämme rakenteellisista ratkaisuista, joten sitä ei korosteta erikseen. Sivuille voi toki tulla monia muitakin elementtejä, joista muutamia tarkastelemme luvussa Muita tarpeellisia HTML-sivun rakenteita.

3

4

5 Linkki ITKP101 - Tietokone ja tietoverkot työvälineenä -kurssin kotisivuille:

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

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

Lisätiedot

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

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

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

Lisätiedot

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

Verkkosivut perinteisesti. Tanja Välisalo 11.2.2009

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

Lisätiedot

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

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

Lisätiedot

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

ETAPPI ry JOOMLA 2.5 Mediapaja. Artikkeleiden hallinta ja julkaisu

ETAPPI ry JOOMLA 2.5 Mediapaja. Artikkeleiden hallinta ja julkaisu ETAPPI ry JOOMLA 2.5 Artikkeleiden hallinta ja julkaisu ETAPPI ry JOOMLA 2.5 Sivu 1(16) Sisällysluettelo 1 Joomla! sivuston sisällöntuotanto... 2 2 Artikkeleiden julkaisu sivustolla... 4 3 Artikkelin julkaisemista

Lisätiedot

Digitaalisen median tekniikat. Esteettömyys ja käytettävyys Harri Laine 1

Digitaalisen median tekniikat. Esteettömyys ja käytettävyys Harri Laine 1 Digitaalisen median tekniikat Esteettömyys ja käytettävyys 30.4.2004 Harri Laine 1 WWW-sivujen käytettävyyttä arvioidaan usein tyypillisen normaalikäyttäjän kannalta Esteettömyydellä (accessibility) tarkoitetaan

Lisätiedot

valitsin on useimmiten html-elementti, jolle tyyli halutaan luoda

valitsin on useimmiten html-elementti, jolle tyyli halutaan luoda Valitsimista valitsin on useimmiten html-elementti, jolle tyyli halutaan luoda Muistin virkistykseksi elementtejä http://appro.mit.jyu.fi/doc/www/xhtml/ HTML-elementtien lisäksi valitsimille voidaan luoda

Lisätiedot

TYYLIT. Word Tyylit

TYYLIT. Word Tyylit Word 2013 Tyylit TYYLIT TYYLIT... 1 Pikatyylien käyttäminen... 1 Tyylimuotoilun poistaminen... 2 Tyylin muokkaaminen... 2 Uuden tyylin luominen muotoillusta tekstistä... 2 Uuden tyylin luominen valintataulussa...

Lisätiedot

Digitaalisen median tekniikat. Esteettömyys ja käytettävyys

Digitaalisen median tekniikat. Esteettömyys ja käytettävyys Digitaalisen median tekniikat 30.4.2004 Harri Laine 1 WWW-sivujen käytettävyyttä arvioidaan usein tyypillisen normaalikäyttäjän kannalta Esteettömyydellä (accessibility) tarkoitetaan sivujen laajempaa

Lisätiedot

Käyttöliittymä ja tuotantokäsikirjoitus. Heini Puuska

Käyttöliittymä ja tuotantokäsikirjoitus. Heini Puuska Käyttöliittymä ja tuotantokäsikirjoitus Heini Puuska Sisältö 1 Käyttöliittymä... 1 2 Tuotantokäsikirjoitus... 2 2.1 Kurssin esittely... 2 2.2 Oppimistehtävä 1... 2 2.3 Oppimistehtävä 2... 2 2.4 Reflektio

Lisätiedot

Sivupohjien täyttö suppeat sivupohjat

Sivupohjien täyttö suppeat sivupohjat Sivupohjien täyttö suppeat sivupohjat Tässä kuvataan sivupohjien muokkaus askelittain yksinkertaisemman sivupohjan avulla. Tätä ohjetta tunnollisesti seuraamalla saat aikaan yksinkertaiset, mutta toimivat

Lisätiedot

1 Yleistä Web-editorista... 3. 1.1 Web-editori -dokumentin luominen... 3. 2 Pikatoimintopainikkeet... 3. 2.1 Tallenna... 3

1 Yleistä Web-editorista... 3. 1.1 Web-editori -dokumentin luominen... 3. 2 Pikatoimintopainikkeet... 3. 2.1 Tallenna... 3 Web-editori 2 Optima Web-editori -ohje Sisällysluettelo 1 Yleistä Web-editorista... 3 1.1 Web-editori -dokumentin luominen... 3 2 Pikatoimintopainikkeet... 3 2.1 Tallenna... 3 2.2 Peru / Tee uudelleen...

Lisätiedot

Sivuston nopeus. (vanhentumista ei ole määritetty)

Sivuston nopeus.   (vanhentumista ei ole määritetty) Sivuston nopeus 76 / 100 Nopeus Pitäisi korjata: Hyödynnä selaimen välimuistia Asettamalla umpeutumispäivän tai enimmäisiän staattisten resurssien HTTP-header-osissa neuvot selainta lataamaan aiemmin ladatut

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

Ylläpitoalue - Etusivu

Ylläpitoalue - Etusivu Crasmanager 5.2 Ylläpitoalue - Etusivu Sivut osiossa sisällön selaus ja perussivujen ylläpito. Tietokannat osiossa tietokantojen ylläpito. Tiedostot osiossa kuvien ja liitetiedostojen hallinta. Työkalut

Lisätiedot

WORD TYYLILLÄ. Tietohallintokeskus hannele.rajaniemi@jyu.fi. Miksi tyylit? Tyylien lisääminen: joko jälkikäteen tai etukäteen

WORD TYYLILLÄ. Tietohallintokeskus hannele.rajaniemi@jyu.fi. Miksi tyylit? Tyylien lisääminen: joko jälkikäteen tai etukäteen WORD TYYLILLÄ Tietohallintokeskus hannele.rajaniemi@jyu.fi Sisältö 2 h Miksi tyylit? Tyylien lisääminen: joko jälkikäteen tai etukäteen Tyylien muokkaaminen Asiakirjamallit * Sisällysluettelo otsikkotyylien

Lisätiedot

Kiipulan ammattiopisto. Liiketalous ja tietojenkäsittely. Erja Saarinen

Kiipulan ammattiopisto. Liiketalous ja tietojenkäsittely. Erja Saarinen Kiipulan ammattiopisto Liiketalous ja tietojenkäsittely Erja Saarinen 2 Sisällysluettelo 1. Johdanto... 3 2. Hyvät internetsivut... 3 3. Kuvien koko... 4 4. Sivujen lataus... 4 5. Sivukartta... 5 6. Sisältö...

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

Näin rakennat mielenkiintoiset nettisivut

Näin rakennat mielenkiintoiset nettisivut Näin rakennat mielenkiintoiset nettisivut Ajattele ennen kuin toimit Ei kannata lähteä suinpäin nettisivuja rakentamaan. Hyvin suunniteltu on enemmän kuin puoliksi tehty. Muuten voi käydä niin, että voit

Lisätiedot

MOBISITE-TYÖKALUN SISÄLTÄMÄT TOIMINNOT

MOBISITE-TYÖKALUN SISÄLTÄMÄT TOIMINNOT MOBISITE-TYÖKALU MobiSite on työkalu matkapuhelimeen soveltuvan mobiilisivuston rakentamiseen. AIMO-järjestelmän jatkuvasti päivittyvä päätelaitetunnistus tunnistaa useimmat puhelinmallit ja mukauttaa

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

Moodle-oppimisympäristö

Moodle-oppimisympäristö k5kcaptivate Moodle-oppimisympäristö Opiskelijan opas Sisältö 1. Mikä on Moodle? 2. Mistä löydän Moodlen? 3. Kuinka muokkaan käyttäjätietojani? 4. Kuinka ilmoittaudun kurssille? 5. Kuinka käytän Moodlen

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

UpdateIT 2010: Editorin käyttöohje

UpdateIT 2010: Editorin käyttöohje UpdateIT 2010: Editorin käyttöohje Käyttäjätuki: Suomen Golfpiste Oy Esterinportti 1 00240 HELSINKI Puhelin: (09) 1566 8800 Fax: (09) 1566 8801 E-mail: gp@golfpiste.com Sisällys Editorin käyttöohje...

Lisätiedot

SeaMonkey pikaopas - 1

SeaMonkey pikaopas - 1 SeaMonkey pikaopas SeaMonkey on ilmainen ja yksinkertainen www-sivujen teko-ohjelma. Sillä on kätevää koostaa yksinkertaisia sivuja ilman, että täytyy tietää jotain HTML-koodista. Tämä opas esittelee sivuston

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

Verkkojulkaiseminen Minna Väisänen. HTML5-tehtävä

Verkkojulkaiseminen Minna Väisänen. HTML5-tehtävä Verkkojulkaiseminen Minna Väisänen HTML5-tehtävä Kirjoita Dreamweaverissa oheisen nettisivun koodi. Lisää xx-kohtiin omat tietosi. Kuvan nimi on joki.jpg. Ensin tehdään sivusto ja sitten yksittäinen sivu.

Lisätiedot

Sivuston nopeus. (vanhentumista ei ole määritetty)

Sivuston nopeus.   (vanhentumista ei ole määritetty) Sivuston nopeus 93 / 100 Nopeus Harkitse korjaamista: Hyödynnä selaimen välimuistia Asettamalla umpeutumispäivän tai enimmäisiän staattisten resurssien HTTP-header-osissa neuvot selainta lataamaan aiemmin

Lisätiedot

Tekstinkäsittelyn jatko. KSAO Liiketalous 1

Tekstinkäsittelyn jatko. KSAO Liiketalous 1 KSAO Liiketalous 1 Tyylien käyttö on keskeinen osa tehokasta tekstinkäsittelyä. Merkki- ja kappalemuotoilujen tallentaminen valmiiksi tyyleiksi nopeuttavat tekstinkäsittelyä; tekstin kirjoittamista ja

Lisätiedot

Sivuston nopeus. Sivullasi on 2 uudelleenohjausta. Uudelleenohjaukset viivästyttävät sivun lataamista.

Sivuston nopeus. Sivullasi on 2 uudelleenohjausta. Uudelleenohjaukset viivästyttävät sivun lataamista. Sivuston nopeus 50 / 100 Nopeus Pitäisi korjata: Älä käytä aloitussivun uudelleenohjauksia Sivullasi on 2 uudelleenohjausta. Uudelleenohjaukset viivästyttävät sivun lataamista. Vältä aloitussivun uudelleenohjauksia

Lisätiedot

MOODLE-OHJE: Liitetiedoston lisääminen ja päivittäminen

MOODLE-OHJE: Liitetiedoston lisääminen ja päivittäminen etusivulta yläoikealta. Kirjauduttuasi sisään SAMK Moodleen, mene omalle opintojaksollesi ja siirry muokkaustilaan. Muokkaustila päälle painike löytyy opintojakson Kun muokkaustila on päällä, siirry sen

Lisätiedot

Opas administraattori-tason käyttäjille. MANAGERIX -ohjelman esittely... 2 Kirjautuminen... 2

Opas administraattori-tason käyttäjille. MANAGERIX -ohjelman esittely... 2 Kirjautuminen... 2 MANAGERIX Opas administraattori-tason käyttäjille SISÄLLYS MANAGERIX -ohjelman esittely... 2 Kirjautuminen... 2 Käyttöliittymä... 2 1 ORGANISAATIO Organisaation tietojen tarkastelu ja muokkaaminen4 Yhteenveto

Lisätiedot

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2012

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2012 Tiedostot Uudet ominaisuudet: - Ei Tiedostot-kohtaa alueen sisällä, vaan tiedostonvalitsin, jolla tiedostot tuodaan alueelle siihen kohtaan missä ne näytetään - Firefox-selaimella voi työpöydältä raahata

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

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 6/8: Navigoinnin tukeminen Edellinen

Lisätiedot

Listat eli luettelot. Järjestämätön lista (unordered list)

Listat eli luettelot. Järjestämätön lista (unordered list) Listat eli luettelot listaelementit ovat lohkoelementtejä: lista ja listan alkiot alkavat uudelta riviltä listan jälkeen tuleva elementti alkaa uudelta riviltä listan alkuun ja loppuun selain jättää tyhjää

Lisätiedot

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2013

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2013 Aineistot Kun laitat Muokkaustilan päälle, näet jokaisessa osiossa Lisää aineisto-valikon tai Add an activity or resource valikon (Asetukset lohko Activity chooser on toiminnon ollessa päällä). Valitse

Lisätiedot

1 LOGO JA SEN KÄYTTÖ 1.1 LOGO JA TURVA-ALUE VÄRILLINEN LOGO LOGO VÄRILLISELLÄ POHJALLA MUSTA LOGO 7 1.

1 LOGO JA SEN KÄYTTÖ 1.1 LOGO JA TURVA-ALUE VÄRILLINEN LOGO LOGO VÄRILLISELLÄ POHJALLA MUSTA LOGO 7 1. 1 LOGO JA SEN KÄYTTÖ 1.1 LOGO JA TURVA-ALUE 4 1.2 VÄRILLINEN LOGO 5 1.3 LOGO VÄRILLISELLÄ POHJALLA 6 1.4 MUSTA LOGO 7 1.5 EI NÄIN 8 3 1.1 Logo ja turva-alue neste jacobsin logo Neste Jacobsin uusi tekstilogo

Lisätiedot

WORD TYYLILLÄ (4 h) Tietohallintokeskus Miksi tyylit? Tyylien lisääminen: joko jälkikäteen tai etukäteen

WORD TYYLILLÄ (4 h) Tietohallintokeskus Miksi tyylit? Tyylien lisääminen: joko jälkikäteen tai etukäteen WORD TYYLILLÄ (4 h) Tietohallintokeskus hannele.rajaniemi@jyu.fi Sisältö 4 h Miksi tyylit? Tyylien lisääminen: joko jälkikäteen tai etukäteen Tyylien muokkaaminen Asiakirjamallit Sisällysluettelo otsikkotyylien

Lisätiedot

Tentti erilaiset kysymystyypit

Tentti erilaiset kysymystyypit Tentti erilaiset kysymystyypit Kysymystyyppien kanssa kannatta huomioida, että ne ovat yhteydessä tentin asetuksiin ja erityisesti Kysymysten toimintatapa-kohtaan, jossa määritellään arvioidaanko kysymykset

Lisätiedot

VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE

VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE JULKAISUJÄRJESTELMÄÄN KIRJAUTUMINEN. Osoitekenttään kirjoitetaan www.domain.fi/admin. Kirjoita käyttäjätunnus: xxxxxx. Salasana:

Lisätiedot

Sivuston nopeus. Sivullasi ei ole uudelleenohjauksia. Lue lisää aloitussivun uudelleenohjausten välttämisestä.

Sivuston nopeus. Sivullasi ei ole uudelleenohjauksia. Lue lisää aloitussivun uudelleenohjausten välttämisestä. Sivuston nopeus 100 / 100 Nopeus 10 Hyväksytyt säännöt Älä käytä aloitussivun uudelleenohjauksia Sivullasi ei ole uudelleenohjauksia. Lue lisää aloitussivun uudelleenohjausten välttämisestä. Ota pakkaus

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

ICT1TN004 Hakukoneoptimoin p ti Heikki Hiet Hie ala t

ICT1TN004 Hakukoneoptimoin p ti Heikki Hiet Hie ala t ICT1TN004 Hakukoneoptimointi Heikki Hietala Hakukoneoptimointi Sivuston laatiminen on vain osa työtä Laadittu sivusto on saatava myös hyvin esiin hakukoneissa Tavoitteena on kasvattaa ns. luonnollista

Lisätiedot

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

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

Lisätiedot

Kuva xhtml-sivulla. Mirja Jaakkola

Kuva xhtml-sivulla. Mirja Jaakkola Kuva xhtml-sivulla Mirja Jaakkola Sisältö 3. Kuva www-sivulla 4. img-elementti 5. Kuvan koko 6. Kuvan keskitys vaakasuoraan & kuvateksti 7. Kuvan tasaus pystysuoraan 8. Esimerkki: pystysuora tasaus eri

Lisätiedot

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2012

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2012 Aineistot Uudet ominaisuudet: - Ei Tiedostot-kohtaa alueen sisällä, vaan tiedostonvalitsin, jolla tiedostot tuodaan alueelle siihen kohtaan missä ne näytetään - Firefox-selaimella voi tiedostot siirtää

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

Suvi Junes/Pauliina Munter Tietohallinto / Opetusteknologiapalvelut 2014

Suvi Junes/Pauliina Munter Tietohallinto / Opetusteknologiapalvelut 2014 Aineistot Kun laitat Muokkaustilan päälle, näet jokaisessa osiossa Lisää aktiviteetti tai aineisto - linkin. Valitse linkin takaa avautuvasta listasta, millaisen aineiston haluat alueelle tuoda, ja paina

Lisätiedot

Keskustelualue. Tampereen yliopisto/ tietohallinto 2017 Suvi Junes/Pauliina Munter

Keskustelualue. Tampereen yliopisto/ tietohallinto 2017 Suvi Junes/Pauliina Munter Keskustelualue Keskustelualue soveltuu eriaikaisen viestinnän välineeksi. Keskustelualueelle voidaan lähettää viestejä toisten luettavaksi, ja sitä voidaan käyttää alueena myös ryhmätöiden tekemiseen,

Lisätiedot

Aloitusopas verkkosivuston ylläpitoon

Aloitusopas verkkosivuston ylläpitoon Aloitusopas verkkosivuston ylläpitoon JPP-Soft Oy 2(13) Sisällys Tervetuloa emedia CMS verkkopalveluiden käyttäjäksi... 3 Sivuston graafinen ilme ja rakenne... 4 Sivuston ilme ja tyyli... 5 Sivupohjat...

Lisätiedot

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

Kotisivuohjeet. Eteläpohjalaiset Kylät ry. Sivupohjien rakenne Kotisivuohjeet Tässä ohjeessa käydään läpi kotisivujen tekemisen perusteet keskittyen html-koodiin ja sen ominaisuuksiin. Ohjetta voidaan käyttää sivupohjien luonnin apuna, on kuitenkin suositeltavaa että

Lisätiedot

9. Kappale -ryhmä - Kappalemuotoilut

9. Kappale -ryhmä - Kappalemuotoilut 9. Kappale -ryhmä - Kappalemuotoilut Aloitus -välilehdellä Kappale -ryhmästä löytyvät kaikki kappalemuotoilut. Huomaa, että kappalemuotoilut ovat aina voimassa seuraavaan kappalemerkkiin asti. Kappalemerkki

Lisätiedot

Digitaalisen median tekniikat css tyylimääritykset

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

Lisätiedot

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

Moodle 2.2 pikaohje. 1. Kirjautuminen ja omat kurssit (Työtilat) 1. Mene internet-selaimella osoitteeseen

Moodle 2.2 pikaohje. 1. Kirjautuminen ja omat kurssit (Työtilat) 1. Mene internet-selaimella osoitteeseen Moodle 2.2 pikaohje 1. Kirjautuminen ja omat kurssit (Työtilat) 1. Mene internet-selaimella osoitteeseen https://moodle2.pkky.fi Kirjaudu omilla kuntayhtymän verkkotunnuksilla klikkaamalla Kirjaudu linkkiä

Lisätiedot

C-ohjelmoinnin peruskurssi. Pasi Sarolahti

C-ohjelmoinnin peruskurssi. Pasi Sarolahti C! C-ohjelmoinnin peruskurssi Pasi Sarolahti Mitä haluan oppia C-kurssilla? ja miksi? Tutustu lähimpään naapuriin Keskustelkaa miksi halusitte / jouduitte tulemaan kurssille 3 minuuttia è kootaan vastauksia

Lisätiedot

ESRC:n uusiutumassa olevat kotisivut on toteutettu WordPress-ohjelmalla (WP). Samaa ohjelmaa käyttävät menestyksellä ainakin SSql, HSRC ja JSK.

ESRC:n uusiutumassa olevat kotisivut on toteutettu WordPress-ohjelmalla (WP). Samaa ohjelmaa käyttävät menestyksellä ainakin SSql, HSRC ja JSK. PIKAOHJEET VIESTIEN KÄYTTÖÖN ESRC:N KOTISIVUILLA Versio 3, 27.12.2006 ESRC:n uusiutumassa olevat kotisivut on toteutettu WordPress-ohjelmalla (WP). Samaa ohjelmaa käyttävät menestyksellä ainakin SSql,

Lisätiedot

PÄIVITÄ TIETOSI OPTIMASTA! KOOSTE

PÄIVITÄ TIETOSI OPTIMASTA! KOOSTE PÄIVITÄ TIETOSI OPTIMASTA! KOOSTE IT-palvelut / Hannele Rajaniemi optima-support@jyu.fi www.jyu.fi/itp/optima-ohjeet 2 Sisältö Mikä on koosteen idea? Miten saan kooste-työkalun käyttööni? Miten luon koosteen?

Lisätiedot

,QWHUQHWVHODLPHQNl\WWlPLQHQ±,QWHUQHW([SORUHU

,QWHUQHWVHODLPHQNl\WWlPLQHQ±,QWHUQHW([SORUHU ,QWHUQHWVHODLPHQNl\WWlPLQHQ±,QWHUQHW([SORUHU Tässä pääsette tutustumaan Internet Explorerin (IE) käyttöön. Muitakin selainversioita löytyy, kuten esimerkiksi Netscape, Opera ja Mozilla. Näiden muiden selainten

Lisätiedot

helsingintaiteilijaseura.fi WordPress-pikaohjeet

helsingintaiteilijaseura.fi WordPress-pikaohjeet 1/12 helsingintaiteilijaseura.fi WordPress-pikaohjeet Sisällysluettelo 1. Ohjausnäkymä...1 2. Työkalupakki... 2 3. Artikkelit, Näyttelyt ja Sivut...3 4. Artikkelin lisäys tai muokkaus... 4 Artikkelikuvan

Lisätiedot

HTML perusteita (ei julkiseen jakeluun)

HTML perusteita (ei julkiseen jakeluun) HTML perusteita (ei julkiseen jakeluun) Tämä opas pyrkii selvittämään joitain verkkoviestintään liittyviä käsitteitä ja antamaan perustiedot HTML- kielestä sekä musiikin WWW- julkaisusta. Internetissä

Lisätiedot

KURRA HOCKEY RY Nettisivujen joukkueen ylläpito-ohje Piia Heiniö, 1/2018. Kurra Hockey Ry 1

KURRA HOCKEY RY Nettisivujen joukkueen ylläpito-ohje Piia Heiniö, 1/2018. Kurra Hockey Ry 1 KURRA HOCKEY RY Nettisivujen joukkueen ylläpito-ohje Piia Heiniö, 1/2018 Kurra Hockey Ry 1 Kirjautuminen ylläpitoon https://www.kurra.fi/jasen Kirjaudu sisään saamillasi tunnuksilla Kurra Hockey Ry 2 Päivitä

Lisätiedot

VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE

VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE VIENET JULKAISUJÄRJESTELMÄLLÄ TOTEUTETTUJEN INTERNET-SIVUJEN YLLÄPITO-OHJE JULKAISUJÄRJESTELMÄÄN KIRJAUTUMINEN. Osoitekenttään kirjoitetaan www.domain.fi/admin. Kirjoita käyttäjätunnus: xxxxxx. Salasana:

Lisätiedot

Sivuston nopeus. Sivullasi on 2 uudelleenohjausta. Uudelleenohjaukset viivästyttävät sivun lataamista.

Sivuston nopeus. Sivullasi on 2 uudelleenohjausta. Uudelleenohjaukset viivästyttävät sivun lataamista. Sivuston nopeus Mobiili 56 / 100 Nopeus Pitäisi korjata: Älä käytä aloitussivun uudelleenohjauksia Sivullasi on 2 uudelleenohjausta. Uudelleenohjaukset viivästyttävät sivun lataamista. Vältä aloitussivun

Lisätiedot

OPPITUNTI 3 Ensimmäinen skripti

OPPITUNTI 3 Ensimmäinen skripti 3. Ensimmäinen skripti 35 OPPITUNTI 3 Ensimmäinen skripti Kun olet asentanut PHP:n ja asettanut sen kokoonpanon, on aika laittaa ohjelmisto testaukseen. Tällä tunnilla luot ensimmäisen skriptisi ja tutkit

Lisätiedot

Sivuston nopeus. Poista hahmonnuksen estävä JavaScript ja CSS sivun yläosan sisällöstä

Sivuston nopeus. Poista hahmonnuksen estävä JavaScript ja CSS sivun yläosan sisällöstä Sivuston nopeus 62 / 100 Nopeus Pitäisi korjata: Lyhennä palvelimen vastausaikaa Palvelimesi vastausaika oli testissämme 0,55 sekuntia. Useat tekijät voivat hidastaa palvelimen vastausaikaa. Suosituksistamme

Lisätiedot

Tiedostojen lataaminen netistä ja asentaminen

Tiedostojen lataaminen netistä ja asentaminen s. 1/5 Tiedostojen lataaminen netistä ja asentaminen Yleistä Internetissä on paljon hyödyllisiä ilmaisohjelmia, jotka voi ladata ja asentaa omalle koneelle. Osa ohjelmista löytyy suomenkielisiltä sivuilta,

Lisätiedot

Sivuston nopeus. Poista hahmonnuksen estävä JavaScript ja CSS sivun yläosan sisällöstä

Sivuston nopeus. Poista hahmonnuksen estävä JavaScript ja CSS sivun yläosan sisällöstä Sivuston nopeus 78 / 100 Nopeus Pitäisi korjata: Poista hahmonnuksen estävä JavaScript ja CSS sivun yläosan sisällöstä Sivullasi on 3 estävää ohjelmaresurssia ja 3 estävää CSS-resurssia. Tämä viivästyttää

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 1/8: Informaation esitystapa

Lisätiedot

Tämän lisäksi listataan ranskalaisin viivoin järjestelmän tarjoama toiminnallisuus:

Tämän lisäksi listataan ranskalaisin viivoin järjestelmän tarjoama toiminnallisuus: Dokumentaatio, osa 1 Tehtävämäärittely Kirjoitetaan lyhyt kuvaus toteutettavasta ohjelmasta. Kuvaus tarkentuu myöhemmin, aluksi dokumentoidaan vain ideat, joiden pohjalta työtä lähdetään tekemään. Kuvaus

Lisätiedot

Kirja on jaettu kahteen osaan: varsinaiseen- ja lisätieto-osioon. Varsinainen

Kirja on jaettu kahteen osaan: varsinaiseen- ja lisätieto-osioon. Varsinainen Alkusanat Tämän tieto- ja viestintätekniikan oppikirjan ensimmäinen versio (1. painos) syntyi vuonna 2006 Jyväskylän yliopiston tietotekniikan laitokselle tekemäni pro gradu -tutkielmani yhteydessä. Tutkimuksessani

Lisätiedot

Kirja on jaettu kahteen osaan: varsinaiseen- ja lisätieto-osioon. Varsinainen

Kirja on jaettu kahteen osaan: varsinaiseen- ja lisätieto-osioon. Varsinainen Alkusanat Tämä tieto- ja viestintätekniikan oppikirja on päivitetty versio vuonna 2007 julkaisemastani Tieto- ja viestintätekniikka -oppikirjasta. Päivityksessä kirjan sisällöt on ajantasaistettu ja samalla

Lisätiedot

Juricon Nettisivu Joomlan käyttöohjeet

Juricon Nettisivu Joomlan käyttöohjeet Juricon Nettisivu Joomlan käyttöohjeet Sisällysluettelo Julkaisujärjestelmä hallinta... 3 Joomla-järjestelmän ylävalikolla on seuraavia:... 3 Valikot... 4 Kategoriat ja artikkelit... 5 Lisäosat ja moduulien

Lisätiedot

Upotukset artikkeleihin - videot ja Spotify-listat

Upotukset artikkeleihin - videot ja Spotify-listat PIKI-verkkokirjasto 1 artikkeleihin - videot ja Spotify-listat Voit tehdä Spotify-listojen ja videoiden upotuksia artikkeleihin. Upotuskoodeihin on kuitenkin laitettava hieman lisäkoodia, jotta upotukset

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

VERKKOVELHO-YLLÄPITOTYÖKALUN KÄYTTÖOHJE

VERKKOVELHO-YLLÄPITOTYÖKALUN KÄYTTÖOHJE VERKKOVELHO-YLLÄPITOTYÖKALUN KÄYTTÖOHJE 1. SISÄÄN KIRJAUTUMINEN Sisään kirjautuminen VerkkoVelho-ylläpitotyökaluun tapahtuu yrityksesi osoitteessa www.omaosoitteesi.fi/yllapito, esim. www.verkkovelho.fi/yllapito.

Lisätiedot

Digitaalisen median tekniikat Luento 1: Intro

Digitaalisen median tekniikat Luento 1: Intro Digitaalisen median tekniikat Luento 1: Intro Web Mahtava alusta tiedon välittämiseen! Information Superhighway! Web Archive! Gutenberg! DEMO Kirjasto ja analoginen media digitaaliseksi Julkaisutekniikan

Lisätiedot

Sivuston nopeus. Tiivistämällä resursseja gzip- tai deflate-koodilla voit vähentää verkon kautta lähetettävien tavujen määrää.

Sivuston nopeus. Tiivistämällä resursseja gzip- tai deflate-koodilla voit vähentää verkon kautta lähetettävien tavujen määrää. Sivuston nopeus 45 / 100 Nopeus Pitäisi korjata: Ota pakkaus käyttöön Tiivistämällä resursseja gzip- tai deflate-koodilla voit vähentää verkon kautta lähetettävien tavujen määrää. Pienennä seuraavien resurssien

Lisätiedot

Suvi Junes Tampereen yliopisto / tietohallinto 2013

Suvi Junes Tampereen yliopisto / tietohallinto 2013 Keskustelualue Keskustelualue soveltuu eriaikaisen viestinnän välineeksi. Keskustelualueelle voidaan lähettää viestejä toisten luettavaksi, ja sitä voidaan käyttää alueena myös ryhmätöiden tekemiseen,

Lisätiedot

1.1 Sisäänkirjautuminen ST-Akatemia Online -palveluun kirjaudutaan -osoitteen kautta.

1.1 Sisäänkirjautuminen ST-Akatemia Online -palveluun kirjaudutaan  -osoitteen kautta. Sisällysluettelo ST-Akatemia Online -palvelun käyttöohjeet... 2 1. Kirjautuminen... 2 1.1 Sisäänkirjautuminen... 2 1.2 Uloskirjautuminen... 2 2. Julkaisujen lukeminen... 2 2.1 Julkaisuista palaaminen palvelun

Lisätiedot

Tehtävä 1: Tekstin käsitteleminen valinta, kopiointi, siirtely (2p)

Tehtävä 1: Tekstin käsitteleminen valinta, kopiointi, siirtely (2p) H4: Arviointiohjeet Yleistä arvioinnista: Muista laittaa myös kaikkiin arviointeihin tieto käytätkö LibreOfficea vai MS Officea ratkaisun arviointiin. Arvioinnin ensimmäinen rivi on siis esim. Arvioinnissa

Lisätiedot

HAKUOHJEET HAKULOMAKETTA KÄYTTÄEN

HAKUOHJEET HAKULOMAKETTA KÄYTTÄEN PÄTEVÄKSI TODETUT HENKILÖT Päteväksi todettuja henkilöitä voi etsiä hakulomakkeen avulla tai sivuston vasemmasta reunassa avautuvaa hakuluetteloa käyttäen. Hakulomakkeen avulla voit hakea pätevyyksiä nimen,

Lisätiedot

Digitaalisen median tekniikat css tyylimääritykset Harri Laine 1

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

Lisätiedot

63 / 100 Nopeus. Sivuston nopeus. Pitäisi korjata: Hyödynnä selaimen välimuistia. Mobiili

63 / 100 Nopeus. Sivuston nopeus. Pitäisi korjata: Hyödynnä selaimen välimuistia. Mobiili Sivuston nopeus Mobiili 63 / 100 Nopeus Pitäisi korjata: Hyödynnä selaimen välimuistia Asettamalla umpeutumispäivän tai enimmäisiän staattisten resurssien HTTP-header-osissa neuvot selainta lataamaan aiemmin

Lisätiedot

VALIKON LISÄÄMINEN Moduulin lisääminen Valikon nimikkeen lisääminen Moduulien järjestyksen muuttaminen

VALIKON LISÄÄMINEN Moduulin lisääminen Valikon nimikkeen lisääminen Moduulien järjestyksen muuttaminen ETAPPI ry JOOMLA 2.5 VALIKON LISÄÄMINEN Moduulin lisääminen Valikon nimikkeen lisääminen Moduulien järjestyksen muuttaminen ETAPPI ry JOOMLA 2.5 Sivu 1(13) Sisällysluettelo 1. Uuden valikon lisääminen...

Lisätiedot

Graafiset käyttöliittymät Sivunparantelu

Graafiset käyttöliittymät Sivunparantelu Graafiset käyttöliittymät Sivunparantelu Johdanto Tarkoituksenamme on parantaa Konebox.fi-verkkokaupan nettisivuja. Ensivaikutelman perusteella sivusto tuntuu todella kömpelöltä ja ahdistavalta. Sivu on

Lisätiedot

Design with business impact

Design with business impact Design with business impact Palveluvaaka ESTEETTÖMYYDEN ASIANTUNTIJA-ARVIO Elina Melkko & Simo Säde 4.5.2015 2 RAPORTIN RAKENNE 1. Päähavainnot 2. Havainnot osa-alueittain Arviointilomake Otsikointi Sivuston

Lisätiedot

Clt132 kevät 2008 KURSSIN LOPPUTYÖ

Clt132 kevät 2008 KURSSIN LOPPUTYÖ Yleistä lopputyöstä Clt132-kurssin suorituksessa lopputyöllä on suurin painoarvo arvostelua ajatellen. Lopputyön tarkoituksena on osoittaa, että kurssilla on opittu edes jotain ja että osaa soveltaa kurssilla

Lisätiedot

Lahden, Pohjois Karjalan ja Kemi Tornion AMK Effective Reading > 80 % 80 60 % 60 50 % < 50 % Suhteellinen osuus maksimiarvosta (%)

Lahden, Pohjois Karjalan ja Kemi Tornion AMK Effective Reading > 80 % 80 60 % 60 50 % < 50 % Suhteellinen osuus maksimiarvosta (%) Oppimisaihion arviointi / Arvioinnin tulos 9 Aineiston arvioinnin tulos arviointialueittain Lahden, Pohjois Karjalan ja Kemi Tornion AMK Effective Reading > 80 % 80 60 % 60 50 % < 50 % Arviointialue Ominaisuuksien

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

(1) refleksiivinen, (2) symmetrinen ja (3) transitiivinen.

(1) refleksiivinen, (2) symmetrinen ja (3) transitiivinen. Matematiikassa ja muuallakin joudutaan usein tekemisiin sellaisten relaatioiden kanssa, joiden lakina on tietyn ominaisuuden samuus. Tietyn ominaisuuden samuus -relaatio on ekvivalenssi; se on (1) refleksiivinen,

Lisätiedot

Suvi Junes/Pauliina Munter Tampereen yliopisto / tietohallinto 2014

Suvi Junes/Pauliina Munter Tampereen yliopisto / tietohallinto 2014 Keskustelualue Keskustelualue soveltuu eriaikaisen viestinnän välineeksi. Keskustelualueelle voidaan lähettää viestejä toisten luettavaksi, ja sitä voidaan käyttää alueena myös ryhmätöiden tekemiseen,

Lisätiedot

Tietokannan luominen:

Tietokannan luominen: Moodle 2 Tietokanta: Tietokanta on työkalu, jolla opettaja ja opiskelijat voivat julkaista tiedostoja, tekstejä, kuvia, linkkejä alueella. Opettaja määrittelee lomakkeen muotoon kentät, joiden kautta opiskelijat,

Lisätiedot

BLOGGER. ohjeita blogin pitämiseen Googlen Bloggerilla

BLOGGER. ohjeita blogin pitämiseen Googlen Bloggerilla BLOGGER ohjeita blogin pitämiseen Googlen Bloggerilla Sisältö Blogin luominen... 1 Uuden blogitekstin kirjoittaminen... 4 Kuvan lisääminen blogitekstiin... 5 Lisää kuva omalta koneelta... 6 Lisää kuva

Lisätiedot

KÄYTTÖOHJE. Servia. S solutions

KÄYTTÖOHJE. Servia. S solutions KÄYTTÖOHJE Servia S solutions Versio 1.0 Servia S solutions Servia Finland Oy PL 1188 (Microkatu 1) 70211 KUOPIO puh. (017) 441 2780 info@servia.fi www.servia.fi 2001 2004 Servia Finland Oy. Kaikki oikeudet

Lisätiedot

Matematiikassa ja muuallakin joudutaan usein tekemisiin sellaisten relaatioiden kanssa, joiden lakina on tietyn ominaisuuden samuus.

Matematiikassa ja muuallakin joudutaan usein tekemisiin sellaisten relaatioiden kanssa, joiden lakina on tietyn ominaisuuden samuus. Matematiikassa ja muuallakin joudutaan usein tekemisiin sellaisten relaatioiden kanssa, joiden lakina on tietyn ominaisuuden samuus. Matematiikassa ja muuallakin joudutaan usein tekemisiin sellaisten relaatioiden

Lisätiedot