External links

The best practices for linking to external web pages.

The App UI Kit has two components that are suitable for linking to external web pages:

  • Button
  • Link

We recommend using these components instead of creating custom components.

The most appropriate component for a link depends on how it's used:

  • If the external link is the main call-to-action (CTA), use the Button component with the variant prop set to "primary" or "secondary". Otherwise, use the Link component.
  • If there's more than 2-3 CTAs on the page, use the Link component.

That is, only open links in response to a relevant action, such as clicking a button. Don't open links in a way or at a time that might be surprising, such as immediately after the user opens the app.

When an app calls the requestOpenExternalUrl method, the user is informed that they're navigating away from Canva. Trying to open a link through alternative means, such as via the window.open method, triggers an error.

You can monetize your app by linking to external web pages that prompt users for payment, but only on certain platforms. To learn more, see Accepting payments.

The more CTAs an app has, the less focused the user experience becomes and the more overwhelmed the user becomes. Providing fewer options results in a simpler, friendlier app.

Some links, such as links to the app's terms and conditions, can be configured via the Developer Portal. Don't include links to these pages in the app itself, because this creates a redundant and inconsistent user experience.