Kuvan koon muuttaminen ilman venymistä

Koonmuutos, rajaus vai reunukset?

Leventyneet kasvot kertovat yleensä väärästä kuvasuhteesta. Kuvan muotoa on muutettu; korkeampi vientilaatu ei korjaa sitä.

Koonmuutos muuttaa pikselimäärää. Samassa suhteessa tehtynä se säilyttää koko kuvan ja muodon. Rajaus poistaa sisältöä sommittelun tai kuvasuhteen muuttamiseksi. Reunukset säilyttävät kuvan suuremmalla kuvapohjalla, jonka tyhjä tila täytetään värillä tai läpinäkyvyydellä.

Valitse säilytettävän sisällön mukaan. Maisemasta voi ehkä rajata taivasta, mutta tuote pitää näyttää kokonaan. Ohjekuvakaappauksen viimeistä riviä ei pidä leikata vain neliöön sopimisen vuoksi.

Muuta kokoa Pixilolla

1. Tarkista alkuperäiset mitat tiedoston ominaisuuksista tai kuvankäsittelyohjelmasta. Käytä täysikokoista alkuperäistä, älä viestin esikatselua.
2. Valitse tavoitekoko vaatimusten tai näyttötilan mukaan. Älä suurenna pientä lähdettä vain jonkin luvun saavuttamiseksi.
3. Kuvan koon muuttaja. Jätä kuvasuhteen lukitus päälle ja syötä tarvitsemasi leveys tai korkeus. Työkalu laskee toisen mitan automaattisesti.
4. Käsittele ja lataa kopio. Tarkista mitat ja ulkoasu tarkoitetussa näyttökoossa.

Kuvasuhteen lukitus on oletuksena päällä. Kun 2400 × 1600 kuvan leveydeksi syötetään 1200, korkeudeksi lasketaan 800. Ilman lukitusta mitat toimivat erikseen: tyhjä kenttä säilyttää alkuperäisen mitan ja voi venyttää kuvaa. Tarkista molemmat arvot ennen käsittelyä.

Tuetut JPG-, PNG- ja WebP-kuvat piirretään uudelleen ja tallennetaan samassa muodossa. JPEG- ja WebP-tallennus voi muuttaa pakkausta ja yksityiskohtia. Säilytä alkuperäinen myöhempiä versioita varten.

Laske saman kuvasuhteen säilyttävät mitat

Kuvasuhde on leveyden ja korkeuden suhde. 2400 × 1600 kuvan suhde on 3:2. Kun leveys on 1200, korkeuden pitää olla 800.

Uusi korkeus = alkuperäinen korkeus × uusi leveys ÷ alkuperäinen leveys. Vastaavasti uusi leveys = alkuperäinen leveys × uusi korkeus ÷ alkuperäinen korkeus. Pyöristä lähimpään kokonaiseen pikseliin.

Molempien mittojen puolittaminen jättää neljänneksen pikseleistä. Tiedostokoko riippuu lisäksi kuvamuodosta, sisällöstä ja pakkauksesta.

Vaakakuvasta neliöksi

1600 × 900 kuvan pienentäminen 800 pikselin leveyteen tuottaa 800 × 450 kuvan. Jos tavoite on 800 × 800, korkeutta puuttuu 350 pikseliä.

Rajaa täyttämään neliö

Valitse rajaustyökalulla neliö, jossa tärkeät yksityiskohdat säilyvät. Alkuperäisen 900 × 900 rajaus voidaan pienentää kokoon 800 × 800. Sisältöä poistuu sivuilta, mutta kuva ei veny. Keskitetty rajaus ei aina ole paras.

Säilytä koko kuva reunuksilla

Aseta 800 × 450 kuva 800 × 800 kuvapohjalle sitä tukevassa editorissa. Keskitettynä ylös ja alas jää 175 pikseliä. Valitse taustaan sopiva väri tai läpinäkyvyys. Pixilon nykyinen koonmuutostyökalu ei lisää reunuksia automaattisesti.

Verkkosivulla CSS:n object-fit: cover täyttää alueen rajaamalla, kun taas object-fit: contain näyttää koko kuvan. MDN:n object-fit-ohje selittää eron. CSS muuttaa näyttämistä, ei ladatun tiedoston kokoa.

Miksi kuva voi jäädä sumeaksi oikeasta kuvasuhteesta huolimatta?

Oikea kuvasuhde estää vääristymät, mutta ei takaa terävyyttä. Suurentaminen arvioi uusia pikseleitä eikä palauta lähteestä puuttuvia yksityiskohtia.

Pienentäminen voi heikentää pientä tekstiä ja ohuita viivoja. Tarkista ne todellisessa näyttökoossa. Kokeile tarvittaessa suurempaa tulosta, tiiviimpää rajausta tai kevyempää pakkausta.

Tiheäpikselinen näyttö voi hyötyä CSS-näyttökokoa leveämmästä kuvasta. Älä silti suurenna heikkolaatuista lähdettä vain ”2×”-version vuoksi. Valitse sopiva lähde ja mitat verkkosivujen kuvakoko-oppaan avulla.

Sovita kuva enimmäismittojen sisään

Jos palvelu antaa enimmäisalueen, esimerkiksi 1200 × 800, laske pienempi arvoista enimmäisleveys ÷ alkuperäinen leveys ja enimmäiskorkeus ÷ alkuperäinen korkeus. Kerro molemmat alkuperäiset mitat tällä arvolla.

3000 × 2000 vaakakuva sopii kokoon 1200 × 800. 2000 × 3000 pystykuvan kerroin on 800 ÷ 3000, joten tulos on noin 533 × 800. Sen pakottaminen kokoon 1200 × 800 venyttäisi kuvaa. Jos kuva jo mahtuu, sitä ei tarvitse suurentaa.

Pyöristä kokonaisiin pikseleihin ja tarkista enimmäismitat. Yhden pikselin ero voi johtua pyöristyksestä. Suuri muutos, kuten 3:2:sta 3:4:ään, vaatii rajaamista tai reunuksia.

”Enintään 1200 × 800” sallii pienemmän pystykuvan; ”täsmälleen 1200 × 800” voi vaatia vaakarajauksen tai reunukset. Tarkista myös vähimmäiskoko. Pieni lähde ei ehkä täytä sitä ilman terävyyttä heikentävää suurentamista.

Tarkista kohde ja reunat

Vertaa alkuperäistä ja kopiota samoissa oloissa. Pyöreiden esineiden pitää pysyä pyöreinä, kasvojen luonnollisina ja suorien viivojen vääristymättöminä. Katso rajauksen jokainen reuna: tuotteen kulma, käsi, kuvateksti tai logo voi jäädä ulkopuolelle.

Tarkista myös lopullinen sivu tai palvelu. Se voi rajata oikeankin tiedoston uudelleen. Käytä kuvan sijoittelusäätöä, jos sellainen on, ja pidä tärkeä sisältö erossa reunoista.

Läpinäkyvän logon suuret tyhjät reunukset voivat tehdä kohteesta liian pienen. Rajaa niitä tarvittaessa, mutta säilytä brändin vaatima suoja-alue. Tarkista kuvakaappausten pieni teksti lopullisessa koossa.

Usein kysytyt kysymykset

Voiko kuvasuhdetta muuttaa rajaamatta?

Reunukset säilyttävät koko kuvan. Eri muotoinen alue täyttyy ilman niitä vain rajaamalla, vääristämällä tai tuottamalla uutta sisältöä.

Miksi kuva venyy vain verkkosivulla?

Sivu voi määrätä väärän leveyden ja korkeuden. Tarkista näyttöasetukset ennen alkuperäisen muokkaamista. Kuvasuhteen mukainen korkeus on yleensä parempi kuin molempien mittojen pakottaminen.

Onko koonmuutos sama kuin pakkaus?

Ei. Koonmuutos muuttaa pikselimittoja, pakkaus tallennustapaa. Molemmat voivat pienentää tiedostoa.

Kannattaako rajata ennen pienentämistä?

Yleensä rajaa alkuperäinen ensin ja pienennä valittu sommittelu kerran. Näin käytettävissä on enemmän yksityiskohtia.