Buttons

Imagine a user placing an order on an e-commerce website. They get to the checkout page and accidentally click the ‘order’ button twice.

Making users wait too long for your app to load can make users impatient. If users get impatient, they'll abandon your site for a faster site.

Text labels aren't the only thing that describe what users are clicking. The two most common affordances on menus and buttons are arrows and ellipses.

Have you ever struggled to figure out what an icon meant? Users do this all the time with icons they're not familiar with. That's why it's important to make your icons clear and intuitive.

Icons are visual cues that help users use interfaces more efficiently. Instead of reading each word on an interface, users can scan for the icon that represents the task they're trying to do.

When a user interface prompts users to take action, they'll see at least two buttons. One button is primary to the user's task and the other is secondary.

Designers often question where to place their 'Ok' and 'Cancel' buttons on dialog boxes. The 'Ok' button is the primary action that completes the task.

Where you place your call to action buttons can affect whether users click them or not. Most designers only focus on how their call to action buttons look.

How fast can you spot the difference between ‘sign up’ and ‘sign in’? Using these button labels together causes users to click the wrong button. But it's not their fault.

On a dialog box, clicking the 'Ok' button means the user wants the system to act. Clicking the 'Cancel' button means the user wants to go back to the original screen.

Your buttons may call users to act, but do they compel users to act? Buttons come in different shapes and forms, but it isn't effective if it doesn't compel users to act.

Low color contrast has always been a common problem in web design. The problem with low color contrast is that it makes text and buttons hard for users see.

A list of links can look like a big blob of paragraph text if they're not formatted right. This is evident when you try to scan the headlines on USA Today and LA times.

Gradients are often used on user interfaces to give it a natural look and feel. They act as a single light source lit from above mimicking the sun. This effect gives objects depth in appearance.