skip to Main Content

 

Phrases like these have become synonymous with the web, I cant recall Shakespeare using “read more…” in his works, although he may have fallen into this trap had he been a blogger. This guide covers common blunders (love that word) and how you can improve links within your blog posts or website.

 

 

01. Be descriptive

As you can see above is a more self explanatory and concise way to form a link. Moreover this method aids accessibility as screen readers take link inputs and read them out as options. Being more descriptive can also be useful for SEO (search engine optimisation) by removing the clutter in a search result, no more unnecessary “this” and “click here”.

 

 

 

 

02. Use buttons

Key links are links on the page that are intended to be clicked whilst other links are perceived as optional. Using a button for key links increases its visibility in the design and incises the likelihood of a click. Ideally a button should start with a verb “buy” “download” etc. If its function would work well as a button consider the design choice.

 

 

03. Condense links

Nobody likes to see links everywhere, its overwhelming and frankly looks a mess. When using multiple links in a block of text simplify it for the user and list the links below in a list, don’t forget to use descriptive link text.

 

 

 

 

04. Read more or read less?

Is “read more” always bad? In the usage above read more is not necessary as having the title as the link implies that clicking it will bring you to the news article. This is especially useful for accessibility. Sometimes however the design of the article will not allow for this type of usage, if that’s the case there is something you can do to help out screen reader users.

Try using the aria-label HTML attribute on your links to provide more detailed information about the context of the “read more…” link. see below for usage.

<h1>News</h1> <p>NASA discovers alien life on mars in new declassified report. <a href="life-on-mars.html" aria-label="Read more about discovery of life on mars in recent NASA report"Read more...</a> </p>

 

 

05. Style and consistency

The style of your links must be cohesive, pick a style and stick with it! Underlining and making it blue implies a link, probably thanks to google. Although its not the only way, whichever styling you choose make sure it stands out in a unique way from the text and consider the contrast to the background. Aim to make it high contrast by comparison to text, make it bold or underlined (or both) as a rule of thumb.

 

Next time you decide to include a link consider these 5 aspects for a more user friendly design

 

 

Thanks for reading!

This Post Has 0 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

Recent Posts
Free Icon

Top 5 Completely Free Icon websites

Everyone hates it when they need an icon or stock image only to find its…

read more

Better link guide for the web

Stop using “Click here” or “more info” and start thinking of your SEO!
read more
Back To Top