Wrzuć zdjęcia i grafiki, aby dostać kopie WebP, AVIF i JPG w szerokościach potrzebnych Twoim stronom, z usuniętymi danymi aparatu. Zobacz, o ile mniejszy jest każdy, pobierz je wszystkie jako .zip i wklej kod srcset. Twoje obrazy nigdy nie opuszczają tego urządzenia. Jest darmowe.
Jak zoptymalizować obrazy dla strony internetowej, krok po kroku
- Wybierz obrazy albo upuść je na stronę. Pliki JPG, PNG, WebP, AVIF i GIF działają.
- Zaznacz Szerokości, które chcesz, od 480 do 2560. Obrazy nigdy nie są powiększane ponad oryginał.
- Wybierz Formaty: AVIF, WebP, zapasowy JPG i PNG dla obrazów przezroczystych.
- Ustaw Jakość, atrybut sizes i Folder obrazów na swojej stronie, a potem naciśnij Wykonaj ponownie z tymi ustawieniami, jeśli je zmienisz.
- Porównaj Przed i Po, a potem naciśnij Pobierz wszystko (.zip).
- Skopiuj kod obrazu dla każdego obrazu i wklej go na stronę.
Po co kilka szerokości?
Telefon nie potrzebuje tego samego zdjęcia 2000 pikseli co duży monitor. Z srcset wypisujesz kilka szerokości, a przeglądarka wybiera najmniejszą, która nadal wygląda ostro na danym ekranie. Atrybut sizes mówi jej, jak szeroki będzie obraz, więc może wybrać, zanim strona skończy układ.
AVIF, WebP czy JPG?
AVIF jest zwykle najmniejszy, WebP jest tuż za nim i działa w każdej obecnej przeglądarce, a JPG to bezpieczna opcja zapasowa. Kod picture oferuje je w tej kolejności, więc każda przeglądarka bierze najlepszy format, jaki rozumie. Obrazy z przezroczystością dostają zapasowy PNG zamiast JPG, aby zachować przezroczystość. Jeśli format jest wyszarzony, ta przeglądarka nie potrafi go utworzyć; pozostałe formaty nadal działają.
Co jest usuwane
Każdy obraz jest rysowany i zapisywany od nowa, więc dane aparatu, lokalizacja GPS, historia edycji i wbudowane profile kolorów są pomijane. Zdjęcia zrobione na boku są najpierw obracane do pionu. Jakość około 75 do 82 to dobry kompromis dla zdjęć; grafiki z ostrymi krawędziami mogą wyglądać lepiej odrobinę wyżej.
Dlaczego to ważne
- Mniejsze obrazy sprawiają, że strony ładują się szybciej, zwłaszcza na telefonach.
- Szybsze strony są wygodniejsze w użyciu i zwykle lepiej wypadają w wyszukiwarce.
- Usunięcie danych o lokalizacji chroni prywatność osób i miejsc na Twoich zdjęciach.
- Obrazy o właściwym rozmiarze oszczędzają transfer Tobie i Twoim odwiedzającym.
Kto z tego korzysta
Blogerzy, właściciele sklepów, fotografowie i programiści, którzy chcą obrazów wyglądających ostro i ładujących się szybko. Dla jednego obrazu o określonym rozmiarze pliku użyj kompresji obrazu, a do zmiany typu pliku konwertera obrazów.
Pytania
Jaką jakość wybrać?
Około 75 do 82 to dobry kompromis dla zdjęć. Zwiększ trochę dla grafik z ostrymi krawędziami.
Czy potrzebuję AVIF, jeśli mam WebP?
AVIF jest zwykle mniejszy, a kod obrazu wraca do WebP i JPG dla przeglądarek, które go nie pokażą.
Czy moje obrazy są przesyłane?
Nie. Są przetwarzane w Twojej przeglądarce.