Screenshots in help instructions identify where to act, but a complete guide should also work without them. A reader may use a small screen, a screen reader or a different panel version. If the only clue is a coloured arrow, they do not know which control to find. Give every image an action description, expected result and explanation of its meaningful detail; use the illustration to support the task rather than replace information necessary to complete it.
Select the moment where an image resolves uncertainty
An illustration is useful when it distinguishes a control, state or layout that is difficult to identify through words alone. Do not capture every click merely because you can. A password guide might need the entry to settings, while a clearly named field needs no separate picture. Choose the uncertain moment and record the particular detail that the illustration should make clear to a person attempting the task for the first time without your help.
Read the task-based help article title and ensure the capture concerns that exact task. A general dashboard does not explain changing an appointment if the relevant button sits in a specific visit's details. Do not add a decorative screen for attractiveness alone. If an image neither selects an action nor identifies its result, remove it and keep clear instructions; fewer illustrations also mean fewer places to revise after interface changes elsewhere in the product.
Prepare a crop without real customer data
The best material uses safe demonstration data before you need to hide a real conversation. Inspect not only the main field but customer lists, tabs, avatars, filenames and notifications elsewhere on the screen. An instruction does not need an operator's full working context. Crop elements that do not help identify the control; publishing a list of real cases just to make the interface look realistic is unnecessary and provides no useful information for the instructional task.
Replace sensitive source material or cover its details permanently before adding the file. Do not depend on slight blur, and do not leave the same data in a caption or asset name. Preserve enough context: an isolated button can be impossible to identify when several similar buttons exist. This is editorial practice for illustrations rather than a full data-protection assessment; rules for conversations and records require a separate process and do not follow merely from producing a well-prepared screenshot.
Google recommends text descriptions of important image information and excluding personal data from captures; it advises opaque covering rather than blur for hiding details. These are illustration preparation guidelines: images in documentation.
Write the action and result outside the image
The step should name the visible action and the state expected afterwards. Replace “click the highlighted area” with “In Security, select Change password; a form for the current and new passwords opens.” This fictional wording structure needs the actual interface details. Named actions let someone complete the task when the picture fails to load or the control moves on a phone or after text enlargement; the instruction remains tied to meaning rather than one fixed set of coordinates.
Do not rely only on colour or direction: “the green button on the right” may look different in another theme. Its label is more stable, with position as optional context. Plain instruction language makes the step clearer; an illustration does not justify omitting a necessary condition. When clicking can produce two outcomes, explain both in words instead of presenting one captured state as if it covered everything a customer might actually see at that point.
Separate alternative text, caption and instruction
Alternative text describes meaningful image information, a caption supplies visible context, and the step explains what to do. Those layers need not repeat one sentence word for word. For settings, describe the location or state unclear without the image instead of writing “picture” or its filename. The caption may identify the browser version when it differs from mobile; do not place the whole procedure there when it should already be available in the nearby visible action text.
Scroll the table sideways to see all columns.
| Layer | Purpose | Example |
|---|---|---|
| Step text | Action and expected result | Open Account settings and select Change password; the form appears |
| Alternative text | Meaningful image detail | Account settings with Change password in the Security section |
| Caption | View and version context | Account settings in the browser version |
| Decoration | No additional information | Do not mark an instructional capture decorative when it supplies a needed detail |
The table presents layers for a single example task. A decorative image contributes no necessary information; do not select that status just to avoid writing a description. Meetlead's current Help Centre editor provides alternative text, captions, decoration marking and section text. Check the published result, because filling a field alone does not establish that its description explains the image or that the task can be completed using an accessible navigation method available to the person reading the guide.
Follow the instructions with images hidden
A trial without illustrations reveals whether the necessary information exists in text. Ask someone unfamiliar with the task to follow the steps while images are hidden, without pointing to controls yourself. Record where they cannot identify a label, condition or expected result. Fix that information instead of adding another capture; a picture can conceal missing textual guidance but does not remove the difficulty for someone using a different way to read or navigate the help content.
Restore illustrations afterwards and check whether they help or distract. A close crop may identify the button but obscure the whole section. Do not assess the guide solely on your large monitor. When the task begins with a symptom and possible causes, use branching troubleshooting instructions; a single success image cannot replace guidance on distinguishing outcomes and choosing the next action when the reader sees a different state from the one shown in the author's screenshot.
Publish the complete guide and define replacement triggers
The finished article keeps image, text and current interface names consistent. Add the prepared material to Meetlead Help Centre, check permissions and the published version, then perform the task from that version. Reviewing the editor preview alone is insufficient because public display and reader screen sizes can expose other problems. Check descriptions and captions after a language change too; a Polish capture does not supply a recognisable German control name when the reader's interface uses different labels.
Record changes requiring an image review: a renamed control, moved section or different result after the step. Do not replace every picture for small appearance changes when the instruction remains accurate. During new operator onboarding, ask for the first mismatch between text and screen; that is a useful revision signal rather than proof the entire product is broken. Keep the task name and preparation conditions with the illustration so a future editor knows what it explains and can reproduce it without accessing a real customer's account.
Questions about instruction images
Does alternative text replace a complete step? No, visible step text should give the action and result to every reader. Alternative text communicates meaningful image information when the image is unavailable. Do not move the entire procedure into one image field; check that the task remains possible with illustrations hidden and that action names still identify the correct controls without requiring colour or exact screen positions.
Must you show the whole screen? No, the crop should include the required control and enough context to find it. A broad view reduces readability, while an overly small fragment hides its place in the product. Remove unnecessary details and real data, then check a narrow screen; the decision follows the reader's task rather than a requirement to include a fixed number of screenshots in every guide.
