Usewright
Back to results
Explore the library298 guides total · goals, work & tasks
By goal

Choose what you want to achieve.

By work or interest

Choose a setting you work or spend time in.

By task

Choose the kind of help you want.

Counts show all available guides. Filters combine to narrow your results.

Communicate clearlyGuide

Write image descriptions that fit their actual purpose

Use the picture and its page context to choose useful text for decorative, informative and functional images.

Illustrative resourceNot tool-testedPeople preparing image-description handoffs for a website or digital document
What you’re working towards

A three-image handoff with context-specific roles, exact proposed alternatives, preserved notice text and clear implementation checks.

Download playbook .md

Your choice also saves this guide’s current worked-example checkmarks. Only this browser; no account or sync. View saved guides

Saving needs JavaScript. Reading and downloading this guide does not save it.

Included example · illustrative MD file

Download the description handoff

Three context-specific role decisions, exact proposed alternatives, visible-text check and unperformed implementation checks.

Not tool-tested. Review and adapt before using it for a real project. Your browser may download this file when you choose View example file.

View example file (opens in a new tab; your browser may download the file) Download example
Abstract curved line with a tilted ochre rectangle, green circle and pale triangle. This teaching example is assigned a purely decorative role in its supplied target-page context.
D01: decorative in the fictional target page; informative teaching material here.
Fictional informative notice: Repair café. Saturday 17 October, 10:00–12:00, Cedar Hall. Bring one small household item.
I01: the target page’s event information appears only in this image, so its meaningful text must be preserved.
Downward arrow over a document outline, used here to teach a functional image-only link. Its supplied target action is downloading the desk supply list PDF.
F01: name the confirmed action and destination, which the icon alone cannot establish.

Source files to work with

Make a start

One step at a time.

4 steps

Start with the synthetic worked example or other non-sensitive inputs. Run one prompt at a time in your chosen AI tool. Replace any bracketed placeholders with the requested material, check each reply, and supply the source or earlier outputs that step needs. Paste them again if the tool lacks that context.

Set up the worked example

Open

Open the three downloaded PNGs in an image viewer: description-decorative.png, description-informative.png and description-functional.png. If your chat accepts and can inspect images, use it for the draft; uploading depends on your actual access. With text-only chat, describe what you personally see and copy visible words exactly, label them YOUR OBSERVATIONS, and say the AI has not seen the image. If nobody can open a picture, stop its image-dependent checks.

Add the sample

Download image-description-contexts.md; it gives fuller context than ‘The starting point’ (Synthetic input). For steps 1 and 2, work through D01, I01 and F01 one at a time in the same chat. Attach the matching actual PNG if supported and replace each context placeholder with that image’s complete section from the contexts file. In text-only chat replace the attachment instruction with your own labeled observations and the viewing limitation. In step 3 provide all three contexts and checked roles, with all three labeled PNGs if supported. Save its handoff as my-image-handoff.txt and reopen it before step 4; supply that saved text, all contexts and the same images or labeled observations. Replace bracketed instructions rather than sending them literally. ‘The intended result’ (Illustrative output) and image-description-handoff.md are comparison answers.

Start with the synthetic example, then adapt each prompt to your task.

01

Gather the image and its job on the page

An icon alone cannot tell you where its link goes. Include nearby text, purpose and behavior with the actual PNG before asking for a description.

Your starting prompt
Inspect the attached image and the page context below. Report only visible facts and meaningful text you can read. Separately record the supplied page heading, adjacent text, author-stated purpose, any action or link destination, and existing visible or programmatic labels. Do not infer a destination from an icon. Mark missing or unreadable details. If you cannot view the image, say so.

IMAGE:
[attach PNG]

PAGE CONTEXT:
[paste the matching context]
Expect

For each filename, visible observations and readable wording are kept separate from what the page context says the picture does.

Check

D01 has shapes and no words. I01 reads ‘Repair café’, ‘Saturday 17 October’, ‘10:00–12:00’, ‘Cedar Hall’, ‘Bring one small household item’. F01 shows an arrow/document; its PDF destination comes from the context, not the pixels.

If it differs

If the AI cannot view a PNG, require that admission and use your own observations for a text-only draft. Enlarge unreadable text yourself; leave it unknown if still unreadable. Do not invent a year, destination or person’s characteristics.

02

Choose the role from the supplied context

Ask what information or action the reader would lose without the image. The same picture may need different treatment on another page.

Your starting prompt
Classify the image in this exact target context as decorative, informative or functional, explaining what the reader would lose if it were absent. For the supplied purely ornamental, non-interactive HTML image, propose an explicitly empty alt. For information absent from nearby text, preserve the essential meaning. For an image-only link with no other label, communicate its confirmed action or destination. Do not apply decorative treatment merely because the graphic is simple or abstract. Keep the instructional-guide context separate from the fictional target context.

IMAGE AND CONTEXT:
[attach and paste]
Expect

A role for each image in the fictional target page: D01 decorative, I01 informative and F01 functional, with a reason.

Check

D01 adds only decoration there. I01 alone carries event details. F01 is the only content naming a link’s action. The same D01 picture is informative teaching material in this guide, so the target-page choice does not apply everywhere.

If it differs

If a simple shape is called decorative just because of its appearance, ask what information or action would be lost in the supplied context. Resolve missing purpose or link details before deciding.

03

Write the shortest complete alternative

Preserve the notice’s meaningful words. For the download icon, name the PDF action. Avoid invented details or descriptions of irrelevant decoration.

Your starting prompt
Produce a handoff row with file ID/name, target context, role, exact proposed alternative, reason and unresolved implementation checks. For I01 preserve Repair café; Saturday 17 October; 10:00–12:00; Cedar Hall; Bring one small household item. Do not add an unstated year, time zone, address, price or registration rule. For F01 name the desk supply list PDF action from the supplied context. For D01 distinguish the target empty alt from the informative description used to teach this example. Do not claim standards conformance or that a website was changed.

IMAGES, CONTEXTS AND DRAFT ROLES:
[attach/paste]
Expect

Three filename-matched handoff rows, each with context, role, exact alternative, reason and remaining implementation checks. Save the complete draft under my-image-handoff.txt, keeping references unchanged.

Check

For the stated HTML-image pattern, D01’s target alt is explicitly empty: alt="". I01 retains all five meaningful lines. F01 says ‘Download the desk supply list (PDF)’. Empty alt is not the same as omitting it or writing ‘decorative’.

If it differs

For a missing notice line or invented detail, point to the pixels and context and ask for correction. Do not generalize the HTML instructions to a different publishing system. Reopen the saved handoff before step 4.

04

Check the pixels, wording and final placement

Read the notice yourself and compare every meaningful line. Before publication, recheck the complete page and control name in the actual publishing system.

Your starting prompt
Audit this handoff against the actual images and supplied contexts. Check every meaningful word, omission and unsupported addition. Confirm D01 is still purely decorative in the target context, I01 preserves all event text, and F01 names the confirmed PDF destination rather than just the arrow. Flag whether surrounding text or another label makes any proposed wording redundant. List remaining checks for the chosen implementation: image alternative, complete link name, real destination, keyboard use and relevant assistive-technology behavior. Separate direct image observations from tests you did not perform. Do not certify accessibility compliance.

IMAGES:
[attach]

CONTEXTS AND HANDOFF:
[paste]
Expect

An image-and-context audit of the saved handoff plus a list of later implementation checks.

Check

Compare the notice words yourself and verify every filename/role. No live PDF or website exists in this exercise. Actual destination, full link name, keyboard use and assistive-technology behavior are not tested by drafting alt text.

If it differs

If the page context changes or a label repeats nearby text, review the role and wording again. Save corrections to a new revision and reopen it to recheck. Keep claims limited to observed images and supplied contexts; do not certify accessibility compliance.

Optional: improve the result

Recheck descriptions when the page changes

Keep the image ID with its context. Adding visible text or reusing an icon can change what the alternative should say.

Advanced prompt
Review these proposed page-context changes against the previous image-description handoff. For each image, identify what information or action is now supplied elsewhere, whether its role changed, and the exact alternative or full control name to retain or revise. Preserve meaningful information without redundant announcements. Record the old and new context so a later editor can understand the choice. Ask for any missing destination or behavior instead of guessing. Keep implementation suggestions distinct from completed browser or assistive-technology tests and do not assert compliance.

PREVIOUS HANDOFF:
[paste]

CHANGED CONTEXTS:
[paste]
Optional: use your own input

Describe your own images in context

Use only images you own or may share, with private details removed. Open each actual image yourself. Use an image-capable chat only if it genuinely supports inspection; otherwise give your own exact observations/transcriptions and label the draft text-only. Start with the prompt below, repeating the first review for each image. Then send:
“Using each checked image and its exact target context, choose decorative, informative or functional and explain what the reader would lose without it. For a purely ornamental non-interactive HTML image only, propose an explicitly empty alt. Do not decide from visual simplicity alone. Ask about missing purpose, behavior or destination.”
“Make a filename-to-description handoff: target placement/context, role, exact proposed alternative, reason and unresolved checks. Preserve meaningful visible text absent from nearby content. Name a functional image’s confirmed action/destination rather than guessing from the shape. Keep unknowns unknown and use implementation-specific advice only for the target supplied.”
Save the complete handoff as my-image-handoff.txt and reopen it before auditing; preserve source images unchanged.
“Audit my saved handoff against the same images and contexts. Check wording, omissions, unsupported additions, duplicate nearby information and the complete name of any control. Separate direct image observations from my supplied observations and unperformed implementation checks. Do not change a website or certify compliance. SAVED HANDOFF: [paste the reopened complete file]. IMAGES AND CONTEXTS: [attach permitted images if supported and paste all contexts; otherwise paste labeled personal observations and state the image-access limitation].”
Check each exact alternative yourself. Save and reopen corrections before repeating the audit. If actual images cannot be viewed, keep their visual checks pending. Your own context controls the role; the sample’s wording and roles are not defaults. The original advanced prompt needs your own previous handoff and changed contexts before reuse. Publication, account edits and actual keyboard/assistive-technology testing are separate work.

Your own-input prompt
Help me draft image descriptions for the exact contexts below. First inspect each supplied image if you can. Report visible facts and meaningful readable text separately from supplied page facts. If images are unavailable, state that limitation and work only from my labeled observations; never claim to have seen pixels. Do not infer identities, disabilities or personal traits. Record purpose, nearby text, interaction, verified destination and existing labels, and ask about anything needed before choosing a role. Stop for my review. This is a written handoff only; do not edit or publish a page.

IMAGE INPUT
[Attach each permitted actual image only if this chat supports image inspection. Otherwise supply your own exact observations and text transcription, labeled YOUR OBSERVATIONS, and state the image has not been shown to the AI. Give each a stable ID and filename.]

MATCHING CONTEXT FOR EACH IMAGE
[Give the target page/document and implementation, heading, adjacent words, placement, intended purpose, whether it is interactive, confirmed action/destination, and any visible or programmatic label. Mark unknowns rather than guessing.]

Check your own result

  • Every filename maps to the right image and its actual target context; appearance alone does not determine the role.
  • Meaningful visible wording is preserved where needed, without invented facts or guessed destinations.
  • Empty-alt advice is limited to the supplied decorative HTML-image pattern; functional images identify their confirmed purpose.
  • A saved handoff is not a completed site edit, working-link test or accessibility certification.
Show, then try

See the shape of the result.

This input is synthetic. The output is a written illustration of the intended result, not a verified AI-tool run.

The starting point

Synthetic input
THREE OWNED IMAGE FIXTURES
Open description-decorative.png, description-informative.png and description-functional.png. All artwork and page contexts are original and fictional.

D01: abstract banner beside the heading Make room for your next idea and the paragraph A place to keep sketches and project notes. The author specifies purely visual decoration, no extra information and no interaction. Target: HTML image element.

I01: fictional workshop notice under This month's workshop. Nearby text says only Event details are shown below. The image alone contains the event name, day/date, time, venue and request to participants. Target: non-interactive HTML image element. The context supplies no year or time zone. Inspect the image; do not invent missing details.

F01: arrow/document graphic is the only content of a link on Prepare your desk. Nearby paragraph: Keep the supply list handy. The page author specifies that the link leads to desk-supply-list.pdf, the desk supply list PDF. No visible link text or other accessible name is supplied. The destination comes from this context, not from the icon. Target: HTML image inside a link.

BOUNDARY
Provide a filename-to-description handoff. No real event invitation, PDF, live link, website edit or publication is requested. Do not infer disability, identity or personal traits from an image. For real photos, use only supported, relevant details and permission to share the image. The download image-description-contexts.md contains the complete contexts.

Copies text only. For image or file tasks, use the source files named in the steps too.

Download source .txt

The intended result

Illustrative output
ILLUSTRATIVE DESCRIPTION HANDOFF
D01, description-decorative.png: decorative in its specified target context. Use alt="" on the target HTML image. The curved line and shapes add no information there. Do not omit alt or announce the word decorative. In this teaching guide itself, the image is instructional content and has a separate informative alternative describing the example.

I01, description-informative.png: informative. Proposed alt: Repair café. Saturday 17 October, 10:00–12:00, Cedar Hall. Bring one small household item. This preserves all meaningful visible text. No year, address, price or booking details are supplied or invented.

F01, description-functional.png: functional, as the sole content of the described PDF link. Proposed alt: Download the desk supply list (PDF). The supplied link context establishes its destination. Describing only a downward arrow would miss the action.

HANDOFF
image-description-handoff.md maps each file to its observation, page context, role, exact proposed alternative, rationale and remaining implementation checks. Recheck the choices if nearby text, link labels or page purpose change.

The three PNG fixtures were rendered and visually inspected. That editorial review is not an executed consumer AI-description workflow, browser test, screen-reader test, legal conclusion or accessibility-compliance certification. Publication and implementation checks remain open.
Download result .txt
You’re the final check

Check the worked example.

These checks use the worked example and its particular facts. With your own material, check your actual names, numbers, sources and rules; do not reuse the sample’s values as the answer.

Unsaved checks stay in this tab and reset when you reload. If you choose Save guide, its current example checkmarks are kept in this browser when storage is available.

A few things to watch for.

  • Writing a detailed shape description for an image that is purely ornamental in its actual target context.
  • Leaving a decorative image’s alt attribute absent instead of explicitly empty in the stated HTML-image pattern.
  • Calling an image decorative because it looks simple while it actually carries information or labels an action.
  • Guessing a link destination from an arrow, or adding facts that the notice and context do not supply.
  • Assuming good proposed alt text alone proves a whole page meets accessibility requirements.

What has been checked?

Documentation
Reviewed 2026-10-14. Source review is not workflow execution.
Included files
Scoped checks passed on 2026-10-14. Fixture checks; File parsing. See scope below.
AI workflow
Not run in a recorded consumer-AI workflow.
Time savings
Time savings not measured
Read the scope and evidence

image-description-handoff.md

2026-10-14 · semantic fixture · passed

Filename-to-context mapping and exact proposed alternatives checked against the authored contexts and independently enumerated meaningful notice text. Six invalid handoff mutations are rejected. This confirms the scoped fixture, not general alt-text correctness or compliance.

  • D01 target alt explicitly empty; guide’s own teaching alt informative
  • I01 all five meaningful text lines retained without an invented year
  • F01 names the supplied PDF action, not merely the icon shape
  • No working-link or screen-reader test claimed
  • Six invalid mutations rejected

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: ea8d19413772adb73a2d76401e15af190e942b2a06d1a2061a1d651bc4080c23

image-description-contexts.md

2026-10-14 · semantic fixture · passed

The three source contexts each specify surrounding words, image purpose, target HTML-image pattern and interaction/name facts needed for the exercise.

  • D01 explicitly non-interactive and ornamental
  • I01 event facts not provided in adjacent text; year/time zone not supplied
  • F01 PDF destination and lack of another accessible label stated
  • Synthetic provenance and no real event or live PDF clear

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: 7be4f377e6f9d4e0d8516cb46c1b850ffaa57bc38085f5f3cc5fbd5a48d75c24

description-decorative.svg

2026-10-14 · parser · passed

Owned self-contained SVG parses with expected dimensions. No active elements, event handlers or linked resources found.

  • XML parse
  • 560 by 200 dimensions
  • No scripts, foreignObject or href references
  • No visible text nodes

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: e4c18ec0ae53f55f46e7c3a2480de21b99e389a7e1ce043140f2cce5a0c1640e

description-decorative.png

2026-10-14 · parser · passed

PNG signature, dimensions, chunk CRCs and compressed raster payload validated. Parsing alone does not establish visual appearance.

  • PNG signature
  • 560 by 200 pixels
  • Every chunk CRC and raster decompression

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: b255cd900308a81aef733689ab0ea07ed060ade32388ed11492b086d9dd15fcb

description-decorative.png

2026-10-14 · semantic fixture · passed

The actual PNG visibly contains a curved dark line, tilted ochre rectangle, green circle and pale triangle, with no words or numbers. Its decorative role comes from the supplied target-page context, not appearance alone. This is direct editorial image review, not consumer AI execution, a browser test or an accessibility certification.

  • Actual 560 by 200 PNG opened
  • Four visible geometric features and no text observed
  • No clipping observed

Environment: Inkscape 1.4 raster export followed by direct view_image inspection of the actual PNG on 2026-10-14.

SHA-256: b255cd900308a81aef733689ab0ea07ed060ade32388ed11492b086d9dd15fcb

description-informative.svg

2026-10-14 · parser · passed

Owned self-contained SVG parses with expected dimensions. No active elements, event handlers or linked resources found.

  • XML parse
  • 800 by 400 dimensions
  • No scripts, foreignObject or href references
  • Exact five visible event-text nodes match controls

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: 7dc7517f0c8e47150c0731e56e62de518b1e6261ed5a2cc89da5cd33b35d8e23

description-informative.png

2026-10-14 · parser · passed

PNG signature, dimensions, chunk CRCs and compressed raster payload validated. Parsing alone does not establish visual appearance.

  • PNG signature
  • 800 by 400 pixels
  • Every chunk CRC and raster decompression

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: c1602b3e732f0af2b4425db287dd43c205899309ceafa53fcb4db00a3a09a282

description-informative.png

2026-10-14 · semantic fixture · passed

The actual PNG visibly contains every meaningful event line: Repair café; Saturday 17 October; 10:00–12:00; Cedar Hall; Bring one small household item. All text was legible. The small tag shape adds no event detail in the supplied context. This is direct editorial image review, not consumer AI execution, a browser test or an accessibility certification.

  • Actual 800 by 400 PNG opened
  • Five meaningful lines compared directly with proposed alternative
  • No year, price, address or registration information visible
  • No text clipping observed

Environment: Inkscape 1.4 raster export followed by direct view_image inspection of the actual PNG on 2026-10-14.

SHA-256: c1602b3e732f0af2b4425db287dd43c205899309ceafa53fcb4db00a3a09a282

description-functional.svg

2026-10-14 · parser · passed

Owned self-contained SVG parses with expected dimensions. No active elements, event handlers or linked resources found.

  • XML parse
  • 320 by 300 dimensions
  • No scripts, foreignObject or href references
  • No visible text nodes

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: 19bc4c8353cd6425e031ab947bb2b92ab7c44e41a859d5548101d7bf48e72cd6

description-functional.png

2026-10-14 · parser · passed

PNG signature, dimensions, chunk CRCs and compressed raster payload validated. Parsing alone does not establish visual appearance.

  • PNG signature
  • 320 by 300 pixels
  • Every chunk CRC and raster decompression

Environment: Local Python standard library; XML/PNG parsing and exact context/wording assertions. No consumer AI, browser or assistive-technology test.

SHA-256: 33855449745b071b3498440efad7dc922d6158c498385266f39d5a93f6b4dc8c

description-functional.png

2026-10-14 · semantic fixture · passed

The actual PNG visibly shows a downward arrow over a document outline with no words. The proposed PDF action comes from the supplied link context; it cannot be verified from the icon pixels. This is direct editorial image review, not consumer AI execution, a browser test or an accessibility certification.

  • Actual 320 by 300 PNG opened
  • Arrow and document outline visible
  • No destination text is embedded in the icon
  • No actual link or PDF opened

Environment: Inkscape 1.4 raster export followed by direct view_image inspection of the actual PNG on 2026-10-14.

SHA-256: 33855449745b071b3498440efad7dc922d6158c498385266f39d5a93f6b4dc8c

W3C WAI: Decorative Images ↗ (opens in a new tab)

2026-10-14 · confirmed

For an HTML image used only decoratively in its actual page context, an explicitly empty alt attribute avoids unnecessary announcement; omitting the attribute is not equivalent.

Limits: Scoped W3C tutorial guidance for these specified image-in-page contexts. No AI workflow, website implementation, assistive-technology behavior or WCAG conformance was tested.

W3C WAI: Informative Images ↗ (opens in a new tab)

2026-10-14 · confirmed

An informative image needs a text alternative conveying the meaning it contributes in its page context.

Limits: Scoped W3C tutorial guidance for these specified image-in-page contexts. No AI workflow, website implementation, assistive-technology behavior or WCAG conformance was tested.

W3C WAI: Functional Images ↗ (opens in a new tab)

2026-10-14 · confirmed

For an image used alone as a link, the alternative should communicate the link destination or action rather than merely describing its appearance.

Limits: Scoped W3C tutorial guidance for these specified image-in-page contexts. No AI workflow, website implementation, assistive-technology behavior or WCAG conformance was tested.

W3C WAI: An alt Decision Tree ↗ (opens in a new tab)

2026-10-14 · confirmed

Image text not otherwise available should be included in the alternative; context and function determine the choice.

Limits: Scoped W3C tutorial guidance for these specified image-in-page contexts. No AI workflow, website implementation, assistive-technology behavior or WCAG conformance was tested.

For context and further reading

Official documentation

Documentation reviewed: 2026-10-14. Documentation review is not tool-execution evidence. This resource remains illustrative and not tool-tested.

Keep going
Back to the library
  1. Launch somethingWorkflow

    Create a one-page website starter from a service idea

    A complete one-page brief, draft copy and a downloadable HTML starter. Its sample contact section sends no messages and collects no information. Open and adapt the file locally; browser checks, consumer-tool testing and publication approval are still required.

  2. Launch somethingPlaybook

    Build a coherent starter brand kit

    A complete fictional starter identity with editable vector artwork, color and type rules, and ready-to-use example copy.

  3. Communicate clearlyGuide

    Make an honest chart from a small dataset

    A readable eight-week bar chart, source CSV and complete text alternative that keep a missing week distinct from the recorded zero.

Copy these instructions

Your browser blocked automatic copying. Select the text below and copy it.