Jak zmienić wymiary obrazu bez zniekształcania

Zmiana wymiarów, kadrowanie czy marginesy?

Szersza twarz zwykle oznacza błędne proporcje. Wyższa jakość eksportu ich nie naprawi.

Zmiana wymiarów zmienia liczbę pikseli i przy zachowaniu proporcji pozostawia treść i kształt. Kadrowanie usuwa część obrazu. Marginesy umieszczają cały obraz na większym płótnie z kolorem lub przezroczystością.

Wybierz według treści: można usunąć część nieba, ale nie fragment produktu lub ostatni wiersz instrukcji.

Zmiana wymiarów w Pixilo

1. Sprawdź oryginalne wymiary we właściwościach lub edytorze. Użyj źródła w pełnej rozdzielczości.
2. Wybierz docelowe wymiary według wymagań i miejsca wyświetlania. Nie powiększaj małego źródła bez potrzeby.
3. Zmiana rozmiaru obrazów. Pozostaw blokadę proporcji włączoną i wpisz potrzebną szerokość lub wysokość. Narzędzie automatycznie obliczy drugi wymiar.
4. Przetwórz i pobierz. Sprawdź wymiary i wygląd w docelowej skali.

Blokada jest domyślnie włączona. Dla źródła 2400 × 1600 szerokość 1200 oblicza wysokość 800. Bez blokady wartości są niezależne; puste pole zachowuje oryginalny wymiar i może zniekształcić obraz. Sprawdź obie wartości przed przetworzeniem.

Obsługiwane JPG, PNG i WebP są rysowane ponownie i eksportowane w tym samym formacie. JPEG i WebP mogą stracić szczegóły. Zachowaj źródło.

Obliczanie proporcjonalnych wymiarów

2400 × 1600 ma proporcje 3:2. Przy szerokości 1200 wysokość powinna wynosić 800.

Nowa wysokość = pierwotna wysokość × nowa szerokość ÷ pierwotna szerokość. Odwrotnie: nowa szerokość = pierwotna szerokość × nowa wysokość ÷ pierwotna wysokość. Zaokrąglaj do całych pikseli.

Zmniejszenie obu boków o połowę daje jedną czwartą pikseli. Rozmiar pliku zależy też od formatu, treści i kompresji.

Z poziomego zdjęcia do kwadratu

1600 × 900 zmienia się proporcjonalnie na 800 × 450. Do 800 × 800 brakuje 350 pikseli wysokości.

Wypełnij kwadrat kadrowaniem

W narzędziu kadrowania wybierz kwadrat z ważnym obiektem. Kadr 900 × 900 można zmniejszyć do 800 × 800 bez deformacji, tracąc treść po bokach. Środek nie zawsze jest najlepszym wyborem.

Zachowaj całość z marginesami

Umieść 800 × 450 na płótnie 800 × 800 w odpowiednim edytorze. Po wyśrodkowaniu zostanie po 175 pikseli u góry i dołu. Użyj koloru lub przezroczystości. Pixilo nie dodaje tego miejsca automatycznie.

Na stronie object-fit: cover wypełnia obszar przez kadrowanie, a object-fit: contain pokazuje całość. Zobacz opis object-fit w MDN. CSS zmienia wyświetlanie, nie rozmiar pliku.

Dlaczego poprawny obraz nadal jest nieostry?

Właściwe proporcje nie gwarantują ostrości. Powiększanie szacuje dodatkowe piksele, ale nie odzyskuje brakujących szczegółów.

Zmniejszanie może pogorszyć drobny tekst i cienkie linie. Sprawdź końcową skalę i spróbuj większych wymiarów, ciaśniejszego kadru lub mniejszej kompresji.

Ekrany o dużej gęstości mogą potrzebować więcej pikseli obrazu niż CSS. Nie powiększaj słabego źródła tylko dla „2×”. Zobacz przewodnik po wymiarach obrazów na stronach.

Dopasowanie do maksymalnych wymiarów

Dla maksimum 1200 × 800 wybierz mniejszą z wartości: maksymalna szerokość ÷ pierwotna szerokość i maksymalna wysokość ÷ pierwotna wysokość. Pomnóż oba wymiary przez ten współczynnik.

3000 × 2000 daje 1200 × 800. Portret 2000 × 3000 wymaga około 533 × 800 ze współczynnikiem 800 ÷ 3000. Wymuszenie 1200 × 800 go zniekształci. Jeśli już pasuje, nie powiększaj.

Zaokrąglij i sprawdź granice. Jeden piksel różnicy może być skutkiem zaokrąglenia; 3:2 do 3:4 wymaga kadru lub marginesów.

„Maksymalnie 1200 × 800” dopuszcza węższy portret; „dokładnie 1200 × 800” może wymagać innej kompozycji. Sprawdź też minimum: małe źródło może je osiągnąć tylko kosztem ostrości.

Sprawdź obiekt i krawędzie

Porównuj w tych samych warunkach: koła powinny być okrągłe, twarze naturalne, linie niezgniecione. Obejrzyj każdy brzeg, aby nie odciąć dłoni, produktu, podpisu lub logo.

Docelowy serwis może kadrować ponownie. Ustaw pozycję, jeśli to możliwe, i trzymaj ważną treść z dala od krawędzi.

Duże przezroczyste marginesy pomniejszają logo. Przytnij je, zachowując wymagane pole ochronne. Sprawdź tekst zrzutu ekranu w końcowej skali.

Częste pytania

Czy zmienię proporcje bez kadrowania?

Z marginesami zachowasz całość. Bez nich inny kształt wymaga kadrowania, deformacji lub dodania treści.

Dlaczego obraz rozciąga się tylko na stronie?

Strona może narzucać złe wymiary. Sprawdź style przed edycją oryginału i użyj proporcjonalnej wysokości.

Czy zmiana wymiarów to kompresja?

Nie. Jedna zmienia piksele, druga sposób zapisu. Obie mogą zmniejszyć plik.

Czy najpierw kadrować?

Zwykle tak: wybierz kompozycję na oryginale, a potem zmień wymiary raz.