Image Source Extractor

· Free browser tool

An image source extractor reads pasted page HTML and pulls out every image it references, returning each src, the first URL from any srcset, the alt text, and the declared width and height in one table. It is the fastest way to audit a template or competitor page for missing alt attributes, undersized media references, and stray background images without opening the browser inspector element by element.

This tool is free and runs entirely in your browser. The HTML you paste is parsed locally with the browser’s own DOM parser, no markup is ever uploaded to a server, and the results include a one-click Copy URLs button and a CSV export for handing the list to a developer or a spreadsheet.

Image Source ExtractorFree · client-side

How to use the image source extractor

Paste the HTML of a page or template, click Extract, and the tool lists every image with its source, file type, alt text, and dimensions, flagging any image that is missing an alt attribute.

Audit every image source and srcset in one pass

Copy the HTML from your page source or a saved file and paste it into the box. The tool runs the browser’s DOMParser over the markup and collects every <img> element, reading its src first and falling back to common lazy-load attributes and the first candidate URL inside a srcset when no plain src exists. Each row shows the resolved source, the file extension, and the width and height attributes if they were declared, so you can spot responsive images that ship a single fixed source or references that point at the wrong path before they reach production.

Catch images that are missing alt text

Alt text is both an accessibility requirement and an image-SEO signal, yet it is the attribute most often forgotten in bulk templates and migrated content. The extractor flags two distinct cases: an image with no alt attribute at all, and an image carrying an empty alt that may or may not be intentionally decorative. The summary counts how many images need attention, and the table marks each row, so a content editor can fix the gaps in one sweep rather than discovering them later in an accessibility audit or a Lighthouse report.

Export the list and skip the background images you do not need

Once the table is built, Copy URLs places every source on the clipboard as a clean newline-separated list, and Export CSV downloads a spreadsheet with the source, type, alt text, alt-missing flag, and dimensions for documentation or a developer hand-off. CSS background-image URLs are detected separately from inline styles and <style> blocks and can be toggled off when you only care about real content images. Inline data-URI backgrounds are skipped so the list stays focused on fetchable, auditable image files.

Image source extractor frequently asked questions

Q1What does the image source extractor pull from the HTML?

It collects every image the markup references: the src of each img element, the first URL from a srcset when no plain src exists, common lazy-load attributes like data-src, and optionally CSS background-image URLs from inline styles and style blocks. For each one it reports the file type, the alt text, the declared width and height, and whether the alt attribute is missing.

Q2Does this tool download or scan live image URLs?

No. The tool only analyses the HTML you paste; it never fetches the images themselves or makes any network request. That means it reads the width and height you declared in the markup, not the true pixel size of the file. To compare declared dimensions against actual file size you would open the image directly in a browser tab.

Q3How does it handle responsive images and srcset?

When an image element has a srcset but no src, the extractor takes the first candidate URL listed and strips its width or density descriptor, then marks the row as coming from srcset. It does not expand every candidate in the set, because the goal is a clean one-row-per-image audit. The full srcset remains in your original HTML if you need every variant.

Q4Is the HTML I paste kept private?

Yes. Parsing happens entirely in your browser using the native DOM parser, and nothing you paste is uploaded, logged, or stored anywhere. The tool keeps working after the page has loaded even with no connection, which makes it safe for staging markup, client work, or any page you have not published yet.

Q5Why are some images flagged with an empty alt instead of missing?

An image with no alt attribute at all and an image with alt set to an empty string are different things. An empty alt can be a deliberate signal that an image is decorative and should be ignored by screen readers. The tool labels each case separately so you can confirm the empty ones were intentional rather than assuming every blank value is a mistake.

Hristo Bogdanov, Head of SEO at SEO Domains

Hristo Bogdanov

Head of SEO @ SEO Domains · CEO & Co-founder of SEO.bo

Hristo has spent 15+ years building aged-domain acquisition and screening workflows for SEO professionals, brand owners, and domain investors, and builds the free tooling SEO Domains publishes for practitioners.