Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 4 Next »

This pattern is used whenever an image is included as part of a Data Definition.

image properties data definition is its default state

How it works

Image location

image location data definition field

Internal - Indicates the image file is located in Cascade as part of your site.

Selecting this option causes the Image file field to display.

External - Indicates the image file is located somewhere on the web, not in Cascade as part of your site.

Selecting this option causes the Image URL field to display.

Image file

Only displayed when Image location is set to ‘Internal’.

image file data definition field

Use the asset selector to indicate the desired image in your Cascade site.

Image URL

Only displayed when Image location is set to ‘External’.

image url data definition field

Enter the full URL of the image in the text field.

Alternative text

alternative text data definition field

Enter the image’s alternative text in the text field.

Alt text is the text-equivalent of the image and is used when when the image can’t be displayed by the browser or can’t be perceived by the user. It is super important for accessibility.

Some tips:

  • Use alt text to provided the content and function of the image.

  • When an image is used as a link, the alt text should indicate where link will take the user.

  • When an image is used to display stylized text, the alt text should represent that text exactly.

  • Alt text longer than ~100 characters is likely too long. Maybe what the image is meant to convey should be more thoroughly described in the main text of the page.

  • Alt text can be pretty nuanced. Consider reading WebAIM’s article on alt text.

  • No labels