Vyhľadávač Nefunkčných Obrázkov prehľadá každý <img> a CSS background-image na stránke, zistí nefunkčné načítania (404, CORS zlyhania, znečistené canvasy) a zobrazí ich v prehľadnom zozname. Filtrujte podľa nefunkčných/všetkých/CSS pozadí, preskočte na jednotlivé obrázky a zvýraznite ich na stránke, a skopírujte zoznam nefunkčných URL pre rýchle hlásenia chýb.
Nefunkčné obrázky patria medzi najviditeľnejšie chyby na webovej stránke — no napriek tomu ich pri QA prekvapivo ľahko prehliadnete, pretože zlyhávajú ticho. Vyhľadávač Nefunkčných Obrázkov ich zachytí všetky. Po aktivácii nástroj prejde DOM a nájde každý prvok <img> (kontroluje naturalWidth / naturalHeight na zistenie zlyhaného načítania) a každú CSS background-image URL (overí každú novým Image(), aby potvrdil jej načítanie). Výsledky sú kategorizované ako OK / Nefunkčný / Načítava sa a zobrazené vo filtrovateľnom zozname so štatistikami na vrchu. Každý záznam zobrazuje URL, typ (img alebo CSS pozadie), rozmery, ak sa načítal, a alt text, ak je prítomný. Nefunkčné obrázky sú zvýraznené červenou farbou a majú tlačidlo "Nájsť", ktoré posunie prvok do zorného poľa a okolo neho zabliká červeným obrysom. Tlačidlo "Kopírovať Nefunkčné URL" naraz získa všetky zlyhávajúce URL na skopírovanie do hlásenia chyby. Funguje na akejkoľvek stránke bez potreby prístupu k backend logom — rýchla vizuálna QA kontrola.
Kontroluje každý prvok <img> plus každú URL background-image vo vypočítaných štýloch. Data URI a blob URL sa preskakujú (sú vždy platné).
Prehľadné štatistiky ukazujú stav zdravia obrázkov na stránke. Čísla sa aktualizujú naživo, ako sa vyhodnocujú asynchrónne sondy.
Prepínajte medzi záložkami Nefunkčné, Všetky a CSS Pozadia. Zostaňte sústredení na to, čo treba opraviť.
Kliknite na Nájsť pri akomkoľvek obrázku, aby ste sa posunuli k jeho prvku na stránke a okolo neho zablikal červený zvýrazňovač.
Jedno kliknutie skopíruje zoznam nefunkčných URL obrázkov — vložte do hlásenia chyby alebo zdieľajte s backend tímom.
Obmedzené na 500 skenov CSS pozadí, aby zostalo UI responzívne aj na obsahovo náročných stránkach.
Spustite na staging pred nasadením, aby ste zachytili 404 chyby zavedené refaktoringom, premenovaním súborov alebo migráciou CDN.
Pravidelne prehľadávajte živé stránky — nefunkčné obrázky poškodzujú SEO a dôveru používateľov a často unikajú automatizovaným testom.
Keď editori nahrávajú obrázky, niektoré sa nemusia nikdy dostať na finálnu URL. Prehľadajte, aby ste zachytili mŕtve odkazy.
Ak sa spoliehate na externé obrázkové služby (avatary, priamo prepojené fotografie produktov), prehľadávajte pravidelne, aby ste zachytili výpadky.
Po presunutí prvkov na nové CDN alebo úložisko prehľadajte každú kľúčovú stránku, aby ste overili, že migrácia nič nepokazila.
Kliknite na ikonu Nefunkčné Obrázky v dokovacej lište DevSuite Pro. Otvorí sa panel a automaticky prehľadá stránku.
Štatistiky na vrchu panela zobrazujú Celkom / OK / Nefunkčné / Načítava sa. Ak je Nefunkčné > 0, prepnite na záložku Nefunkčné a pozrite si ich.
Kliknite na Nájsť pri ktoromkoľvek riadku, aby ste posunuli jeho prvok do zorného poľa na stránke — okolo neho na 2 sekundy zabliká červený obrys.
Kliknite na Kopírovať Nefunkčné URL, aby ste získali celý zoznam — vložte do tiketu, chatu alebo backend vyšetrovania.
Po opravách na backende kliknite na Znova Prehľadať Stránku, aby ste overili, že sa všetky obrázky teraz načítajú správne.
Nainštalujte si DevSuite Pro zadarmo a odomknite viac ako 64 vývojárskych nástools pre váš prehliadač.
