Tässä Photoshop-opetusohjelmassa opitaan kuinka muuttaa kokoa, optimoida ja tallentaa valokuvia verkkosivustolle lähettämistä tai sähköpostin lähettämistä perheen tai ystävien kanssa käyttämällä Photoshop CS5: n Image Size- ja Save for Web & Devices -komentojen yhdistelmää! Tämä opetusohjelma on myös täysin yhteensopiva Photoshop CS4: n kanssa.
Tässä on kuva, jonka olen tällä hetkellä avannut näytöllä ja joka minun on optimoitava verkkoa varten:
Alkuperäinen kuva.
Jos katsomme Kerrokset-paneeliin, näemme, että olen tehnyt hiukan tämän kuvan retusointityötä lisäämällä muutama kerros ja säätökerros alkuperäisen kuvan yläpuolelle Taustakerros :
Tasot-paneeli.
Vaihe 1: Kopioi kuva
Valmistellaksesi tämän valokuvan sähköpostitse lähettämistä tai verkkosivustolle lähettämistä varten minun on tasoitettava asiakirja yhdeksi kerrokseksi ja muutettava kuvan kokoa pienentämään sitä, mutta haluan ensin varmistaa, että en menetä mitään tekemäni työ tai tehdä pysyviä muutoksia alkuperäisen kuvan kokoon. Pelataksesi sitä turvallisesti, ennen kuin teen jotain muuta, aion kopioida kuvani siirtymällä näytön yläreunan valikkorivin Kuva- valikkoon ja valitsemalla Kopioi :
Siirry kohtaan Kuva> Kopio.
Photoshop avaa ponnahdusikkunan Kopioi kuva -valintaikkunan, jossa pyydetään nimeämään kopio. Voit vain hyväksyä oletusnimen, jonka Photoshop on jo syöttänyt (minun tapauksessani se on "sininen_osoitekopio"), koska voimme helposti nimetä kuvan uudelleen, kun tallennamme sen myöhemmin. Napsauta valintaikkunan oikeassa yläkulmassa olevaa OK-painiketta, kun haluat hyväksyä oletusnimen ja sulkea sen:
Hyväksy oletusnimi napsauttamalla OK.
Photoshop avaa identtisen kopion kuvasta, mukaan lukien kaikki alkuperäiseen versioon lisätyt tasot, erillisessä asiakirjaikkunassa:
Kopio alkuperäisestä asiakirjasta tulee uuteen ikkunaan.
Vaihe 2: Leikkaa kuva
Seuraavaksi tasoitetaan kuvan kopio yhdeksi kerrokseksi, mikä voi auttaa antamaan meille parempia tuloksia, kun siirrymme koon muuttamaan, kuten teemme hetkessä. Siirry näytön yläreunassa olevaan Taso- valikkoon ja valitse Tasoita kuva :
Siirry kohtaan Kerros> Suorista kuva.
Jos katsomme uudelleen Tasot-paneeliin, näemme, että kaikki tasot ovat nyt tasattu yhdeksi taustakerrokseksi:
Tasot-paneeli, joka näyttää litistetyn kuvan.
Vaihe 3: Kuvan koon muuttaminen
Nyt kun kuvamme on tasoitettu, muutetaan sen koko niin, että se sopii paremmin sähköpostitse tai verkkosivustolla näyttämiseen. Siirry näytön yläreunassa olevaan Kuva- valikkoon ja valitse Kuvakoko :
Siirry kohtaan Kuva> Kuvakoko.
Tämä avaa Kuvakoko-valintaikkunan. Kuten pian näemme, Photoshopin Tallenna Webille ja laitteille -valintaikkuna antaa meille myös vaihtoehdon kuvan koon muuttamiselle, mutta saat parempia tuloksia, jos muutat kuvan etukäteen Kuvakoko-komennolla.
Jos tarkastelemme valintaikkunan yläosaa, Pikselimitat- osiossa, näemme, että kuvasi on tällä hetkellä 1571 pikseliä leveä ja 2356 pikseliä korkea. Se on liian iso, jotta useimmat ihmiset voivat mahtua koko kuvan näytölle, jos haluaisin lähettää kuvan heille sähköpostitse, ja se on varmasti liian iso, jotta sitä voidaan näyttää useimmissa verkkosivustoissa:
Kuvan nykyinen leveys ja korkeus pikseleinä.
Yleisesti ottaen, sähköpostissa ja web-katselussa haluat rajoittaa valokuvasi enintään 800 pikseliin 600 pikselillä, mikä tarkoittaa, että leveys ei saa ylittää 800 pikseliä ja korkeus saa olla enintään 600 pikseliä. Jos lataat valokuvan verkkosivustoon, verkkosivustolla voi olla muita erityisiä ulottuvuuksia, joihin sinun on kiinni, mutta tyypillisesti koon pitäminen 800 px x 600 px: n sisällä antaa useimmille ihmisille mahdollisuuden nähdä kuva ruudulla mukavasti.
Ennen kuin syötät uudet pikselimitat, varmista kuitenkin ensin, että kaikki kolme valintaikkunan alareunassa olevaa vaihtoehtoa - Skaalaustyylit, Rajoitetut osuudet ja Resample Image - on valittu . Teknisesti kuvan tasoittamisen yhteydessä meidän ei tarvitse huolehtia ensimmäisestä vaihtoehdosta, Scale Styles, koska meillä ei ole kuvaan sovellettuja tasotyyleja, mutta on helpompaa vain varmistaa, että kaikki kolme vaihtoehtoa on valittu. Aseta sitten Image Interpolation -vaihtoehto valintaikkunan alareunassa kohtaan Bicubic Sharper (paras pienennettäväksi). Siinä ei sanota "Image Interpolation" missään, mutta juuri tämä on tämä alavaihtoehto, ja se ohjaa sitä, kuinka Photoshop käsittelee pikseliä uudelleennäytteenottoprosessin aikana. Jos asetat sen Bicubic Sharper -sovellukseen, saamme parhaat tulokset, kun pienennämme kuvaa näytössä katselua varten:
Varmista, että kolme ensimmäistä vaihtoehtoa on valittu ja että alaosa on asetettu Bicubic Sharper -asetukseksi.
Palaa sitten takaisin valintaikkunan yläosassa olevaan Pikselimitat-osioon ja kirjoita uudet mittasi. Koska valokuvani on muototilassa, mikä tarkoittaa sitä, että se on suurempi kuin leveä, enkä halua, että korkeus ylittää 600 pikseliä, kirjoitan 600 pikseliä Korkeus-asetukseen . Kun valintaikkunan alareunassa valitaan Rajoita mittasuhteet, Photoshop kirjoittaa minulle automaattisesti uuden leveysarvon, jotta kuvan leveyden ja korkeuden suhde pysyy samana kuin se oli alun perin. Minun tapauksessani Photoshop kirjoitti 400 pikseliä leveydelle :
Kun rajoitetut osuudet on valittu, kaikki mitä meidän on annettava, on uusi leveys tai korkeus ja Photoshop antaa toisen meille.
Huomaa, että en tehnyt muutoksia Tarkkuus- arvoon valintaikkunan Asiakirjan koko -osiossa. Tämä johtuu siitä, että tarkkuus määrittää, kuinka suuri kuva tulostuu paperille, eikä sillä ole mitään tekemistä kuvan katselemisen kanssa tietokoneen näytöllä. Ainoa, johon meidän on keskityttävä, kun kuvan kokoa muutetaan näytöllä näkyväksi, on kuvan todelliset pikselimitat, jotka löytyvät asianmukaisesti nimetystä pikselimitat-osiosta valintaikkunan yläosassa.
Kun olet kirjoittanut uudet mitat, napsauta OK valintaikkunan oikeassa yläkulmassa sulkeaksesi sen, jolloin Photoshop pienentää kuvaa uuteen pienempään kokoon.
Lyhytkoodit, toiminnot ja suodattimet-laajennus: Virhe lyhytkoodissa (mainokset-tärkeät-keskellä)
Vaihe 4: Tallenna verkkoon
Olemme monistaneet, tasoittaneet ja koon koon muuttaneet. Nyt on aika optimoida ja tallentaa se. Siirry näytön yläreunassa olevaan Tiedosto- valikkoon ja valitse Tallenna Webille ja laitteille :
Valitse Tiedosto> Tallenna Webille ja laitteille.
Tämä avaa Photoshopin erittäin suuren Tallenna Webille ja laitteille -valintaikkunan, jossa suuri esikatselualue vie suurimman osan tilasta. Jos katselet esikatselualueen vasemman yläkulman yläpuolella, näet sarjan neljä välilehteä. Oletuksena on Optimoitu- välilehti, joka tarkoittaa, että et näe alkuperäistä kuvaa. Sen sijaan näet reaaliaikaisen esityksen siitä, miltä kuva näyttää nykyisillä optimointiasetuksilla (joita tarkastelemme hetkessä):
Esikatselualue on oletusarvoisesti optimoitu näkymätila.
Voit jättää katselutilan asetukseksi Optimoitu. Jos haluat tarkastella kuvan alkuperäisten ja optimoitujen versioiden vertailua, siirry kaksoisnäkymätilaan napsauttamalla sen välilehteä:
Siirtyminen 2-ylös-näkymätilaan.
Kun 2-ylös valittu, näemme nyt kuvan alkuperäisen version vasemmalla ja optimoidun version oikealla (jos kuvasi on vaakatilassa, mikä tarkoittaa sitä, että se on leveämpi kuin se on korkea, näet pystysuuntaisen esikatselun alkuperäisen version yläreunassa ja optimoidun version alla):
Alkuperäinen versio on vasemmalla, optimoitu versio oikealla.
Tiedosto muoto
Valintaikkunan oikealla puolella on erilaisia optimointivaihtoehtoja (jos et näe luettelossa olevia vaihtoehtoja, varmista, että sinulla on esikatselualueella valitun kuvan optimoitu versio). Ensimmäinen asia, joka meidän on tehtävä täällä, on valita kuvalle oikea tiedostomuoto . Jos käytät Tallenna verkkoon ja laitteisiin -valintaikkunaa ensimmäistä kertaa, näet yläosassa valitun GIF- tiedostomuodon (suoraan sanan "Esiasetus" alapuolella). GIF on hieno muoto verkkografiikan tallentamiseen, mutta valokuvissa haluamme käyttää JPEG.webp- muotoa, joten vaihda vaihtoehto GIF: stä JPEG.webp: ksi, jos sitä ei ole jo asetettu JPEG.webp:
Aseta tiedostomuoto JPEG.webp.
Kuvanlaatu
Suoraan tiedostomuodon alapuolella ovat kuvanlaatuasetukset . Voimme valita esiasetetun laatuasetuksen (alhainen, keskitaso, korkea, erittäin korkea ja maksimi) vasemmalla puolella tai voimme valita tietyn arvon oikealla olevaan Laatu- asetukseen. Vaikka voi olla houkutusta valita valokuvillemme korkealaatuisimmat asetukset, jotta jokainen näkee kuinka mahtavia ne ovat, optimoimalla ne sähköpostiin tai verkkoon, meidän on pidettävä tiedostokoko mahdollisimman pienenä ja se tarkoittaa keskikohdan löytämistä maa kuvan laadun ja tiedostokokojen välillä. Korkealaatuinen esiasetus on melkein aina paras valinta, mikä antaa meille molemmista maailmoista parhaat puolet - hyväksyttävän kuvanlaadun ja suhteellisen pienet tiedostokoot. Valitsemalla Korkea esiasetuksen asetetaan Laatu-asetukseksi automaattisesti 60 :
Valitse Korkea laatu -asetus, joka asettaa Laatu-arvoksi 60.
Kun olet valinnut laatuasetuksen, varmista, että Optimoitu- vaihtoehto on valittu, mikä voi auttaa vähentämään tiedoston kokoa hieman enemmän. Jätä Progressiivinen -vaihtoehto valinnatta ja jätä myös Upota väriprofiili -valintaruutu, koska useimmat selaimet eivät tue väriprofiileja muutenkaan:
Valitse Optimoitu ja jätä progressiivinen ja upotettava väriprofiili ilman valintaa.
Väriavaruus
Valitse lopuksi Muunna sRGB: ksi -vaihtoehto, jos sitä ei ole jo valittu. Tämä varmistaa, että valokuva on tallennettu sRGB-väriavaruuteen. Lyhyen tarinan mukaan valokuvasi värit näkyvät oikein verkossa tai kun joku tarkastelee kuvaa sähköpostissa:
Muunna sRGB-vaihtoehto estää valokuvien värit näyttämältä tylsiltä ja värisiltä muiden ihmisten tietokoneiden näytöillä.
Kuvan koko
Mainitsin aikaisemmin, kun tarkastelimme valokuvan koon muuttamista Kuvakoko-komennolla käyttämällä, että Tallenna Webille ja laitteille -valintaikkuna antaa meille myös mahdollisuuden muuttaa kuvan kokoa. Kuvakoko-asetukset ovat valintaikkunan oikeassa alakulmassa. Tässä tapauksessani valintaikkuna näyttää, että valokuvani on 400 pikseliä leveä ja 600 pikseliä korkea, koska sen vuoksi muutin sen aikaisemmaksi. Vaikka kuvan koon muuttaminen voi tuntua mukavalta, kun määrität kaikkia muita web-optimointivaihtoehtoja, saat paremmat koonmuutokset, jos ohitat nämä asetukset täällä ja pidät kuvan todellista koko -komentoa:
Kuvakoon asetukset valintaikkunan oikeassa alakulmassa.
Tiedoston koon vertailu
Tässä vaiheessa olemme tehneet kaiken tarvittavan, mutta ennen kuin suljemme Tallenna Webille ja laitteille -valintaikkunan ja tallennamme kuvan, katsomme lyhyesti valokuvan kahden version alla esikatselualueella verrata alkuperäisen version tiedostokokoa optimoidun version kokoon. Minun tapauksessani alkuperäinen valokuva (vasemmalla) oli mahtava 703 kt, aivan liian suuri webille, etenkin hitaamman Internet-nopeuden omaaville, kun taas optimoitu versio (oikealla), joka näyttää melkein yhtä hyvältä kuin alkuperäinen, on vain 58.41 kt :
2-Ylä-näkymän avulla voimme verrata tiedostokokoja kuvan alkuperäisen ja optimoidun version välillä.
Vaihe 5: Tallenna kuva
Voit tallentaa valokuvasi optimoidun version napsauttamalla valintaikkunan alaosassa olevaa Tallenna- painiketta. Photoshop avaa ponnahdusikkunan Tallenna optimoitu nimellä -valintaikkunan, jonka avulla voit nimetä kuvan tarvittaessa uudelleen ja selata kiintolevyn hakemistoon, johon haluat tallentaa sen. Aion nimetä valokuvani nimellä "sininen-mekko.jpg.webp" ja tallennan sen työpöydän "verkkovalokuvat" -kansioon. Kun olet valmis, tallenna kuva napsauttamalla Tallenna ja sulje valintaikkuna:
Tallenna optimoitu nimellä -valintaikkuna.
Ja siellä meillä se on! Valokuvan koko on nyt optimoitu ja se on täysin optimoitu, valmis lähettämään se sähköpostilla ystäville ja perheenjäsenille tai lataamaan verkkoon Photoshop CS5: n Kuvakoko- ja Tallenna Web- ja laitteille -komentojen avulla!