Wprowadzenie
Obrazy często stanowią największą część stron internetowych i mają własną zakładkę w wynikach Google. Są one kluczową częścią kompletnej strategii SEO, więc ich optymalizacja jest niezbędna dla lepszej widoczności.
Jak wyszukiwarki indeksują i rozumieją obrazy
Wyszukiwarki indeksują strony internetowe, aby znaleźć obrazy i wyodrębnić dane, takie jak metadane i nazwy plików. Google wykorzystuje czynniki takie jak otaczający tekst, nazwa pliku obrazu, tekst alternatywny, podpisy i zawartość strony, aby zrozumieć kontekst i treść obrazów.
Czym jest pozycjonowanie obrazów?
Optymalizacja obrazów obejmuje techniki zwiększania widoczności na stronach wyników wyszukiwania (SERP) poprzez kompresję obrazów, korzystanie z obrazów responsywnych, wdrażanie leniwego ładowania, dodawanie odpowiedniego tekstu alternatywnego, używanie opisowych nazw plików i wdrażanie danych strukturalnych.
1. Wybierz odpowiedni format obrazu
Google obsługuje formaty takie jak JPEG, PNG, WebP, BMP, GIF i SVG. Każdy format ma swoje wady i zalety:
-
PNG: Bezstratna kompresja, lepsza jakość, obsługa przezroczystości, większy rozmiar pliku.
-
JPEG: kompresja stratna, regulowana jakość, mniejszy rozmiar pliku.
-
WebP: Wydajne, mniejsze rozmiary plików, obsługiwane przez wszystkie główne przeglądarki.
-
GIF: Bezstratny, ograniczony do 256 kolorów, odpowiedni do prostych grafik i animacji.
-
SVG: oparty na wektorach, skalowalny, idealny do logo i ikon.
-
BMP: Duże, nieskompresowane, wysokiej jakości, nieodpowiednie dla stron internetowych ze względu na rozmiar.
Zalecenie: Użyj PNG i przekonwertuj na WebP do wdrożenia w sieci, aby uzyskać optymalną jakość i czas ładowania.
2. Tworzenie unikalnych obrazów
Unikaj ogólnych zdjęć stockowych. Używaj oryginalnych, wysokiej jakości obrazów, aby poprawić wrażenia użytkownika i SEO. Google zaleca, aby obrazy miały co najmniej 1200 pikseli szerokości i używały ustawienia max-image-preview:large
w metatagu robots, aby zapewnić, że będą wyświetlane jako duże obrazy w Google Discover.
<meta name='robots' content='index, follow, max-image-preview:large' />
3. Optymalizacja nazw plików graficznych
Używaj opisowych, bogatych w słowa kluczowe nazw plików, aby pomóc wyszukiwarkom zrozumieć temat obrazu. Unikaj domyślnych nazw, takich jak "IMG_722019".
4. Tekst alternatywny przyjazny dla SEO
Znaczniki Alt opisują zawartość obrazu i poprawiają jego dostępność. Pomagają również wyszukiwarkom zrozumieć kontekst obrazu, pomagając w lepszych rankingach.
Przykład:
<img src="chocolate-1.jpg" alt="baton o smaku kawy z ciemnej czekolady"/>
5. Optymalizacja tytułu i opisu strony
Uwzględnij odpowiednie słowa kluczowe w tytule i opisie strony, aby poprawić ranking wyszukiwania obrazów. Upewnij się, że wszystkie czynniki SEO na stronie są zoptymalizowane.
6. Zdefiniuj swoje wymiary
Uwzględnij atrybuty szerokości i wysokości dla każdego obrazu, aby zapobiec problemom związanym z Cumulative Layout Shift (CLS) i poprawić wyniki Core Web Vitals.
7. Uczyń swoje obrazy przyjaznymi dla urządzeń mobilnych
Użyj atrybutów srcset
i sizes
dla responsywnych obrazów, które skalują się zgodnie z urządzeniem użytkownika.
Przykład:
<picture> <source type="image/webp" srcset="image-300w.webp 300w, image-600w.webp 600w, image-1200w.webp 1200w" sizes="(max-width: 600px) 300px, (max-width: 900px) 600px, 1200px"> <img src="image-300w.jpg" srcset="image-300w.jpg 300w, image-600w.jpg 600w, image-1200w.jpg 1200w" sizes="(max-width: 600px) 300px, (max-width: 900px) 600px, 1200px" alt="Opis obrazu"> </obrazek>
8. Leniwe ładowanie i wstępne ładowanie
Użyj leniwego ładowania dla obrazów nie znajdujących się w rzutni, aby poprawić wydajność strony. Użyj preload lub fetchpriority="high"
dla obrazów powyżej zakładki.
Przykład:
<img src="image.jpg" loading="lazy" srcset="image-300w.jpg 300w, image-600w.jpg 600w" alt="Description">.
9. Dodawanie obrazów do mapy witryny
Uwzględnienie obrazów w mapie witryny zwiększa szanse na ich indeksowanie przez wyszukiwarki. Użyj wtyczek takich jak Yoast lub RankMath dla WordPress lub narzędzi takich jak Screaming Frog.
10. Dodaj dane strukturalne
Wzbogać obrazy o dane strukturalne, aby poprawić widoczność w wynikach wyszukiwania. Użyj znaczników schematu, aby uwzględnić szczegóły, takie jak cena, dostępność i oceny.
Przykład:
{ "@context": "http://schema.org", "@type": "Article", "headline": "Article Title", "image": ["https://example.com/photos/1x1/image.jpg", "https://example.com/photos/4x3/image.jpg", "https://example.com/photos/16x9/image.jpg" ], "datePublished": "2024-01-10T08:00:00+08:00", "dateModified": "2024-01-10T09:20:00+08:00", "author": { "@type": "Person", "name": "Author Name", } }
11. Użyj CDN do szybszego dostarczania obrazów
Sieć dostarczania treści (CDN) może optymalizować i dostarczać obrazy szybciej, serwując je z lokalizacji bliższych użytkownikowi. Rozważ skorzystanie z usług takich jak Cloudflare, Amazon CloudFront, ImageKit lub KeyCDN.
12. Uważaj na prawa autorskie
Upewnij się, że masz prawo do korzystania z obrazów, aby uniknąć kosztownych procesów sądowych. Używaj licencjonowanych obrazów od dostawców takich jak Getty, Shutterstock lub DepositFiles.
Kluczowe wnioski z optymalizacji obrazu
-
Wybierz odpowiedni format i rozmiar pliku, aby przyspieszyć ładowanie.
-
Upewnij się, że elementy SEO na stronie są zoptymalizowane.
-
Utwórz mapę witryny z obrazami dla lepszej indeksowalności.
Postępując zgodnie z tymi wskazówkami, możesz poprawić SEO obrazu swojej witryny i ogólną widoczność w wyszukiwarce. Udanej optymalizacji!