Jak optymalizować obrazki na stronie WWW? Czyli atrybuty ALT i TITLE

Jak optymalizować obrazki na stronie WWW? Czyli atrybuty ALT i TITLE

Opublikowano 6 miesięcy temu -


Wspominałem już, że w dzisiejszych czasach jedną z kluczowych ról dla dobrego pozycjonowania naszej strony w sieci odgrywa content. Specjalnie użyłem angielskiego słowa, ponieważ jego polski odpowiedni – ‘treści’ nie w pełni obrazuje jego znaczenie. No właśnie, obrazuje! Taką to, zabawną grą słów chcę zwrócić uwagę na znaczenie obrazków w naszych postach.

Kiedy mowa o on-page SEO, obrazów albo się nie wspomina, albo napomina o nich gdzieś pod koniec. Jednakże lekceważące podejście do obrazów na stronie jest zwyczajnie nieodpowiedzialne. Odpowiednio zoptymalizowane są w stanie nie tylko poprawić SEO strony, ale również przyciągnąć większy ruch.

Roboty Google oczu nie mają – nie widzą jakie zdjęcie czy rysunek umieściliśmy na blogu. Sami musimy je o tym poinformować. Odpowiednio opisane, czyli po prostu dobrze zoptymalizowane obrazy zostaną zaindeksowane przez Google i przyczynią się do wyższego pozycjonowania naszego serwisu. Dodatkowym atutem jest to, że użytkownik odwiedzający naszą stronę zamiast zostać zaatakowanym przez odstraszającą ścianę tekstu, zostanie zachęcony interesującym postem poprzelatanym ciekawymi dodatkami wizualnymi, jak grafiki, zdjęcia i infografiki.

Atrybut ALT

Alt jest skrótem od alternative. Jeśli z jakiegoś powodu obrazek nie jest wyświetlany na stronie (np. z powodu wolnego łącza), na jego miejscu pojawia się właśnie tekst alternatywny. Roboty zawsze odczytują atrybut ALT i na jego podstawie analizują obraz. Co więcej, to właśnie ten tekst jest odczytywany przez programy używane przez osoby z dużą wadą wzroku bądź niewidome – warto więc się starać aby alternatywny opis obrazka miał sens. Najczęściej będzie on podobny do jego tytułu, który stworzymy na bazie słowa kluczowego zastosowanego w poście. WordPress pozwala na łatwe przydzielanie atrybutów mediom. W języku XHTML podstawowy kod tego atrybutu wygląda następująco:

<img src="adres obrazka" alt="Opis alternatywny" />

Atrybut TITLE

Tytuł obrazka jest tak naprawdę mniej ważny, niż jego opis alternatywny. Jest to informacja, jaka pojawi nam się, kiedy najedziemy kursorem myszy na obrazek na stronie i chwilę go na nim przytrzymamy (oczywiście tekst pojawi się tylko wtedy, jeśli atrybut ten został opisany).

Mamy dwie możliwości – opisać prostymi słowami co jest na obrazku, lub do wymyślenia tytułu zastosować nasze słowo kluczowe z posta. Dajmy na to – zdjęcie stockowe na którym ktoś przegląda fotografie dodaję jako tytułowy obraz tego posta z podpisem optymalizacja-obrazkow-na-potrzeby-strony-www.jpg albo po prostu optymalizacja-obrazkow-www.jpg Wtedy mój obraz ma szansę znaleźć się w wyświetlanej grafice na podane słowa kluczowe, co z kolei zwiększa jego zasięg, a tym samym liczbę odwiedzających stronę.

Skuteczne Techniki On-Page SEO, które zwiększą ruch na Twojej stronie!

Dodatkowa rada: Zwracajcie uwagę na rozmiar waszych obrazów! Im mniejszy, tym lepiej dla strony. Specjaliści SEO jako górną granicę wagi jednego zdjęcia wyznaczają zaledwie 70kb, przy czym dodają, że jeśli bez ubytków na jakości są w stanie zmniejszyć obraz jeszcze bardziej, to robią to. Jest mnóstwo programów i narzędzi pomagających to zrobić. Jednym z przykładów jest Smush, darmowa wtyczka do WordPressa


Autorem artykułu jest Tomasz Celler.