UI/UX Tip 5: Well-defined buttons & links are crucial

26 Apr. 22

Use the Clickability Factor seriously


Sometimes, it’s a good idea to think outside the box. Try using a different colour to spice up an abstract painting. You can add a pinch of something new to your family’s cooking recipe.

In other cases, it is not a good idea to think outside the box. The windshield wiper button should not be placed near the radio. This would frustrate car owners. It could be a nice design, but it would make it difficult to use. Although it could be fun to change the keys’ positions on a keyboard, it would pose a Mount Everest accessibility challenge. People would die if they saw “Go” signs in red and “Stop” signs in green.

It’s essential to balance innovation based on context. It’s important to stick to what users are comfortable with in order to help them achieve their goals. However, this doesn’t mean that you shouldn’t be creative. Conventions can help guide your creativity.

This principle is also applicable to web design. Clicks are the heart of web design. This includes clicking links, buttons and key features such as tabs and navigation. These micro UI features are essential to creating a macro UI that is usable. It is important to make things clickable and easily clickable. Let’s not forget about links and buttons. They are the centre of attention. Buttons must look like Buttons, and Links should look like links.


Buttons Look Like Buttons


If one of the outcomes of using your product involves the click of a button, the user must know what that button is. A button should be recognizable as a button.

Some usability testing might show that a red button is more user-friendly than a grey one. Many users are unhappy with the flat design trend. Google’s material design allows for shadows, depth, and other effects to ensure that buttons are always known to be buttons.

In an article entitled Flat Design and Realism: Which Side are You on? the author states that flat design has taken over digital design last year. The hallmarks of skeuomorphic designs – embossed, bevel effects, drop shadows, and reflective shimmers – have all been replaced by minimalist design, bold colours, sharp edges, lines, simple typography, and very little shadowing.

The flat design was created in response to skeuomorphism. This design trend focuses on making sure that every aspect of your interface looks realistic. Flat design is a great design choice for its aesthetic, colour, and innovative typography, but it also has some limitations. Users often don’t know where they should click. This is a major area in which flat design falls short.

Google’s material design is a happy middle. It borrows elements from flat design and skeuomorphism. However, buttons still look like buttons and designers have the freedom to keep it simple. The important thing is that users know where they click and the web’s entire world revolves around clicks.

Which of these buttons is it?

The first option takes you to gluten-free recipes. However, the second option could be misinterpreted as an extraneous design element or tag. It is important that you clearly indicate to your users what they should click in order to improve clickability.

Similar, Links Should Look Like


Steve Krug wrote in his classic book Don’t Make Me Think that “A large part of what people do on the internet is looking for next thing to click. It’s important to clearly indicate what’s clickable.”

People want to know where they can go to get to Point A and Point B. While links are an aesthetic benefit, it doesn’t help usability. A link is a way for someone to locate a similar article on your blog.

The user can quickly see what the next step is by underlining and giving it a different colour. A common convention is to use blue underlined links which change colour when clicked. This allows users to keep track of what’s been seen. You can use other colours, but they must be consistent. Black underlined text might not indicate that there’s a link.

Strong colour and an underline are important to make sure that links appear actionable and consistent.

Which of these is a hyperlink?


Helping users achieve their goals

It’s all about making your site easy to use.

Both usability and aesthetics are equally important. Even usability should be considered aesthetics. If your website isn’t an interactive advertising platform, it’s likely that users will have some purpose in visiting it.

This goal must be easily achieved by users. Clear visual clues, i.e. well-defined buttons and links, are crucial.

We use cookies to give you tailored experiences on our website. Talk to us for COVID19 Support