Sprawdzanie rozmiaru obrazów

Za darmo i bez rejestracji: wpisz URL — pobierzemy do 40 obrazów ze strony i dla każdego pokażemy wagę pliku, prawdziwy format (z zawartości, nie z rozszerzenia), wymiary w pikselach i rozmiar ustawiony w HTML, lazy-load i alt, a potem podpowiemy, co skompresować, zmniejszyć lub zamienić na WebP/AVIF. Własne pliki sprawdzisz w karcie „Moje pliki” — w przeglądarce, bez wysyłania na serwer.

Rozmiar wyświetlany na ekranie

Serwer nie widzi, w jakim rozmiarze przeglądarka faktycznie rysuje obraz. Otwórz swoją stronę, naciśnij F12 → Console i wklej linię poniżej — dostaniesz tabelę: rozmiar rzeczywisty, wyświetlany i ile razy obraz jest za duży.

console.table([...document.images].filter(i=>i.naturalWidth).map(i=>({src:(i.currentSrc||i.src).split('/').pop().slice(0,60),intrinsic:i.naturalWidth+'×'+i.naturalHeight,rendered:i.clientWidth+'×'+i.clientHeight,dpr:devicePixelRatio,xTooBig:+(i.naturalWidth/Math.max(1,i.clientWidth*devicePixelRatio)).toFixed(1)})).sort((a,b)=>b.xTooBig-a.xTooBig))

Przeciągnij obrazy tutaj lub kliknij, aby wybrać (JPEG, PNG, WebP, AVIF, GIF, SVG). Pliki nie opuszczają przeglądarki.

Najważniejsze fakty

Cena: Za darmo
Rejestracja: Niewymagana
Przetwarzanie: Tryb URL działa na naszym serwerze: strona i do 40 obrazów pobierane przez ochronę SSRF, pliki nie są zapisywane; „Moje pliki” działa tylko w przeglądarce
Dane wejściowe: URL strony (obrazy <img>, do 8 MB na plik) lub własne pliki obrazów
Limity: Tryb URL: 6 sprawdzeń na minutę; dziennie 15 bez konta, 45 z kontem, bez limitu z Pro; „Moje pliki” bez limitu
Wynik: Dla każdego obrazu: format z zawartości, piksele, waga, rozmiar z HTML, srcset, lazy-load, alt i wskazówki; łączna waga i szacowana oszczędność
Ostatnia aktualizacja: 2026-10-13

Alternatywy

Inne narzędzia do tego samego zadania i w czym każde z nich jest dobre:

PageSpeed Insights — Renderuje stronę, a audyty Lighthouse dokładnie liczą zbędne bajty obrazów (rozmiar, format, kompresja).
Squoosh — Aplikacja Google do kompresji i konwersji pojedynczego obrazu w przeglądarce z podglądem jakości (WebP, AVIF i inne).

Kiedy wybrać to narzędzie: Gdy potrzebujesz szybkiego zestawienia wszystkich obrazów strony — prawdziwy format, piksele, waga i co jest zbędne — bez rejestracji, albo chcesz sprawdzić pliki przed wgraniem.

Opisy sprawdzono na stronach tych narzędzi w październiku 2026 r.

Sprawdzanie rozmiaru i wagi obrazów na stronie

Obrazy to zwykle najcięższa część strony, a problemem rzadko jest ich liczba — raczej zdjęcie o szerokości 4000 px w bloku na 400 px albo PNG tam, gdzie wystarczyłby WebP. Narzędzie pobiera do 40 obrazów ze strony i dla każdego pokazuje prawdziwy format (z zawartości pliku), wymiary w pikselach, wagę i rozmiar ustawiony w HTML, oznacza lazy-load, srcset i alt oraz wyjaśnia, co poprawić: zmniejszyć, skompresować, zamienić na WebP lub AVIF, zastąpić GIF wideo, dodać width i height. W karcie „Moje pliki” sprawdzisz rozmiar i wagę własnych obrazów w przeglądarce, bez wysyłania.

Waga pliku, piksele i prawdziwy format każdego obrazu

Porównanie z rozmiarem w HTML: znajdziemy obrazy 2× i więcej za duże

Wskazówki: WebP/AVIF, kompresja, srcset, wideo zamiast GIF, width/height, lazy-load

Łączna waga obrazów i szacowana oszczędność

Sprawdzanie własnych plików w przeglądarce bez wysyłania

Za darmo: 15 sprawdzeń stron dziennie bez rejestracji, 45 z kontem

Jak korzystać

Wpisz adres strony lub otwórz kartę „Moje pliki”
Posortuj obrazy według wagi i zacznij od najcięższych
Zmniejsz i skompresuj pliki, potem sprawdź stronę ponownie

FAQ

Nie ma sztywnej normy, ale orientacyjnie: główny obraz pierwszego ekranu do 150–250 KB, obrazy w treści do 100 KB, ikony i logo kilka KB (lepiej SVG). Pliki rastrowe powyżej 200 KB oznaczamy jako ciężkie, a powyżej 500 KB — jako bardzo ciężkie.

Rozmiar na ekranie zależy od CSS, szerokości okna i gęstości pikseli — zna go tylko przeglądarka. Porównujemy plik z atrybutami width/height w HTML, a dla dokładnej odpowiedzi na stronie jest linijka do konsoli DevTools, która pokaże rozmiar rzeczywisty i wyświetlany każdego obrazu na Twoim ekranie.

Squoosh od Google kompresuje i zamienia na WebP/AVIF w przeglądarce; mamy też kompresję i konwerter obrazów. Na WordPressie prościej zainstalować wtyczkę, która sama tworzy WebP i mniejsze kopie do srcset.

Audyt „Dobierz odpowiedni rozmiar obrazów” w PageSpeed Insights dokładnie liczy zbędne bajty, renderując stronę. Nasze narzędzie szybciej daje obraz wszystkich grafik — format, piksele, waga, atrybuty — i sprawdza Twoje pliki przed wgraniem, bez rejestracji.

Trzy „rozmiary” jednego obrazu

Co	Gdzie patrzeć	Po co
Waga pliku (KB, MB)	kolumna „Waga”	Ile pobiera odwiedzający — kluczowe dla szybkości
Wymiary w pikselach	kolumna „Piksele”	Szczegółowość obrazu; zbędne piksele to zbędna waga
Rozmiar na ekranie	width/height w kolumnie „HTML” i fragment do konsoli	Ile pikseli strona naprawdę potrzebuje

Zasada: plik nie powinien być szerszy niż dwukrotność rozmiaru wyświetlania (dla ekranów 2×). Zdjęcie 4000 px w kolumnie 400 px waży dziesiątki razy więcej, niż trzeba.

Jaki format wybrać

WebP — według danych Google jest o 25–34% lżejszy od JPEG przy podobnej jakości; obsługują go wszystkie nowoczesne przeglądarki.
AVIF — często jeszcze lżejszy, ale wolniej się koduje; dobry dla dużych zdjęć.
JPEG — opcja zapasowa dla zdjęć; jakość 75–85 zwykle nie różni się wizualnie od 100.
PNG — do zrzutów ekranu, schematów i przezroczystości; dla zdjęć za ciężki.
SVG — do logo i ikon; przepuść przez optymalizator, jeśli ma więcej niż kilka KB.
Animowany GIF — zastąp wideo MP4 lub WebM z autoplay muted loop playsinline; plik będzie wielokrotnie mniejszy.

Format rozpoznajemy po zawartości pliku: zdarza się, że photo.jpg to naprawdę WebP, bo CDN konwertuje go w locie — to normalne.

srcset: różne pliki dla różnych ekranów

Atrybut srcset z listą szerokości i sizes pozwala telefonowi pobrać mały plik, a dużemu monitorowi — duży:

<img src="photo-800.webp"
     srcset="photo-400.webp 400w, photo-800.webp 800w, photo-1600.webp 1600w"
     sizes="(max-width: 600px) 100vw, 800px"
     width="800" height="533" alt="…" loading="lazy">

Większość CMS tworzy takie kopie automatycznie — sprawdź, czy motyw wyświetla srcset.

Kolejność optymalizacji

Posortuj tabelę według wagi i zacznij od 3–5 najcięższych plików — to zwykle połowa całej wagi.
Zmniejsz za duże obrazy do dwukrotności rozmiaru wyświetlania.
Zamień JPEG i PNG na WebP lub AVIF (konwerter obrazów, kompresja).
Dodaj width i height wszystkim obrazom — to usuwa przesunięcia układu (CLS).
Ustaw loading="lazy" dla obrazów poniżej pierwszego ekranu, ale nie dla głównego obrazu u góry — jemu daj fetchpriority="high".
Sprawdź wynik tutaj i w teście szybkości.