Card anatomy overview

The right panel of Image SEO displays your images as a grid of cards. Each card represents one image and contains all the information and controls needed to review and update its alt text without leaving the panel.

A card is structured in two rows:

• Card header row: contains the checkbox (left), the thumbnail, the image label, and the wand icon (right).

• Input row: a full-width alt text field that spans the entire width of the card below the header.

The red dot overlay on the thumbnail is a quick visual signal. If you see a red dot, the image has no alt text saved. Once alt text is added and saved, the dot is removed.

Scan the grid visually for red dots to quickly identify which images still need attention. Images without red dots are already covered.

1. Checkbox

The checkbox sits at the far left of the card header row. Checking it selects that image for bulk actions. You can check multiple cards and then use the bulk controls to process all selected images at once.

• Use checkboxes when you want to generate alt text for a specific subset of images.

• Deselect a card by clicking its checkbox again.

• Switching Explorer nodes clears the current selection.

To process only images missing alt text, filter the grid first using the Explorer or search, then select all and run bulk generation on the filtered set.

2. Thumbnail and red dot indicator

The thumbnail is a small preview of the image rendered inside the card. It gives you a visual reference so you can confirm you are writing alt text for the correct image.

A red dot appears in the corner of the thumbnail when the image has no alt text saved. Once you save alt text (either typed manually or generated by AI), the red dot is removed.

• Red dot present: alt text is missing. Action required.

• No red dot: alt text has been saved.

The red dot reflects the saved state of the alt text. If you type into the field but do not save, the red dot remains until the value is confirmed.

3. Image label

The image label sits between the thumbnail and the wand icon. It tells you where the image comes from.

• Canvas Image: shown when the image is placed directly on a Framer canvas page.

• CMS collection path: shown as the file name with the collection name as context (for example, Our Cases > 01).

Reading the label before writing alt text helps you tailor the description to the context.

4. Wand icon (single AI generation, uses 1 credit)

The wand icon sits at the right end of the card header row. Clicking it sends the image to RankFrame's AI model, which analyzes the visual content and writes a descriptive alt text string. The result is filled directly into the alt text input field below.

Each click of the wand icon uses exactly 1 credit. The wand icon is the per-card equivalent of bulk generation and is useful when you want to generate for just one specific image.

• The wand icon generates alt text for that card only.

• Generation consumes 1 credit per click.

• The result is placed in the alt text field but is not saved automatically.

• You can click the wand icon again to regenerate (uses another credit).

Credits are consumed at the point of generation, not at the point of saving. If you regenerate multiple times for the same image, each generation costs 1 credit.

5. Alt text input field

The alt text input field spans the full width of the card below the header row. You can type, paste, or edit alt text here at any time, with or without using the wand icon.

The field has two starting states:

• Pre-filled: if the image already has saved alt text, that text appears in the field. The red dot is absent.

• Empty with placeholder: if no alt text has been saved yet, the field shows the placeholder text Alt text... in grey. The red dot is present.

After the wand icon runs AI generation, the generated text is inserted into this field. You can then edit it freely before saving. No credits are used for manual input.

Writing good alt text

• Describe the image as you would to someone who cannot see it.

• Include relevant keywords naturally, but do not keyword-stuff.

• Avoid starting with "Image of" or "Photo of".

• For purely decorative images, an empty alt attribute is correct.

• Keep descriptions to roughly 80–125 characters for most images.

Writing alt text: AI vs. manual

Option A: AI generation (wand icon)

1. Locate the image card: Use the Explorer tree or search field to find the image.

2. Click the wand icon: One credit is consumed and AI generation begins.

3. Review the generated text: The result appears in the alt text input. Read it to confirm accuracy.

4. Edit if needed and save: Make any edits, then confirm. The red dot will clear once the value is saved.

Option B: Manual input

1. Click into the alt text input field: The field is ready for typing immediately.

2. Type or paste your alt text: Write a clear, concise description. No credits are used.

3. Save: The red dot disappears once alt text is saved successfully.