Tiedostomuodon valitseminen kuville

Transkriptio

1 Kuvan lisääminen sivulle Valitse työkaluriviltä Lisää Kuva tiedostosta painike 1. Ruudulle aukeaa sekä Kuva-ikkuna että Valitse tiedosto ikkuna 2. Selaa Valitse tiedosto ikkunassa esiin se kuva, jonka haluat sivullesi lisätä 3. Napsauta OK 4. Kuva lisätään sivulle Kuvan kiertäminen ja kääntäminen Frontpagessa kuvan kiertäminen ja kääntäminen onnistuu käyttämällä kuva työkalurivin kierrä käännä painikkeita Painikkeet vasemmalta oikealle: Kierrä vasemmalle; kierrä oikealle; käännä pystysuunnassa; käännä vaakasuunnassa. Tiedostomuodon valitseminen kuville Melkein kaikki Internetissä julkaistavat kuvat ovat joko JPEG/JPG- (Joint Photographic Experts Group) tai GIF - muotoisia (Graphics Interchange Format). Myös muita tiedostomuotoja on käytössä, kuten uusi PNG -formaatti (Portable Network Graphics). Jos kuitenkin haluat olla aivan varma, että useimmat selaimet pystyvät näyttämään kuvasi, valitse 2002 Päivi Vartiainen 1

2 joko JPEG tai GIF, kaikki selaimet eivät tue muita kuvaformaatteja. Kuvien latausaika ja sen hallinta Sivun lataamiseen kuluva aika on sivun kaikkien elementtien yhteenlaskettu koko jaettuna käytettävissä olevalla kaistanleveydellä. FrontPage osaa arvioida sivujen lataamisajan tavallisella modeemilla, FrontPage näyttää arvion tilarivillä. Mikäli sivun latausaika on suuri, kannattaa yrittää pienentää kuvien kokoa. Clipart kuvan lisääminen Valitse Lisää/kuva/ClipArt tai napsauta Lisää kuva -painiketta 1. Etsi kategoria josta haluat kuvaa etsiä 2. Napsauta haluamasi kategorian kuvaketta 3. Etsi leike jonka haluat lisätä työhösi 4. Napsauta leike aktiiviseksi 5. Kun leike on aktiivinen sen viereen tulee valintaluettelo valintapainikkeineen Päivi Vartiainen 2

3 6. Napsauta ensimmäistä painiketta jos haluat lisätä kuvan 7. Toinen painike tuo leikkeen esikatselu tilaan 8. Kolmannesta painikkeesta voit lisätä leikkeen johonkin luokkaan, esimerkiksi suosikkeihin 9. Neljäs painike on samankaltaisten leikkeiden etsimistä varten Kun kuva lisätään sivulle siihen joutuu mahdollisesti kohdistamaan muutamia muotoiluja, yleensä vähintään kuvan kokoa joutuu muuttamaan. Kun kuva on aktiivinen sen jokaisessa kulmassa ja jokaisella sivulla on näkyvissä musta neliö, ns. koonmuuttokahvat. Kun haluat muuttaa kuvan kokoa vie hiiriosoitin koonmuuttokahvan päälle, siten että se muuttuu kaksipäiseksi pieneksi mustaksi nuoleksi ja vedä hiiren painike alaspainettuna kuvan keskipistettä kohti. Kun kuva on haluamasi kokoinen vapauta hiiren painike Päivi Vartiainen 3

4 Läpinäkyvän värin valitseminen Läpinäkyvät värit ovat suosittu grafiikan käyttötapa Web-sivuilla. Kun luot läpinäkyviä värejä sisältävän kuvan, kuten esim. viereisessä kuvassa kuvan tausta on valkoinen ja sivun taustaväri keltainen, kuvan reunat näkyvät häiritsevästi. Kuvan taustan voi muuttaa läpinäkyväksi. 1. Valitse kuva napsauttamalla sitä hiiren ykköspainikkeella 2. Valitussa kuvassa on koonmuuttokahvat näkyvissä kulmissa ja jokaisella sivulla 3. Kun kuva on valittuna Kuva työkalurivi on käytössä ruudun alalaidassa 4. Valitse Kuva-työkaluriviltä Määritä läpinäkyvä väri - painike 5. Hiiriosoitin muuttuu kynän näköiseksi 6. Valitse kuvasta väri, eli vie hiiri sen värin päälle jonka haluat tehdä läpinäkyväksi 7. Hiiriosoittimen kärjessä olevan pienen nuolen tulee osoittaa kuvassa sitä väriä minkä haluat läpinäkyväksi 8. Napsauta kerran ja kyseinen väri muutetaan läpinäkyväksi 9. Huomaa, että kaikki samassa kuvassa olevat kohdat, jotka ovat valitsemasi värisiä, muutetaan myös läpinäkyviksi 10. Joskus kannattaa muuttaa kuvan taustaväri kuvan muusta värityksestä poikkeavaksi ennen kuin määrittää ko. värin läpinäkyväksi, tämä onnistuu kuvan käsittelyohjelmilla Päivi Vartiainen 4

5 Kuvien kirkastaminen ja tummentaminen Voit parantaa kuvan ulkoasua huomattavasti muuttamalla sen kirkkautta. Tee se käyttämällä Kuvatyökalurivin painikkeita. Valitse kuva ja napsauta Kuva-työkalurivin Suurempi kirkkaus- tai Pienempi kirkkaus -painiketta, kunnes kuva on mielestäsi sopiva. Kuvan kontrastia voi vastaavasti suurentaa tai pienentää Suurempi kontrasti tai Pienempi kontrasti painikkeista. Kuvatiedoston koon pienentäminen Kuvatiedoston kokoa voi pienentää yksinkertaisimmin käyttämällä pienempää kuvakokoa. kuvan kokoa voi pienentää esimerkiksi leikkaamalla siitä FrontPagen avulla pois osia, kuten yläosan, laidat tai alaosan, jos ne ovat tarpeettomia. 1. Valitse kuva asettelunäkymän Normaali-välilehdestä 2. Napsauta Kuva-työkalurivin Rajaa-painiketta 3. Rajaa vetämällä rajausmerkinnän kulmista ja napsauta uudelleen Rajaa-painiketta 2002 Päivi Vartiainen 5

6 Tekstin lisääminen kuvaan Kun kuva on aktiivinen, ja koonmuuttokahvat näkyvissä on ruudun alalaidassa Kuva työkalurivi käytettävissä. Voit lisätä kuvaan tekstin napsauttamalla Teksti painiketta työkalurivillä. Mikäli kuva on jossain muussa tiedostomuodossa kuin.gif kuvana, se muutetaan, ja ruudulle tulee varoitus muutoksesta. Hyväksy muutokset napsauttamalla OK. Kun napsautat Teksti painiketta kuvan keskivaiheille ilmestyy tavallinen tekstikehys, joka on siirrettävissä kuvassa haluamaasi paikkaan. Kun olet kirjoittanut haluamasi tekstin kehykseen, napsauta hiirellä kehyksen ulkopuolella, ja vie hiiriosoitin kehyksen reunan päälle siten, että se on ylöspäin viistosti vasemmalle osoittava valkoinen nuoli. Nyt voit vetää kehyksen haluamaasi paikkaan kuvassa. Jos haluat muuttaa tekstiä jonka kirjoitit, napsauta tekstin päällä kehyksessä, kun näkyvissä on koonmuuttokahvat ja tekstikohdistin vilkkuu tekstissä, pääset muuttamaan tekstiä 2002 Päivi Vartiainen 6

7 Kuvan sijoittaminen Kun olet lisännyt kuvan sivullesi, voit sijoittaa sen haluamaasi kohtaan tekstissä. Voit myös rivittää tekstin kuvan ympärille samaan tapaan kuin esimerkiksi Word tekstinkäsittelyohjelmassa 1. Valitse Muotoile valikosta Sijoittaminen 2. Ruudulle aukeaa Sijainti ikkuna, jossa voit valita eri vaihtoehdoista mieleisesi rivitystavan. 3. Huomaa että kuvan tulee olla valittuna, jotta saat kyseisen sijoittaminen vaihtoehdon käyttöösi Muotoile valikossa 4. Mikäli vaihtoehto ei ole näkyvissä, napsauta kuvaa kerran hiirellä 5. Ruudulle aukeaa Sijainti -ikkuna 6. Valitse Rivitystyyli kohdasta miten haluat tekstin sijoittuvan kuvan ylä- ja alapuolelle. 7. Sijoitustyyli kohdassa voit määritellä miten teksti ja muut sivulla olevat elementit sijoittuvat suhteessa kuvaan 8. Esimerkkikuvassa on valittu rivitystyyliksi vasen ja sijoitustyyliksi suhteellinen, eli kuva sijoittuu tekstiin nähden vasemmalle Toinen vaihtoehto on napsauttaa absoluuttinen sijainti painiketta kuva työkalurivillä. Kuva on tämän jälkeen vapaasti 2002 Päivi Vartiainen 7

8 siirrettävissä mihin kohtaan sivulla tahansa. Hiiriosoittimen tulee olla nelinuoli kun kuvaa siirretään. Ota kuitenkin huomioon, että kaikki selaimet eivät tue absoluuttista sijoittamista, mikä saattaa aiheuttaa sen että sivusi ei näy halutulla tavalla kaikissa selaimissa. Hot spots Voit luoda hyperlinkkejä käyttämällä suuren kuvan eri osia. Erillisiä hyperlinkkejä jotka on luotu piirtämällä kutsutaan Hot spoteiksi. 1. Valitse kuva johon haluat lisätä Hot spotteja 2. Napsauta Monikulmainen kohdepiste painiketta (Polygon) Kuva työkalurivillä 3. Napsauta ja vedä hiirellä alue kuvaan (vedä vähän matkaa napsauta jatka kunnes olet aloitus pisteessä) 4. Kun napsautat aloituspisteessä saat ruudulle Luo hyperlinkki ikkunan. Etsi tai kirjoita URL osoite johon haluat Hot spotin viittaavan 5. Napsauta OK 2002 Päivi Vartiainen 8

9 Kuvien rajaaminen 1. Napsauta kuva aktiiviseksi 2. Kun kuva on aktiivinen, eli siinä on koonmuuttokahvat näkyvissä Frontpagen kuva työkalurivi ilmestyy ruudun alalaitaan 3. Valitse rajaa työkalu 4. Vie rajaus työkalu koonmuuttokahvan päälle ja vedä hiirellä kuvan rajaus haluamaksesi 5. Kuvan rajaaminen ei muuta kuvatiedoston kokoa 6. Napsauta uudelleen rajaus työkalua Kuvan koko siis ei pienene kun kuvaa rajataan, kannattaakin käyttää jotain kuvankäsittelyohjelmaa jos haluaa pienentää kuvatiedoston kokoa samalla kun kuvaa rajataan. Pikkukuvan luominen kuvasta (thumbnails) Voit luoda FrontPagen avulla pikkukuvan, joka on pienempi versio kuvasta. Pikkukuvasta käyttäjä pääsee hyperlinkillä täysikokoiseen kuvaan. Pikkukuva on hyödyllinen silloin, kun sinulla on iso kuva, jonka lataaminen saattaa sivuston käyttäjän järjestelmästä riippuen viedä kauan aikaa. Sen sijaan, että käyttäjän tarvitsee ladata suuri kuva, hän voi pikkukuvan avulla päättää, haluaako hän nähdä täysikokoisen kuvan Päivi Vartiainen 9

10 1. Valitse kuva sivunäkymässä 2. Napsauta Kuva työkalurivillä Automaattinen pikkukuva painiketta 3. FrontPage luo pikkukuvan ja hyperlinkin alkuperäiseen kuvaan Kuvaan tulee oletuksena sininen reunaviiva, sen saa pois kun napsauttaa kuvaa hiiren kakkospainikkeella, ja valitsee avautuvasta paikallisvalikosta kuvan ominaisuudet. Siirry Ulkoasu välilehdelle ja muuta Reunaviivan paksuus nollaksi. Voit myös muuttaa kuvan tasauksen sivun suhteen Ulkoasu välilehdellä Päivi Vartiainen 10