▷ Slik komprimerer du et BILDE i PHOTOSHOP

Å ha et nettsted er ikke utelukkende basert på ukontrollert opplasting av innhold, du må ta vare på strukturen på nettet, inkludert hvert element som vi er vert for i det. Det må tas i betraktning at den er tilgjengelig via Internett -tilkoblinger, og at selv om det mange steder er høye hastigheter, er de fremdeles noe forsinket i andre. Alt dette uten å ta hensyn til viktigheten av det mobile temaet og kostnaden for megabyte. Det er derfor komprimering av bilder uten å miste Photoshop -kvalitet er en svært ettertraktet oppgave av skapere som tenker i brukernes interesse.

Det vi ikke bør gjøre er å gjøre nettstedet vårt til et sakte rom som folk ikke vil gå inn på igjen, noe vi kan unngå hvis vi tar hensyn til forskjellige elementer og lærer å komprimere bilder i Photoshop. En av dem og veldig viktig er opplasting av bilder. Hvis du har et nettsted med mye visuelt innhold, må du ta vare på det både inne og ute ved å komprimere Photoshop -bilder og få siden til å gå mye raskere.

Hastigheten på nettstedet vårt er avgjørende for brukeropplevelsen siden det ikke er det samme å gå inn på en rask side som ikke påvirker vår tilkobling til et nettsted der alle objektene vi ser lastes veldig sakte. I tillegg må de lastes ned til serveren for å se bildene, så jo høyere volum, desto lengre tid vil lasten ta og brukeren vil trolig fortvile og gå. Derfor er det viktig å redigere bilder i Photoshop og forbedre nettstedet vårt eller rett og slett plassen vår ved å vite hvordan du komprimerer bilder i Photoshop.

Hvis du laster opp veldig tunge bilder, blir siden din treg og brukerne blir slitne og går. Hvis du vil unngå å miste besøk, ta vare på alt du laster opp og lær hvordan du komprimerer et bilde i Photosho og reduserer størrelsen.

1. Typer bildeformater i Photoshop

For å snakke om bildeoptimalisering må vi skille hvilken type bildeformat vi har og hvilket som er best for oss.

JPEG.webp -formatFor generell fotografering er det standardformatet som brukes med gode kvalitetsresultater. Støtter 24-biters farge.

PNG-8-formatDet er alternativet til GIF.webp, men uten animasjoner og kan vise opptil 256 farger. Dens komprimering for nettet er en av de mest passende, og gir god kvalitet med reduserte størrelser.

PNG-24-formatDet er et godt alternativ å eksportere kvalitetsbilder akkurat som JPEG.webp. Denne typen utvidelse er praktisk når vi har et bilde som inneholder gjennomsiktighet. Den viser også opptil 16 millioner farger da den støtter 24-biters farge.

GIF.webp -formatDet er formatet for animasjoner par excellence. Representerer opptil 256 farger i former med store mengder ensfarget, linjer eller tekst.

For denne opplæringen vil vi velge to av de mest nyttige og brukte formatene for opplasting av bilder til nettet: JPEG.webp og PNG-8.

2. Hvordan komprimere et bilde i Photoshop

Når vi jobber i et arbeidsområde i Photoshop, gjør vi det i henhold til visse parametere avhengig av bildet eller av generell karakter. En av dem er størrelsen, proporsjonene til bildet vi jobber med. Størrelsen på et bilde tilsvarer antall piksler det inneholder vertikalt og horisontalt, noe som gir opphav til størrelsen på bildet.

Det vi kaller oppløsning betyr antall biter av informasjon i et bestemt rom, som kalles piksler per tomme eller dpi. Dette betyr at jo høyere antall piksler per tomme, blir oppløsningen vår høyere.

Når begge aspektene er differensiert, bør det bemerkes at to bilder kan ha samme størrelse, men forskjellige oppløsninger og proporsjoner. Hvis de er bilder for nettet, anbefales det å behandle størrelsene i pikselstørrelse. For å få tilgang til den, gå til Bilde / bildestørrelse eller trykk på følgende kombinasjon.

Ctrl + Alt + I

MerkAlternativet Resample image lar oss endre størrelsen uten å endre oppløsningen. Velg det mest passende alternativet for det du trenger.

3. Endre Photoshop -fargeprofil

Fargerommet der vi jobber vil også påvirke den endelige filen. Det er å nevne forskjellen mellom sRGB og RGB -plass. Adobe RGB -systemet ble introdusert av selskapet i 1998 og utgjør et mye bredere fargespekter enn sRGB -plassen. Dette betyr ikke at det er verre, men at de er dedikert til forskjellige mål.

RGB -systemet er nærmere med sitt spekter av CMYK, som er orientert mot utskriftsverdenen. Til tross for å ha flere farger, er standarden distribuert digitalt i enheter, det være seg mobiltelefoner, skjermer eller en hvilken som helst digital enhet, sRGB. Når en av disse enhetene støter på RGB, prøver den å komprimere overflødige farger og skaper en falsk sRGB med dårligere resultat.

Trinn 1
Derfor anbefales det å ta fotografiene, arbeidsområdet i Photoshop eller optimalisere dem med dette systemet for å forbedre fargekompatibiliteten. For å endre arbeidsfargeprofilen, gå til Rediger -menyen og velg Konverter til profil.

Steg 2
I det neste vinduet trenger du bare å velge profilen du trenger, i dette tilfellet sRGB.

4. Komprimer bildet uten å miste Photoshop -kvalitet

JPG.webp -formatet er den mest brukte standarden, og selv om det tillater komprimering, tilbyr det ikke så mange redigerbare parametere som PNG. Vi kan variere den endelige vekten av bildet vårt ved å endre størrelsen på fotografiet eller ved eksport.

Trinn 1
Når vi lagrer som JPEG.webp, ser vi at vi har to alternativer, på den ene siden konfigurerer vi bildealternativene (kvalitet) og på den andre siden formatalternativene. For å gjøre dette, gå til Fil / Lagre som -menyen eller følgende kombinasjon og velg JPEG.webp -formatet.

Shift + Ctrl + S

Steg 2
Disse konfigurasjonsparametrene vises i det neste vinduet. La oss se hva hver enkelt betyr.

BildealternativerHer må vi velge den endelige kvaliteten på bildet, det er tydelig at jo høyere kvalitet, jo større filstørrelse, er i stand til å se hva det endelig vil oppta hvis vi klikker på Forhåndsvisning. Flytt linjen for å kunne endre disse verdiene.

Hvis vi vil at et fotografi skal skrive ut plakatstørrelse, må vi velge en mye høyere kvalitet enn hvis vi vil ha et bilde for nettet, husk at jo større bildestørrelse, desto flere ressurser vil være nødvendig for å laste det via nettet.

Format alternativerHer inne finner vi forskjellige alternativer for å gi det endelige formatet til bildet vårt. Den mest anbefalte er standard grunnlinje, da den vanligvis er den mest kompatible.

• Grunnlinje ("Standard"). Det bruker bruk av et format som er gjenkjennelig for de aller fleste nettlesere og programmer. For tiden gir de siste programmene vanligvis ikke inkompatibilitet.

• Optimalisert grunnlinje. Dette formatet vil lage en bildefil som inneholder optimaliserte farger, og dermed gi deg en mindre størrelse.

• Progressiv. Med dette alternativet vil forskjellige versjoner bli vist som vil bli mer og mer detaljerte etter hvert som de lastes ned. Det er brukeren som bestemmer hvor mange som skal opprettes. Det er et format som ble brukt og brukes mye når vi går til langsomme tilkoblinger som krever at feier skal lastes.

MerkDet skal nevnes at ikke alle nettlesere kommer til å gjenkjenne eller støtte JPEG.webp -bilder som er progressive eller optimaliserte.

5. Komprimer PNG -bilder i Photoshop

Trinn 1
For å eksportere som PNG må vi gjøre det samme første trinnet som med de andre formatene, gå til Filmeny / Lagre som og velg i dette tilfellet PNG.

Steg 2
Nå vil du se i lagringsvinduet at forskjellige alternativer vises.

KomprimeringVi kan velge hvilken type komprimering vi ønsker eller si ingen hvis vi ikke vil at den skal brukes. Avhengig av valg vil lastehastigheten økes eller reduseres.

VeveDette alternativet er viktig, spesielt hvis vi snakker om webplattformer. La oss se forskjellen:

• Ingen. Dette alternativet lar et bilde bare vises når det er fullstendig lastet, det vil si at hvis vi har en treg eller problemfri tilkobling, vil ikke bildet vises før det er lastet inn i Internett -overføringen.

• Sammenflettet. Dette alternativet er mer anbefalt for webtjenester ettersom det viser reduserte versjoner av bildet når det lastes inn. Dette hjelper nedlastingsprosessen til å bli mindre, og også brukeren vet at bildet lastes ned.

6. Lagre JPG.webp -bilder for Photoshop web

Trinn 1
Et av de mest fordelaktige alternativene vi har i Photoshop for bildeoptimalisering er Lagret som et web, som lar oss manuelt justere forskjellige parametere. Denne lagringen er veldig nyttig for bilder dedikert til nettopplasting, slik at bilder av høy kvalitet, men med redusert størrelse. For dette går vi til File / Save for web eller gjør følgende kombinasjon.

Alt + Shift + Ctrl + S

Steg 2
Hvis vi vil velge JPEG.webp, har vi disse innstillingene.

BildekvalitetVelg foretrukket bildekvalitet fra Lav til Maksimum eller med verdiene til høyre. Du kan se størrelsesvariasjonen under bildet til venstre.

ProgressivBildet vil lastes inn litt etter litt, det vil si at vi går fra å se det i lav oppløsning til det sanne.

InterlacedViser bare bildet når det er fullastet.

HaloHvis bildet er gjennomsiktig, velg en gloriefarge som tilsvarer bakgrunnen på siden der det skal legges inn.

Bygg inn fargeprofilVelg dette alternativet for å bevare ICC -profilen til bildet. Noen nettlesere bruker den til å korrigere fargen.

Konverter til sRGBBruk denne profilen til å forbedre fargekompatibiliteten på enheter og skjermer.

Du har andre alternativer som forhåndsvisningsmodus, metadata eller endring av størrelse med eller uten begrensning.

7. Lagre PNG -bilder for web -Photoshop

Trinn 1
Som vi allerede vet for å få tilgang til Saved for Web i PNG, må vi gå til File / Save for web. Husk at dette formatet er veldig bra for bilder med en webdestinasjon siden resultatet gir et veldig godt forhold mellom kvalitet og filvekt.

Steg 2
For å eksportere som PNG, velg den fra rullegardinmenyen. Husk at PNG 24 tilbyr mer farge, så størrelsene er mye høyere enn PNG-8. Vi anbefaler sistnevnte for standard webbilder. Vinduet som vises ligner på JPEG.webp, og i tillegg til alternativene som allerede er sett i forrige seksjon, kan vi også velge:

ÅpenhetHer kan du velge den typen gjennomsiktighet som passer best for bildet ditt, eller fjerne det og velge en bestemt farge med Halo.

Tilpass til webDenne parameteren gjør at bildet kan komprimeres ytterligere, jo høyere justeringsprosent, jo høyere komprimering, jo lavere kvalitet og mindre størrelse.

8. Lagre bilder for Photoshop web

Trinn 1
For å kunne utføre en automatisk komprimering for både PNG og JPEG.webp, åpner vi lagringen for web i File / Save for Web eller følgende kombinasjon av nøkler.

Alt + Shift + Ctrl + S

Steg 2
Til høyre for forhåndsinnstillingene klikker du på menyfanen som vises og velger Optimaliser til filstørrelse.

Trinn 3
Nå er det bare å velge størrelsen på bildet du vil ha, og programmet vil automatisk utføre komprimeringen for deg. Du kan variere verdiene for å oppnå forskjellige resultater.

Trinn 4
Du kan også gå til vinduet som heter 4 kopier og velge en av versjonene du får derfra og lagre den.

Trinn 5
Hvis du vil endre størrelsen og overføringshastigheten, klikker du på verdiene under bildet og velger dem automatisk.

Som du kan se, er det forskjellige måter å redusere størrelsen på bildene avhengig av formålet. Det er mange parametere du må ta hensyn til, men avhengig av nivået du trenger, vil den ene eller den andre være mer nyttig for å vite hvordan du komprimerer Photoshop -bildet. I den følgende videoen viser vi deg grafisk hvordan du optimaliserer og komprimerer bilder på en grunnleggende og fullstendig måte. Hvis du vil ha en rask komprimering, vil den første metoden være bra for deg, og hvis du er ute etter noe mer komplekst der du kan redigere alle parameterne, er metoden den andre.