Message pages give feedback to the user when an app or list is empty, or when an error has occurred. There are different use cases for showing a message page. The layout is the same, but the text and icon can change depending on the use case. You can use the message page in the following situations:

• Filtering with no results
• Searching with no results
• Empty app
• Too many items
• Item saved as a tile that is not longer available
• Error

Responsiveness

The size of the message page adjusts to fit the available space.

Size S (Smartphone)

Size M (Tablet)

Size L (Desktop)

Types

• Display the following text: No matching <entity> found. Check the filter settings. For example: “No matching items found. Check the filter settings.”
• Show the filter icon.

• Display the following text: No matching <entity> found. For example: “No matching items found.”
• Show the search icon.

• Display the following text: Search for <entities>. For example: “Search for opportunities.”
• Show the search icon.

• Display the busy state without any explanatory text, such as “Loading”.

• Display the following text on the page and specify the entity. Where relevant, you can also include the ID: This <entity> is no longer available, or <Entity> <ID> is no longer available. Examples: “This product is no longer available.” or “Purchase order 123456 is no longer available.”
• Show the product icon or an icon that matches your use case.

• Display the following text: “Sorry, we can’t find this page.”
• Provide a link to the app start screen if you can.
• Show the document icon.

• Otherwise, display the following text: “Sorry, we can’t find this page. Please check the URL you are using to call the app.”
• Show the document icon.

Guidelines

Resources

Want to dive deeper? Follow the links below to find out more about related controls, the SAPUI5 implementation, and the visual design.