Obrazy na strony
Jak eksportować zdjęcia do portfolio internetowego
Dobierz piksele, format, kolory i kompresję zdjęć portfolio. Porównaj szczegóły i sprawdź opublikowaną galerię na komputerze i telefonie.
Portfolio musi sprawnie się wczytywać i pokazywać wartość pracy. Tkaniny, liście, gładkie niebo i subtelna skóra mogą być ważniejsze niż w małej ilustracji. Dobra miniatura może wyglądać źle w dużej galerii.
Celem są pliki zachowujące istotne szczegóły w rzeczywistych widokach. Poradnik pomaga wybierać i testować eksporty, również po przetworzeniu przez platformę.
Planuj galerię, nie tylko miniaturę
Wypisz siatkę, stronę projektu, powiększony podgląd i szerokie zdjęcie otwierające. Ten sam kadr może być kwadratem w siatce i pełnym obrazem po otwarciu. Mały eksport nie dostarczy szczegółów do dużego widoku.
Przeczytaj instrukcje przed zapisaniem ustawień. Niektóre platformy tworzą wiele rozmiarów, inne pokazują przesłany plik. Adobe Portfolio przechowuje pełną rozdzielczość i tworzy mniejsze wersje. Osobno badaj źródło i plik dostarczony odbiorcy.
Sprawdź pobieranie oryginałów. Nie przesyłaj pliku wzorcowego do druku tylko dlatego, że galeria zwykle pokazuje mniejszą wersję. Kopia webowa powinna nadawać się do udostępnienia przez funkcje strony.
Ustal rozmiar faktycznie otwieranego widoku
- Zacznij w kreatorze strony. Sprawdź pomoc galerii i ustawienia układu. Szukaj maksymalnej szerokości lub wysokości wyświetlania. Limit przesyłania to co innego.
- Otwórz opublikowaną galerię testową. Użyj najszerszego przewidzianego okna i otwórz zdjęcie jak odbiorca, także w powiększeniu. Sprawdź pionowy kadr ograniczany wysokością.
- Mierz tylko bez przydatnych danych platformy. Kliknij zdjęcie prawym przyciskiem i wybierz Zbadaj. Podświetlenie elementu lub panel układu pokazuje piksele CSS. Mierz obraz, nie ramę galerii. Źródło w osobnej karcie pokazuje wymiary pliku, nie widoku.
Jeśli rozmiar widoku pozostaje niepewny, zacznij od aktualnych zaleceń platformy i przetestuj otwartą galerię przed ustawieniem całej serii. Potrzebny jest uzasadniony punkt wyjścia, nie zgadywanie z rozdzielczości aparatu.
| Zastosowanie | Co zaplanować |
|---|---|
| Siatka otwierająca większe zdjęcie | Szczegóły dla dużego widoku i osobny kadr miniatury, jeśli dostępny. |
| Zdjęcie w kolumnie tekstu o stałej szerokości | Szerokość kolumny i oczekiwana gęstość pikseli. |
| Obraz wypełniający okno | Najszerszy widok i kadrowanie na wąskich ekranach. |
| Portret w podglądzie ograniczonym wysokością | Sprawdzić oba wymiary. Sam długi bok może dać inną szerokość niż oczekiwana. |
| Pliki dla klienta do druku | Oddzielne wymagania i proces dostawy. Eksport portfolio nie jest wzorcem do druku. |

Wyznacz piksele na podstawie układu
Zacznij od największego widoku i oceń potrzebę dodatkowych pikseli. Przy szerokości 1 200 CSS źródło 2 400 może dać 2× szczegółów, jeśli strona rzeczywiście je dostarcza. Nie jest to obowiązkowa szerokość każdej fotografii.
6 000 × 4 000 pomniejszone proporcjonalnie do szerokości 2 400 daje 2 400 × 1 600. W widoku 1 200 × 800 CSS przypadają dwa piksele w każdym kierunku na piksel CSS. Portret 4 000 × 6 000 z długim bokiem 2 400 daje 1 600 × 2 400. Ten sam długi bok nie daje tej samej szerokości.
Podwojenie obu wymiarów daje cztery razy więcej pikseli: 960 000 przy 1 200 × 800 i 3 840 000 przy 2 400 × 1 600. Plik nie musi być cztery razy większy, ale transfer i dekodowanie kosztują więcej. Porównaj mały i 2× w galerii. Zachowaj dodatkowe piksele przy widocznej korzyści, małym widokom dostarczaj mniejsze wersje.
Mniejsze kopie gotowego eksportu twórz przez zmianę rozmiaru z blokadą proporcji. Gdy zmienia się kompozycja, najpierw kadruj. Nie rozciągaj portretu do poziomego miejsca.
Telefon nie powinien pobierać największego pliku do każdej miniatury. Kreator może to obsłużyć; własna strona może wymagać responsywnego kodu obrazów. Poradnik o obrazach responsywnych opisuje źródło i widok.
Na zwykłym ekranie piksele znaczą więcej niż etykieta PPI. Szerokość 2 400 nie zmieni się po samej zmianie metadanych. W druku zależność jest inna; zobacz DPI, PPI i piksele.
Świadomie wybierz format i kolory
Zacznij od formatu platformy
JPG jest praktyczny dla zdjęć. PNG pomaga przy przezroczystości i grafice, lecz dla fotografii bywa zbyt duży. WebP i AVIF są przydatne przy zgodnej platformie lub własnym dostarczaniu. Dokumentacja MDN opisuje cechy i obsługę.
Nie konwertuj całej kolekcji przed testem publikacji. Platforma może odrzucić lub ponownie zakodować obraz. Porównuj plik z gotowej galerii, nie tylko przesłany.
Eksportuj z zarządzaniem kolorem
Dla typowego portfolio o standardowym zakresie dynamiki, SDR, sRGB jest praktycznym punktem wyjścia. Eksportuj w edytorze z zarządzaniem kolorem i dołącz profil, jeśli jest taka opcja. Konwersja kolorów do sRGB różni się od samego przypisania profilu sRGB wartościom przygotowanym w innej przestrzeni barw. Pytania i odpowiedzi Adobe o kolorze wyjaśniają działanie Lightrooma.
Szeroka gama i HDR wymagają zgodnego eksportu i publikacji. Stosuj je świadomie, gdy platforma je obsługuje. Sam podgląd edytora nie określa widoku odbiorcy.
Porównaj publikację i eksport na tym samym urządzeniu, używając skóry lub neutralnej powierzchni jako odniesienia. Ekrany nadal mogą się różnić. Gdy publikacja tam zmienia kolory, najpierw sprawdź platformę i profile, nie artystyczną edycję. Poradnik o kolorze pomaga.
Dobierz kompresję na małym zestawie testowym
Procent jakości nie działa tak samo w każdym programie. Steruje konkretnym koderem, nie opisuje procentu jakości artystycznej lub technicznej.
Wybierz zdjęcia ujawniające różne błędy. Gładkie niebo pokaże pasma kolorów, a włosy, trawa i tkaniny utratę drobnej faktury. W cieniach mogą pojawić się bloki lub rozmazany szum. Architektura ujawnia uszkodzenia cienkich, kontrastowych krawędzi. Użyj motywów reprezentatywnych dla swojej pracy.
- Używaj tej samej edytowanej bazy. Zachowaj wymiary i kolory, by badać tylko kompresję.
- Utwórz dwa lub trzy warianty. Na skali JPG 0–100 można sprawdzić 75, 85 i 95. To punkty testu, nie uniwersalne zalecenia.
- Sprawdź zdjęcie w dwóch widokach. Najpierw oceń je w rozmiarze, w którym zobaczy je odbiorca. Następnie obejrzyj przy 100% lub w widoku 1:1, szukając utraty faktury, bloków i obwódek. 100% nie oznacza dopasowania do okna ani nie musi oznaczać powiększenia. Adobe opisuje widok 1:1 w Lightroomie jako wyświetlanie rzeczywistych pikseli obrazu.
- Po wyglądzie porównaj rozmiar pliku. Wybierz mniejszy tylko z istotnymi szczegółami. Duża utrata dla niewielkiej oszczędności rzadko ma sens.
- Opublikuj test i porównaj ponownie. Platforma może zmienić wynik. Sprawdź siatkę, otwarte zdjęcie i telefon przed całą serią.
Nie istnieje uniwersalny docelowy rozmiar w kilobajtach dla zdjęć portfolio. Fotografia szczegółowego lasu może wymagać więcej danych niż prosta kompozycja studyjna o tych samych wymiarach. Wybierz najmniejszy plik, który przechodzi ocenę wizualną, a następnie sprawdź wczytywanie całej strony.
Zmierzony przykład: jedno zdjęcie, trzy eksporty JPG
Przetestowaliśmy Alpy i Morze Śródziemne z NASA Earth Observatory. Źródło: NASA/JSC, ISS Crew Earth Observations Facility, ISS073-E-3320. Plik był już JPG. Raz zmniejszyliśmy go do 2 400 × 1 348 i zapisaliśmy PNG dla jednakowych pikseli startowych. PNG nie przywraca wcześniejszych strat.

17 października 2026 przekonwertowaliśmy ten sam PNG narzędziem Pixilo PNG na JPG przy 75, 85 i 95 w Microsoft Edge 155.0.4283.45. Wymiary pozostały bez zmian. Liczby dotyczą kodera przeglądarki, nie odpowiedników Lightrooma ani gwarantowanych wyników innych zdjęć.
| Ustawienie | Rzeczywiste bajty | Plik |
|---|---|---|
| 75 | 347 191 | Pobierz JPG |
| 85 | 479 959 | Pobierz JPG |
| 95 | 905 332 | Pobierz JPG |




Każdy szczegół pokazuje ten sam obszar 240 × 160 bez dodatkowego skalowania. Strona może dopasować podglądy do ekranu. Otwórz pełne pliki w 100% do oceny pikseli. Niższa jakość oszczędza bajty, lecz może wygładzić grzbiety i fakturę. 95 waży prawie dwa razy tyle co 85; sam rozmiar nie mówi, czy poprawa jest ważna w galerii.
Możesz pobrać roboczy PNG (6 464 084 bajty) i powtórzyć test. Jedno zdjęcie lotnicze nie wyznacza ustawień portretu, sztuki i wszystkich krajobrazów. Sprawdź własne reprezentatywne prace.
Przykład: ustawienie eksportu Lightroom Classic
Załóżmy największy nieprzycięty widok 1 200 × 800 CSS i oryginał 6 000 × 4 000. Porównaj JPG 2 400 × 1 600 z mniejszym. Wybierz zdjęcie i otwórz File → Export. Dokumentacja Adobe wyjaśnia panele; nazwy zależą od wersji i języka.
- File Settings: wybierz JPEG i sRGB dla tego SDR. Porównuj jakość w Lightroomie zamiast kopiować liczbę przeglądarki.
- Image Sizing: włącz Resize to Fit i Width & Height. Podaj ramę 2 400 × 1 600 dla poziomego zdjęcia. Mieści się proporcjonalnie, bez wciskania portretu w ten kształt. Zachowaj Don't Enlarge dla mniejszych źródeł.
- Output Sharpening: porównaj brak wyostrzania z Sharpen For: Screen, Amount: Standard. Oceniaj fakturę i krawędzie w docelowej wielkości. Zmniejsz lub wyłącz przy obwódkach i twardych brzegach.
- Metadata: zachowaj potrzebne opisy i prawa autorskie, sprawdzając usuwanie lokalizacji i danych osobowych.
- Export Location: zapisuj w osobnym folderze webowym z różnymi nazwami, by wysłać sprawdzony wariant.
Prześlij wariant, obejrzyj otwartą galerię i telefon, potem zapisz ustawienie. Portrety i miniatury mogą wymagać innych ram. Sprawdź ponownie po zmianie układu.
Używaj Pixilo do potrzebnych dodatkowych etapów
Jeśli edytor daje wymiary, format i jakość w jednym eksporcie, zacznij tam. Pixilo pomaga przy gotowym obrazie wymagającym zmniejszenia, kadru lub porównania kompresji.
Kompresor tworzy lżejszą kopię, a narzędzie zmiany rozmiaru usuwa nadmiar pikseli. To drugie obsługuje JPG, PNG i WebP do 25 MB na plik. Większe źródło najpierw wyeksportuj jako mniejszą kopię roboczą w edytorze. Obróbka RAW, konwersja profili kolorów i wyostrzanie przy eksporcie wymagają programu, który obsługuje te funkcje.
Unikaj powtarzanych eksportów JPG. Wykonuj zmiany przed jednym końcowym plikiem i porównuj tę samą przygotowaną bazę, nie kompresuj ponownie poprzedniego pobrania.
Sprawdź metadane, nazwy i znaki wodne
GPS i dane osobowe sprawdzaj niezależnie od kompresji; pomaga poradnik o metadanych. Po użyciu narzędzia znaku wodnego sprawdź położenie w siatce i powiększeniu. Nie odwracaj uwagi od pracy. Znak nie zapobiega kopiowaniu.
Znajdź etap zmiany jakości
- Sprawdź edytowaną bazę. Eksport nie odtworzy brakujących tam szczegółów.
- Sprawdź eksport lokalny. Przy utracie faktury lub obwódkach osobno zbadaj wymiary, kompresję i wyostrzanie.
- Sprawdź plik dostarczany przez galerię. Jeśli lokalny jest dobry, sprawdź wersję, kadr i wielkość wyświetlania. Rozciągnięta miniatura wymaga innej naprawy niż nadmierna kompresja.
Zmieniaj jeden etap naraz. Wiele dużych plików pobieranych jednocześnie też spowalnia. Testuj nową wizytę i pierwsze otwarcie, nie tylko już wczytane zdjęcia.
Sprawdź opublikowaną galerię
- Miniatury i duże widoki pokazują zamierzoną kompozycję.
- Ważna faktura pozostaje bez uciążliwych artefaktów w niebie i cieniach.
- Duży widok nie jest powiększoną, zbyt małą miniaturą.
- Kolory są sensowne w porównaniu eksportu i publikacji na tym samym urządzeniu.
- Strona mobilna wczytuje się sprawnie, bez pobierania największego pliku dla każdej miniatury.
- Publiczne pliki i linki zawierają tylko przeznaczone do udostępnienia wersje i metadane.
Najczęstsze pytania
Czy zawsze wybierać najwyższą jakość JPG?
Nie. Plik może znacznie urosnąć bez przydatnej różnicy w docelowym widoku. Testuj trudne zdjęcia, oceniając wygląd i oszczędność.
Czy wszystkie zdjęcia powinny mieć te same wymiary?
Niekoniecznie. Spójność nie wymaga rozciągania. Układ określa, które kadry ujednolicić, a gdzie zachować proporcje oryginału.
Czy eksport webowy nadaje się do druku?
Nie zakładaj tego. Druk i dostawa klientowi mogą wymagać innych wymiarów, kolorów, wyostrzania i metadanych. Przygotuj je z oryginału według wymagań dostawy.
Przetestuj mniejszą kopię portfolio
Zacznij od wymagającego zdjęcia, zaplanuj duży widok i porównaj publikację przed całą kolekcją.
Zmień rozmiar zdjęcia portfolioPorównaj kompresję →