I have a website for an iOS app that has a button that opens the App Store.
My question is, do users automatically recognize Apple's badge as a tappable button, or would it be better to use a custom button that fits with the design of my website?
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this communityIt's not only about the button.
It's also about how you use it and where you place it. What is the goal of your website? Is the download-button the primary button you want users to click on?
Think of what the message of your website is and how you guide your users to the download button.
The button itself is fine. It has a clear label which indicates the action when you click it ('download'). It has the shape and size of what users expect a button to look like.
To reduce confusion, link text should explicitly state that it leads to an action and not just to a new page. It's not enough to communicate this info in the surrounding text; users often scan Web pages for the areas they can act on. Thus, you should assume that most users will only read the link text. In fact, users often read only the link text's first few words, so it's important to start with a word (typically a verb) that indicates the action that results if they click the link.
Source: Command links by Nielsen Norman Group
Usually, you’ll want to make buttons square or square with rounded corners, depending on the style of the site or app. Some research suggests that rounded corners enhance information processing and draw our eyes to the center of the element.
Source: Button UX Design: Best Practices, Types and States by UX Planet.
This article also explains a lot about behaviours and types.
Place a button where users expect it to be.
For example, if the goal of your website is to have users download your app make sure users know about your app. Show your app, make the download button the primary action button.
Here are some visual examples of websites where it's clear that you're on a website about an app. The download button is in a logical position on this website.