Optimer billeder med Responsive Breakpoints Generator

Brug af et billede til alle mulige udsigtspunkter af et design (desktop, laptop, tablet, mobil og alle ikke-standard browservinduer i mellem) er ikke nøjagtigt ideelt med hensyn til design og opretholdelse af billedets opløsning. Med Responsive Breakpoints GeneratorDu kan dog nu bruge faktiske ligninger til at fortælle dine billeder, hvornår du skal bryde.

screen-shot-2016-11-01-at-1-36-58-pm

I stedet for at gætte eller vælge vilkårlige breakpoints til dine billeder, kan du bruge Responsive Breakpoints Generator-værktøjet til at komme med breakpoints, der er beregnet baseret på de originale dimensioner af dit billede i fuld størrelse ved hjælp af generatorens avancerede algoritmer.

screen-shot-2016-11-01-at-1-37-27-pm

Nøglen til, at algoritmen kan finde passende brudpunkter, er, at den finder billedbreddeværdier og ledsagende dimensioner, der giver reduktioner i filstørrelse. Efter at breakpoints er oprettet, giver generatoren dig også et HTML-img-tag, der viser alle breakpoint-værdierne og muligheden for at downloade en zip-fil med det originale billede, der er størrelse ned til alle breakpoints.

screen-shot-2016-11-01-at-1-37-36-pm

Dette er et godt værktøj at bruge, især hvis du finder dig selv meget design eller udvikling til mobil. Værktøjet er også open source, så du kan bruge og / eller ændre det, uanset hvor du vælger. Læs mere om, hvordan algoritmen fungerer her.

Kilde

Giv en kommentar

Dette websted bruger Akismet til at reducere spam. Lær, hvordan dine kommentardata behandles.