Web Conventions: Links & Buttons

Websites are all about clicking. OK well that’s not completely true – a number of sites these days do some creative things with scrolling – but computers at their core are about seeing something and clicking it, whether you’re using your finger or a cursor. Because of this, there are some important conventions surrounding all the clickable aspects of a website – standards that web users are used to and rely on for an intuitive and enjoyable experience on any website.

Hit the Links

The internet as we know it wasn’t created at once or by one person, so it can be hard to determine why some things were made the way they are and just when they caught on. One thing that seems fairly constant though, is blue, underlined links. Why blue? Well according to lore (you know… from the early 90’s) the early browser Mosaic used blue for their links because it was the darkest color besides black, which was already in use as their default (Who are we kidding? In those days, probably their only) color for text. It was a choice that seems to have stuck, though today there are many more possibilities as well.

While blue, underlined text is still largely the default for links, it’s not as strict as some other web conventions. Since most websites still use black as their main text color, users are acustomed to clicking on a word or phrase that displays in another color other than black, with the exception of headers. It has become commonplace for sites to customize their color scheme in order to match links to their branding, but it needs to be done clearly and consistently.

While using an underline on links is not necessarily a ‘must do’ anymore, you should absolutely try to avoid using them on any other text. Just as seeing something in another color usually denotes a link, so does underlining. If you use underlined text throughout your site, even if it’s not meant to be a link, it’s more than likely that people will attempt to click on those words or phrases expecting to be taken to another page.

Push the Button

Buttons are another clickable element that need to be used correctly. Raised and bevelled edges or rounded corners can create the feel of a physical button, which begs to be pushed. If you feature elements on your site that look like buttons, they had better be buttons because people are going to click them and expect an action. The reverse, however, isn’t true: just because an element is clickable doesn’t mean it has to look like a button, though there should be some cue.

Buttons usually (though not always) denote an action that can be taken, usually within the site itself. Links take you to another page or site, and while clicking a button may indeed change the page you’re on, it usually has to do with an input by you; consider two common examples, a ‘search’ button, or a ‘submit’ button.

While many of the ‘rules’ for links and buttons have been around for a long time, a more recent convention for clicking is the migration away from the old standby “Click Here!” In the early days of the internet, links were new and we had to learn that they were meant for clicking, but now we’re all grown up and know how they work. Whether using a button or a link, the words “click here” tell your visitors absolutely nothing about what they’re clicking towards, and a lack of trust about what’s waiting for them can be enough to cause some to skip a link all together. “Click Here” also proves challenging to work into text naturally. If I wanted to mention and link to one of our services, I could say “Here at BKMedia Group we offer custom web design services – Click here” That forces me to break up my copy with a somewhat awkward demand when I could just as easily use a descriptive link that directs you to our Boulder web design services page without causing an unnatural stop in the text. Simple directions like “Click Here!” can still be useful at times for buttons and banner ads when used with other copy to clarify, but don’t feel limited – other, more descriptive calls to action work just as well.

How do the links and buttons work on your site? Are these elements and their functions clear to users of your site, new or returning? If you have analytics, you can assign specific URLs to different links and buttons throughout your site to see just where people are clicking most and where you might need to adjust your approach.

Think your site may need some help? Contact us today to set up a free needs analysis meeting!