Optymalizacja Zdjęć
Szybkość i Google Grafika
Google nie ma oczu. Musisz mu "opowiedzieć", co jest na zdjęciu. Dodatkowo, wielkie i nieskompresowane pliki to najczęstszy powód wolnego ładowania strony.
Zdjęcia mogą generować nawet 30% ruchu na Twojej stronie dzięki usłudze Google Grafika (Image Search).
W branżach wizualnych (moda, wnętrza, turystyka) użytkownicy często szukają inspiracji właśnie w zakładce "Grafika". Jeśli Twoje zdjęcia nie są opisane, tracisz ten potencjał.
Drugi aspekt to wydajność. Strona ważąca 10 MB przez nieudolnie dodane zdjęcia będzie ładować się wieki na telefonie. Użytkownik ucieknie, a Google obniży pozycję.
Jak Google "widzi"
obrazki?
Robot Google czyta kod HTML. Kluczowym elementem jest atrybut ALT (tekst alternatywny).
ALT pełni też funkcję dostępności – jest odczytywany przez czytniki ekranu dla osób niewidomych.
ŹLE (Brak lub spam)
alt="IMG_5521"
alt="pies piesek psy karma dla psa tanio"
DOBRZE (Opisowo)
alt="Złoty retriever biegnący po plaży z piłką"
Formaty nowej generacji
Zapomnij o PNG dla zdjęć. Czas na nowoczesne rozwiązania.
JPG / JPEG
Dobry standard dla zdjęć. Oferuje niezłą kompresję stratną, ale powoli odchodzi do lamusa na rzecz nowszych formatów.
Waga: Średnia
PNG
Idealny dla logo, ikon i grafik z przezroczystością. Fatalny dla zdjęć (ogromna waga pliku).
Waga: Bardzo duża
WebP
Format stworzony przez Google. Oferuje jakość JPG przy wadze mniejszej o 30-50%. Obsługiwany przez wszystkie nowoczesne przeglądarki.
Waga: Minimalna
Dieta dla
Twojej strony
Zdjęcie prosto z aparatu waży często 5-10 MB. Wrzucenie go na stronę to "zabójstwo" dla szybkości. Musisz je skompresować.
Celem jest zejście poniżej 200 KB na zdjęcie, zachowując dobrą jakość wizualną.
Grzechy główne
Unikaj tego przy dodawaniu grafik.
Nazwa pliku "DSC_001.jpg"
Nazwa pliku to też czynnik rankingowy. Zmień nazwę na opisową przed wgraniem na serwer, np. czerwone-buty-sportowe.jpg. Używaj myślników, nie spacji.
Skalowanie w HTML
Wgrywanie zdjęcia 4000x3000 pikseli i wyświetlanie go jako małej miniaturki 300x200 pikseli to marnowanie transferu. Przytnij zdjęcie do docelowego rozmiaru.
Brak Lazy Loading
Ładowanie wszystkich zdjęć naraz spowalnia stronę. Używaj "leniwego ładowania" (loading="lazy"), aby zdjęcia wczytywały się dopiero, gdy użytkownik do nich przewinie.
Szybka Grafika,
Potężny Ranking
Zoptymalizowane zdjęcia przyspieszają stronę, ale to linki napędzają ranking. Niech Twoja wizualna praca zyska solidne wsparcie. Wybierz frazy, a my dostarczymy moc.
Rejestracja jest darmowa i zajmuje 60 sekund