Tekijä Mervi Ruotsalainen Kajaanin AMK päivitys:

Transkriptio

1 Tekijä Mervi Ruotsalainen Kajaanin AMK päivitys:

2 2 Sisältö 1 YLEISTÄ WWW-SIVUISTA ALOITUS TYÖKALU- JA MUOTOILUVALIKON ESITTELY TIEDOSTON TALLENNUS TIEDOSTON AVAUS UUDEN SIVUPOHJAN LUONTI TEKSTIN KIRJOITUS JA MUOKKAUS LINKIN TEKO SIVUN TAUSTAN JA TEKSTIN HYPERLINKKIEN VÄRIN VALINTA LISTAN LUONTI TEKSTISTÄ KUVAN TUONTI SIVULLE TAULUKKO TAULUKON OMINAISUUKSIEN MUUTTAMINEN:: TAULUKON SOLUN ASETUSTEN MUUTTAMINEN KIRJANMERKKI KIRJANMERKIN LUONTI LINKIN LUONTI KIRJANMERKKIIN PALAUTELOMAKE UUDEN LOMAKEPOHJAN AVAAMINEN YHDEN RIVIN TEKSTIKENTÄN ASETUSTEN MUUTTAMINEN VIERITETTÄVÄN TEKSTIRUUDUN(MUOKKAUSRUUTU)ASETUSTEN MUUTTAMINEN VALINTANAPIN ASETUSTEN MUUTTAMINEN VALINTARUUDUN ASETUSTEN MUUTTAMINEN AVATTAVAN LUETTELORUUDUN ASETUSTEN MUUTTAMINEN TYHJENNÄ PAINIKE LÄHETÄ PAINIKE LOMAKKEEN ARVOJEN ANTAMINEN KUVATIEDOSTOJEN FORMAATIT WWW-SIVUILLA WWW-SIVUJEN TEKOON TARVITTAVIEN OHJELMIEN IMUROINNISTA VERKOSTA WWW-SIVUJEN KEHYSRAKENTEET KEHYKSEN OMINAISUUKSIEN MUOKKAAMINEN TIETYN DOKUMENTIN AVAAMINEN TOISEEN KEHYKSEEN TOISEN KEHYKSEN LINKISTÄ...23

3 3 16 HYPERLINKIN LUOMINEN ULKOPUOLISEEN TIEDOSTOON TIEDOSTON LINKITTÄMINEN TAPAHTUU SEURAAVASTI SÄHKÖPOSTIA LÄHETTÄVÄN LINKIN LUONTI KOMPONENTIN LISÄÄMINEN WWW-SIVUILLE...27 Laskuri:...27 Valintapainike: SIVUSTON LUOMISESTA YLEISTÄ SIVUSTON HALLINTATYÖKALUT UUDEN SIVUSTON LUOMINEN SEURAAVAKSI LUODAAN SIVUSTOLLE SIIRTYMISRAKENNE SIVUSTON TALLENTAMINEN AIKAISEMMIN LUODUN SIVUSTON AVAAMINEN MALLIESIMERKKI SIVUSTOSTORAKENTEESTA AIKAISEMMIN TEHTYJEN SIVUJEN YHDISTÄMINEN SIVUSTOKSI VIDEON LISÄÄMINEN WWW-SIVUILLE VIDEO LISÄTÄÄN SEURAAVASTI VIDEOASETUSTEN MUUTTAMINEN TAUSTAÄÄNEN LISÄÄMINEN WWW-DOKUMENTTIEN TALLENTAMINEN INTERNET-PALVELIMELLE (KAJAANIN AMK) TIEDOSTOJEN VIENTI NETTIPALVELIMELLE SISÄLTÖTUOTANTO DIGITAALISEN MATERIAALIN NAVIGOINTIRAKENTEESTA ASSOSIATIIVINEN MALLI HIERARKKINEN MALLI (PUUMAINEN RAKENNE) RUOTO (EI-LINEAARISET MALLIT) HYBRIDI MALLI ESIMERKKI WWW-SIVUN HYPERRAKENTEESTA WWW-MATERIAALIN TEKIJÄNOIKEUS...43

4 4 Front Page - ohjeita 1 Yleistä WWW-sivuista. WWW-sivut muodostuvat yleensä useammasta yhteen linkitetystä sivusta. Linkitys voi olla joko lineaarista eli peräkkäin olevia sivuja tai sivut voidaan linkittää eri tasoihin ns. hyperlinkeillä, jolloin sivujen välinen linkitys muodostaa verkon sivujen välille. WWW-sivujen rakenne voidaan myös rakentaa ns. kehysrakenteeseen, jota nykyisin käytetään lähes aina sivuston rakenteena. Yleensä Kotisivun (tai Muun kokonaisuuden) aloitussivu talletetaan nimellä index.htm tai index.html. Muut sivut voidaan tallettaa niitä kuvaavilla sivuilla. 2 ALOITUS 1. Valitse Käynnistä ja sieltä Ohjelmat. 2. Valitse Microsoft Front Page kuvake 3 Työkalu- ja muotoiluvalikon esittely Työkaluvalikon ja Muotoiluvalikon esittely: Muista, että pudotusvalikoista löytyvät myös kaikki valikoiden toimenpiteet. Vasemmalla näkyvä Näkymät-ikkunan valinnat löytyvät myös Näytä- valikon alta ja jos näkymät-ikkunan haluaa pois, niin poista Näytä valikosta väkänen Näkymäpalkki-kohdasta. Sivu- valinta näyttää työskentelytilan, jossa sivun sisältö tehdään. Työkalut-valinnan kautta saadaan muita työkaliriviä auki. Esim. Kuva-työkalurivi tuo esille kuvan käsittelyyn liittyviä toimintakuvakkeita.

5 5 FrontPages-ohjelman alareunasta voidaan katsoa sivun sisältöä työskentelytilassa (Normaali),HTMLkoodi-ikkunassa (HTML) ja Esikatseluna eli miltä sivun pitäisi näyttää internetissä. Esim. Normaali ja HTML-tilassa eivät linkit toimi, mutta Esikatselutilassa voi tarkistaa linkkien toimivuuden 4 Tiedoston tallennus Tyhjälle pohjalle voi heti alkuun antaa sitä kuvaavan nimen ja tallentaa tiedoston. Valitse valikosta Tiedosto / Tallenna nimellä. Tiedoston nimi kohtaan kirjoitetaan tiedoston nimi ja tallennusmuotona annetaan olla Web-sivut. Kohde- alasvetovalikosta valitaan kansio, jonne tiedosto talletetaan. Samaan sivustoon liittyvät sivut kannattaa tallentaa samaan kansioon, jotta niitä on helpompi viedä internetin palvelimelle ja samalla vältytään absoluuttiselta polkuviittauksilta. Uuden kansion voi luoda painamalla Luo uusi kansio kuvaketta ja antamalla kansiolle nimi Muuta-painikkeen kautta annetaan sivustolle nimi, joka näkyy www-selaimen sinisessä yläpalkissa. Lopuksi tiedosto talletetaan painamalla Tallenna-painiketta 5 Tiedoston avaus Valitse valikosta Tiedosto/ Avaa. Valitse Kohde alasvetovalikosta kansio ja valitse sieltä avattava tiedosto ja paina Avaa painiketta. 6 Uuden sivupohjan luonti Valitse valikosta Tiedosto / Uusi / sivu jolloin avautuu seuraava valinta-ikkuna. Yleiset-lehdeltä valitaan haluttu vaihtoehto. Täältä löytyy tyhjän sivun pohta(normaalisivu), Lomakepohja jne.. Kehyssivut-lehdeltä löytyvät valmiit kehysrakenteiden mallit.

6 6 Tyylisivut-lehdeltä löytyvät valmiita sivupohjia, joissa on määritelty tyylit (Otsikko, kappaleteksti jne..) Valitse sopiva vaihtoehto ja kuittaa OK 7 Tekstin Kirjoitus ja muokkaus Kirjoita teksti Voit muokata tekstin ulkoasua Muotoiluvalikon työkaluilla. Muista maalata muotoiltava teksti ensin. 8 Linkin teko Linkki voidaan luoda joko kuvakkeesta tai tekstistä ohjautuvaksi linkiksi. Linkki voi avata joko kuvan, uuden muulla sovellusohjelmalla tehdyn tiedoston, uuden sivun tai uuden WWW-osoitteen ( Tekstistä aukeava linkki tehdään siten, että linkkisana maalataan ensin ja sitten painetaan Luo hyperlinkki kuvaketta. Tai valitse valikosta Lisää / Hyperlinkki Valitse linkitettävä tiedosto listasta tai jos linkkinä on www osoite, niin kirjoita URL-kohtaan osoite. Esim. File eli tiedosto, joka määritetään URL-kohtaan. Esim.http eli www-osoite esim. Jos linkki viittaa samassa hakemistossa olevaan tiedostoon niin kirjoita, URL-kohtaan vain tiedoston nimi, esim valikkosivu.html. Jos linkki viittaa alihakemistossa olevaan tiedostoon,tällöin, URL = hakemisto/tiedoston nimi, esim. kuvat/koira.jpg. Jos linkki viittaa ylähakemistossa olevaan tiedostoon, tällöin, URL =../tiedoston nimi, esim.../esittely.html

7 7 9 Sivun taustan ja tekstin hyperlinkkien värin valinta.sivun tausta ja hyperlinkin värin valinta yms. Voidaan määrittää sivun ominaisuudet valinnasta. Valitse Tiedosto ja sieltä ominaisuudet Avautuu ikkuna, jossa on useampi lehti: Yleiset: Tiedoston sijainti, otsikko, taustaääni yms. Tausta: Määritä taustan väri ja tekstin väri, sekä hyperlinkkiin liittyvät värit värit-kohdasta Taustakuva määritetään laittamalla linkki Taustakuvakohtaan Ja etsitään tiedosto Selaa-painikkeen alta 10 Listan luonti tekstistä Kirjoita lista valmiiksi ja maalaa teksti sekä paina numeroimaton tai numeroitu lista - painiketta Numeroitu luettelo tai Luettelomerkeillä varustettu luettelo. Luettelomerkkejä voi muokata valitsemalla valikosta Muotoile / luettelomerkit ja numerointi 11 Kuvan tuonti sivulle Paina joko Lisää kuva painiketta tai valitse valikosta Lisää / Kuva/tiedostosta tai ClipArt

8 8 Muu sijainti: Valitse Kohde alasvetovalikko ja sieltä hakemisto ja osoita kuvatiedostoa. tai valitse ClipArt 12 Taulukko WWW-sivujen tekstin ja kuvien asemointi tehdään hyvin usein taulukko-muotoon. Tällöin taulukossa voi olla paljonkin tyhjiä soluja, mutta niiden olemassa olo ei haittaa varsinaisen sivun katselua. Asemoinnin yhteydessä poistetaan taulukon reunat, jolloin katselija ei näe niitä. Muista, että voit muotoilla taulukkoa myöhemmin. Sarakkeiden ja rivien lukumäärää, Solujen sijaintia, väriä, Tekstin ulkoasua jne.. Soluun voidaan myös laittaa kuva ja solun tekstistä tai kuvasta voidaan tehdä linkki. Voit laittaa taulukon solun seinämän näkymättömäksi tai määrätä sen leveyden. Voit määrittää taulukon taustavärin tai tuoda taustalle kuvan. Lisää taulukko valitsemalla valikosta Taulukko / Lisää/ taulukko Määritä Koko kohdasta rivien ja sarakkeiden määrät. Asettelukohdasta voit määrittää Tasaus: Taulukon paikka sivulla. Reunan Koko: Reunan paksuus (jos 0, niin taulukon reunoja ei näy) Määritä leveys: Kuinka paljon taulukko on sivun leveydestä Taulukon muodon muokkaus: Voit lisätä tai tuhota taulukon soluja, rivejä tai sarakkeita, sekä muuttaa taulukon reunan ja taustan väriä, muuttaa reunaviivan paksuutta jne.. Tiettyihin soluihinkin voidaan tehdä vastaavanlaisia muuotoksia.

9 9 Jos taulukkoon lisätään rivejä ja sarakkeita, niin muutoksen paikka tulee osoittaa aina ensiksi taulukossa. Esim rivin lisäys toiminnon yhteydessä viedään kursori siihen kohta taulukkoa, johon rivi lisätään. Taulukon muotoiluun päästään valitsemalla valikosta taulukko, jolloin avautuu seuraavat valintalistat Lisää Rivit tai sarakeet: Vie kursori siihen kohti taulukkoa, johon haluat lisätä rivejä ja sarakkeita. Määritä avautuneesta ikkunasta lisäätkö rivejä vai sarakkeita ja anna lisättävien osien lukumäärä ja lisäksi valitse suunta, jonne lisättävät osiot tulevat. Lisää Solu: Riville tulee uusi solu Lisää otsikko: Taulukon otsikko kirjoittuu taulukon yläpuolelle Yhdistä Solut: Ensin maalataan yhdistettävät solut, jolloin soluista tulee yksi yhteinen solu. Jaa solut: Määritä jaetaanko sarakkeisiin vai riveihin. Valitse solu, sarake, rivi tai taulukko: Ko valinta maalaa kyseisen valinnan mukaan. Muunna, Taulukko teksteiksi Muuttaa taulukkoon luodun tekstiksi, jolloin taulukko häviää pois Ominaisuudet Valitaan muutetaanko taulukon ominaisuuksia vai tiettyjen solujen ominaisuuksia. Taulukon ominaisuuksien muuttaminen tehdään seuraavan ikkunan kautta

10 Taulukon ominaisuuksien muuttaminen:: Asettelu: Tasaus ja sijainti kohdasta muutetaan taulukon paikkaa sivulla. Solujen täyttö. Muutetaan solun sisällä olevan marginaalin kokoa Solujen välistys: Muutetaan solujen välissä olevan tilan suuruutta. Määritä leveys: Taulukon leveyden määrittäminen Reunat: Määritetään taulukon reunan ja taulukon taustan väri Koko: Taulukon solun reunan koko. 0 kun ei solun reunoja Väri: Taulukon reunan värin määrittäminen Taulukon reuna voi olla yksivärinen tai kaksivärinen. Kun käytät kahta väriä, taulukon reuna näyttää kolmiulotteiselta. Vaalea reuna ja Tumma reuna: Määritetään reunan väri Tausta: Määritetään taustan väri tai taustalle kuva. Tausta kuva haetaan Selaa-painikkeen kautta Taulukon solun asetusten muuttaminen Taulukossa voidaan muuttaa yksittäisten solujen ominaisuuksia. (Taulukko / Ominaisuudet / Solu ) Asettelu: Vaakatasaus ja pystytasaus kohdasta solun sisällön tasaus. Levitetyt rivi ja sarakkeet: Kuinka monen sarakkeen ja rivin verran solua levitetään. Reunat: valitaan solun reunaviivan väri ja taustan väri tai kuva

11 11 13 Kirjanmerkki Kirjanmerkki on sivun sisällä oleva nimetty kohdistin paikka, johon voidaan viitata linkillä. Pitkät väliotsikoilla varustetut tekstit ovat joskus hankalia rullata näytöllä ja etsiä tiettyä kappaletta rullaamalla tekstiä. Tekstin paikantamiseen ja etsimiseen voidaan käyttää kirjanmerkkejä. Kirjanmerkit on luotava ja paikannettava aina ensin sivulle ja tämän jälkeen niihin voidaan viitata linkillä. Kirjanmerkin luonnin jälkeen voidaan kirjanmerkin paikkaa siirtää tai se voidaan tuhota DELnäppäimellä Kirjanmerkin luonti. Vie kursori siihen paikkaan tekstiä, johon kirjanmerkki luodaan. Valitse valikosta Lisää / Kirjanmerkki Kirjoita merkin nimi Kirjanmerkki-nimi kohtaan ja kuittaa OK-painikkeella. (Esim Sivun loppuun voidaan tehdä kirjanmerkki nimeltä Loppuun seuraavasti. Vie kursori sivun loppuun ja valitse valikosta Lisää / Kirjanmerkki 1. Kirjoita Kirjanmerkin nimi kohtaan Loppuun (tämä on kirjanmerkin nimi) 3. Paina OK-painiketta Muut sivun kirjanmerkit listassa näkyvät HTMLtiedoston muut aikaisemmin luodut kirjanmerkit Linkin luonti Kirjanmerkkiin. Maalaa linkki-sana tekstistä (esim. Loppuun) ja tee linkki valitsemalla valikosta Lisää / Hyperlinkki Alhaalta Kirjanmerkki listasta valitaan oikea kirjanmerkki ja valinta kuitataan OK (kuva seuraavalla sivulla) Kirjanmerkki voidaan myös tehdä toisen HTML-sivun kirjanmerkkiin. Tällöin valitaan Avaa sivut kohdasta se HTML-tiedosto, jonka kirjanmerkkiin viitataan ja alhaalta valitaan Kirjanmerkkilistasta haluttu kirjanmerkki

12 12

13 13 14 Palautelomake www-sivuille voidaan laittaa palautelomake, jonka välityksellä www-sivujen katselija voi välittää teksti tietoa sivun haltijalle osoitettuun sähköpostiosoitteeseen. Front Page ohjelmassa voidaan esim. avata suoraan sivu, jolle tehdään palautelomake. Lomakkeeseen voidaan lisätä yhden rivin tekstiruutu tai vieritettävä teksti ruutu, jolle voidaan kirjoittaa pitkiäkin tekstejä. Lomakkeeseen voidaan laittaa myös ns. luetteloruutuja, valintaruutuja, valintanappeja sek ätietenkin lomakkeen tyhjennyt ja lähetyspainikkeet Uuden lomakepohjan avaaminen Valitse valikosta Tiedosto / uusi / sivu Valitse Yleiset lehdeltä palautelomake pohjaksi. Kuittaa valinta OK-painikkeella. Tällöin avautuu valmis malli, jota muokkaamalla voidaan tehdä itselle sopiva palautelomake. Palautelomakkeeseen voidaan lisätä uusia toimintoja tai siitä voidaan poistaa tarpeeton toiminto. Lomakkeen objekteja voidaan siirtää hiirellä uuteen paikkaan viemällä kursori objektin päälle ja raahaamalla se uuteen paikkaan 14.2 Yhden rivin tekstikentän asetusten muuttaminen Etunimi: Yläpuolen tekstikentän vieressä on sivustolle kirjoitettuetu nimi- teksti, joka ei liity kentän määrityksiin. etunimi- sana opastaa vain käyttäjää antamaan etunimensä viereiseen lokeroon Kaksoisklikkaa yhden rivin tekstikehystä, ja muuta uudet arvot asetus-ikkunassa. Jokaiselle objektille kannattaa antaa sitä kuvaava nimi, jotta tiedetään minkä kentän sisältö on tulostunut sähköpostiin. esim muodossa Etunimi: Marja Voit määrittää kuinka monta merkkiä kenttään voi syöttää muuttamalla Leveys merkkeinä arvoa. kuittaa muutokset OK. Alkuarvo kohtaan annetttu teksti näkyy valmiiksi tekstikentässä. Voit lisätä yhden rivin tekstikentän myös valikosta Lisää / lomake/ yhden rivin tekstiruutu

14 Vieritettävän tekstiruudun(muokkausruutu)asetusten muuttaminen Esim. Kerro mielipiteesi sivustostani Kaksoisklikkaa vieritettävän tekstiruudun päälä, jolloin saat seuraavan asetusikkunan Anna nimi kohtaan kentälle kuvaava nimi ja määritä leveys merkkeinä sekä kuinka monta riviä ikkuna on laaja. Voit lisätä vieritettävän tekstiruudun myös valikosta Lisää / lomake/ vieritettävä tekstiruutu 14.3 Valintanapin asetusten muuttaminen Valintapainikeryhmästä voidaan valita yksi vaihtoehto. Ensimmäisen valintapainikkeen yhteydessä annetaan valintapainikeryhmälle nimi Esim. Taustavari ja arvoksi tulee valittava valinta Esim. hyvin huono. Taustaväri sivuilla oli mielestäni Hyvin huono Huono Hyvä Hyvin hyvä Tämän jälkeen valitaan seuraava valintapainike ja muutetaan ryhmän nimi samaksi(taustavari Jatketaan kunnes kaikki vaihtoehdot on laitettu. Valintanappiryhmästä voidaan siis valita vain yksi vaihtoehto

15 15 Voit lisätä valintanappeja myös valikosta Lisää / lomake/ valintanappi 14.4 Valintaruudun asetusten muuttaminen Valintaruutupainike on yksinäinen elementti joka saa joko ruksin arvokseen tai ei mitään. Ei ole riippuvainen toisten valintaruutujen valinnoista. Esim: Suosittelen sivustoasi Läheisilleni Kaukaisille sukulaisilleni Työkavereilleni Valintaruudulle kannattaa antaa sitä kuvaava nimi kaksoisklikkaamalla valintaruutua, jolloin voidaan muuttaa asetuksia. Nimi kohtaan annetaan kuvaava nimi ja Arvo-kohtaan se arvo, joka välittyy sähköpostiin, jos tämä kohta on ruksattu Voit lisätä valintaruutuja myös valikosta Lisää / lomake/ valintaruutu

16 Avattavan luetteloruudun asetusten muuttaminen Avattava luetteloruutu ikkunaan määritetään valintavaihtoehdot jälleen kaksoisklikkaamalla luetteloruutua. jolloin avautuvaan ikkunaan määritetään halutut vaihtoehdot. Lisää painikkeella lisätään uusia valintoja ja Muokkaa painikkeella voidaan muokata jo annettua tekstiä sekä poista painikkeella poistetaan koko valinta. Korkeus paikkaan ilmoitetaan kuinka monta riviä on kerralla näkyvissä. Salli monivalinta tarkoittaa sitä että listasta voidaan valita useampi vaihtoehto kerrallaan Voit lisätä Avattava luetteloruudun myös valikosta Lisää / lomake/ avattava luetteloruutuu 14.6 Tyhjennä painike Lomakkeeseen lisätään yleensä TYHJENNÄ painike, joka tyhjentää lomakkeen kaikki kentät Tyhjennä asetuksia päästään katsomaan kaksoisklikkaamalla painiketta, jolloin aukeaa seuraava ikkuna Arvo tai selite kohdassa oleva teksti näkyy painikkeessa tekstinä ja painikkeen tyyppi pitää olla Palauta. Siis se palauttaa alkutilan lomakkeelle. Eli tyhjän lomakkeen. Voit lisätä painikkeen myös valikosta Lisää / lomake/ painike

17 Lähetä painike Lomake tarvitsee myös lähetä painikkeen, jolla täytetty lomake lähetetään. Lähetä Lähetä- painikkeen tietoja pääsee muuttamaan kaksois-klikkaamalla lähetä-painiketta. Arvo tai selite kohtaan kirjoitettu teksti näkyy painikkeessa ja painikkeen tyypiksi valitaan lähetä Lomakkeen arvojen antaminen Lomakkeelle itselleen on määritettävä tietoja, jotta lähetä painikkeen painalluksen jälkeen lomakkeen tiedot lähtevät oikeaan sähköpostiosoitteeseen. Lomakkeen tietoja päästään määrittämään painamalla hiiren oikean puoleinen näppäin alas lomakkeen kenttien päällä ja valitsemalla sieltä lomakkeen ominaisuudet (HUOM! Päästäksesi muuttamaan lomakkeen tietoja sinun on pitänyt luoda jo yksi lomake-elementti.) Valitse Lähetä muualle kuvan mukainen vaihtoehto: Avaa seuraavaksi Asetukset painikkeen alta aukeava lehti

18 18. Toiminto:-kentään kirjoitetaan joko sovellusohjelman nimi hakemistopolkuineen, jos sellainen on käytössä. Sovellusohjelma on sijoitettu ko palvelimelle ja se muokkaa palautelomakkeen tiedot järkevästi luettavaan muotoon sähköpostiin. Tässä voidaan käyttää harjoitusmielessä seuraavaa ohjelmaa, joka sijaitsee palvelimella. Siis on oma sähköpostiosoite, eli se korvataan omalla sähköpostiosoitteella. ALLA on valkeaa tekstiä Määritä tekstikentät esimerkin mukaan. Tässä toiminto-kentässä oleva komento kertoo sen että käytetään AMK-n palvelimella olevaa ohjelmaa mailto.exe, joka muuttaa palautelomakkeen sellaiseen muotoon, jotta palaute olisi luettavissa suoraan sähköpostista. Vielä pitää määrittää sähköpostiosoite, johon lomake lähetetään. Se tehdään seuraavasti. Valitse edelleen palautelomakkeen ikkunasta painike Lisäasetukset. Paina painiketta Lisää ja lisää seuraavat toiminnot listaan: Siis sähköposti lisätään antamalla Lisää painikkeen aukeavan ikkunaan nimi kohtaan sendto ja arvo kohtaan oma sähköpostiosoite. Server tarkoittaa palvelinta ja subject kohtaan kirjoitettu teksti näkyy saapuvassa sähköpostissa subject- eli aihekentässä

19 19 13 Kuvatiedostojen formaatit WWW-sivuilla Tietokoneella voidaan esittää ja tallentaa hyvin monia erilaisia kuvatiedostoformaatteja. Kuvatiedostoformaatit jaetaan vektori- ja bittikarttakuviin. Vektorikuvia voidaan skaalata näytöllä ilman, että kuvan laatu kärsii. Bittikarttakuvan skaalaaminen vaikuttaa kuvan näköön. Esim. bittikarttakuvan suurentaminen tekee kuvasta epätarkemman ja rakeisen. Bittikarttaformaatteja ovat esim. GIF, TIFF, JPEG, PNG, BMP, PICT. Esim. BMP-tiedostostoksi talletettu kuva on suuri tiedostokooltaan, mutta sen tallentaminen esim. GIF-muotoon pienentää kuvan tiedostokokoa. Yleisin kuvaformaatti on GIF (logot, grafiikka jne..)ja seuraavaksi yleisin JPEG (valokuvat ja paljon värisävyjä sisältävät kuvat). XBM ( X Windows System Bitmap) on harvemmin käytetty. Se on UNIX-koneissa käytetty yksivärinen pakkautuva kuvatiedosto. WWW-selaimet voivat näyttää vain tiettyjä pieneen tiedostokokoon pakkaavia kuvaformaatteja. Näitä ovat GIF, JPEG, PNG ja XMB. WWW-selainten avulla voidaan myös katsella vektorigrafiikkaa, multimediaa, ja esitysgrafiikkaa, mutta silloin on www-selaimen tueksi ladattava laajennusosa (Esim. Directorilla tehtyjä multimediaesityksiä voidaan katsella www-sivujen kautta, kunhan ensin asennetaan ilmainen verkosta ( saatava laajennusosa, shockware) GIF (Grafics Interchange Format) GIF on yleisin www-sivuilla käytetty pakkautuva kuvaformaatti, joka toimii kaikissa www-selaimissa. GIF kuva pakkautuu siten, että pakkausvaiheessa ei häviä alkuperäistä kuvainformaatiota (GIF89a). Koko pienenee ½ - 1/10 osaan alkuperäisestä koosta. GIF-kuvan ongelma on se, että piirretty kuva tallentuu 8 bittisenä kuvana, jossa on maksimissaan 256 värisävyä. Etuna on puolestaan se, että kuvasta voidaan määrittää yksi väri läpinäkyväksi (GIF89a). GIF-kuva voidaan myös animoida. Tällöin yhteen tiedostoon tallennetaan useita kuvia. GIF-kuva soveltuu logojen, painikkeiden, taustakuvien ja koristekuvien esittämiseen. JPEG ( Joint Photographic Expert Group) JPEG on toiseksi yleisin WWW-sivuilla käytetty kuvaformaatti. Se soveltuu hyvin runsaasti värisävyjä sisältävien valokuvien esittämiseen. Pakkaussuhde on 1/1,5 1/100 osa alkuperäisestä. Pakkausvaiheessa häviää alkuperäistä tietoa, mutta se ei ole yleensä olennaista ja kuvan laatu ei heikkene ratkaisevasti. WWW-sivuilla tulevat kuvat voidaan pakata 80 % pakkaus eli kompressioasteella ilman, että näkyvää eroa huomaa alkuperäiseen kuvaan. JPEG-kuva soveltuu siis laajasävyisten sävykuvien esim. valokuvasta skannattujen kuvien tallentamiseen. Voimakkaita värikontrasteja sisältävät kuvat kannattaa tallentaa GIF-muotoon. JPEG kuva tallentuu 24 bittisenä eli se voi sisältää tuhansia tai miljoonia värisävyjä. Kuvaa ei voi tehdä läpinäkyväksi yhden värin suhteen.

20 20 PNG (Portable Network Greaphics) PNG-kuvaformaatissa yhdistyy GIF- ja JPEG kuvien parhaat puolet. Kaikki selaimet eivät tue PNGformaattia suoraan. Esim. Netscape ei tue suoraan vaan siihen on haettava Live PNG-laajennus ( LivePNG mahdollistaa kuvan osan suurentamisen suoraan selainikkunassa. 14 WWW-sivujen tekoon tarvittavien ohjelmien imuroinnista verkosta Www-dokumenttien työstämisessä tarvittavia sovellusohjelmia löytyy internetistä mm. macromedian ja Tucowsin kotisvuilta. Tucowsin kotisivuilta löytyy paljon sovellusohjelmia, joita voi käyttää ilmaiseksi noin kuukauden Esim. DreamWeaver-ohjelman ilmaisversion hakeminen (uusi suosion saavuttanut HTML-editori) 1. Mene 2. Valitse Dreamweaver 3. Valitsee Dreamweaver DOWNLOAD 5. Valitse hakemisto, jonne talletan tiedoston ja kuittaa OK 5. Pura ohjelma menemällä hakemistoon, jossa tiedosto on ja avaa se. Toimi ohjelman ohjeiden mukaan. (HUOM!: macromedian sivuilta löytyy myös paljon muita apuohjelmia kotisivun tekemiseen. Edellä mainitut toimenpiteet eivät välttämättä aina päde, mutta kun muistat että DOWNLOAD-komennon alta voi aina ladata ohjelmia, kunhan noudattaa ohjeita.)

21 21 15 WWW-sivujen KEHYSRakenteet Kehyksiä tukevat Nescape 2 -> ja Explorer > versiot. Kehyksillä jaetaan selaimen ikkuna itsenäisiin osiin (soluihin, kehyksiin) joihin jokaiseen voidaan avata mikä tahansa itsenäinen HTML-sivu. Kehysrakenteella voidaan muokata sivun ulkoasu ja rakenne sopivaksi ja käyttäjäystävälliseksi. Kehys muistuttaa siis taulukon rakennetta, jolla myös voitiin sijoittaa sivun sisältö paremmin sivulle. Varsinkin silloin, kun sivu koostuu monista itsenäisistä kuva ja tekstikentistä. Front Page Express versiolla ei voi tehdä kehysrakennetta suoraan, mutta kylläkin maksetulla Front Page-versiolla. Kehystiedoston komennot voidaan kirjoittaa käsin esim muistiolla ja muistetaan tallentaa tiedosto htm tai html loppuiseksi. HTML-tiedosto, jossa on kehysrakenne sisältää vain kehysrakenteen tekoon tarvittavan koodin, ei siis varsinaista sivujen sisältöä. Kehysrakenteessa määritetään mitä sivuja mihinkin kehykseen avataan. Kehysrakenne määritetään avattavaan sivuun. Tälle sivulle ei tule muita peruskomentoja komentoja. Koska käytössämme on Front Page ohjelma, niin tekijän ei tarvitse kirjoittaa kehysrakenteen koodia esim. muistiolla vaan käytetään Front Pagen valmista kehysrakenne pohjaa. Kehysrakenne aloitetaan avaamalla uusi sivupohja, johon määritetään kehysrakenne 1. Valitse valikosta Tiedosto / uusi / sivu ja avautuneesta ikkunasta lehti kehyssivut 2. Valitse haluamasi kehystyyli. Kuittaa OK Työpöydälle avautuu kehysrakenne, jossa jokaisessa osiossa on painikkeet Määritä aloitussivu. ja Uusi sivu.. Määritä aloitussivu tarkoittaa tilannetta jolloin on jo valmiiksi tehty kehykseen aukeavat sivut. Nämä sivut määritetään tämän painikkeen alta aukeaviksi sivuiksi Uusi sivu painikkeen alta saadaan aukeamaan uusi tyhjä sivu, jota päästään muokkaamaan. Eli kehykseen aukeaa tyhjä tila, jota voidaan muokata (valkoinen tausta) Jo aikaisemmin tehty sivu aukaistaan kehykseen seuraavasti.

22 22 Valitse Määritä aloitussivu--- painike ja määritä kohde-kohtaan kansio, jossa sivu sijaitsee ja osoita valittua tiedostoa 15.1 Kehyksen ominaisuuksien muokkaaminen Kukin kehys on nimetty ja kehyksen ominaisuuksia päästään muokkaamaan klikkaamalla kehys aktiiviseksi ja valitsemalla valikosta Kehykset / Kehyksen ominaisuudet Nimi ikkunassa nähdään kehykselle annettu nimi Aloitussivu kertoo sivun, joka aukeaa kehykseen Kehyksen koko kohdasta määritetään kehyksen mittasuhteet Reunukset kohdasta määritetään kehyksen reunojen ominaisuudet Koko muutettavissa selaimessa kohdassa annetaan käyttäjäjälle mahdollisuus muuttaa kehyksen leveyttä.

23 TIETYN DOKUMENTIN AVAAMINEN TOISEEN KEHYKSEEN TOISEN KEHYKSEN LINKISTÄ Jos sivut on rakennettu kehysrakenteeseen ja halutaan että toisen kehyksen linkistä aukeaa tietyn htmtiedoston sisältö johonkin toiseen kehykseen, niin linkki-sanan osoitteessa kerrotaan mihin kehykseen linkki avataan Maalataan linkkisana ja avataan linkin määritysikkuna valitsemalla Lisää / hyperlinkki Yläpuolen listasta valitaan avattava tiedosto, jolloin nimi siirtyy URL-riville. Kehykseen, johon sivu avataan määrätään alhaalta oikealta olevasta Kohdekehys kohdasta. (jos valitsit Sisältö tyyppisen kehyksen, niin vasemman puoleinen kehys on nimeltään sisältö ja oikeapuoleinen nimeltään pää. Jos ehdotuksena ei ole oikea kehys, niin pääset valitsemaan kehyksen kynäpainikkeen alta ja tästä ikkunasta valitaan oikea kehys klikkaamalla sitä kehystä avautuneesta ikkunasta, johon sivun halutaan aukeavan Esim.

24 24 Valikko.htmtiedosto aloitus.htmtiedosto Sisältö pää

25 25 16 Hyperlinkin luominen ulkopuoliseen tiedostoon Voit luoda hyperlinkin kuvasta tai maalatusta sanasta johonkin toisella ohjelmalla tehtyyn tiedostoon. Esim. jos sivuilla halutaan esittää word- tai tai Excel-tiedostojen sisältöjä, niin ne voidaan linkittää www-sivuille omana linkkinään. Tällöin vastaanottajalla on oltava tietenkin ohjelma, joka pystyy avaamaan tiedoston sisällön. Linkki avaa tiedoston kyseiseen ohjelmaan millä se voidaan avata (Esim Word-dokumentti avautuu Wordin ohjelmaan) ja täten tietokoneessa on auki www-sivu sekä wordohjelma) Linkitetty tiedosto aukeaa siis omaan ikkunaan ja se voidaan sulkea sulkemalla kyseinen sovellusohjelma. Linkitetyn tiedoston osalta on muistettava että se on myös kopioitava ja vietävä muiden www-sivujen mukana palvelimelle, josta kyseinen www-sivu linkkeineen voidaan aukaista. Näinhän oli myös meneteltävä www-sivuille lisättyjen kuvien suhteen. Jos Excel- ja word - tiedoston sisään on liitetty kuva, niin nämä kuvat ovat tiedoston sisällä ja siten ne sisältyvät kyseiseen tiedostopakettiin sisälle Tiedoston linkittäminen tapahtuu seuraavasti 1. Valitse joko kuva tai maalaa linkitettävä sana. 2. Valitse valikosta Lisää / Hyperlinkki 3. Avautuneesta ikkunasta (alla oleva kuva) paina painiketta Luo hyperlinkki tietokoneen tiedostoon 4. Valitse avautuneesta ikkunasta kohde kohdasta kansio, jossa tiedosto on ja valitse linkitettävä tiedosto kansiosta sekä kuittaa valinta OK-painikkeella Sähköpostia lähettävän linkin luonti Voit luoda linkin, joka aukaisee selaimen sähköpostin. 1. Maalaa linkitettävä sana 2. Valitse valikosta Lisää /Hyperlinkki ja paina avautuneesta ikkunasta (vrt alapuolella oleva kuva) 3. Kirjoita avautuneeseen ikkunaan sähköpostiosoite (mervi.ruotsalainen@mail.kajak.fi) 4.

26 26

27 27 17 Komponentin lisääminen www-sivuille www-sivuille voidaan lisätä myös komponentti, joka voi olla esim. Exceltaulukkolaskentataulukon osa, pivottaulukko tai kaavio tai jokin muu Komponentin lisääminen tapahtuu valikosta Lisää / komponentti Komponentti ilmestyy omana objektinaan ja sen kokoa voidaan muuttaa tartuntakahvoista. OFFICE-laskentataulukko: Exceltaulukon voi myös luoda valmiiksi Excel-ohjelmassa ja tämä taulukko kopioidaan leikkelepöydän kautta FrontPageen: (Tee Excel-taulukko excelissä. Maalaa se ja valitse Muokkaa / kopioi. Siirry Front Pageen ja vie kursori siihen kohtaa tekstiä, johon taulukko tulee. Liitä se valitsemalla Muokkaa / Liitä) Laskuri: Voit asentaa laskurin valitsemalla valikosta Lisää / komponentti/laskuri. Koska laskuri vaatii sen, että kun sivulla on käyty, niin silloin johonkin on talletettava tieto laskurin kasvusta. Yleensä peruspalvelin sivuilla on suojaus, että sinne ei pysty tallettamaan tietoa. Tästä johtuen laskurien päivitys on hankalaa. Netistä löytyy ns. ilmaispalvelimia, joista voi tilata ilmaisen laskuripalvelun. Tällöin palveluun voi liittyä mainontaa tai muuta oheistoimintaa. Näitä laskureita ei saa käyttää kaupallisessa tarkoituksessa. Laskuri sijaitsee siis palvelun tarjoajan selaimella, joka päivittää laskurin ajantasalle. On myös mahdollista että sillä palvelimella, jolla laskuri sijaitsee on tämä palvelu (Huomautus Laskuri toimii vain sivuston sivuilla ja edellyttää, että Web-palvelimesi käyttää FrontPage-palvelinlaajennuksia). Siispä tämä täytyy selvitellä AMK: n sivuston suhteen. Valintapainike: Voidaan laittaa painikkeen alta avautumaan ulkopuolinen tiedosto tai www-sivu.

28 28 Painikkeen ominaisuuksia voidaan muuttaa myöhemmin. Painike on ns. toimintopainike, joka elää sivulla, esim. välkyy tai vaihtaa väriä Painikkeen teksti: tähän kirjoitetaan painikkeeseen tuleva teksti. Linkki: tähän määritetään mitä painikkeen painallus tekee. Esim avaa toisen HTML- sivun, woeddokumentin tai uuden www-sivun. Vierivä teksti: www-sivuille voi lisätä myös vieriviä tekstejä valitsemalla valikosta Lisää / Komponentti / Vierivä teksti Kirjoita Teksti- kohtaan teksti, jolle efekti halutaan. Tällaiset efektit kannattaa testata sekä Explorer että Netscape-selaimen kautta, sillä nämä selaimet eivät aina osaa näyttää efektiä.

29 29 18 SIVUSTON LUOMISESTA YLEISTÄ FrontPagen sivusto sisältää WWW-dokumenttikokonaisuuden hakemistot ja tiedostot, siis htmltiedostojen lisäksi myös kuvatiedostot sekä muut liitetiedostot (word-dokumentit, jne..). Sivuston luomisen yhteydessä luodaan automaattisesti _private- ja images- hakemistot sekä aloitussivu, jolle tulee nimeksi index-htm. Sivuston rakenteen voi luoda itse tai sitten voi käyttää FrontPagen omia sivuston malleja. I:\\RuotsalainenMervi Kurssi1 _PRIVATE IM A GES oma Näkymät -palkin kautta hallitaan tiedostojen ja hakemistojen muodostamaa kokonaisuutta. Näkymät palkki saadaan näkyviin(tai pois ) valitsemalla valikosta Näytä / Näkymäpalkki Sivuston hallintatyökalut Sivuston hallintaan on käytössä graafisia työkaluja: Kansiot ( Folders) Raportit (Reports) Siirtyminen (Navigation) Tässä luodaan navigointirakenne Hyperlinkit (Hyperlinks) Tehtävät (Tasks) Tulevaisuudessa aiotut tehtävät Ennen varsinaisten dokumenttien tekemistä luodaan sivustolle siirtymisrakenne. Tämä ei tee sivuistoille näkyvää jälkeä, mutta aloittaa dokumentit ja nimeää ne rakenteen määrittelyssä annetuilla nimillä. Käyttäjä antaa sivuille nimet ja joutuu myös luomaan linkitykset sivuille. Sivuston sivuille jostakin toisesta hakemistosta linkitetyt kuvat siirtyvät automaattisesti siihen hakemistoon, jossa sivu sijaitsee, kunhan käyttäjä antaa luvan ohjelman kysyessä sitä. siihen

30 30 19 UUDEN SIVUSTON LUOMINEN FrontPagen käynnistyksen jälkeen on päätettävä tehdäänkö yksittäisiä sivuja vai luodaanko sivustokokonaisuus. Sivustokokonaisuus tarjoittaa sitä että tavallaan tehdään projekti, joka koostuu esim. tietyn kurssin 1 html-sivuista ja siihen liitetyistä kuvista ja linkitetyistä tiedostoista (word). Tällöin sivusto nimetään sitä kuvaavalla nimellä (kurssi1) ja tämän jälkeen voimme hallita koko kokonaisuutta kutsumalla kurssi1 sivustoon liittyviä osakokonaisuuksia (tiedostoja) yksistään avaamalla sivusto. Tällöin kaikki tähän sivustoon liittyvistä tiedostoista aukeaa yhtä aikaa. Täten yksittäisiä sivuja ei tarvitse aukaista yksitellen. FrontPage-ohjelman käynnistys aukaisee aina uuden tyhjän yksittäisen sivun ei sivustoa. Täten käyttäjän on itse aloitettava sivuston luominen seuraavasti 1. Valitse valikosta Tiedosto / Uusi / Sivusto. 2. Valitse Yksityinen sivusto ja kirjoita hakemisto polkuineen kohtaan -Määritä uuden websivuston sijainti, jonne talletat sivut. Esimerkiksi I:\\RuotsalainenMervi\kurssi1 I:\\RuotsalainenMervi on kansio intekoasemalla ja sen alle luodaan uusi kansio nimeltä kurssi1. Tämä kansi ei siis ole olemassa valmiiksi vaan ohjelma luo sen sinne. Hakemiston alle muodostui _Private ja images- kansiot ja FrontPage-ohjelman omia kansioita.. Kansioiden alla näkyy myös pääsivu, joka on nimeltään index.htm. Työtilassa on tyhjä aloitussivu, joka on nimeltään index.htm

31 31 3. Edellisen ikkunan hyväksymisen jälkeen FrontPage ikkunaan aukeaa Kansioluettelo ikkuna. Voit sulkea sen valitsemalla valikosta Näytä / kansioluettelo. Poista väkänen listasta kansioluettelokohdasta klikkaamalla sitä hiirellä 19.1 Seuraavaksi luodaan sivustolle siirtymisrakenne 1. Avaa siirtymisrakennetyötilaan valitsemalla Näkymät palkista Siirtyminen- painike. Työtilaan aukeaa seuraava näkymä. 2. Pääsivu (index.htm) näkyy nimellä Kotisivu ja siinä on symboli koti-kuvakkeena. 3. Siirtymisrakenteeseen luodaan uusia uusia sivuja seuraavasti. 4. Paina kotisivu-kuvakkeen päällä oikeanpuoleista hiiren näppäintä ja valitse listasta Uusi sivu 5. Tällöin kotisivun alle ilmestyy Uusi sivu 1 niminen sivu. Näiden sivujen välillä on viiva, joka kuvaa dokumentin välistä yhteyttä 6. Muuta Uusi sivu 1 nimi sivun sisältöä kuvaavaksi nimeksi. Nimi voidaan muuttaa klikkaamalla kursori nimikentän päällä, jolloin kursori siirtyy nimikenttään. Voit luoda valmiiksi sivuston rakenteen ja sitten vasta kirjoittaa sivujen sisällön. Tietenkin on mahdollista myös kirjoittaa sitä mukaa sivujen sisältöjä kun niitä luodaan. Ennen uuden sivun luomista on aina valittava se sivu, johon yhteys luodaan. Hyperlinkin luominen sivulle Siirtyminen -näkymässä 1. Paina hiiren oikeanpuoleista näppäintä sivun päällä ja valitse sieltä Ulkoinen hyperlinkki 2. Kirjoita avautuneen ikkunan URL-kohtaan www-osoite. 3. kuittaa OK Sivustorakenteen luominen ei kuitenkaan tee linkkejä sivujen välille, vaan ne on tehtävä aina itse Sivujen paikkaa sivustossa voi muuttaa ottamalla hiirellä kiinni ko sivusta ja vetämällä se haluttuun paikkaan.

32 Sivuston tallentaminen Sivuston rakennenäkymää ei tarvitse erikseen tallentaa, mutta ne sivut joihin on tehty muutoksia pitää tallentaa erikseen. Ohjelman lopetus-komennon jälkeen ohjelma kysyy yksitellen tallennuksesta, jos sivulla on käyty tekemässä muutoksia Aikaisemmin luodun sivuston avaaminen Aikaisemmin luotu sivusto avataan valitsemalla valikosta Tiedosto / Avaa Sivusto Valitse kansio, johon sivuston on talletettu. (Esim. kurssi1) ja paina Avaa painike Siirtyminen-näkymä tilassa näet sivuston rakenteen 19.4 Malliesimerkki sivustostorakenteesta Sivuston luomisen etuna on se että kyseiseen aiheeseen kuuluvat sivut pysyvät samassa paketissa kansion alla ja siten niitä on helpompi liikutella paikasta toiseen. Sivustoon kuuluvat sivut saadaan aukiyhdellä kertaa avaamalla sivusto.

33 33 20 AIKAISEMMIN TEHTYJEN SIVUJEN YHDISTÄMINEN SIVUSTOKSI Aikaisemmin luotujen yksittäisten sivujen yhdistäminen sivustoksi on mahdollista seuraavalla tavalla Avaa FrontPage ja valitse valikosta Tiedosto / Uusi / Sivusto Valitse avautuneesta ikkunasta Ohjattu sivuston tuominen ja muista laittaa kansio, johon tietyllä nimellä luotu sivusto avataan (esim OmatSivut) kuittaa OK Tällöin avautuu ohjattu sivuston luominen ja seuraava ikkuna avautuu Jos sivut sijaitsevat jollakin levyasemalla, niin valitse ylempi vaihtoehto ja määritä Selaa-painikkeen alta missä kansiossa kyseiset tiedostot sijaitsevat. Laita myös rasti Sisällytä alikansiot kohtaan jos kansion alla on alikansioita, jossa esim on talletettu kuvia. Seuraavaksi aukeaa ikkuna, jossa näkyvät kyseisen kansion tiedosto sisältö. Jos haluat jättää joitakin tiedostoja pois, niin valitse ne ja paina Jätä pois-painiketta. Lopuksi kuittaa painiketta. Lopuksi voit painaa Päivitä painiketta. Siirry eteenpäin NEXT-painikkeella.

34 34 Tämän jälkeen ilmestyy seuraava sivu, joka kuitataan Finish-painikkeella. Annetaan seuraavaksi sivukokonaisuudelle uusi nimi. Valitse valikosta Työkalut / Web-sivuston asetukset Kirjoita avautuneeseen ikkunaan Yleiset-lehdelle Web-sivuston nimi kohtaan WEB-sivuston nimi. Esim. Mervinkotisivu Ja kuittaa OK Siirtyminen rakenteessa voidaan määrittää navigointirakenne siten että kansiot-luettelosta vedetään ko sivut rakennenäkymän puolelle ja määritetään sivun sijainti ko rakenteessa.

35 35 21 Videon lisääminen www-sivuille WWW-sivuille voi myös lisätä videoita. Videon kokona kannattaa käyttä 320X240, sillä muuten videon lataamisaika voi kasvaa suureksikin ja video näkyy nykivänä tai ei pyöri lainkaan. Videon esitys aika kannattaa pitää muutamissa minuuteissa korkeintaan. Videotiedosto pitää muistaa myös viedä palvelimelle HTML-dokumentin mukana, jossa se aukeaa. Se on siis erillinentiedosto kuten kuva, word-dokumentti jne.. Muutamia linkkejä, josta löytyy videoita: Kuvat, ääni ja video World Wide Webissä ( Lainaus yllä olevasta linkistä Koska tiedostojen koko on pulma, ne täytyy pakata. Yleisimmin käytetty tekniikka on ns. MPEGpakkaus, joka on still-kuvissa käytetyn JPEG-pakkaustekniikan sovellus liikkuvaan kuvaan. Tämä pakkaustapa on tehokas, joten siirrettävä tiedosto on melko pieni, mutta toisaalta pakkaustapa hävittää kuvan tarkemmat yksityiskohdat. Jonkin verran näkee myös käytettävän Microsoftin Video for Windowsvideoformaattia, Intelin Indeo-videofor-maattia ja Apple Computerin Macintosh-koneille kehittämää QuickTime-videoformaattia. Yleensä kukin näistä tarvitsee oman apuohjelmansa käyttäjän mikroon ennen kuin niitä voi katsoa. Kunkin tiedostomuodon hallitsevia ns. runtime-ohjelmia voi löytää ilmaiseksi verkon ftptiedostopalvelimista, myös QuickTime-ohjelmia PC-koneille ja Video for Windows -muodon hallitsevia ohjelmia Macintosheille. Kaikkein yleisimmän eli MPEG-videon esittämiseen löytyy verkosta myös monia eri apuohjelmia, mutta ne ovat yleensä kaikki ns. shareware-ohjelmia, eli niistä täytyy maksaa pienehkö rekisteröintimaksu tekijälle. Tyypillistä on, että rekisteröimätön, ilmainen mpeg-esitysohjelma suostuu näyttämään vain alle 1 Mb kokoisia videotiedostoja eli siis vain aivan lyhyitä pätkiä. Maksamalla maksun saa täyden version, jolla voi sitten esittää vaikkapa satojen megatavujen esittelyvideoita Video lisätään seuraavasti Valitse valikosta Lisää / kuva / video Valitse Look In kohdasta hakemisto, jossa video sijaitsee ja valitse videotiedosto sekä kuittaa OK

36 Videoasetusten muuttaminen Voit muuttaa videon esitysasetuksia klikkaamalla hiiren oikeanpuoleista näppäintä videoklipin päällä ja valitsemalla listasta Kuvan ominaisuudet Avautuneesta ikkunasta varmistetaan että ollaan Videot lehdellä ja tältä lehdeltä voidaan muuttaa videon esitystoistokertoja jne. 22. TAUSTAÄÄNEN LISÄÄMINEN HTML-sivuille voi lisätä myös soimaan taustaäänen Taustaäänitiedosto lisätään valitsemalla valikosta Muotoile / Tausta ja avautuneesta ikkunasta valitaan Yleiset lehti Tältä lehdeltä Taustaääni-kohdasta painetaan Selaa-painiketta, ja valitaan kansio, jossa taustaäänitiedosto sijaitsee. Valitaan tiedosto Taustaäänen toistokerrat määritetään Toistokerrat kohdasta Lopuksi kuitataan OK

37 37

38 38 EI TULOSTETTU 23 WWW-DOKUMENTTIEN TALLENTAMINEN INTERNET- PALVELIMELLE (Kajaanin AMK) Valmiit www-sivut talletetaan palvelimelle etukäteen määrättyyn kansioon. TYö Mikro Levyresurssi: \\kajaklib\opetusma Tutka Palvelin Kotimikro \\TO2\INTEKO Internet Palvelin Kotimikro Ennen tallentamista on tietenkin yhdistettävä levyasemaresurssi (\\kajaklib\opetusma) Levyresurssin alle on tehty kullekin oma hakemisto ja tämän hakemiston alle talletetaan materiaalit. Yhdistä levyresurssi seuraavasti: 1. Avaa oma tietokone kuvake ja osoita yksi levyasema siniseksi (yksi klikkaus, ei siis avata). 2. Valitse valikosta File / Exlore (resurssihallinta) 3. Valitse avautuneesta ikkunasta valikosta Tools / Map Network Driver (Pääset myös resurssien hallintaan klikkaamalla hiiren oikeanpuoleista näppäintä Oma Tietokonekuvakkeen päällä ja valitsemalla avautuneesta listasta Explore.) 4. Valitse jokin asematunnus kirjain ja kirjoita path-kohtaan \\kajaklib\opetusma 5. Laita rasti Reconnect at Logon kohtaan ja kuittaa OK Tämän jälkeen omatietokone-ikkunaan ilmestyy kyseinen levyasema ikonina Edellä mainitulla tavalla voit myös yhdistää INTEKO-aseman, jos se on tipahtanut pois. Internetin kautta tultaessa katsomaan sivuja anna osoitteeksi URL:

39 39 Yllä oleva osoite johtaa siihen juurihakemistoon, jossa näkyvät kaikkien sinne tehtyjen henkilöiden kansiot. Näiden alle kukin tekee uusia kansioita, jonne tiedostot talletetaan. 24 Tiedostojen vienti nettipalvelimelle. Teon alla olevat tiedostot kannattaa tallentaa joko omalle Z- asemalle, oman tietokoneen asemalle tai INTEKO-asemalle. Täältä kopioidaan valmiit sivut vasta palvelimelle Tietyn asiakokonaisuuden tiedostot kannattaa tallentaa hakemiston alle. Jos sivujen teon yhteydessä on käyttänyt sivuston luonti toimintoa, niin silloin kansion nimi on sama kuin sivuston nimi. Avaa oman tietokoneen kautta inteko asema ja valitse omalla nimellä oleva kansio. Älä avaa sitä, vaan kopioi se esim. seuraavasti. Vie hiiri kopioitavan kansion päälle ja paina hiiren oikeanpuoleista näppäintä alas. Valitse avautuneesta listasta kopioi toiminto. Avaa oman tietokoneen kautta www-palvelin asema (kajaklib\oppima) ja avaa sieltä oman niminen kansio. Liitä kopioimasi kansio valitsemalla Muokkaa / Liitä.

40 40 25 Sisältötuotanto (lähde: Oulun yliopisto Digitaalisen median perusteet 3 ov: Kari Pankonen) Mitä projektisuunnitelman tulee sisältää? Projektisuunnitelma on sisältää mm. seuraavat asiat: 1. hankkeen idea 2. henkilöstön esittely ja toiminta: - tiimin jäsenten lkm, kunkin jäsenen vastuualueet, jäsenien muu osaaminen (kommunikointi jne.), kuka toimii projektin vetäjänä jne. 3. tarvittavat tilat, laitteet, softat, lisenssit 4. miten idea aiotaan toteuttaa (sisällöntuotantoprosessit) 5. aikataulu (yleispiirteittäin) + projektin vaiheistus 6. Käytettävät markkinointikeinot ja rahoitus. Taustatietoja: Tuotettava mediasisältö voi tarkoittaa mm. tietopalveluita, kauppapaikkoja, verkkolehtiä tai yritysten, organisaatioiden ja yksityisten ihmisten sekä erilaisten järjestöjen tuotteita ja palveluja yms. tai esimerkiksi vaikkapa taidetta ja kirjallisuutta Seuraavassa muutamia painotettavia seikkoja: Tiimiajattelu: Multi- ja hypermediatuotannossa, ja siten myös oleellisessa osaa koko digitaalisen median sisältöhankkeita, tiimiajattelu on keskeistä. Tiimejä tarvitaan, kun projektin toteuttamiseen vaadittavat osaamisalueet ja työtuntien määrä paisuvat niin suuriksi, ettei yhden ihmisen resurssit riitä. Ryhmätyön onnistumiseksi taas tarvitaan omaa erityisosaamista, kuten dokumentointi- ja viestintätaitoja, ja usein erillinen vetäjä, joka keskittyy pelkkään koordinointiin. Suunnittelu ja protoilu: Tehtävän - kuten usein reaalimaailman projektienkin - pääpaino on suunnittelussa. Kehitettävien järjestelmien protoilu, siis koeversioiden kyhääminen ja kokeilu, voi kuitenkin olla tärkeä osa projektia melkein alusta asti. MIT:n kuuluisan Media Labin mottona on joskus kuullut: "demo or die!" Siis jos kirjoittaminen ja kaavioiden teko, ja muu sellainen suunnittelutyö tympii, ei välttämättä ole paha idea tehdä prototyyppiä.

41 41 26 Digitaalisen materiaalin Navigointirakenteesta Digitaalinen materiaali voi olla joko www-sivu tai jokin muu digitaalisessa muodossa tuotettava materiaali, joka koostuu hypertekstistä. Sisällön esittäminen hypertekstimuodossa vaatii laatijalta tarkkaa suunnitelmaa sivuston navikointirakenteesta. Navigointirakenteen tulisi olla selkeä, ja sen otsikoiden tulisi kuvata asiasisältöä. Navikointirakeneteessa tulisi erottaa päätasot ja päätasojen alitasot. Pohdittavaa navigointia suunnitellessa: Miten sivustolta löytää haluamansa? Tarvitaanko navigaatioapuja: hakemistoa, sisällysluetteloa, karttaa tai kenties vapaasanahakua? Onko rakenne sellainen, että jokaiselta sivulta voi päästä jokaiselle sivulle vai riittääkö, jos jokaiselta sivulta pääsee joillekin sivuille? Mitä linkkejä järjestelmän pääsivulta lähtee? Leveä vai syvä rakenne? 26.1 Lineaarinen malli Lineaarisessa rakenteessa edetään periaatteessa ensimmäisestä asiasta viimeiseen. Yleensä painonappeina on seuraava- edellinen (next - previous). Tällainen rakenne on www-sivuilla harvinainen, mutta käytettävissä ohjatuissa kiertoajeluissa (guided tours) ja haluttaessa käyttäjän käyvän läpi kaikki vaihtoehdot esim. laskun maksaminen verkkopankissa Assosiatiivinen malli Assosiatiivisessa rakenteessa asiaa voidaan lähestytä miltä suunnalta tahansa. WWW on pääasiassa juuri assosiatiivisten linkkien varaan rakennettu ympäristö ja niiden klikkailu on kaikille tuttua. Koska jokainen järjestelmän solmu (sivu) voi olla ensimmäinen tai viimeinen, pitää sivun suunnittelijan ajatella yhtä sivua kokonaisuutena: sivun ymmärtämiseen ei tarvitse kulkea tiettyjen linkkien kautta. Kuitenkin jokaisesta solmusta pitää päästä käsiksi sivuston muuhun materiaaliin, ainakin aihepiirin pääsivulle.

42 42 WWW sivulla assosiatiivinen linkki voi viitata saman sivun (dokumentin) eri kohtaan tai valittuun URL-osoitteeseen. Linkkien nimeämisessä kannattaa olla tarkkana. yhden sanan linkki on joskus liian lyhyt. Koko lauseen käyttäminen linkkinä näyttää liian pitkältä, varsinkin jos se ulottuu useammalle riville. Myös tämä- tai tästä-sanan käyttäminen linkkinä on mautonta: "Klikkaa tästä päästäksesi Kajaanin kaupungin sivuille. Myös kuvia käytetään kuvaamaan linkin kohdetta (esimerkiksi suurennuslasi kuvaa linkkiä hakusivulle) Hierarkkinen malli (puumainen rakenne) Hierarkkisessa rakenteessa edetään pääasioista edelleen alaspäin. Internetissä yleensä sivuston aloitussivusta (index-sivulta) käsin on nähtävissä tällainen rakenne. Puurakenteinen, hierarkkinen järjestys on usein lukijankin kannalta helposti hahmotettava kokonaisuus, mutta rakenteesta ei saisi tulla liian syvä muttei toisaalta liian matalakaan. Varsinaiseen asiaan pääsemiseksi ei ole mukava kahlata neljän - viiden linkin kautta.

43 Ruoto (Ei-lineaariset mallit) 26.5 Hybridi malli Yleensä useita eri rakenteita sovelletaan samassa järjestelmässä rinnakkain. Sivuston alku voi olla puurakenteinen, mutta edetessä muuttuu assosiatiiviseksi ja joihinkin soluihin voi päästä vain lineaarista reittiä pitkin. Navigoinnin apuna voidaan käyttää myös vapaasanahakua, sisällysluetteloa ja karttaa sivuston rakenteesta Esimerkki www-sivun hyperrakenteesta 27 WWW-materiaalin tekijänoikeus

44 44 Mitä tahansa materiaali tuotettaessa on muistettava tekijänoikeuskysymykset. Toisen tekijän kuva-, ääni-, video-, animaatio-, teksti yms. materiaali on tekijänoikeussuojattua materiaalia. Lainattaessa toisen tekemää materiaalia on muistettava tarkastella tekijänoikeusasiat. Tähän löytyy tietoa netistä esim linkeistä: ) Muutamia linkkejä: (erittäin hyvät ja laajat luovuuteen liittyvät sivut) (asiantuntijuudesta) (tuotteistamisesta)