Twitter JPEG-compressie de beste beeldkwaliteit voor uw feed maken

Voor foto's op je feed lijkt Twitter ons bijna niet te beperken als Facebook, dus het plaatsen van een fatsoenlijke kwaliteitsfoto voor een feed zou relatief eenvoudig moeten zijn, toch? Nou, het is lastiger dan je zou denken. Deze snelle tip is bedoeld om uw JPEG's zo goed mogelijk weer te geven.

Twitter Feed Pictures

Twitter heeft ons deze richtlijnen gegeven:

Twitter's richtlijnen

We focussen ons op JPEG in deze Quick Tip zodat alle voorbeelden in dat formaat zijn. Het lijkt erop dat we met een limiet van 5 MB al veel meer kunnen spelen dan Facebook. Maar is dat noodzakelijkerwijs het geval? Een 5 MB bestand kan door Twitter worden gecomprimeerd tot hetzelfde als een bestand van 3 MB of een bestand van 1 MB met verschillende soorten vervorming. Dus laten we het uitzoeken!

Onze voorbeeldfoto

Ik heb drie versies van mijn bovenstaande voorbeeld geüpload naar mijn Twitter Feed; een 3000px (4,2 MB) bestand, a 2000px (2.2MB) bestand en een 1000px (734kb) bestand. Dit is hoe ze uitkwamen:

Foto's na Twitter Compressie

Ik heb elke afbeelding die automatisch werd vergroot naar 600 px op Twitter opgeslagen (je kunt alleen de preview opslaan, maar ik kan de volledige versie die je hierboven ziet vastleggen) en zag dat de bestandsgroottes erg interessant waren. 

De 3000px 4.2MB het beeld was naar buiten gekomen 47.2kb, de 2000px 2.2MB op 47.5kb en de 1000px 734kb op 52.4kb.  Dus de grootste van de afbeeldingen was eigenlijk tot het kleinste formaat gedaald. Interessant als je kijkt naar de compressie op elk. Het grootste beeld heeft een aantal compressie-artefacten, maar het heeft ook veel van zijn scherpte verloren over het hele beeld. De kleinste is nu de grootste bestandsgrootte, maar de compressie is zeer uitgesproken rond de contouren van de mensen. 

Net als bij Facebook lijkt het erop dat grotere afbeeldingen redelijk beter zijn; maar niet te groot. In mijn eigen ervaring, ergens in de buurt 1500-2000px heeft ongeveer gelijk en als je de bestandsgrootte kunt verlagen met Adobe Photoshop's Save For Web optie dan des te beter.

Headerfoto's

Dit is mijn voorbeeld:

Voorbeeldkop

Uploaden van een afbeelding met een hoge resolutie

Eerst probeerde ik dit met een zeer hoge resolutie, 5000px breed en 8 MB - de maximale Twitter-snelheid is 10 MB.

Twitter-header met grote resolutie

Dat zag er redelijk goed uit voor mij. Het is een beetje ingekort maar omdat het een hoge resolutie foto was, is dat goed. Je ziet dat er hier heel weinig zichtbare compressie is.

Ik was behoorlijk zelfvoldaan, totdat ik op save sloeg:

De compressie na het opslaan was vrij slecht

De compressie vond plaats na het opslaan van het goed uitziende beeld. U ziet nu compressie rond de randen en een algemeen verlies aan scherpte

Dus wat als we hetzelfde uploaden, maar na het wijzigen van de grootte van de door Twitter aanbevolen 1500 x 500 px?

Upload van de aanbevolen grootte afbeelding van Twitter

De aanbevolen header-grootte van Twitter

Het is ingekort zoals de andere deed, maar de compressie is lang niet zo slecht. Dit zijn de vergelijkingen naast elkaar:

Vergelijkingen van een groot formaat en de aanbevolen grootte van Twitter op 100%

Je kunt het verlies van definitie in beide zien, maar de linker is veel erger, met vrij zichtbare vervorming, vooral rond het schrijven op de boot.

Wat nou als…

Twitter's gids werkte duidelijk beter dan een afbeelding op ware grootte, maar ik vroeg het me af; wat als ik hun maat nam, dezelfde verhouding bewaarde maar de grootte verdubbelde. Ik heb een gemaakt 3000 px bij 1000 px afbeelding en probeerde dat:

Ik probeerde de aanbeveling van Twitter te verdubbelen, 3000 x 1500 px

Aha! Dit ziet er veel beter uit voor mij; er zijn nog steeds tekenen van compressie maar je kunt aan de 100% preview zien in de hoek, het schrijven op de boot is veel duidelijker en de randen van objecten hebben veel minder zichtbare artefacten.

Samenvatting

Websites van derden zullen onze afbeeldingen altijd comprimeren, we moeten alleen de beste manier vinden om ze met deze beperkingen weer te geven. Hun richtlijnen zijn er om een ​​reden maar dat wil niet zeggen dat het hebben van een spel rond je geen betere resultaten oplevert.

De beste resultaten behalen voor feedafbeeldingen

  • Upload een grote (ish) grootte, idealiter tussen 1500 px - 2000 pixels
  • Bespaar op maximale kwaliteit mogelijk
  • Verklein de bestandsgrootte met Save For Web

De beste resultaten behalen voor omslagafbeeldingen.

  • 3000 px bij 1000 px werkte goed voor mij
  • Het moet minder dan 10 MB zijn 
  • Het zal uitsnijden, maar de resultaten zullen veel beter zijn dan het formaat wijzigen naar de aanbevolen 1500px bij 500px

Zie ook

Facebook comprimeert ook uw afbeeldingen. Gisteren hebben we gekeken naar de beste resultaten voor uw tijdlijn.