W wielu branżach Google Grafika jest jednym z ważnych źródeł ruchu – szczególnie dotyczy to tych działalności, w których bardzo istotny jest wygląd produktu, np. odzieżowej, obuwniczej, ale też wielu innych. Tak naprawdę bez względu na to, w jakiej branży działasz, warto, aby Twoja strona była zoptymalizowana pod wymagania wyszukiwarki również pod kątem zdjęć, czym zwiększasz szansę na dobrą widoczność w wynikach Google Grafika. Sprawdź, jak pozycjonować tam witrynę i jak dodawać alty w WordPress.
Czym jest tag alt i jak z niego korzystać – ważne zasady
Tag alt nazywany jest również atrybutem alt i opisem alternatywnym, a najwięcej na jego temat mówi ostatnia z nazw. Otóż jeśli z pewnych przyczyn na Twojej stronie nie wyświetli się dodane zdjęcie, to wtedy zamiast niego pojawi się opis, o ile go zdefiniowałeś. To po prostu treść. Dodanie tego elementu jest ważne nie tylko dla robotów Google, ale również dla osób niepełnosprawnych, które korzystają z urządzeń czytających strony WWW. Sprzęty te, kiedy napotykają na obrazek, to odczytują tekst alternatywny.
Co powinien zawierać tag title? Otóż ma to być opis tego, co znajduje się na zdjęciu lub informacja o efekcie, jaki wywoła kliknięcie w grafikę, o ile jest podlinkowana. Zatem, jeśli:
- Na fotce jest dana sukienka, to tag alt może być następujący: Czerwona sukienka wieczorowa Roksana rozmiar M.
- Na grafice jest sukienka, ale kliknięcie zdjęcia spowoduje, że internaucie otworzy się większa wersja obrazu. Wtedy tag title może brzmieć: Zobacz większą wersję zdjęcia czerwona sukienka wieczorowa Roksana rozmiar M.
Oto przykłady źle przygotowanej treści tagu alt:
- sukienka,
- czerwona sukienka,
- długa sukienka.
Dlaczego? Wspomniany tag Czerwona sukienka wieczorowa Roksana rozmiar M opisywał bardzo konkretny produkt, natomiast w Twoim sklepie mogą być setki sukienek, dziesiątki długich i czerwonych. Jak zatem opiszesz je wszystkie unikatowo, aby treść wskazywała na zawartość obrazka? Inne przykłady dobrych altów w sklepie odzieżowym to:
- Czarna sukienka studniówkowa rozmiar L.
- Wiosenna sukienka w kwiaty rozmiar S.
Jeśli chodzi o długość tagu alt, to najlepiej, aby nie miał on więcej niż 125 zzs, gdyż wiele czytników ucina tag po tylu znakach. Ten element wygląda w kodzie HTML następująco:
<img src=” https://rise360.pl/wp-content/uploads/2021/08/Artboard.png” alt=”Alternatywny opis grafiki“>
Inne ważne zasady, których powinieneś przestrzegać, tworząc treść tagu alt:
- Nie upychaj słów kluczowych. Złym pomysłem jest tag, którego treść brzmi następująco: Sukienka czerwona, sukienka Wiola, sukienka wieczorowa, sukienka rozmiar M. Pamiętaj, że to ma być opis, czyli prawidłowa jego wersja to: Sukienka wieczorowa Wiola w rozmiarze M.
- Umieść w nim najważniejsze dla danej strony słowo kluczowe, ale nie rób tego w przypadku każdego zdjęcia, które znajduje się na podstronie. Wystarczy, jeśli opis taki zamieścisz pod jednym zdjęciem. Na pewno warto użyć tagu alt ze słowem kluczowym w przypadku ikony danego wpisu, zdjęcia przedstawiającego dany produkt. Nie używaj altów dla elementów graficznych strony WWW, które nie przekazują żadnych informacji, np. części szablonu.
- Nie korzystaj ze zbędnych słów – nie musisz dodawać np. na tym zdjęciu znajduje się czy ta fotka zawiera. Pisz konkretnie, od razu przechodź do sedna – masz po prostu opisać, co widać na obrazku.
- Pisz naturalnie, nie łącz słów, które znajdują się w tagu alt. Np. użycie treści Sukienka-wieczorowa-w-rozmiarze-M nie ma żadnego uzasadnienia. Identycznie w przypadku Sukienka_wieczorowa_Wiola _w_rozmiarze_M.
Jak dodać tag alt w systemie WordPress?
Brak tagów alt dla plików, które już dodałeś na swoją stronę, jest problemem, który możesz szybko rozwiązać, o ile plików nie jest bardzo dużo. W przypadku gdy jest ich sporo, czeka Cię wiele pracy, ale warto ją podjąć. Najlepiej dodawać tagi alt systematycznie za każdym razem, kiedy umieszczasz plik graficzny na serwerze.
Jak dodać tag alt dla istniejącego zdjęcia w systemie WordPress?
Po zalogowaniu się do panelu administracyjnego Twojej strony kliknij Media, a następnie Biblioteka.
Wtedy wyświetlą Ci się zdjęcia, które są już dodane do bazy serwisu. Żeby uzupełnić tag alt dla danej grafiki, kliknij przy niej Edytuj.
Pojawi się możliwość dodania tekstu alternatywnego.
Po wprowadzeniu treści kliknij Zaktualizuj.
Jak dodać zdjęcie z tagiem alt w systemie WordPress?
W tym przypadku ścieżka się nieco różni, ale zadanie to nie powinno Ci sprawić większych trudności. Po zalogowaniu się do panelu administracyjnego w systemie WordPress kliknij Media, a następnie Dodaj nowe.
Dalej wybierz plik, który chcesz dodać. Możesz to zrobić, wskazując go na dysku lub metodą przeciągnij i upuść.
Kiedy plik znajdzie się na serwerze, to wtedy pojawi się też możliwości jego edycji. Ten krok wygląda już identycznie jak w poprzednim przypadku. Wystarczy, że wpiszesz tekst alternatywny i wybierzesz Zaktualizuj.
Dodawanie zdjęć i tagu alt może wyglądać nieco inaczej w zależności od tego, z jakiej wersji systemu WordPress korzystasz, natomiast działania te będą bardzo podobne. Jeśli jednak natrafisz na problem, z którym nie będziesz mógł sobie poradzić, to napisz do nas.
Jak pozycjonować stronę w Google Grafika?
Jeśli chcesz, aby zdjęcia z Twojej witryny pojawiały się na wysokich pozycjach w Google Grafika, to powinieneś zoptymalizować je pod kątem wymagań tej wyszukiwarki. Wpływ na widoczność ma co najmniej kilka czynników – jeśli zwrócisz uwagę na wszystkie z nich, to zwiększysz szansę na sukces. Co powinieneś zrobić?
Dodaj tekst alternatywny do zdjęć
Już wiesz, jak wykonać ten krok. Nie pomijaj go – ma on duże znaczenie dla widoczności zdjęć w Google Grafika.
Dodaj title zdjęcia
Obecnie nie ma to większego wpływu na widoczność w Google, natomiast, skoro już umieszczasz tagi alt, to warto, abyś wypełnił również i title. Tytuł będzie widoczny dla internauty wówczas, gdy ustawi on kursor myszy na zdjęciu – wtedy jego treść pojawi się chmurce. Być może w przyszłości ten element będzie mieć znaczenie, a Ty nie będziesz musiał wypełniać title dla wszystkich grafik.
W title zawrzyj opis tego, co znajduje się na zdjęciu, ale nie może to być kopia tagu alt. Kod HTML wzbogacony o ten element wygląda następująco:
<img src=” https://rise360.pl/wp-content/uploads/2021/08/Artboard.png” alt=”Alternatywny opis grafiki“ title=”tytul grafiki”>
Możliwość dodania title dostępna jest również w opcjach edycji zdjęcia w systemie WordPress.
Zoptymalizuj nazwy plików
Prawdopodobnie nie raz spotkałeś się w sieci ze zdjęciami, których nazwy były przypadkowym ciągiem znaków. Jeśli chcesz, aby Twoje grafiki wyświetlały się na wysokich pozycjach w Google, to w nazwie użyj słowa kluczowego. I tak plik może być zapisany następująco:
czerwona-sukienka-wieczorowa-roksana-rozmiar-m.jpg
Pamiętaj o zasadach:
- Słowa w tytule oddzielaj łącznikami, a nie podkreślnikami. Nie używaj spacji, gdyż robot Google może je pominąć i potraktować cały tytuł jako jedno słowo.
- Nie używaj polskich znaków diakrytycznych, takich jak ą, ę czy ż.
Uwaga: jeśli pliki są już na serwerze, to nadal możesz zmienić ich nazwy i to bez konieczności pobierania ich na dysk urządzenia. Wystarczy, że skorzystasz z wtyczki File Media Renamer.
Przejdź do edycji danego pliku graficznego. Tam pojawią się dodatkowe opcje, które umożliwią Ci zmianę nazwy pliku:
Zmniejsz rozmiar plików
Grafika nie powinna negatywnie wpływać na szybkość ładowania się Twojej witryny, dlatego zdecydowanie warto zoptymalizować zdjęcia pod tym kątem. Narzędzie PageSpeed Insights wskaże Ci, które pliki wymagają uwagi. Masz różne możliwości. Możesz zmniejszyć rozmiary plików za pomocą narzędzi dostępnych online, np. https://imageoptim.com/online.
Jeśli korzystasz z systemu WordPress, to możesz zainstalować wtyczkę, która będzie automatycznie zmniejszać i optymalizować rozmiar pliku. Przykładem takiego pluginu jest Smush.
Ile powinien zajmować zoptymalizowany plik graficzny? Najlepiej około 70–100 KB, ale staraj się nie przekraczać 200–300 KB. Jednocześnie pamiętaj, że kluczowa powinna być jakość zdjęcia. Nie zmniejszaj maksymalnie pliku, jeśli ma to oznaczać nieatrakcyjny wygląd fotografii.
Jakie formaty grafiki powinieneś stosować? Najbardziej uniwersalnym jest JPG. Warto również stawiać na formaty graficzne nowej generacji, czyli WebP, JPEG200 lub JPEG XR. Pierwszy z nich jest rozwijany przez Google i coraz częściej zastępuje JPG ze względu m.in. na większą wydajność kompresji i to na nim warto się skupić.
Dodaj mapę plików graficznych
Być może masz już w Google Search Console mapę podstron witryny. Warto również wygenerować ją dla plików graficznych, gdyż zwiększysz dzięki temu szansę na zindeksowanie tych zdjęć przez Google. Jeśli w systemie WordPress korzystasz z jednej z popularnych wtyczek SEO, np. All In One SEO, to wtedy mapa zdjęć wygeneruje się automatycznie po włączeniu tej opcji. Listę wszystkich map znajdziesz pod adresem: https://twoja-strona.pl/sitemap.xml. Wystarczy, że dodasz adres konkretnej w Google Search Console. Po zalogowaniu się do GSC, wybierz opcję Mapy witryn.
Następnie dodaj jej adres:
Jak sprawdzić widoczność zdjęć w Google?
Zoptymalizowałeś zdjęcia i chcesz zobaczyć, jakie przyniosło to efekty? W takim razie zaloguj się do Google Search Console i kliknij Wyniki wyszukiwania.
Wybierz Typ wyszukiwania, dalej Grafika i Zastosuj.
Następnie możesz sprawdzić liczbę kliknięć na dane zapytanie, liczbę wyświetleń, a także średnią pozycję strony na tę frazę w danym okresie.
Zweryfikuj koniecznie poszczególne zdjęcia – być może w niektórych przypadkach nie wszystkie działania optymalizacyjne zostały wykonane, a ich dopełnienie spowoduje, że pozycja witryny na dane zapytanie jeszcze się poprawi.
Masz wątpliwości dotyczące optymalizacji grafiki na stronie? Nie wiesz, jak wykonać poszczególne czynności? Skontaktuj się z nami – pomożemy.
