Skærmbilleder viser den engelske app. Forudindstillede navne og kontroller er også tilgængelige på dit app-sprog.

Dit udgangspunkt

Brug Responsivt web i PixRinse, og gennemgå derefter disse indstillinger i forhold til din faktiske destination.

Indstillinger for denne arbejdsgang
Bredder320 / 640 / 1280 / 1920 px
ProduktionWebP, kvalitet 80
FarvesRGB
Små kilderStørre varianter springes over
PixRinse Responsivt web forudindstilling viser flere WebP outputstørrelser
Indstillinger brugt til denne gennemgang. Vælg skærmbilledet for at inspicere det i fuld størrelse.

Sådan gør du

  1. Start med det originale aktiv

    Brug en kilde, der er bred nok til den største variant, du har brug for. Hver afledt er genereret fra originalen i stedet for at blive ændret gentagne gange.

  2. Vælg Responsivt web

    Gennemgå de fire indbyggede bredder og filnavne. Varianter, der er bredere end kilden, springes over, så inspicer det planlagte outputtæller.

  3. Eksporter billedsættet

    Gennemgå alle udgange. Flere udgange pr. kilde kræver Pro; det gratis lag kan stadig bruges til at teste et workflow i en enkelt størrelse.

  4. Tilføj billederne til din side

    Brug breddebeskrivelser i srcset og indstil sizes til at matche det faktiske layout. Medtag nøjagtig bredde, højde og alternativ tekst på billedelementet.

EKSEMPEL HTML · TILPASSER DIT LAYOUT
<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"
>

FILERNE FRA DENNE GENNEMGANG

Hvad dette eksempel frembragte

En 3072 px bred kilde er stor nok til alle fire forudindstillede bredder. Hver fil er en separat WebP, genereret direkte fra den kilde.

Kvalitet
80
Farveprofil
sRGB
Output fra én kilde
4
Faktisk eksporterede filer
FilFormatPixelsBytes
vase-1280w.webpWebP1280 × 85335.214
vase-1920w.webpWebP1920 × 128064.108
vase-320w.webpWebP320 × 2134.018
vase-640w.webpWebP640 × 42711.594
Én kilde, fire nyttige webbredder: faktiske eksporterede resultater
Faktiske eksportresultater for eksempelfilerne vist i denne gennemgang.

Målt på de viste prøvefiler. Dine resultater afhænger af dine originaler og indstillinger. Det keramiske vasefotografi er en AI-genereret prøve. Appens skærmbilleder og eksporterede filmålinger er ægte.

Et par almindelige spørgsmål

Hvad sker der, hvis min kilde kun er 1000 px bred?

Skabelonen springer varianterne 1280 og 1920 px over. Kun referencefiler, der rent faktisk blev genereret.

Genererer appen HTML?

Denne arbejdsgang producerer billeder. Tilføj srcset og sizes i dit webstedskode eller indholdssystem.

Sæt arbejdsgangen i gang.

Åbn PixRinse, tilføj et par billeder og start med indstillingerne ovenfor.

Hent til MacGratis: op til 10 billeder pr. batch og et output pr. kilde. Denne workflows flere output kræver Pro. Sammenlign gratis og pro.