Przygotowanie zdjęć do strony internetowej.

Nazwy plików

Załóżmy że zgraliśmy zdjęcia z aparatu / telefonu / dostaliśmy od kogoś pliki mailem.
Najlepiej zacząć od zmiany nazw plików. Tak dla porządku, łatwiej potem odszukać zdjęcie.

Nie używamy w nazwach plików polskich znaków, tyko małe litery i zamiast spacji "-" lub "_"

Przykład

nazwa-costam-1.jpg
nazwa-costam-2.jpg 
nazwa-costam-3.jpg 
itd

Do zmiany nazw można użyć jakiegoś narzędzia do masowej zmiany nazw plików żeby nie robić tego pojedynczo.
darmowy program do masowej zmiany plików
Instrukcja do programu

Możemy teraz dla ułatwienia sobie późniejszej pracy rozdzielić zdjęcia na te w orientacji poziomej i pionowej. Najlepiej w katalogu utworzyć nowy katalog o nazwie "pionowe" i tam przekopiować zdjęcia w takiej orientacji.

Zmiana rozdzielczości (przy dużych plikach)

Zdjęcia będą na 99% miały zbyt dużą rozdzielczość (wyrażoną w pikselach px ). Trzeba je zatem zmniejszyć żeby się szybciej ładowały na stronie.

Najpierw w naszym katalogu ze zdjęciami utworzymy katalog o nazwie "zmniejszone". Tam pojawią nam się później pliki.

Do zmniejszenia rozdzielczośći najlepiej użyć programu ktróry zrobi to automatycznie, proponuję:

RIOT link do programu, zacznie od razu pobierać.

Należy po pobraniu zainstalować program.

Okno programu wygląda tak:

1. Wybieramy przycisk batch (program będzie wykonywał operację na wielu plikach na raz)

2. Ustawiamy rozdzielczość i kompresję:

Jeśli nie mamy tego okienka należy w menu "Additional tasks" wybrać "resize"

Najpierw zmniejszamy zdjęcia w orientacji poziomej dlatego ustawiamy:

1200 px szerokości (wysokość się ustawi proporcjonalnie)

Resampling filter: ustawiamy na Lanczos3.

3. Teraz dodajemy zdjęcia do kolejki przyciskiem

Wybieramy wszystkie zdjęcia z katalogu (możemy użyć skrótu klawiaturowego ctrl+a)

Wyświetli nam się lista zdjęć do zmniejszenia

4. Następnie wybieramy gdzie mają nam się zapisać już zoptymalizowane zdjęcia, klikamy "..."

W tym wybieramy wcześniej utworzony katalog o nazwie "zmniejszone" *
Ścieżka powinna wyglądać analogicznie do tego obrazka

* wcześniej możemy utworzyć katalog o dowolnej nazwie. Ważne żeby potem go wybrać jako miejsce docelowe.

Po wybraniu folderu docelowego klikamy Start i program robi już swoje i pokazuje nam w kolumnie status (na zielono) o ile % zostało zmniejszone zdjęcie.

W naszym katalogu "zmniejszone" pojawią się zdjęcia.

Teraz chcielibyśmy zmniejszyć nasze zdjęcia w orientacji pionowej.

Najpierw musimy wyczyścić z "kolejki" zdjęcia o orientacji poziomej. Robimy to klikając przycisk Remove all

Tak jak w punkcie 2 ustawiamy rozdzielczość na 800 zamiast 1200.

Znowu w jak w punkcie 3 wybieramy zdjęcia ale tym razem z katalogu "pionowe".

Punkt 4 możemy zostawić tak jak jest. Zdjęcia zapiszą nam się do katalogu ustawionego wcześniej (czyli "zmniejszone") obok tych w orientacji poziomej. Będziemy mieć wszystkie zdjęcia zmniejszone w jednym katalogu.

Klikamy start i program zrobi swoje.

W zasadzie takie zdjęcia już można wrzucać na naszą stronkę jednakże nam zależy, żeby strona ładowała się jak najszybciej. Zatem przechodzimy do następnego punktu.

*Optymalizacja plików do formatu do WEBP

Jest to nowszy format zapisu obrazów, pozwala na zmniejszenie "wagi" pliku przy jednoczesnym zachowaniu jakości. Jest to format "popychany" przez google, więc jest jednym z zaleceń dla lepszej optymalizacji strony (i lepszego pozycjonowania).

Do zamiany plików jpg na webp jest fajny, prosty programik: Imagine link do programu, zacznie od razu pobierać. Po pobraniu instalujemy.

Program powinien być ustawiony tak:

Klikamy na przycik Add i wchodzimy do naszego katalogu "zmniejszone", zaznaczamy wszystkie zdjęcia (ctrl+a) i klikamy otwórz.

Program od razu zaczyna pracę i zamienia zdjęcia (zaczną się pojawiać zielone kropki przy każdej miniaturze zdjęcia co oznacza że dane zdjęcie jest już gotowe).

Teraz należy tylko zapisać pliki. Klikamy Save i do wyboru jest:

Save and overwrite - ta opcja zapisze pliki w katalogu z którego je dodawaliśmy (w naszym przypadku jest to katalog zmniejszone). Pliki z rozszerzeniem webp pojawią się obok tych z jpg. (może być to niewygodne więc lepiej wybrać opcję Export to)

Export to - program zapisze pliki we wskazanym przez nas katalogu. Można w naszym katalogu zmniejszone utworzyć kolejny katalog np. o nazwie "webp" i tam zapisać pliki.

I tyle, zdjęcia są gotowe do wrzucenia na stronę.