Verkkosivut

tekijä: Tanja Tuulikki Välisalo Viimeisin muutos lauantai 17. maaliskuuta 2018, 00.08
Verkkosivujen luominen Google Sites -palvelulla

Verkkosivujen luominen ja julkaisu

Verkkosivujen luomiseen tarvitaan yleensä

  1. verkkosivueditori eli ohjelma, jolla verkkosivut laaditaan
  2. palvelintila eli tallennustila tiedostoille, jotka muodostavat verkkosivuston 
  3. domain-nimi eli verkkotunnus, esim. yrityksennimi.comyhdistyksennimi.org tai omienkotisivujennimi.fi

Palvelintila ja domain-nimi ovat useimmiten maksullisia.

Google Sites

Google Sites http://sites.google.com/ on verkkoselaimessa toimiva verkkosivujen luomiseen tarkoitettu palvelu. Se sisältää samalla sekä verkkosivueditorin että palvelintilan Sivuja ei tarvitse siis erikseen siirtää verkkoon, vaan ne ovat siellä jo muokattaessa. Verkkosivuilla ei ole omaa domainnimeä, vaan niiden verkko-osoite on sites.google.com-domainin alla, esim. sites.google.com/a/jyu.fi/omansivustonnimi.

Palveluun kirjautuminen

Palveluun voi kirjautua 

Asetukset

Palvelun asetuksiin pääsee oikean ylänurkan rataspainikkeesta. Siellä kohdasta Käyttäjän asetukset voi valita

  • palvelun kielen
  • aikavyöhykkeen

Sivuston luominen

Palvelusta on olemassa kaksi eri versiota: uusi ja vanha Google Sites. Näissä palveluversioissa on erilaiset käyttöliittymät ja hieman erilaisia valmiita ulkoasuja. Voit siirtyä palveluversiosta toiseen painikkeilla:

  • Takaisin vanhaan Sites-versioon (Back to old Sites)
  •  Uusi Google Sites (New Google Sites)

Sivuston luominen vanhassa Sites-versiossa

Uuden sivuston voi luoda vasemman reunan Luo (Create) -painikkeella. Avautuvassa näkymässä on mahdollista valita

  • Tyhjä malli (Blank template) tai
  • Selaa lisää vaihtoehtoja galleriassa (Browse the gallery for more), jossa on valmiina erilaisia sivustopohjia.

Samassa näkymässä sivustolle annetaan nimi ja verkko-osoite. Yleensä nimen ja verkko-osoitteen olisi hyvä muistuttaa toisiaan. Kannattaa muistaa, että verkko-osoitteessa ei voi käyttää skandinaavisia aakkosia, erikoismerkkejä tai välilyöntejä. Kaikkien yliopiston tunnuksilla luotavien verkkosivustojen osoitteena on sites.google.com/a/jyu.fi/sivustonnimi.

Valitse teema (Select a theme) -kohdasta voi valita sivustolleen ulkoasun.

Sivusto avautuu oletusmuodossaan, jossa on valmiina etusivu (Home).

Sivuston luominen uudessa Sites-versiossa

Sivusto luodaan valitsemalla oikeasta alanurkasta Luo uusi sivusto -kuvake. Se avautuu heti sivuston muokkausnäkymässä oletusulkoasulla.

Sivustolle voi antaa nimen vasemman ylänurkan kohdassa Kirjoita sivuston nimiVerkkosivustolle valitaan verkko-osoite sivuston julkaisun yhteydessä. Yleensä nimen ja verkko-osoitteen olisi hyvä muistuttaa toisiaan. Kannattaa muistaa, että verkko-osoitteessa ei voi käyttää skandinaavisia aakkosia, erikoismerkkejä tai välilyöntejä. Kaikkien yliopiston tunnuksilla luotavien verkkosivustojen osoitteena on sites.google.com/a/jyu.fi/sivustonnimi.

Luo uusi tyhjä sivusto, anna sille nimi ja valitse ulkoasuteema. Voit antaa sivuston nimeksi esim. Portfolio.

Sivun lisääminen

Sivun lisääminen vanhassa Sites-versiossa

Verkkosivustolle voi lisätä uusia verkkosivuja yläreunan painikkeesta Uusi sivu (New page) . Sivun luomisen yhteydessä voi valita

  • sivun nimen
  • sivun verkko-osoitteen 
  • sivun mallin (template)
    • verkkosivu (Web Page) - tavallinen verkkosivu (näissä harjoituksissa käytämme vain tätä)
    • ilmoitukset (Announcements) - sivu, jolle voi tuottaa sisältöä blogin tapaan, uusin kirjoitus ylimpänä
    • tiedostoarkisto (File Cabinet) - kätevä useiden tiedoston jakamiseen verkkosivuston kautta, lukija voi tilata tiedon muutoksista
    • luettelo (List) - kätevä listojen ylläpitämiseen, lukija voi tilata tiedon muutoksista
  • sijainnin
    • ylätasolle
    • olemassaolevan sivun alasivuksi

Sivun lisääminen uudessa Sites-versiossa

Verkkosivustolle voi lisätä uusia verkkosivuja oikean reunan valikon Sivut-välilehden alareunassa olevalla Lisää sivu -painikkeella. Avautuvassa ikkunassa sivulle voi antaa nimen ja verkko-osoitteen.

Sivun voi asettaa toiselle sivulle alasivuksi oikean reunan sivuvalikossa joko

  • raahaamalla sivun toisen sivun päälle TAI
  • viemällä hiiren kursorin olemassaolevan sivun päälle ja siirtymällä esiin tulevan pistekuvakkeen kautta alavalikon kohtaan Lisää alasivu

Lisää verkkosivustolle kaksi uutta sivua: Työnäytteet ja Osaamiseni. Molempien mallina on verkkosivu ja ne tulevat sivuston ylätasolle.

Lisää verkkosivustolle vielä kaksi uutta sivua: Kuvankäsittely ja Videotuotanto. Kaikkien mallina on verkkosivu ja ne tulevat alasivuiksi Työnäytteet -sivulle. Voit halutessasi luoda myös lisää alasivuja.

Sivujen välillä liikkuminen

Sivulta toiselle voi siirtyä eli navigoida vasemman tai oikean reunan navigointipalkin kautta.

Sisällön tuottaminen sivustolle vanhassa Sites-versiossa

Teksti

Verkkosivun sisältöä voi muokata oikean yläreunan painikkeesta Muokkaa sivua (Edit page) . Tämä painike avaa verkkosivun muokkaustilassa. Sivun ylälaidassa olevassa työkalupalkissa on tuttuja tekstin muokkauksen työkaluja.

Lisää etusivulle tekstiä, esim. nimesi ja Tämä verkkosivusto on tehty Jyväskylän yliopiston kurssilla.

Sivun nimeä voi muuttaa vaihtamalla sen muokkausnäkymässä. Uusi nimi päivittyy myös vasemman reunan navigaatiovalikkoon.

Hyperlinkki

Linkit ovat keskeinen verkkotekstin elementti. Linkin lisääminen tapahtuu

1) valitsemalla ensin maalaamalla teksti, josta linkki halutaan muodostaa,
2) valitsemalla sitten työkaluriviltä Linkki-työkalu  ja
3) lisäämällä linkin kohteeksi avautuvassa ikkunassa joko saman verkkosivuston sivu Sivuston sivu (Sites page) tai ulkoinen verkkosivu Verkko-osoite (Web address).

Lisää etusivulle linkki esim. yliopiston verkkosivustolle.

Kuva

Ylävalikon kohdasta Lisää | Kuva (Insert | Image) voi verkkosivustolle lisätä kuvan. Kuva sijaitsee pystysuunnassa siinä kohdassa, missä hiiren kursori on aktiivisena lisäämisen hetkellä.

Kun kuva on lisätty, niin sitä voi edelleen muokata. Kun kuva on valittu, sen viereen ilmestyy työkalupalkki.

Työkalupalkista on mahdollisuus määrittää

  • kuvan sijainti (vasen reuna, keskellä sivua, oikea reuna)
  • kuvan koko (pieni, keskikokoinen, suuri, 100 % eli koko sivun levyinen, alkuperäisen kokoinen)
  • tekstin rivitys suhteessa kuvaan (teksti ympäröi kuvaa tai kuva on tekstin kanssa omalla rivillään)

Kuvan voi myös poistaa työkalurivin rastista.

Tallenna kuvatiedosto, esim. lehdet.jpg (kuvaaja: Miia Lehtola). Lisää se sitten verkkosivustosi etusivulle. Voit myöhemmin korvata tämän jollain omalla kuvallasi. Muista merkitä kuvan tekijätiedot asianmukaisesti. 

Liitetiedoston tuominen verkkosivulle

Verkkosivustolle voi tuoda myös tiedostoja, jotka eivät avaudu verkkoselaimessa, mutta jotka sivustolla kävijä voi ladata omalle koneelleen. Tällaisten tiedostojen tiedostomuotoja voivat olla esimerkiksi ppt, docx, rtf, pdf jne. 

Liitetiedosto lisätään muokkaustilassa valitsemalla sivun alalaidasta Lisää tiedostot (Add files).

Lisää Työnäytteet-sivulle aiemmin kurssilla muokkaamasi xslx-tiedosto.

Google-tiedoston upottaminen sivulle

Sivustolle voi upottaa tiedoston suoraan omista Google Drive -dokumenteista kohdasta Lisää | Drive (Insert | Drive). Tämä toiminto on hyödyllinen mm. esitysten lisäämisessä sivustolle.

Sisällön tuottaminen sivustolle uudessa Sites-versiossa

Tekstiä, kuvia, liitetiedostoja ja upotettuja Google-tiedostoja voi uudessa Sites-versiossa lisätä sivustolle oikean palstan Lisää-välilehdellä. 

HUOM! Uudessa Google Sites -versiossa muita kuin kuvatiedostoja ei voi tuoda suoraan verkkosivustolle liitteeksi, vaan ne tulee ladata Google Driveen tai muuhun palveluun ja luoda verkkosivuille linkki kyseiseen tiedostoon.

Sivun toiminnot

Sivuun liittyvät toiminnot vanhassa Sites-versiossa

Sivun asetuksia voi muokata Lisää toimintoja (More actions) -valikosta . Valikosta löytyvillä toiminnoilla voi mm.

  • tarkastella sivun versiohistoriaa (Revision history) ja tarvittaessa palauttaa sivusta aiempi versio
  • luoda sivusta kopion Kopioi sivu (Copy page)
  • siirtää sivu toiseen kohtaan sivuhierarkiassa: Siirrä sivu (Move page)
  • poistaa sivun Poista sivu (Delete page)
  • muokata sivun asetuksia (Page Settings)

Sivun asetuksista voi valita mm.

  • näkyykö sivulla sen otsikko
  • näkyykö sivulla linkit sen alasivuille
  • voivatko lukijat jättää sivulle kommentteja

Piilota sivun otsikko näkyvistä Etusivulta (Home).

Sivuun liittyvät toiminnot uudessa Sites-versiossa

Vastaavat sivuun liittyvät toiminnot, kuten sivun kopiointi, löytyvät viemällä hiiren kursorin oikean reunan valikossa sivun päälle ja siirtymällä esiin tulevan pistekuvakkeen kautta alavalikkoon. 

Sivuston asettelu

Sivuston sivujen asettelua voi muokata Lisää toimintoja (More actions) -valikon kohdasta Muokkaa sivuston ulkoasua (Edit site layout).

Tässä näkymässä voi muokata mm. sivuston

  • ylätunnistetta, 
  • alatunnistetta ja 
  • sivupalkkia.

 

Näkymässä yläreunassa työkalupalkki, jossa ovat jo valmiiksi valittuina ylätunniste ja sivupalkki. 

Ala- ja ylätunniste

Ala- ja ylätunniste ovat osia, jotka säilyvät samanlaisina kaikilla saman sivuston sivuilla. Ylätunnisteessa on tyypillisesti ainakin sivuston nimi ja alatunnisteessa sivuston tekijän nimi. 

Lisää sivustolle alatunniste (footer) ja lisää sinne ainakin tieto siitä, milloin sivuston on viimeksi päivitetty muodossa: Päivitetty xx.xx.xxxx.

Sivupalkki

Sivupalkkia voi muokata tarkemmin alempaa sivun vasemman reunan kohdasta Sidebar.

Kynäpainikkeesta voi muokata sivupalkin sijaintia (vasen/oikea) ja leveyttä.

Plus-painikkeesta sivupalkkiin voi lisätä navigaatiovalikon lisäksi myös muita sisältöjä, kuten tekstiä tai sivuston uusimmat muutokset.

Navigointivalikkoa voi muokata siirtämällä hiiren kursorin sen päälle ja klikkaamalla esiin tulevasta Navigointi (Navigation) -otsikosta

Samalla avautuu muokkausikkuna, jossa voi vaikuttaa mm. navigaatiopalkin linkkien järjestykseen. 

Muokkaa sivuston navigaatiopalkkia niin, että sivustokartta (Sitemap) ei ole näkyvissä. Voit myös ottaa navigaatiopalkin otsikon pois näkyvistä samassa ikkunassa.

Sivuston asettelu uudessa Sites-versiossa

Navigaatiopalkki voi verkkosivustolla olla yläreunassa tai vasemmassa reunassa. Oletusulkoasuassa se on yläreunassa. Viemällä hiiren yläpalkin päälle ja valitsemalla sen vasemmalle puolelle ilmestyneen rataskuvakkeen, voi navigaation sijaintia muokata.

Sivun voi piilottaa navigaatiopalkista viemällä hiiren kursorin oikean reunan valikon Sivut-välilehdellä sivun päälle ja siirtymällä esiin tulevan pistekuvakkeen kautta alavalikkoon. 

Sivuston asetukset

Sivuston asetukset koskevat koko sivustoa. Valikon kohdasta Ylläpidä sivustoa (Manage Site) pääsee "konepellin" alle vaikuttamaan useisiin sivuston asetuksiin.

Takaisin sivustolle pääseen vasemman reunan valikon ensimmäisestä linkistä, jossa on sivuston nimi.

Seuraavassa on esitelty tärkeimmät sivuston asetukset:

Yleisasetukset

Kohdassa Yleistä (General) voi mm.

  • vaihtaa sivuston nimen 
  • lisätä sivuston kuvauksen 
  • valita sivuston oletuskielen 
  • ottaa käyttöön myös sivuston mobiiliversion
  • poistaa sivuston

Käyttöoikeudet

Sivuston julkisuutta ja muokkausoikeuksia voi muuttaa kohdasta Jakaminen ja käyttöoikeudet (Sharing and Permissions). Oletusarvoisesti sivusto on muiden Jyväskylän yliopiston opiskelijoiden löydettävissä ja muokattavissa. Sivuston voi kuitenkin jakaa myös vain linkin saaneille, jolloin se ei ole löydettävissä hakukoneilla, tai antamalla oikeudet vain tietyille henkilöille, jolloin nämä pääsevät lukemaan sivustoa omilla tunnuksillaan. Sivustolle voi antaa kirjoitusoikeuksia syöttämällä kyseisten henkilöiden sähköpostiosoitteet sivun alareunan kenttään.

Voit halutessasi muuttaa sivuston julkisuusasteen niin, että se on näkyvissä vain linkin saaneille ja kirjoitusoikeudet ovat vain itselläsi. HUOM! Jos valiset jakamisasetuksista vaihtoehdon, joka rajaa näkyvyyden Jyväskylän yliopiston käyttäjiin, niin tällä tarkoitetaan vain opiskelijoita, ei henkilökuntaa, eli siinä tapauksessa opettaja ei pääse näkemään verkkosivustoasi.

Ulkoasu

Sivuston muuta ulkoasua voi muokata kohdasta Teemat, värit ja kirjasimet (Themes, Colors, and Fonts). Avautuvassa näkymässä on ensimmäisenä valikko, josta voi vaihtaa sivuston teemaa. Sen alapuolella on runsaasti valintoja, joilla voi muokata sivuston ja sen eri osien taustaväriä, taustakuvaa, otsikoiden ja tekstin väriä ja kirjasinta jne.

Sivuston asetukset uudessa Sites-versiossa

Sivuston käyttöoikeudet voi määrittää julkaisun yhteydessä. Sivuston voi julkaista yläreunan Julkaise-painikkeella. Samalla voi valita sivustolle verkko-osoitteen. Samalla voi valita, onko sivuston näkyvyys rajattu Jyväskylän yliopiston käyttäjiin (käytännössä opiskelijoihin) vai onko se julkinen Samalla voi valita, onko sivusto listattuna hakukoneiden indekseihin.

Oikean reunan valikon Teemat-välilehdellä voi valita sivustolleen ulkoasun. Jokaisessa ulkoasussa on mahdollisuus valita muutamasta väripaletista ja fonttivalikoimasta.

Materiaalin on laatinut Tanja Välisalo.