Wpisz poszukiwane słowo i wciśnij Enter.

Odpowiadamy na pytania z webinaru – Jak tworzyć grafiki i zapisywać zdjęcia, aby strona działała szybciej i była wyżej w Google

Odpowiadamy na pytania z webinaru – Jak tworzyć grafiki i zapisywać zdjęcia, aby strona działała szybciej i była wyżej w Google

Dziękujemy za Twój udział w webinarze Akademii home.pl
Poniżej podpowiadamy na wszystkie zadane przez Państwa pytania.

Spis treści Ukryj

Jeśli w sklepie internetowym są już zdjęcia a chciałabym je zoptymalizować to jak to zrobić i czy w ogóle?

Przy odpowiedzi na to pytanie nie da się podać konkretnej odpowiedzi bo najpierw trzeba sprawdzić 3 rzeczy.

Po pierwszy czy aby na pewno zdjęcia w sklepie wymagają optymalizacji. Niektóre sklepy internetowe lub rozwiązania po stronie serwera, mają wbudowane systemy optymalizacji dodawanych grafik i mimo, iż jakiś system analizujący stronę pod tym względem uważa, że da się co nieco poprawić rozmiar plików, to czasami (przy wielu produktach) czas poświęcony na to będzie niewspółmierny do osiągniętych korzyści.
Po drugie czy grafiki w tym sklepie nie są już dobrze wypozycjonowane w google images. Jeśli w statystykach (np. Google Analytics) widzimy wejścia na nasz produkt właśnie z tego źródła, to trzeba się zastanowić czy jakieś zmiany nie wpłyną źle na ten parametr. Polecam zrobić zmianę na kilku plikach testowo. Spisać najpierw na której pozycji była grafika na daną frazę i po pewnym czasie zobaczyć na tej małej próbie efekty.

Po trzecie – czy oprogramowanie sklepu w ogóle pozwala na takie modyfikacje. Często jest tak, że dla wygody użytkownika, pewne zadania są zautomatyzowane co daje korzyść dla większości właścicieli sklepów. Chodzi np. o generowanie odpowiedniego rozmiaru zdjęcia już po stronie serwera. Wgrywamy jedno zdjęcie a odpowiednia biblioteka i skrypty generują z niego zdjęcie zoptymalizowane oraz np. miniaturkę.

Jeśli oprogramowanie sklepu na to pozwala, a przy tym nie masz wejść z grafiki Google to warto to zrobić, jeśli widzisz że grafiki są w bardzo dużej rozdzielczości a zdjęcia zajmują np. o 70% więcej KB niż jedno testowe zdjęcie „przepuszczone” przez jakiś kompresor (zakładając oczywiście, że masz na to czas bo twój sklep nie ma np. 1000 produktów).

Co z formatem WEBP ? Czy Google nadal traktuje go wyniośle? – jak tworzyć i czy warto?

WebP jest formatem promowanym przez Googla odnośnie tworzenia stron przyjaznych użytkownikom (szybszy czas ładowania strony). Jaki to ma realnie wpływ na pozycje w Google – tego prawdopodobnie nie wie nawet 99,99% pracowników Googla.
Algorytm pozycjonowania jest jedną z bardziej strzeżonych tajemnic a każdy parametr (jak np. czas wczytywania strony) jest tylko jedną malutką składową tego algorytmu, który i tak ma przydzieloną swoją „wagę” – czyli jak mocno powinien wpływać na wynik.
Myślę, że te wyniki mogą być różne dla urządzeń mobilnych i inne dla komputerów stacjonarnych. Przy urządzeniach mobilnych waga tego parametru może być wyższa i bardziej znacząca – jednakże i tak jest wiele innych (ważniejszych) rzeczy w SEO. Kompleksowe pozycjonowanie skupia się na optymalizacji każdego z tych parametrów – także grafik i ich atrybutów.

Jak tworzyć WebP? Jest wiele sposobów. Format ten, jako specyfikacja ma pewnie z 10 lat, jednakże do niedawna nie każda przeglądarka go obsługiwała (teraz już nie ma tego problemu) a np. Photoshop w wersji 2021 dalej nie potrafi zapisać pliku w formacie WebP bez instalowania dodatkowych pluginów.
Tak samo system Windows po zapisie tego pliku na dysku miał problemy aby wyświetlić dla niego podgląd… Co nie zmienia jednak faktu, że Google czyli twórca tego formatu, stworzył trend z którym trzeba się pogodzić i stosować go na stronach. Ja polecam konwertery online typu https://compress-or-die.com/ lub zainstalowanie dodatku do Photoshopa, lub skorzystanie z Photopea.com, która przy eksporcie bez problemu radzi sobie z zapisem do WebP.
To są rady przy tworzeniu grafik. Jeśli już grafiki są na serwerze to w zależności jaką mamy stronę i umiejętności – można skorzystać z pewnych rozwiązań, które potrafią konwertować grafiki w locie. Są do tego specjalne dodatki do WordPressa czy innych CMSów oraz gotowe biblioteki do wykorzystania na stronach.

W Photoshopie jest opcja zapisywania do użytku w Internecie (zapisz do internetu – Save for Web (Legacy)…) – czy na użytek sklepu internetowego warto tak zapisywać obrobione zdjęcia czy jednak używać innej opcji? Jakiej?

Ta forma zapisywania plików w Photoshopie jest używana przez grafików w home.pl najczęściej. Choć nie daje najlepszych rezultatów jeśli chodzi o stopień kompresji, to jest jednak najwygodniejszą formą (czasami zapisujemy reklamy do Social Mediów, gdzie i tak kompresja dzieje się jeszcze raz po stronie serwerów np. Facebooka) a wyniki nie są wcale złe.
Z doświadczenia wiem, że zapisywanie w ten sposób a nie np. za pomocą „save as… JPG” w Photoshopie daje lepsze rezultaty. Ma się sporą kontrolę nad wielkością pliku JPG gdzie na żywo widzimy rozmiar pliku oraz wizualnie możemy porównać wpływ kompresji na efekt końcowy. Jednak każde zdjęcie jest inne. Z niektórych typów zdjęć da się wyciągnąć dużo lepsze rezultaty stosując narzędzia zewnętrzne, w innym przypadku korzyść będzie rzędu 10 KB. Warto zdjęcie (i tu jest ważna informacja – oryginalne zdjęcie, już po obróbce ale jeszcze przed kompresją) zapisać standardowy sposób w Photoshopie oraz ten sam plik wrzucić w serwis typu  https://compress-or-die.com/, a wyniki jakości do wielkości pliku w KB porównać patrząc na niego bez powiększania – tak jak będą na tą grafikę patrzeć klienci sklepu.
Jeśli wyniki rozmiaru pliku są znacząco mniejsze to warto zastanowić się nad opcją przepuszczania pliku przez coś innego niż Photoshop. Takie zabiegi mają tylko sens przy dodawaniu zdjęć gdzie nic potem z tym zdjęciem się nie dzieje po wrzuceniu na serwer.
Bo np. jeśli robimy post na Facebooka to i tak ta grafika będzie konwertowana na format i rozmiar bardziej optymalny dla potrzeb Facebooka (czyli jakość pogorszona). Podsumowując – w Photoshopie najlepiej skorzystać ze „starej” formy „Save for web” lub jeśli eksportujemy artboardy lub elementy strony to wtedy „Export as”.

Jaki powinien być zoptymalizowany format i waga zdjęć (w sklepie www, na blogu itp.)?

Powinien być tak optymalizowany, aby jakość zdjęcia, a dokładnie jego kompresji nie wpływała negatywnie na odbiór przez użytkownika. Format powinien być dobrany odpowiednio do tego, co się znajduje na danej grafice. Jeśli jest dużo kolorów (zdjęcia lub kolorowe grafiki z wieloma przejściami typu gradientów, cieni itp.) to użyjmy do tego formatu JPG lub WebP.
Jeśli kolorów jest mało a grafiki są proste (wykresy, infografiki, okładki książek, etykiety, instrukcje itp.) to użyjmy formatu PNG 8 bitowego. Czyli takiego, który ma ograniczenie w ilości posiadanych kolorów do 256. Jeśli źródłowy plik jest wektorowy to zapisujmy go raczej jako wektor w formacie SVG (ale takie pliki raczej nie dodaje się często do sklepu czy bloga).
Waga powinna być jak najmniejsza przy zachowaniu jak najlepszej jakości. Ciężko to inaczej opisać – przy zapisywaniu trzeba po prostu patrzeć na symulowany podgląd efektu zapisu i doprać odpowiedni procent kompresji. Myślę że w Photoshopie używając funkcji „Save for web” można tutaj trzymać się w zakresie 60-80% i wtedy rezultat będzie na dobrym poziomie.
Ciężko powiedzieć ile to powinno wynosić w KB, bo to zależy od rozdzielczości zdjęcia i ilości detali na nim. Ale wynik w granicach 100-350 KB jest OK (przy zdjęciu dość szczegółowym w rozmiarze 1500×100). Dla formatu WebP będzie to oczywiście odpowiednio mniej.

PS – Bardzo dobry program, jednak czy polecacie Państwo mniej kosztowne oprogramowanie do optymalizacji grafiki?

Do samej optymalizacji grafiki nikt chyba nie używa Photoshopa, płacąc za to comiesięczny abonament ?
Jeśli oprócz samego zapisu i zmiany rozdzielczości obrabiamy lekko fotografie – to polecam program Affinity Photo. Nie kosztuje dużo, a licencję ma się dożywotnio. Funkcjonalnością goni Photoshopa a nie trzeba płacić co miesiąc.
Dobrą alternatywą mającą podobne funkcje jest przeglądarkowa Photopea.com. Jeśli chodzi o darmowe programy to jest tego pełno na rynku i ciężko mi coś polecić bo nie jestem aktualnie na czasie. Sam zapis pliku nie jest jednak niczym wielkim i cała masa programów potrafiła to już 20 lat temu.
Sam kiedyś korzystałem z darmowego Irfan View aby „przetwarzać wsadowo” dużą ilość zdjęć z wakacji (dało się określić co ma robić ze zdjęciami – zmniejszać, odpowiednio kompresować i zapisywać jako JPG o podanym przez nas schemacie nazewnictwa a po doinstalowaniu odpowiedniej wtyczki także jako WebP).
Trzeba tylko zwrócić uwagę czy takie oprogramowanie wg licencji można używać komercyjnie – czyli na potrzeby firmy. Irfan View jest darmowy na własny użytek, jednak cena jednorazowej licencji nie powinna być wysoka. Są jednak też inne rozwiązania całkowicie darmowe.

Jak w programie Paint 3D zmienić rozmiar?

Nie wiem czy chodzi o rozmiar pliku w KB czy rozmiar pliku w pikselach.
Jeśli to drugie to proszę wybrać na górnym pasku opcję „Kanwa” i tam wpisać inna wielkość w pikselach (po prawej stronie – szerokość i wysokość).
Z tego co widzę to program Paint bardzo się rozwinął i nie jest taki zły, ale szczerze polecam jednak wykorzystać inne rozwiązanie, z jednego prostego powodu…
Po moim 10 sekundowym teście (nigdy wcześniej nie korzystałem z tego programu) wychodzi na to, że nie da się tam ustawić stopnia kompresji. Program sam decyduje za nas jak bardzo ma być skompresowana grafika. Nie ma suwaczka ze stopniem kompresji i podglądu na żywo ile zajmie zapisana grafika. Nie znaczy to, że pliki nie są kompresowane (bo są) – ale nie wiemy czy nie da się tego zrobić lepiej.
Jednak na własne potrzeby program wygląda na dość intuicyjny i ma o wiele większe możliwości w porównaniu do starego Painta (dziękuję za to pytanie – dzięki niemu sam czegoś nowego się dowiedziałem).

Czy do tworzenia grafiki na stronę internetową można używać Canva ?

Canva jest super rozwiązaniem do tworzenia ciekawych grafik dla osób, które nie mają za wiele do czynienia z profesjonalnymi aplikacjami graficznymi lub nie mają doświadczenia w tworzeniu przemyślanych kompozycji.
Ja traktuje ją bardziej jako sprytny edytor do szybkiego tworzenia ładnych grafik niż jako uniwersalny program graficzny, w którym da się zrobić wszystko. Ma swoje ograniczenia ale ma też wiele plusów jak np. główny atut – gotowe szablony do przerabiania.
Nie jestem jednak ekspertem w tym temacie i nie wiem nawet jakie formy eksportu plików ma. Wiem tylko, że darmowa wersja ma pewne. Nie jest to też program graficzny w stylu Photoshopa czy Affinity Photo. Bardziej coś na styl kreatora stron WWW. Daje duże możliwości ale w pewnym momencie okaże się, że nie zrobimy w nim wszystkiego co chcemy. Do podstawowych działań (szczególnie jako tworzenia ładnych grafik na Social Media) jest bardzo dobrym rozwiązaniem.

Czy korzystanie z tinypng/jpg też jest dobrą opcją? Zamiast np. omawianego compressordie?

To już indywidualny wybór każdego użytkownika. Trzeba przetestować takie narzędzia na własnych plikach i dostosować też własne parametry (jeśli akurat narzędzie na to pozwala – z tego co pamiętam to tinyPNG nie miał chyba wielu parametrów). Dla jednej osoby ważny będzie rozmiar pliku wygenerowanego, dla innej szczegóły dla zdjęciu. Trzeba na jednym i tym samym zdjęciu przetestować każdy serwis i zdecydować się na najwygodniejszy i dający najlepsze rezultaty.
Wiele z tych serwisów oferuje także dostęp do API dającego dużo większe możliwości i wygodę jeśli odpowiednio się to oprogramuje. TinyPNG stosowaliśmy kiedyś w zespole Kreacji właśnie do optymalizacji 24 bitowych plików PNG z przeźroczystością.
Używaliśmy też inne narzędzia jak kraken.io ale raczej do optymalizacji PNG z przeźroczystościami (tam najlepsze wyniki dawało w porównaniu do rozmiarów przy zapisie w Photoshopie). Darmowych serwisów tego typu jest bardzo wiele i wciąż powstają kolejne.
Ja ostatnio polecam compress-or-die.com ponieważ doceniam wkład autora w opracowanie tego rozwiązania i chęć dzielenia się wiedzą aby zrozumieć wszelkie zależności. Do tego obsługuje generowanie WebP oraz daje bardzo dużo możliwości modyfikacji parametrów w trybie ekspert.

Jaką rozdzielczość powinno mieć zdjęcie które wyświetlamy jako tło na całej stronie? Czy zdjęcie o szerokości 1500px w takim przypadku będzie dobrze wyglądać na monitorze 4k?

Zawsze należy pamiętać o tym, że nie tworzymy strony dla jednostek tylko dla ogółu. Gdyby tak nie było, to nadal byśmy dostosowywali strony do przeglądarki Internet Explorer bo są użytkownicy, którzy wchodzą na strony jeszcze z tak archaicznych rozwiązań.
W przypadku ekranów 4K to ciężko powiedzieć jaki udział mają one w statystykach odwiedzin bo prawdopodobnie i tak wyświetlą się jako 1920×1080 w statystykach strony (związane to jest z zagęszczeniem pikseli na takiej matrycy i przeskalowaniu obrazu dla komfortu użytkownika). Duże monitory o rozdzielczości 2560×1440 stanowią udział około 1% odwiedzin. Możliwe, że monitory 4K to drugie 1%. Czy dla tych 2% użytkowników warto wstawiać większe zdjęcia w tle? Moim zdaniem nie warto.
Jeśli ja bym robił zdjęcie w tle to ustawiłbym 1920px na szerokość i w zależności od tego jaki efekt chcemy uzyskać, opisał to w CSSie tak, aby się albo rozciągało dostosowując albo przycinało po bokach w zależności od upodobania. Monitor 4K nawet jeśli lekko rozmyje zdjęcie w tle, to i tak nie jest to najważniejszy element na stronie WWW i można przymknąć na to oko.
Z drugiej strony człowiek często nie wie, że coś może wyglądać lepiej, jeśli nie dostanie drugiego obrazka do porównania.

Jaka powinna być wielkość slidera na stronie internetowej aby na każdym urządzeniu otwierało się na całym ekranie?

Nie wiem do końca czy dobrze interpretuje słowo slider – jako element w nagłówku strony przeznaczony do rotacyjnej zmiany treści. Jeśli tak – to już bardziej kwestia jak zaprojektowana jest strona w kodzie HTML i opisanie jej wyglądu stylami CSS.
Ciężko udzielić tutaj odpowiedzi nie widząc konkretnego rozwiązania na żywo. Czy slider mieści się od lewej do prawej w pełnej szerokości strony czy zamknięty jest w tzw. kontenerze. Strony internetowe projektowane są tak, aby zamieszczone na nich elementy (np. teksty czy zdjęcia) nie przekraczały jakiejś szerokości – np. 1200px (szerokość kontenera) i odpowiednio mniej na mniejszych urządzeniach (RWD). Jeśli strona dobrze zaprojektowana jest w stylach CSS to obrazek szerokości największej szerokości w trybie responsywnym może wystarczyć w zupełności. Ewentualnie 2x większy i odpowiednio ustawione style CSS dla ekranów typu Retina, gdzie mimo wyświetlania rozdzielczości 1200px obraz wrzucony w tej wielkości może być lekko niewyraźny (w porównaniu do np. tekstów czy wektorowych ikon).

Czy to błąd, jeśli zmniejszam zdjęcia w zwyczajnym Infrant View?

Nie, to nie błąd. Dobrą praktyką jest każda optymalizacja – czyli zmniejszanie zdjęcia do odpowiedniego formatu i kompresja w stosunku do oryginału – niezależnie jakim programem to zrobimy.
Dawno nie testowałem tego rozwiązania ale myślę, że nie da on gorszych rezultatów niż standardowe opcje zapisu i zmniejszania zdjęcia w programie Photoshop. Z tego co pamiętam to da się do niego dodawać różne rozszerzenia – może jest jakieś, które bardziej optymalizuje zapis. Są też chyba takie, które potrafią zapisać jako format WebP.

Czy waga zdjęć ma znaczenie? Czy lepiej zapisać jako 300 dpi czy 96 dpi?

Waga zdjęcia w KB ma znacznie ale…
Na to pytanie można by najprościej odpowiedzieć, że przy zachowaniu tego samego rozmiaru w pikselach – rozdzielczość w DPI nie ma żadnego znaczenia dla wielkości pliku wyrażonego w KB (ile miejsca zajmuje na dysku czy serwerze). Jeśli mamy plik 1500×1000 px  w 72 dpi, 96, 144 czy 300 lub 600 DPI czy 1 DPI – zawsze będzie to plik mający tyle samo megapikseli a co za tym idzie przy zapisie koduje tyle samo bitów.
W internecie DPI nie ma znaczenia. Każde dalsze rozwinięcie tego tematu wprowadziłoby tylko niepotrzebne zamieszanie. DPI przy projektowaniu do druku ma znaczenie i to duże.

Jaki program do optymalizacji zdjęć w WordPressie byście polecili?

Osobiście (jako graficy) nie mamy aż tak dużego doświadczenia z wtyczkami do WordPressa ale wiem, że takie występują i spokojnie potrafią automatycznie przekonwertować np. wszystkie grafiki zamieszczone w CMSie na format WebP oraz zadbać o optymalizację pod SEO.
Jednak jak z każdą wtyczką do WordPressa, pamiętajmy o zrobieniu odpowiedniego backupu przed testami aby przypadkiem nie wyrządziła jakichś problemów w trakcie optymalizacji serwisu.

W jakim programie najlepiej zrobić kompresję masową zdjęć?

Można to zrobić oczywiście w Photoshopie lub Lightroomie, ale jeśli ktoś nie ma tego programu, to dostępnych na rynku jest sporo rozwiązań (również tych darmowych).
Szukać trzeba w języku polskim hasła „przetwarzanie wsadowe zdjęć”. Na własny użytek (nie w celach komercyjnych) można skorzystać z programu Irfan View. Ma on rozbudowany moduł przetwarzania wsadowego.
Jest to dobrze opisane np. tutaj https://narzedziafreelancera.pl/irfanview-przydatne-funkcje/ . Innymi programami (z licencją na bezpłatne wykorzystywanie niekomercyjne) posiadającymi wyżej wymienione możliwości są XnView lub FastStone Image Viewer. Jeśli ktoś chce całkowicie darmowe rozwiązanie w połączeniu z edytorem grafiki, to można skorzystać z Gimpa i jego wtyczki BIMP. Zalecam to rozwiązanie jednak tylko osobom, które albo korzystają już z Gimpa, albo nie zrażają się dość archaicznym procesem instalacji i obsługi. Plusem jest to, że najnowsza wersja wtyczki potrafi generować pliki w formacie WebP.
Są również aplikacje przeglądarkowe, (stworzone typowo na kompresji zdjęć do sieci) które mają możliwość przetwarzania wielu zdjęć na raz. Są to np. https://bulkresizephotos.com/pl , https://www.iloveimg.com/compress-image , https://convertio.co/pl/jpg-webp/ , https://imagecompressor.com/ ,

Podpowiecie coś o różnych wielkościach dedykowanych do różnych urządzeń czyli właśnie css i zapisywaniu/eksportowaniu plików w różnych wielkościach @2 @4

Jest to wskazane przy projektowaniu serwisów. Odpowiednio zaprojektowana strona HTML i opisanie tego w stylach CSS, pozwoli serwować grafiki dla różnych urządzeń w zależności od tego jakiego typu sprzętem i matrycą dysponuje użytkownik.
Coraz częściej spotyka się ekrany np. telefonów, które fizyczną rozdzielczość ekranu mają 3-4 krotnie większa od tego co wyświetla telefon (jeśli takie przeskalowanie nie miałoby miejsca to strona ładowała by się w telefonie jak na komputerze, wyświetlając teksty tak małe, że byłyby niemożliwe do przeczytania).
Tego typu eksport ma większość aplikacji do projektowania stron typu Figma, Sketch, Adobe XD ale również i Photoshop czy Phtotopea.com. Stosuje się to głównie do elementów stron, które umieszczane są w momencie powstawania serwisu (elementy GUI itp.). Jednak nie stoi nic naprzeciwko aby w ten sposób generowały i wyświetlały się każde grafiki zamieszane w serwisie. Trzeba jednak poszukać samemu odpowiednich rozwiązań dostosowując do swoich potrzeb i umiejętności w kodowaniu.

Mechanizm „lazy load” – czyli doczytywanie grafik na żądanie – czy eSklepy home.pl mają taką funkcję?

Mechanizm “lazy load” nie jest standardem w eSklepie, natomiast istnieje możliwość umieszczenia parametru w kodzie html. 

Czy zdjęcia które są dodawane do sklepu home są optymalizowane do pożądanej wielkości? 

Zdjęcia są optymalizowane pod względem wielkości pliku, ale nie jego rozdzielczości. 

Na marketplacach też nazwa zdjęcia też ma znaczenie? 

To jest już zależne od danego marketpalce. Dodanie takiego tekstu zapewne nie zaszkodzi, jednak czy wpływa to na wyniki wyszukiwania, trzeba już zagłębić się w algorytm danego rozwiązania i weryfikować temat po stronie danego marketplace.  

Jestem użytkownikiem aplikacji sklepowej eSKLEP z home.pl Dlaczego pomimo tego, że nazywam wszystkie moje zdjęcia produktów odpowiednio nazwa-produktu-mojego-przod.jpgna aplikacja zmienia nazewnictwo wszystkich zdjęć na np:n/fdbc2809419ce3cacd2d1942b999d1b4faefd3.jpgnJak rozwiązać ten problem? 

Zdjęcia produktowe w momencie wprowadzenia ich na eSklep ulegają konwersji co powoduje zapisane ich w bazie sklepu wg odpowiedniego klucza. Nie ma możliwości dokonania zmiany w tym zakresie.  

Czy zmiana rozdzielczości zdjęć i poprawienie ich opisów może negatywnie wpłynąć na „wypracowaną” pozycję w google

To zależy, jeżeli zoptymalizujemy zdjęcia i spowoduje to szybsze wczytywanie się witryny, to będzie to korzystna zmiana. W przypadku zmiany opisów zdjęć również zależy, co było wcześniej i na co zmieniamy. Jeśli była np. nazwa numeryczna, a teraz wprowadzimy słowo kluczowe – zmiana, będzie pozytywna, jeśli zastąpimy słowo kluczowe, które miało dla nas znaczenie na inne, może to w pewnym stopniu wpłynąć na pozycję witryny. 

Jaki jest najlepszy rozmiar (szerokość) i waga obrazka dla Googla pod kątem SEO? 

Podczas dodawania zdjęć do witryny duże znaczenie ma ich rozmiar, jak również waga zdjęcia — ile zajmują miejsca na dysku/serwerze. Ważny jest odpowiedni balans pomiędzy jakością a rozmiarem. Do optymalizacji zdjęć można wykorzystać rozwiązanie https://tinypng.com/, dzięki któremu w łatwy sposób skompresujemy plik.  Jeśli chodzi o wagę zdjęcia, to im mniejsza, tym lepsza, ale na pewno nie powinna przekraczać 200 kb. 

Warto zapoznać się również z artykułem https://blog.home.pl/2019/08/jak-zoptymalizowac-grafiki-na-stronie-www/  

Czy warto w nazwie plików graficznych wpisywać dużo słów kluczowych powiązanych z danym produktem? Czy to sprawi, że dane zdjęcie będzie wyżej pozycjonowane na zapytanie użytkownika? 

Opis alternatywny obrazka ALT powinien być w miarę krótki, zwierać słowo kluczowe, ale nie powinien składać się z wrzuconych słów po przecinku. Opis zdjęcia powinien zawierać wystarczającą ilość informacji dla robotów Google oraz dla osób, które nie widzą obrazów, aby mogły zrozumieć, co obraz przedstawia. Przy tym powinien wyglądać naturalnie i być dostosowany do tematyki zgodnej z podstroną, na której się znajduje. Wskazane jest, aby tekst alternatywny nie był dłuższy niż 125 znaków. 

Warto zapoznać się również z artykułem https://blog.home.pl/2019/08/jak-zoptymalizowac-grafiki-na-stronie-www/ 

Szerzej o całej optymalizacji pod SEO można poczytać w ebooku https://blog.home.pl/seo-ebook/  

Zapraszamy do udziału w kolejnych webinarach home.pl