Drupal: Aalto.fi-sivusto

Kuvasuhde

Kuvat ovat erittäin tärkeä osa aalto.fi-kokemusta. Kuvien avulla käyttäjille tarjotaan miellyttävä ja mielenkiintoinen verkkovierailu. Sisällöntuottajien työn tukemiseksi on luotu työkaluja, joiden avulla voidaan miettiä ja kontrolloida tapaa, jolla kuvia käytetään alustalla: komponentista ja laitteen koosta riippuen kuvia voidaan leikata niin, että ne sopivat eri kuvasuhteisiin.
Aspect Ratio Graphic with Aspect Ratio reading within a circle. The rectangle graph is in varying shades of red.

Kun uusi kuva ladataan, on tärkeää ymmärtää, miten sitä käytetään, ja asettaa sen kiintopiste oikein, jotta vältetään ei-toivottu kuvan leikkaus. Lue lisää tästä Drupal-ohjeiden osassa Kuvat: miten lisäät kuvia?, linkki alla.

Kuvien lisääminen, ALT-teksti, kuvan rajauksen ja fokuspisteen muuttaminen

Mikä on kuvasuhde?

Kuvasuhteella tarkoitetaan kuvan leveyden suhdetta kuvan korkeuteen riippumatta siitä, miten suuri kuva tosiasiassa on. Se ilmaistaan yleensä kahdella numerolla, joiden välissä on kaksoispiste, esimerkiksi 16:9.

Nykyiset aalto.fi-alustalla käytettävät kuvasuhteet: 

 
Alkuperäinen kuvasuhde 1:1 1.6:1 1.8:1 2.3:1
Original aspect ratio
Alkuperäinen kuvasuhde (Original ratio)

Alkuperäinen kuvasuhde (Original ratio)

Voit esittää kuvia aalto.fi-sivustolla niiden alkuperäisessä kuvasuhteessa (ilman leikkauksia). Tätä suositellaan silloin, kun kuva on esitettävä kokonaisuudessaan, esimerkiksi infografiikka tai logo. Tässä komponentit, joissa kuvat esitetään alkuperäisessä suhteessa:
 

  • Yksittäinen kuva: kun lisäät sivullesi yksittäisen kuvan, valitse Medium-esitystapa. Lue lisää kohdasta Yksittäinen kuva
  • Kuva tekstillä: kun lisäät yksittäisen kuvan sivullesi, valitse oletusesitystapa. Lue lisää kohdasta Kuva tekstillä
  • Huom. Sisältösivuilla vain pääkuvassa: kun kuva määritetään pääkuvaksi, valitse asetukseksi keskisuuri, ei leikkausta.

1:1 Aspect ratio
Neliökuvasuhde (Square ratio)

1:1 – neliökuvasuhde (Square ratio)

Neliökuvasuhde leikkaa kuvan neliön (tai ympyrän) muotoiseksi. Tätä kuvasuhdetta käytetään alustalla eri kohdissa, mukaan lukien:

  • Manual Liftups
  • hakutulosten luettelo (mobiilinäkymässä)
  • uutis- ja tapahtumaluettelot (pöytäkonenäkymässä)

Vain hub-toimittajille: voit muokata oman hub-sivusi pääkuvan sopimaan 1:1-ympyrään Hub description -komponentilla valitsemalla Medium-esitystavan. Lue lisää kohdasta Hub description -komponentti.

Aspect ratio 1:6
Vaakakuvasuhde (Landscape ratio)

1.6:1 ja 1.8:1 – vaakakuvasuhde (Landscape ratio)

Nämä kuvasuhteet ovat lievästi vaakamuodossa. Niitä käytetään alustalla eri paikoissa, mukaan lukien:

  • Single Image, Large ja Extra large, mobiililaitteissa
  • hakutulosten luettelo (pöytäkonenäkymässä)
  • Events Liftups
Aspect ratio 2.3:1
Voimakas vaakakuvasuhde (Very Landscape ratio)

2.3:1 – voimakas vaakakuvasuhde (Very Landscape ratio)

Tämä kuvasuhde on voimakkaasti vaakamuodossa. Sitä käytetään suurten ja rajattomien kuvien esittämiseen, minkä avulla voit luoda visuaalisesti vaikuttavia sivuja. Komponentit, joissa kuvat esitetään 2.3:1-suhteessa:

  • yksittäinen kuva: kun lisäät sivullesi yksittäisen kuvan, valitse Large tai Extra Large -esitystapa. Lue lisää kohdasta Yksittäinen kuva
  • Hub description -komponentti: voit tehdä oman hub-sivusi pääkuvasta rajattoman valitsemalla Large-esitystavan Hub Description -komponentille. Lue lisää kohdasta Hub description -komponentti.

UKK

Tässä on vastauksia joihinkin usein esitettyihin kysymyksiin. Jos sinulla on kysymys, jonka vastaus hyödyttäisi kaikkia sisällön tuottajia ja editoijia, lähetä se aalto.fi-projektiryhmälle osoitteeseen [email protected]. Kiitos.

  • Julkaistu:
  • Päivitetty:
Jaa
URL kopioitu