Recommendations

Guidance for incorporating the contextual side bar into your design.

Do

Always use a contextual side panel with the contextual side bar so that users can open and close the panel using the icons in the side bar.

Don’t

Never use the contextual side bar without contextual side panel(s).

Do

Always use contextual side panel in the context of the record or the content appearing on the left of the screen.

Don’t

Don’t use contextual side panel outside the context of the record or the content appearing on the left of the screen.

Do

Ensure that when the contextual side panel is opened, content on the left rearranges responsively to accommodate the panel without overlapping the content.

Don’t

Don’t let the contextual side panel overlap or obscure the content on the record page when the contextual side panel is opened, maintaining a clear and organized layout for users.

Do

Use cards for presenting forms or content to enhance readability and ensure adequate contrast, thereby improving accessibility for all users, including those with visual impairments.

Don’t

Don’t place forms or content directly on a colored background of contextual side panel, as it may compromise accessibility, especially for users with visual impairments.

Do

Always use contextual side panel with side bar so that the users can open and close the panel using the icons in the side bar. Additionally, side panel can also be opened using any other action on the screen, but it should always have a dedicated icon on the sidebar.

Don’t

Never use ‘X’ icon to close the contextual bar.