PixRinseLes captures de pantalla mostren l'aplicació en anglès. Els noms i controls predefinits també estan disponibles en l'idioma de l'aplicació.
El teu punt de partida
Utilitzeu Web adaptable a PixRinse i, a continuació, reviseu aquesta configuració amb la vostra destinació real.
| Amplades | 320 / 640 / 1280 / 1920 px |
|---|---|
| Sortida | WebP, qualitat 80 |
| Color | sRGB |
| Fonts petites | Les variants més grans es salten |
Com fer-ho
Comenceu amb l'actiu original
Utilitzeu una font prou àmplia per a la variant més gran que necessiteu. Cada derivada es genera a partir de l'original en lloc de redimensionar-se repetidament.
Seleccioneu Web adaptable
Reviseu les quatre amplades i els noms de fitxers integrats. Les variants més amples que la font s'ometen, així que inspeccioneu el recompte de sortida previst.
Exporteu el conjunt d'imatges
Reviseu totes les sortides. Múltiples sortides per font requereixen Pro; el nivell gratuït encara es pot utilitzar per provar un flux de treball de mida única.
Afegeix les imatges a la teva pàgina
Utilitzeu descriptors d'amplada a srcset i configureu sizes perquè coincideixi amb el disseny real. Incloeu l'amplada, l'alçada i el text alternatiu precisos a l'element de la imatge.
<img
src="vase-1280w.webp"
srcset="vase-320w.webp 320w,
vase-640w.webp 640w,
vase-1280w.webp 1280w,
vase-1920w.webp 1920w"
sizes="(max-width: 720px) 100vw, 960px"
width="1280" height="853"
alt="A terracotta vase with an olive branch"
>ELS FITXES D'AQUEST PASSEIG
Què va produir aquest exemple
Una font d'ample 3072 px és prou gran per a les quatre amplades predeterminades. Cada fitxer és un WebP independent, generat directament des d'aquesta font.
- Qualitat
- 80
- Perfil de color
- sRGB
- Sortides d'una font
- 4
| Fitxer | Format | Píxels | Bytes |
|---|---|---|---|
| vase-1280w.webp | WebP | 1280 × 853 | 35.214 |
| vase-1920w.webp | WebP | 1920 × 1280 | 64.108 |
| vase-320w.webp | WebP | 320 × 213 | 4.018 |
| vase-640w.webp | WebP | 640 × 427 | 11.594 |
Mesurat amb els fitxers de mostra mostrats. Els vostres resultats depenen dels vostres originals i configuració. La fotografia del gerro de ceràmica és una mostra generada per IA. Les captures de pantalla de l'aplicació i les mesures dels fitxers exportats són reals.
Un parell de preguntes habituals
Què passa si la meva font només fa 1000 px d'ample?
La plantilla omet les variants 1280 i 1920 px. Només els fitxers de referència que s'han generat realment.
L'aplicació genera HTML?
Aquest flux de treball produeix imatges. Afegiu srcset i sizes al codi del vostre lloc web o al sistema de contingut.
Posa el flux de treball a treballar.
Obriu PixRinse, afegiu unes quantes imatges i comenceu amb la configuració anterior.
Baixa per a MacGratuït: fins a 10 imatges per lot i una sortida per font. Les múltiples sortides d'aquest flux de treball requereixen Pro. Compara Gratuït i Pro.