Topic Rows
Topic Row Purple
Title for the Topic
Topic Row Dark Purple
Topic With an Image
Topic without Image
Topic Row is a way to feature a single piece of content or a call-to-action with an optional image and links. It works great as a tool for fostering wayfinding and connecting. Grouped together one after another, topic rows can serve as a way to preview sub-sections of the page the user is currently on. Used in isolation, they can also provide a way to laterally connect the content on the current page with content that lives in a different section. If used without links, topic row allows a page to feature brief callouts and highlights in a structured and prominent way.
When creating content for topic rows, always consider why the user is on the current page, where they would need to go next, and how those things are connected. Each topic row should be limited to a single topic.
Make sure that the topic row title matches the title of the page you are linking to. Consistent labeling prevents user confusion. Make sure link text uses action-oriented language and makes sense in the context of the destination the user is being sent to. When stacking several topic rows with link, make sure to use unique link labels.
Content elements:
- Component theme—white, bright purple, or dark purple
- Grouping title—optional
- Topic row repeater item—min 1, max 10
- Label—optional
- Title—required, 65 characters max
- Description—optional but recommended, 230 characters limit
- Image—optional but recommended
- Link label and URL—optional, maximum of two per item