Posnetki zaslona prikazujejo angleško aplikacijo. Prednastavljena imena in kontrolniki so na voljo tudi v jeziku vaše aplikacije.

Vaše izhodišče

Uporabite Odzivni splet v PixRinse, nato pa te nastavitve primerjajte z dejanskim ciljem.

Nastavitve za ta potek dela
širine320 / 640 / 1280 / 1920 px
IzhodWebP, kakovost 80
barvasRGB
Majhni viriVečje variante so preskočene
PixRinse Odzivni splet prednastavitev, ki prikazuje več izhodnih velikosti WebP
Nastavitve, uporabljene za ta sprehod. Izberite posnetek zaslona, ​​da ga pregledate v polni velikosti.

Kako to narediti

  1. Začnite z izvirnim sredstvom

    Uporabite dovolj širok vir za največjo različico, ki jo potrebujete. Vsaka izpeljanka je ustvarjena iz izvirnika, namesto da bi se ji večkrat spreminjala velikost.

  2. Izberite Odzivni splet

    Preglejte štiri vgrajene širine in imena datotek. Različice, širše od vira, so preskočene, zato preverite načrtovano število izhodov.

  3. Izvozi nabor slik

    Preglejte vse rezultate. Več izhodov na vir zahteva Pro; brezplačno raven je še vedno mogoče uporabiti za preizkušanje poteka dela v eni velikosti.

  4. Dodajte slike na svojo stran

    Uporabite deskriptorje širine v srcset in nastavite sizes, da se ujema z dejansko postavitvijo. V slikovni element vključite natančno širino, višino in alternativno besedilo.

PRIMER HTML · PRILAGODITE SE VAŠI POSTAVITVI
<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"
>

DATOTEKE IZ TEGA PREGLEDA

Kaj je ustvaril ta primer

Vir s širino 3072 px je dovolj velik za vse štiri prednastavljene širine. Vsaka datoteka je ločen WebP, ustvarjen neposredno iz tega vira.

Kakovost
80
Barvni profil
sRGB
Izhodi iz enega vira
4
Dejansko izvožene datoteke
DatotekaOblikaPiksliBajti
vase-1280w.webpWebP1280 × 85335.214
vase-1920w.webpWebP1920 × 128064.108
vase-320w.webpWebP320 × 2134018
vase-640w.webpWebP640 × 42711.594
En vir, štiri uporabne spletne širine: dejanski izvoženi rezultati
Dejanski rezultati izvoza za vzorčne datoteke, prikazane v tem vodniku.

Izmerjeno na prikazanih vzorčnih datotekah. Vaši rezultati so odvisni od izvirnikov in nastavitev. Fotografija keramične vaze je vzorec, ustvarjen z AI. Posnetki zaslona aplikacije in meritve izvožene datoteke so resnični.

Nekaj ​​pogostih vprašanj

Kaj se zgodi, če je moj vir širok samo 1000 px?

Predloga preskoči različici 1280 in 1920 px. Samo referenčne datoteke, ki so bile dejansko ustvarjene.

Ali aplikacija ustvari HTML?

Ta potek dela ustvarja slike. Dodajte srcset in sizes v kodo svojega spletnega mesta ali sistem vsebine.

Zaženite potek dela.

Odprite PixRinse, dodajte nekaj slik in začnite z zgornjimi nastavitvami.

Prenesi za MacBrezplačno: do 10 slik na paket in en izhod na vir. Več izhodov tega poteka dela zahteva Pro. Primerjaj Free & Pro.