ScreenshotNeo

BlogHow-to

How to Add a Hyperlink to an Image

Learn how to link an image in Word, PowerPoint, and HTML, write accessible link text, and troubleshoot disabled link controls.

By the ScreenshotNeo team4 October 20267 min read

To add a hyperlink to an image, select the picture in your editor and use its link command to enter a destination. In HTML, wrap the <img> element in an <a> element whose href is the destination. For a web page, give the linked image descriptive alternative text so people using assistive technology can understand where the link goes.

Choose the method for where you are adding the image

Where the image is What to do What the link can point to
Microsoft Word Select the picture, then use Insert > Link or right-click and choose Link. A web page, file, email address, or location in a document, depending on the version.
Microsoft PowerPoint Select the picture, then choose Insert > Link > Insert Link. A web page, presentation location, file, or email address.
HTML page Put the image inside an anchor element with an href. A URL addressable by a link.
Google Docs, Sheets, or Slides Google’s general help describes adding a link with Insert > Link, but does not document selecting an image as the target. Follow the current editor’s image-specific behavior; do not assume the general instructions confirm it.
  1. Select the picture you want people to activate.
  2. Choose Insert > Link. Depending on the Word version, you can also right-click the picture and choose Link.
  3. Enter the destination in the Address box. This can be a website address or another supported destination, such as a file or location in the document.
  4. Optionally set ScreenTip text if you want a descriptive hint to appear when someone points to the link.
  5. Confirm the link, then test it in the document.

Microsoft’s instructions say to select the text or picture that should function as the hyperlink. Menu names can vary between Word releases and platforms. Microsoft Support: Add or remove a hyperlink in Word.

  1. Select the picture on the slide.
  2. Choose Insert > Link > Insert Link.
  3. Enter the address for a web page, or choose another supported destination such as a location in the presentation, a file, or an email address.
  4. Select OK to apply the link.
  5. Test the link in slide show or presentation mode. Editing mode may select the image instead of following its link.

PowerPoint supports linking text, shapes, and pictures. The exact menu presentation varies across desktop and mobile versions. Microsoft Support: Add a hyperlink to a slide.

The anchor provides the destination; the image is the clickable content. This complete example can be saved as an HTML file and opened in a browser:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Linked image example</title>
</head>
<body>
  <a href="https://example.com/gallery/">
    <img src="photo.jpg" alt="Visit Example's photo gallery">
  </a>
</body>
</html>

Replace the href with the destination and src with the image path or URL. If the image is decorative and the link’s purpose is already provided by other text inside the anchor, use an empty alt attribute (alt="") so the image itself is not announced as redundant. For a linked image with no other link text, use concise alternative text that explains the destination or action. MDN: The anchor element and MDN: The image element.

Open the destination in a new tab only when needed

By default, links open in the current browsing context. If there is a clear reason to open a new tab, add target="_blank" and rel="noopener":

<a href="https://example.com/gallery/" target="_blank" rel="noopener">
  <img src="photo.jpg" alt="Visit Example's photo gallery (opens in a new tab)">
</a>

Tell users in the link’s accessible name when it opens a new tab. Avoid adding a new-tab target just because the link contains an image.

What about Google Docs, Sheets, and Slides?

Google’s general instructions for Docs, Sheets, and Slides say to click where the link should go or highlight text, choose Insert > Link, enter a URL or email address, and apply it. Those instructions do not specifically establish how to select an image as a hyperlink target. If the image-link command is unavailable, check the current editor’s help for that app and platform rather than relying on a workaround that may not apply. Google Docs Editors Help: Add or edit a link.

  • Describe the destination or action. Use alt text such as “View the product specifications” rather than “image” when the image is the link’s only content.
  • Avoid duplicating adjacent link text. If the same link text is already inside the anchor next to the image, an empty alt attribute can prevent redundant announcements.
  • Make the clickable area clear. Users should be able to tell the image is interactive. A visible hover or focus style can help on a web page.
  • Preserve keyboard access. An anchor with an href is keyboard operable by default. Do not replace it with a clickable div or add click behavior to an image alone.
  • Use a meaningful destination. The link should go where its description promises. If the image links to a file, email address, or in-document location, make that clear in the surrounding context.

Or skip the browser setup

If you need a screenshot of the linked page, ScreenshotNeo returns an image or PDF from one API request. See the ScreenshotNeo API documentation.

curl -G "https://api.screenshotneo.com/v1/shot" \
  -d access_key=YOUR_API_KEY \
  --data-urlencode url=https://stripe.com \
  -o shot.webp
import requests

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
    timeout=90,
)
open("shot.webp", "wb").write(r.content)
const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

ScreenshotNeo removes cookie banners, popups, and chat widgets before capture. Bot checks, blank pages, and failed loads are never billed. Its MCP server lets AI agents take screenshots. The free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000. Sign up for 1,000 free screenshots a month, no card required.

Troubleshooting

There is no universal cause or fix established by the cited product documentation. Confirm that the picture itself is selected, check whether the file or slide is in a restricted editing mode, and consult the help for the exact application, version, and platform. In Google editors, the general link help cited above does not document image selection.

In Word or PowerPoint edit mode, a normal click can select an object. Use the application’s link-following gesture or presentation/reading mode, then test the destination. In HTML, verify that the image is inside the anchor and that the anchor has an href.

The browser shows a broken image

Check that src resolves from the page’s location, that the file exists, and that its path and capitalization match. A relative path such as photo.jpg is resolved relative to the HTML document; use a full URL when the image is hosted elsewhere.

Inspect the anchor’s href or reopen the editor’s link dialog and check the Address field. Include the full scheme, such as https://, for a web destination.

Give the image useful alt text that describes the destination or action. If equivalent link text already appears inside the same anchor, use empty alt text for the redundant image.

Performance, reliability, and cost

Adding a link to an image does not itself require extra browser requests beyond loading the image and, when followed, the destination. The image’s file size and hosting affect page load; compress and size the image appropriately, and make sure its URL remains available. In documents, a link to a local file can break when the document is moved or shared unless the recipient can access that file. No special service or paid tool is required for the Word, PowerPoint, or HTML methods above.

Frequently asked questions

Word and PowerPoint support email destinations in their link workflows. On the web, use an anchor such as <a href="mailto:team@example.com"> around the image and provide descriptive alternative text.

A single image inside one anchor has one destination. To provide multiple destinations, split the visual into separate linked regions or place separate links alongside it.

Does a linked image need a title attribute?

No. The essential pieces are a valid destination and an accessible name, usually supplied by the image’s alt text or other text inside the link.

Sources