Expert Feed Overlay Cards
The Experts Overlay feed provides a visual display of experts that can be filtered by college/school or expertise. The data is managed by the Office of Marketing & Communications.
Dos
Choose number of cards to display per row based on number of experts available and container width
Ensure OMC has large format portraits of experts to display
Don'ts
Don't include too many cards in a narrow space
Variations
Accessibility
Consistency
Styles are applied to the card consistently including line height, font style, weight, spacing and color of text. The heights of cards are maintained consistently when cards are grouped together in a row. This provides balance and allows for greater readability. WCAG 1.4.12: Text Spacing
Hover and Focus State
Actionable items each have distinctive styling on hover/focus to provide a visual cue to the user that the element is focused and there is an action that can be taken. WCAG 1.4.13: Content on hover or focus
Image
Provide effective alt text of the image that is concise and relevant. Avoid phrases like “image of” since screen readers often already announce the type of element. WCAG 1.1: Text Alternatives
- Do not use an image to present text. True text should be used whenever possible, as it supports translation, is searchable, and is easier to maintain and customize. WCAG 1.4.5: Images of Text
Content
Expert data
Expertise topics will be limited to 3 on card display
Expert photo should be minimum 600px × 600px
*Feed content is managed by the Office of Marketing & Communications. Consider these recommendations when delivering assets or content to OMC.
Layout
Related
A visual card where text overlays the bottom of an image. Also available as a plain card with no image.
