W tym samouczku dotyczącym programu Photoshop nauczymy się, jak zmieniać rozmiar, optymalizować i zapisywać zdjęcia w celu przesłania ich na stronę internetową lub wysłania e-maila do rodziny lub znajomych za pomocą kombinacji opcji Rozmiar obrazu i Zapisz dla Internetu i urządzeń w Photoshop CS5! Ten samouczek jest również w pełni zgodny z programem Photoshop CS4.

Oto zdjęcie, które aktualnie otwieram na ekranie, które muszę zoptymalizować dla Internetu:

Oryginalny obraz.

Jeśli spojrzymy na panel Warstwy, zobaczymy, że wykonałem trochę retuszowania tego obrazu, z kilkoma warstwami i warstwami dopasowania dodanymi powyżej oryginalnego obrazu na warstwie Tła :

Panel Warstwy.

Krok 1: Zduplikuj obraz

Aby przygotować to zdjęcie do wysłania pocztą e-mail lub przesłania na stronę internetową, muszę spłaszczyć dokument do jednej warstwy, a następnie zmienić rozmiar obrazu, aby go zmniejszyć, ale najpierw chcę się upewnić, że nie stracę żadnej praca, którą wykonałem lub wprowadzę jakiekolwiek trwałe zmiany w rozmiarze oryginalnego zdjęcia. Aby grać bezpiecznie, zanim zrobię cokolwiek innego, zrobię kopię mojego obrazu, przechodząc do menu Obraz na pasku menu u góry ekranu i wybierając Duplikuj :

Przejdź do Image> Duplicate.

Program Photoshop otworzy okno dialogowe Duplikat obrazu z prośbą o nazwę kopii. Możesz po prostu zaakceptować domyślną nazwę, którą Photoshop już wprowadził (w moim przypadku jest to „kopia blue_dress”), ponieważ możemy łatwo zmienić nazwę obrazu, gdy przejdziemy, aby zapisać go później. Kliknij przycisk OK w prawym górnym rogu okna dialogowego, aby zaakceptować domyślną nazwę i zamknąć ją:

Kliknij przycisk OK, aby zaakceptować domyślną nazwę.

Photoshop otworzy identyczną kopię obrazu, w tym wszystkie warstwy dodane do oryginalnej wersji, w osobnym oknie dokumentu:

Kopia oryginalnego dokumentu pojawi się w nowym oknie.

Krok 2: Spłaszcz obraz

Następnie spłaszczmy kopię naszego obrazu do jednej warstwy, co może pomóc nam uzyskać lepsze wyniki, gdy przejdziemy do zmiany jego rozmiaru, co zrobimy za chwilę. Przejdź do menu Warstwa u góry ekranu i wybierz opcję Spłaszcz obraz :

Przejdź do Warstwa> Spłaszcz obraz.

Jeśli spojrzymy ponownie w panelu Warstwy, zobaczymy, że wszystkie moje warstwy zostały spłaszczone do pojedynczej warstwy tła:

Panel Warstwy pokazujący spłaszczony obraz.

Krok 3: Zmień rozmiar obrazu

Teraz, gdy nasz obraz został spłaszczony, zmieńmy jego rozmiar na coś bardziej odpowiedniego do wiadomości e-mail lub do wyświetlania na stronie internetowej. Przejdź do menu Obraz u góry ekranu i wybierz Rozmiar obrazu :

Przejdź do obrazu> rozmiar obrazu.

Spowoduje to otwarcie okna dialogowego Rozmiar obrazu. Jak zobaczymy wkrótce, okno dialogowe Zapisz dla Internetu i urządzeń w Photoshopie daje nam również możliwość zmiany rozmiaru obrazu, ale lepsze wyniki uzyskasz, jeśli wcześniej zmienisz rozmiar obrazu za pomocą polecenia Rozmiar obrazu.

Jeśli spojrzymy na górę okna dialogowego, w sekcji Wymiary piksela zobaczymy, że moje zdjęcie ma obecnie szerokość 1571 pikseli i wysokość 2356 pikseli. Jest to zbyt duże, aby większość ludzi mogła zmieścić cały obraz na ekranie, gdybym wysłał im zdjęcie pocztą e-mail, a na pewno jest zbyt duże, aby wyświetlić je w większości witryn:

Bieżąca szerokość i wysokość obrazu w pikselach.

Ogólnie rzecz biorąc, do przeglądania wiadomości e-mail i Internetu chcesz ograniczyć wymiary zdjęcia do nie większych niż 800 pikseli na 600 pikseli, co oznacza, że ​​szerokość nie powinna przekraczać 800 pikseli, a wysokość nie powinna przekraczać 600 pikseli. Jeśli przesyłasz zdjęcie do witryny, witryna może mieć inne, określone wymiary, których musisz się trzymać, ale zazwyczaj utrzymanie rozmiaru w zakresie 800 na 600 pikseli pozwoli większości osób wygodnie oglądać obraz na ekranie.

Zanim jednak wprowadzisz nowe wymiary w pikselach, najpierw sprawdź, czy wszystkie trzy opcje u dołu okna dialogowego - Skaluj style, Zachowaj proporcje i Ponownie próbkuj obraz - są zaznaczone . Technicznie rzecz biorąc, po spłaszczeniu obrazu nie musimy się martwić o pierwszą opcję, Skaluj style, ponieważ nie mamy żadnych stylów warstw zastosowanych do obrazu, ale łatwiej jest po prostu upewnić się, że wszystkie trzy opcje są zaznaczone. Następnie ustaw opcję interpolacji obrazu na samym dole okna dialogowego na Bicubic Sharper (najlepiej do zmniejszenia). Nigdzie nie mówi „Interpolacja obrazu”, ale taka jest ta dolna opcja i kontroluje sposób, w jaki Photoshop obsługuje piksele podczas procesu ponownego próbkowania. Ustawienie Bicubic Sharper zapewni nam najlepsze wyniki przy zmniejszaniu rozmiaru obrazu do oglądania na ekranie:

Upewnij się, że pierwsze trzy opcje są zaznaczone, a dolna opcja jest ustawiona na Bicubic Sharper.

Następnie wróć do sekcji Wymiary w pikselach u góry okna dialogowego i wprowadź nowe wymiary. Ponieważ moje zdjęcie jest w trybie portretowym, co oznacza, że ​​jest wyższe niż szerokie i nie chcę, aby wysokość przekraczała 600 pikseli, wprowadzę 600 pikseli w opcji Wysokość . Po wybraniu opcji Zachowaj proporcje u dołu okna dialogowego Photoshop automatycznie wprowadzi dla mnie nową wartość szerokości, aby zachować stosunek szerokości do wysokości obrazu taki sam, jak pierwotnie. W moim przypadku Photoshop wprowadził 400 pikseli dla Szerokość :

Po wybraniu opcji Zachowaj proporcje wystarczy wprowadzić nową szerokość lub wysokość, a program Photoshop wprowadzi drugą dla nas.

Zauważ, że nie wprowadziłem żadnych zmian do wartości Rozdzielczość w sekcji Rozmiar dokumentu okna dialogowego. Jest tak, ponieważ rozdzielczość określa, jak duży obraz wydrukuje się na papierze i nie ma nic wspólnego z oglądaniem obrazu na ekranie komputera. Podczas zmiany rozmiaru obrazu do wyświetlenia na ekranie musimy jedynie skupić się na rzeczywistych wymiarach piksela obrazu, które znajdują się w odpowiednio nazwanej sekcji Wymiary piksela u góry okna dialogowego.

Po wprowadzeniu nowych wymiarów kliknij przycisk OK w prawym górnym rogu okna dialogowego, aby je zamknąć. W tym momencie Photoshop obniży próbkę obrazu do nowego, mniejszego rozmiaru.

Wtyczka shortcodes, działań i filtrów: Błąd w shortcode (reklamy-niezbędne-środkowe)

Krok 4: Zapisz dla Internetu

Powieliliśmy, spłaszczyliśmy i zmieniliśmy rozmiar naszego obrazu. Teraz nadszedł czas, aby go zoptymalizować i zapisać. Przejdź do menu Plik u góry ekranu i wybierz Zapisz dla Internetu i urządzeń :

Przejdź do Plik> Zapisz dla Internetu i urządzeń.

Otwiera to bardzo duże okno dialogowe Zapisz dla Internetu i urządzeń, z dużym obszarem podglądu zajmującym większość miejsca. Jeśli spojrzysz tuż nad lewym górnym rogiem obszaru podglądu, zobaczysz serię czterech zakładek. Domyślnie wybrana jest karta Zoptymalizowana, co oznacza, że ​​nie widzisz oryginalnego obrazu. Zamiast tego widzisz podgląd na żywo obrazu z zastosowanymi bieżącymi ustawieniami optymalizacji (które przyjrzymy się za chwilę):

Obszar podglądu jest domyślnie ustawiony na Zoptymalizowany tryb widoku.

Możesz pozostawić tryb widoku ustawiony na Zoptymalizowany lub, aby wyświetlić porównanie obok siebie oryginalnych i zoptymalizowanych wersji obrazu, przełącz się do trybu widoku 2 w górę, klikając jego zakładkę:

Przełączanie do trybu wyświetlania 2 stron na arkuszu.

Po wybraniu opcji 2 strony na górze możemy teraz zobaczyć oryginalną wersję obrazu po lewej stronie i wersję zoptymalizowaną po prawej stronie (jeśli twój obraz jest w trybie poziomym, co oznacza, że ​​jest szerszy niż wysoki, zobaczysz podgląd pionowy z oryginalną wersją u góry i wersją zoptymalizowaną pod nią):

Oryginalna wersja znajduje się po lewej stronie, wersja zoptymalizowana po prawej stronie.

Format pliku
Po prawej stronie okna dialogowego znajdują się różne opcje optymalizacji (jeśli nie widzisz żadnych opcji na liście, upewnij się, że masz zoptymalizowaną wersję obrazu wybraną w obszarze podglądu). Pierwszą rzeczą, którą musimy tutaj zrobić, jest wybór odpowiedniego formatu pliku dla naszego obrazu. Jeśli po raz pierwszy używasz okna dialogowego Zapisz dla Internetu i urządzeń, zobaczysz format pliku GIF wybrany u góry (bezpośrednio pod słowem „Ustawienia wstępne”). GIF to świetny format do zapisywania grafiki internetowej, ale w przypadku zdjęć chcemy użyć formatu JPEG.webp, więc zmień opcję z GIF na JPEG.webp, jeśli nie jest on ustawiony na JPEG.webp:

Ustaw format pliku na JPEG.webp.

Jakość obrazu
Bezpośrednio poniżej opcji formatu pliku znajdują się opcje jakości obrazu . Możemy wybrać wstępnie ustawione ustawienie jakości (Niska, Średnia, Wysoka, Bardzo wysoka i Maksymalna) po lewej stronie lub możemy wprowadzić określoną wartość do opcji Jakość po prawej stronie. Chociaż może być kuszące, aby wybrać ustawienia najwyższej jakości dla naszych zdjęć, aby każdy mógł zobaczyć, jak naprawdę są niesamowite, optymalizacja ich pod kątem poczty e-mail lub Internetu oznacza, że ​​musimy utrzymać rozmiar pliku tak mały, jak to możliwe, a to oznacza znalezienie środka uziemienie między jakością obrazu a rozmiarem pliku. Ustawienie wstępne wysokiej jakości jest prawie zawsze najlepszym wyborem, dającym nam to, co najlepsze z obu światów - akceptowalną jakość obrazu i stosunkowo małe rozmiary plików. Wybranie ustawienia wstępnego Wysoka spowoduje automatyczne ustawienie ustawienia jakości na 60 :

Wybierz ustawienie wstępne wysokiej jakości, które ustawia wartość jakości na 60.

Po wybraniu ustawienia jakości upewnij się, że jest wybrana opcja Zoptymalizowana, która może nieco zmniejszyć rozmiar pliku. Pozostaw opcję Progresywną niezaznaczoną, a także pozostaw niezaznaczone Osadź profil kolorów, ponieważ większość przeglądarek internetowych i tak nie obsługuje profili kolorów:

Wybierz Zoptymalizowany i pozostaw niezaznaczony Progresywny i Osadź profil kolorów.

Przestrzeń kolorów
Na koniec wybierz opcję Konwertuj na sRGB, jeśli nie jest jeszcze zaznaczona. Dzięki temu zdjęcie zostanie zapisane w przestrzeni kolorów sRGB, co w skrócie oznacza, że ​​kolory na zdjęciu będą poprawnie wyświetlane w Internecie lub gdy ktoś wyświetli obraz w wiadomości e-mail:

Opcja Konwertuj na sRGB sprawia, że ​​kolory na zdjęciach nie wydają się matowe i szare na ekranach komputerowych innych osób.

Rozmiar obrazu
Wspomniałem wcześniej, kiedy patrzyliśmy, jak zmienić rozmiar zdjęcia za pomocą polecenia Rozmiar obrazu, że okno dialogowe Zapisz dla Internetu i urządzeń daje nam również możliwość zmiany rozmiaru obrazu. Opcje rozmiaru obrazu znajdziesz w prawym dolnym rogu okna dialogowego. W moim przypadku okno dialogowe pokazuje, że moje zdjęcie ma szerokość 400 pikseli na 600 pikseli wysokości, ponieważ zmieniłem to wcześniej. Chociaż może wydawać się wygodna zmiana rozmiaru obrazu podczas ustawiania wszystkich innych opcji optymalizacji sieci, lepsze wyniki zmiany rozmiaru uzyskasz, jeśli zignorujesz te opcje tutaj i pozostaniesz przy właściwym poleceniu Rozmiar obrazu:

Opcje rozmiaru obrazu w prawym dolnym rogu okna dialogowego.

Porównanie rozmiarów plików
W tym momencie zrobiliśmy wszystko, co musimy zrobić, ale zanim zamkniemy okno dialogowe Zapisz dla Internetu i urządzeń i faktycznie zapiszemy obraz, rzućmy okiem poniżej dwóch wersji zdjęcia w obszarze podglądu aby porównać rozmiar oryginalnej wersji z wielkością zoptymalizowanej wersji. W moim przypadku oryginalne zdjęcie (po lewej) było ogromne 703 Kb, o wiele za duże dla Internetu, szczególnie dla osób o niższych prędkościach internetu, podczas gdy wersja zoptymalizowana (po prawej), która wygląda prawie tak dobrze jak oryginalny, ma tylko 58, 41 Kb :

Widok 2-w górę pozwala nam porównać rozmiary plików między oryginalną i zoptymalizowaną wersją obrazu.

Krok 5: Zapisz obraz

Aby zapisać zoptymalizowaną wersję zdjęcia, kliknij przycisk Zapisz u dołu okna dialogowego. Program Photoshop otworzy okno dialogowe Zapisz zoptymalizowane jako, które pozwala zmienić nazwę obrazu w razie potrzeby, a także przejść do katalogu na dysku twardym, na którym chcesz go zapisać. Zmienię nazwę mojego zdjęcia na „blue-dress.jpg.webp” i zapiszę go w folderze „web photos” na pulpicie. Po zakończeniu kliknij przycisk Zapisz, aby zapisać obraz i zamknąć okno dialogowe:

Okno dialogowe Zapisz zoptymalizowane jako.

Mamy to! Zdjęcie ma teraz rozmiar i jest w pełni zoptymalizowane, gotowe do wysłania pocztą e-mail do znajomych i członków rodziny lub przesłania do sieci dzięki poleceniom Rozmiar obrazu i Zapisz dla Internetu i urządzeń w Photoshop CS5!

Kategoria: