HTML Image Link Generator
Wrap an image in a link and get properly formatted HTML, with alt text included because a linked image without it is unusable on a screen reader.
How to use it
- Fill in the fields — the code and the preview update as you type.
- Copy the generated HTML straight into your page.
- The preview renders the real markup, so what you see is what you get.
Examples
| photo.jpg linking to /gallery | <a href><img …></a> |
Wrapping an <img> inside an <a> tag turns the whole image into a clickable link — the pattern behind every logo-links-home, thumbnail-links-to-gallery-item and product-photo-links-to-product-page on the web. This generator produces the tag pair with the alt attribute filled in, because a linked image without alt text is genuinely unusable to anyone using a screen reader: there is nothing for it to announce except “link, image”.
Writing alt text for a linked image, not a decorative one
The rule changes once an image is a link. For a decorative or informational image, alt text describes what is shown. For a linked image, it should describe where the link goes, because that is the information a screen reader user actually needs to decide whether to activate it.
A site logo linking to the homepage should have alt="Home", not alt="Company logo" — a sighted visitor recognises the logo and infers it goes home, and the alt text should give a non-sighted visitor the same functional information rather than a visual description they cannot act on.
Questions people ask
What should the alt text say on a linked image?
Describe where the link goes, not what the picture shows. For a logo linking home, “Home” is more useful to a screen-reader user than “Company logo”.
Is anything uploaded?
No. Everything runs in your browser — no file, image or snippet you use here ever leaves your device.
Last updated 22 August 2026