Converti un PNG opaco in WebP e confronta il risultato

Un PNG fotografico può valere la pena testare come WebP per un sito web. Potrebbe trattarsi di un'immagine della fotocamera esportata da uno strumento di progettazione, una scena della stanza renderizzata o una grafica promozionale appiattita. Effettua un'esportazione separata e confrontala con l'originale anziché eliminare immediatamente il PNG. La dimensione del file dipende dall'immagine, quindi il salvataggio utile è quello che misuri effettivamente.

La trasparenza ha bisogno di cure speciali qui. Sebbene il formato WebP possa memorizzare l'alfa, questo strumento esegue attualmente il rendering dell'output WebP su uno sfondo bianco. Un input trasparente perderà quindi quell'area trasparente nell'esportazione. Mantieni PNG per loghi, ritagli e sovrapposizioni che devono sedersi su sfondi diversi e utilizzare questa conversione per le immagini in cui è appropriato un risultato opaco.

Il preset mantiene le dimensioni e inizia con una qualità del 90% con l'affilatura OFF. Prova un file con testo piccolo e un altro con uno sfondo fotografico. Ispeziona i bordi sottili, le scritte colorate e le sfumature lisce. Un disegno può sembrare a colpo d'occhio mentre mostra aloni colorati accanto a un'etichetta quando viene visualizzato nella dimensione prevista.

Se il PNG è uno screenshot di un'interfaccia, la leggibilità potrebbe essere più importante della rasatura di alcuni byte. Confronta un esportazione PNG Oppure mantieni la fonte quando WebP ammorbidisce i dettagli critici. Per una fotografia opaca di grandi dimensioni, testare l'adattamento all'interno dei limiti di visualizzazione effettivi prima di abbassare ulteriormente la qualità. Riduci prima i pixel non necessari quando il sito Web non li mostra mai, ma mantieni una risoluzione sufficiente per il posizionamento previsto.

Il dispositivo di scorrimento della qualità WebP controlla la codifica con perdita di questa esportazione. Un'impostazione superiore non ripristina i dettagli mancanti nell'origine e lo stesso numero non implica lo stesso risultato visivo in formati diversi. Usalo come strumento di confronto: regola un po ', ispeziona il risultato e mantieni la versione più piccola che soddisfi le tue esigenze di qualità.

PNG non utilizza quel controllo di qualità allo stesso modo, quindi cambiare l'estensione è una vera scelta del flusso di lavoro. Se il tuo PNG include piccole etichette di diagrammi o limiti di colore precisi, mantenere il PNG potrebbe essere la decisione giusta anche quando il suo file è più grande. Questo convertitore non riduce una tavolozza di colori PNG, produce un'impostazione WebP senza perdita di dati o modifica gli oggetti e i livelli all'interno di una grafica appiattita.

Scarica l'immagine convertita e caricala in una pagina di prova nel tuo sistema di sito web reale. Conferma che il browser riceve WebP, il ritaglio visualizzato è corretto e nessun bordo trasparente è diventato inaspettatamente bianco. Visualizzalo sullo sfondo della pagina, soprattutto se la sorgente è stata progettata per una sezione scura. La conversione dovrebbe essere controllata nel contesto, non solo in un'anteprima di file.

Quindi rivedi il display mobile. Una grafica di marketing di grandi dimensioni potrebbe aver bisogno di un layout più semplice invece di una copia più compressa quando le sue scritte diventano illeggibili su un telefono. La selezione delle immagini responsive e le dimensioni riservate rimangono attività del sito Web separate. Una volta che il campione è audio, elabora i file di corrispondenza insieme. I dati dell'immagine rimangono nel browser durante questa conversione e il PNG di origine rimane invariato.

Ad esempio, testa un marchio word bianco su pixel trasparenti prima di convertire qualsiasi risorsa del marchio. Un output opaco bianco può nascondere completamente il segno, che da solo perderebbe un confronto delle dimensioni del file.