Jak wgrywać i kadrować zdjęcia?
Pole na zdjęcie w panelu wygląda skromnie — prostokąt z przyciskiem „Prześlij” albo już wstawioną miniaturką. Kryją się za nim jednak trzy rzeczy, które warto znać, zanim wrzucisz pierwsze zdjęcie: przycięcie, punkt, który zawsze ma zostać w kadrze, i tekst alternatywny.
Wgrywanie
Klikasz „Prześlij” i wybierasz plik z dysku albo po prostu przeciągasz zdjęcie myszką na pole. Zdjęcie trafia do biblioteki mediów Twojej strony i jest gotowe do użycia. Nie musisz przygotowywać kilku wersji tego samego pliku w różnych rozmiarach — strona sama pobiera z panelu taką wielkość, jakiej potrzebuje w danym miejscu.
Dwa narzędzia w jednym oknie
Przy większości zdjęć, po najechaniu na miniaturkę, zobaczysz ikonkę z podpowiedzią „Przytnij obraz”. Otwiera ona okno „Edytuj hotspot i przycięcie” z dwoma elementami nałożonymi na zdjęcie. Panel opisuje je jednym zdaniem: „Dostosuj prostokąt, aby przyciąć obraz. Dostosuj koło, aby określić obszar, który zawsze powinien być widoczny.”
Prostokąt to przycięcie. Wszystko, co zostanie poza nim, znika ze zdjęcia na dobre, w każdym miejscu na stronie. Przydaje się, gdy na brzegu kadru jest coś zbędnego — kawałek cudzej ręki, kosz na śmieci w rogu gabinetu.
Koło to hotspot, czyli punkt zainteresowania. Niczego nie ucina. Mówi tylko stronie, co jest na zdjęciu najważniejsze — twarz na portrecie, fotel w gabinecie, logo na szyldzie. Gdy strona musi zmieścić zdjęcie w ramce o innych proporcjach niż oryginał, przesuwa ramkę tak, żeby to miejsce zostało widoczne. Można to porównać do passe-partout przykładanego do większej fotografii: kształt okienka narzuca strona, ale to Ty decydujesz, na czym ma się zatrzymać.
Pod zdjęciem w tym samym oknie panel pokazuje podglądy w kilku kształtach naraz. To najszybszy sposób, żeby sprawdzić, czy nikomu nie ucięło głowy.
Gdzie strona przycina zdjęcia
Nie każde zdjęcie na stronie jest kadrowane tak samo. W części miejsc ramka ma stały kształt i wtedy hotspot ma znaczenie. W innych zdjęcie pokazywane jest w całości.
| Zdjęcie | Gdzie się pokazuje | Kształt ramki | Czy hotspot ma znaczenie |
|---|---|---|---|
| Usługa → Zdjęcie | karta na stronie usług | poziomy 16:9 | tak |
| Usługa → Zdjęcie | baner na górze strony usługi | szeroki pas 5:2 | tak |
| Wpis na blogu → Zdjęcie główne | karta na liście wpisów | poziomy 16:9 | tak |
| Wpis na blogu → Zdjęcie główne | baner na górze wpisu | szeroki pas 5:2 | tak |
| Zdjęcie w galerii → Zdjęcie | miniatura w galerii | kwadrat 1:1 | tak |
| Zdjęcie w galerii → Zdjęcie | powiększenie po kliknięciu | całe zdjęcie | nie |
| Zdjęcie wstawione w Treść wpisu na blogu | w tekście wpisu | całe zdjęcie | nie |
| Członek zespołu → Zdjęcie | karta osoby na stronie "O nas" | pionowy 3:4, wyrównany do góry | nie |
| Ustawienia witryny → Logo | nagłówek strony | całe logo, wysokość 40 px | nie |
Na szerokich monitorach baner usługi i wpisu ma najwyżej 420 pikseli wysokości, więc dolny pas zdjęcia bywa wtedy dodatkowo ucięty. Najważniejszy motyw lepiej więc trzymać w środkowej albo górnej części kadru, a nie przy dolnej krawędzi.
Zdjęcia zespołu działają inaczej niż reszta. Strona nie kadruje ich według hotspotu, tylko zawsze trzyma się górnej krawędzi zdjęcia, żeby twarz nie wypadła z ramki. Jeśli w zespole jest tylko jedna osoba, jej zdjęcie pokazuje się w całości, bez żadnego przycinania. Dlatego przy portretach liczy się przede wszystkim to, jak zrobisz samo zdjęcie — więcej w jak dodać lub zmienić członka zespołu.
Przycięcie prostokątem działa za to wszędzie. Jeśli coś utniesz, nie wróci ani w miniaturze, ani w powiększeniu.
Jaki rozmiar zdjęcia przygotować
Panel podaje konkretne wymiary tylko w dwóch miejscach. Zdjęcie Członka zespołu powinno być pionowe, w proporcjach 3:4, na przykład 600 × 800 pikseli. Favicon w Ustawieniach witryny ma być kwadratowy, w PNG albo SVG, najlepiej co najmniej 180 × 180 pikseli.
Dla pozostałych zdjęć z tabeli wystarczy prosta zasada: zdjęcia do usług i na bloga przygotuj poziome i szerokie na co najmniej 1400 pikseli, bo tyle ma największy baner. Zdjęcia do galerii najlepiej sprawdzają się z ważnym motywem blisko środka, bo miniatura i tak jest kwadratem. Obrazek do udostępniania w zakładce SEO wgraj od razu w rozmiarze 1200 × 630 pikseli — w tym polu nie ma narzędzia do kadrowania.
Tekst alternatywny
Przy części zdjęć pod polem zobaczysz dodatkowe pole „Tekst alternatywny”. Jest przy zdjęciu Usługi, przy Zdjęciu głównym wpisu, przy każdym zdjęciu wstawionym w treść wpisu (tam dochodzi jeszcze „Podpis pod zdjęciem”) i przy Zdjęciu w galerii. To krótki opis tego, co widać, np. „Dr Anna Kowalska w gabinecie stomatologicznym”.
Wypełnij je za każdym razem, gdy się pojawia — z dwóch powodów. Po pierwsze, czyta je Google przy indeksowaniu obrazów. Po drugie, osoby korzystające z czytnika ekranu, bo są niewidome albo słabowidzące, usłyszą właśnie ten opis zamiast samego zdjęcia. Jeśli pole zostanie puste, strona podstawi tytuł usługi, wpisu albo zdjęcia, co jest lepsze niż nic, ale rzadko opisuje, co naprawdę jest na fotografii.
Zdjęcie Członka zespołu i Logo nie mają tego pola. Strona opisuje je sama — imieniem i nazwiskiem osoby albo nazwą firmy.
Zanim wgrasz zdjęcie
Telefon potrafi zrobić zdjęcie o wadze kilkunastu megabajtów. Strona i tak pobiera z panelu pomniejszoną wersję, ale bardzo duże pliki wolniej się wgrywają i zajmują miejsce w bibliotece mediów. Zanim wgrasz plik, warto go zmniejszyć do mniej więcej 1–2 megabajtów dowolnym darmowym narzędziem do kompresji zdjęć. Upewnij się też, że zdjęcie ma właściwą orientację (nie leży na boku) i że kadr faktycznie pokazuje to, na czym Ci zależy, zanim jeszcze zaczniesz je przycinać w panelu.
To już komplet podstawowych umiejętności w panelu — reszta to kwestia oswojenia się z konkretnymi typami treści, zaczynając od Ustawień witryny.