Alternative text increases website accessibility and SEO by providing clear image descriptions. Here's everything you need to know about implementing alt text effectively.

Best Practices for Alt Text

• Keep descriptions short (under 12 words)
• Be specific and meaningful
• Use complete sentences without hyphens
• Include relevant keywords naturally
• Omit unnecessary words like "image of" or "photo of"
• Consider how you'd describe the image to someone who can't see it

Image File Names

File names serve as default alt text when no other text is provided (except for image blocks and auto layouts). Use descriptive file names following alt text best practices.

Adding Alt Text to Different Elements

Image Blocks:

• Click content tab in editor
• Enter alt text (up to 250 characters)
• Alt text saves automatically

Auto Layouts:

• Edit content in section
• Select image
• Add alt text in designated field
• Click save

Gallery Sections:

• Image descriptions automatically become alt text
• Enter text in description field
• Save changes

Product Images:

• Double-click product
• Click edit metadata
• Add alt text (up to 200 characters)
• Click apply

Automatic Alt Text Implementation

These elements use predefined alt text:

• Website logo: Uses page title
• Blog/event featured images: Uses post/event title
• Page featured images: Uses file name
• Product images without alt text: Uses product name

Elements Without Alt Text Support

• Video block thumbnails
• Section background images
• Email campaign headers

For background images requiring descriptions, consider:

• Using image blocks instead
• Implementing custom code solutions (unsupported)

By implementing proper alt text across your website, you improve accessibility for visitors using screen readers while boosting your SEO performance through better image optimization.

Related Articles

Previous Articles