Thursday, October 4, 2012

De tre prinsippene over Image optimalisering

Du mister besøkende på webområdet på grunn av langsom side belastningen ganger? Er nettstedet blir straffet fordi bilder på nettstedet ditt er for stor? Er du kjøpedyktig fange den besøkende oppmerksomhet i de første 10-15 sekundene som de er på nettstedet ditt?


Alle disse problemene kan være forårsaket av en feil optimalisert web-side. Med andre ord, siden lastes for tregt, og besøkende forlater før du har hatt en sjanse til å hekte seg.


Optimalisere en side for rask lasting kan deles inn i 3 brede kategorier: grunnleggende koding av siden scripts som brukes på siden, og bilder. Av disse tre kan bilder som er for stor ha den beste virkningen på lasting og derfor har størst potensial for forbedret siden lasting ganger hvis riktig optimert.


En kort primer på bildetyper


Det er mange bilde formater felles bruke på nettsteder, tre mest populære som GIF, JPEG, og i noen mindre grad Flash-innhold. Vi vil være å begrense vår diskusjon til GIF og JPEG-bilder, med spesielt fokus på stillbilder.


Hver av disse bildeformater har sine styrker og svakheter. GIF- eller Graphics Interchange Format ble utviklet av CompuServe før Internett-boom som en måte å dele bilder på CompuServe-tjenesten. På grunn av begrensninger med skjermoppløsninger og fargedybder samtidig, GIF-bilder var begrenset til å vise 256 farger, flere farger var imiterte ved Dithering, en prosess for å lure øyet til å se en farge ved hjelp av 2 eller flere sett med farge prikker linjeavstand for tett for øyet å skille separat.


Forestill deg et Sjakkbrett med svarte og hvite firkanter. Når vises tett kan vi tydelig se individuelle rutene, men hvis vi tilbake langt nok vi ikke lenger kjøpedyktig skjelne individuelle rutene og i stedet vil vi se en stor grå firkant, svart-hvitt rutene flette sammen i våre øyne til å danne en heldekkende farge. Dette er tanken bak rastrering.


JPEG-filformatet er derimot et nyere format som kan håndtere millioner av farger enkelt. Den første ulempen til JPEG-bilder er at de inneholder mange flere farger, og hver farge krever litt koding for visning, forstørre filstørrelsen.


Raskere lasting for bilde


Hovedformålet bak gjør et bilde lastes raskere er å gjøre filstørrelsen mindre. Dette kan gjøres på to måter, kan du gjøre det mindre dimensjoner av bildet, eller redusere mengden koding som kreves for å vise bildet.


Den enkleste måten å redusere en bilder-filstørrelsen er å redusere bildets fysiske dimensjoner. I andre ord, jo mindre bildet, jo mindre filstørrelse. Tenk deg et bilde som er en firkant 80 piksler ved 80 piksler. Antall piksler i bildet er 80 x 80 eller 6400 enkeltpiksler. Hvis vi redusere bildestørrelsen ved en halv til 40 x 40 bildepunkter vi da ha 40 x 40 eller 1600 piksler. Så å redusere bildestørrelsen i halvparten reduserer filstørrelsen til en fjerdedel av opprinnelige.


Dette er vår første prinsippet av bildet reduksjon av filstørrelse: Bruk de minste bildedimensjonene som fungerer med layouten. Og på samme måte færre bilder på siden, færre bildepunktene, derfor mindre sidestørrelsen.


Siden GIF- og JPEG-bildeformater bruker forskjellige metoder for å lagre bildeinformasjon, pleier de å være bedre til å vise enkelte typer bilder og verre til å vise andre.


GIF-bilder, er siden de er begrenset til 256 farger per bilde, bedre til å vise bilder med store tekstblokker heldekkende farge og bilder med svært liten fysiske dimensjoner. GIF-formatet vil produsere mindre filstørrelser enn JPEG for disse typer bilder.


JPEG-bilder er bedre til å vise graderinger eller subtile endringer fra en farge til en annen. Derfor er JPEG-filer reprodusere fotografier som er godt, eller et annet bilde med graderinger. JPEG-formatet vil produsere mindre filstørrelser for disse typer bilder enn GIF-formatet.


Dette er vårt andre prinsippet av bildet reduksjon av filstørrelse: Velge riktig bildeformat for bildet du bruker. De fleste web-sidene vil inneholde en kombinasjon av GIF- og JPEG-bilder.


Redusere koding kalles bildekomprimering. Både GIF- og JPEG-bilder kan være komprimerte, men prosessen er forskjellig. I GIF-bilder vi prøver å begrense antallet farger i et JPEG-bilde bruker vi programvare algoritmer til å fjerne overflødig informasjon fra filen.


Når vi komprimere en fil vil vi miste noen bildekvalitet. Vi har nå en balanse mellom en liten filstørrelse og akseptabel bildekvalitet.


Dette er vår tredje prinsippet av bildet reduksjon av filstørrelse: Finne det minste akseptable nivået av bildekvalitet. De fleste bildene kan håndtere noen komprimering med svært lite kvalitet forlis, og alle bilder kan stå mer bilde kvalitet forlis og fortsatt være akseptabelt. Din jobb er å avgjøre hvor mye kvalitet tap kan du godta. Med andre ord, jo lavere kvalitet, jo mindre filstørrelse.


GIF-bilder kan vanligvis være redusert fra 256 farger til 128 farger eller mindre, Jo færre farger brukes jo mindre filstørrelse. JPEG-bilder kan nesten alltid bli redusert til en kvalitetsinnstilling på 80%, og ofte kan bli redusert ned for så lite som 15-30%. Så når du bruker et høyere komprimeringsnivå (lavere tall) reduseres filstørrelsen. Eksperimentere med bildet, prøv mindre og mindre innstillinger til du finner den minste innstillingen som fortsatt viser en akseptabel kvalitet.


Raskeste lasting siden har ingen bilder og tregeste lasting siden bli helt fylt med full oppløsning bilder. Hvis du arbeider mot kontrollere bildene ved hjelp av prinsippene som ble forklart ovenfor du vil ha en veldig mager webside som lastes raskt og vises godt av søkemotorer.

No comments:

Post a Comment