Hvordan lagre bilder for nettet i Photoshop

En av de mer kritiske funksjonene som Photoshop tilbyr er Spar for nett/enheter trekk.

Hvorfor bruke den? Selv om du bare kan lagre filen din i en standardmetode, slik Fil / lagre som, Lagringen for nett-/enhetsfunksjonen gjør avgjørende tre ting.

• Den optimaliserer fildimensjonene (for eksempel: 150 px x 150 px) slik at den kan passe inn på websider renere og se bedre og mindre forvrengt.
• Den optimaliserer filstørrelsen (for eksempel: 23 kb) slik at den kan laste ned raskere.
• Det lagrer i RGB (eller Monitor) -formatet i motsetning til CMYK (Print) -formatet.

Dette verktøyet fungerer bra for å sende ut Twitter -ikoner, Facebook -profilbilder, produktfiler, bloggbilder og kildefiler for Favicons.

01 av 08

Åpne kildefilen

Fil/åpen Photoshop. Skjermbilde av Bryan Haines

For å komme i gang, må du gå til Fil/åpen Å åpne filen din. Det kan være i hvilket som helst format - JPG, GIF, PSD, PNG eller andre. Så lenge Photoshop kan åpne den, kan du sende den ut for nettet.

02 av 08

Lagrer filen din for nettet

Fil Lagre Photoshop CS5. Skjermbilde av Bryan Haines

Vi kommer til å hoppe videre til å spare for nettet, forutsatt at du har gjort hvilke justeringer du trenger. Det er klart, hvis du trenger å redigere bildet, gjør det først og fortsett med dette trinnet senere.

Gå til Fil / lagre for nett / enheter og klikk. Det er omtrent halvveis ned i rullegardinmenyen.

Denne prosessen endrer ikke den opprinnelige filen i det hele tatt. Du oppretter en ny fil. Når du har fullført denne opplæringen og går tilbake til det originale bildet i Photoshop, må du lagre filen hvis du har gjort noen endringer i den. Det er viktig å navngi det nye bildet ditt annerledes enn det originale. Ofte bare å legge til _Web til filnavnet fungerer bra. (Eksempel: filnavn_web.jpg)

03 av 08

Juster sammenligningsvisning til 2-up

Side om side sammenligning Photoshop CS5. Skjermbilde av Bryan Haines

Avhengig av innstillingene dine, kan det hende du må justere visningen her. Det du ønsker er en venstre og høyre sammenligning av bildet ditt. Venstre side vil vise originalen, høyre vil vise bildekvaliteten ved gjeldende innstillinger.

Hvis du ser på toppen av vinduet, vil du se følgende alternativer: original, optimalisert, 2-up, 4-up. For de fleste formål er 2-up det du vil ha.

04 av 08

Sett visningsstørrelsen til 100%

Justeringsvisningen til 100% i Photoshop CS5. Skjermbilde av Bryan Haines

For å sikre at du ser på 100%, sjekk alternativet i nedre venstre hjørne av skjermen.

Det er viktig å huske at hvis du ser bildet ditt på høyere enn 100%, vil det se kornete ut eller muligens til og med ubeskrivelig. Arbeid alltid med bildet på 100%.

05 av 08

Valgte fildimensjoner

Velge fildimensjoner i Photoshop CS5. Skjermbilde av Bryan Haines

Dimensjoner for nettet er nesten alltid i piksler (PX). Det er viktig å holde proporsjonene riktige. Ved siden av bildeboksen er et lite bilde av en kjedelink. Hva det gjør er å skalere bredden når du justerer høyden. For eksempel et bilde som er 600px med 400px. Hvis du reduserer bredden til 300px, skaler filen automatisk til en høyde av 200px. Hvis det ikke er merket av, vil bildet bli forvrengt.

Du har også muligheten til å skalere bildet etter prosenter.

06 av 08

Valgte filtypen for eksport

Velge filtypen for eksport i Photoshop CS5. Skjermbilde av Bryan Haines

I dette alternativet betyr det ikke noe å. Du kan velge hvilken fil du trenger.

Merk: For å begynne prosessen må du klikke på bildet til høyre. Bildet må velges for å bli behandlet.

Det vanligste er JPG for nettet - det er det minste filformatet som betyr at det lastes ned raskere for besøkende på nettstedet ditt. Hvis du har gjennomsiktighet valgt PNG-24. Hvis du ikke vet hva åpenhet betyr, bør du velge JPG.

07 av 08

Velg bildekvalitet

Velg bildekvalitet i Photoshop CS5. Skjermbilde av Bryan Haines

Hvert av de tre JPG -alternativene (høye, middels, lave) har forhåndsinnstilte kvalitetsinnstillinger - som alle kan justeres manuelt. Hvis du ser på 100%, kan du bestemme hvilken kvalitet du trenger. For å justere zoomens nivå, se trinn 5. Bildet vil se det samme ut som det gjør i forhåndsvisningsvinduet.

Hvis du valgte noe annet enn JPG, kan du hoppe over dette trinnet.

08 av 08

Lagre filen din

Lagre filen din i Photoshop CS5. Skjermbilde av Bryan Haines

Når du har gjort de nødvendige justeringene, er du klar til å lagre filen. Klikk "Lagre" og valgte mappen og filnavnet du vil ha for dette nye bildet.

Gratulerer! Den nye filen din er klar til å brukes på nettet.