Links are nowadays used on many sites as the main method of navigation – either to other pages on your site or other sites. This is especially important on screens that have limited navigation options, to begin with, like phones and tablets, even more so when you consider that browsing the web using these devices has far surpassed doing it through a desktop interface. All this combined has put a greater emphasis on links than ever before.
Links can be broadly classified into two main groups – internal and external. Internal links are much easier to manage because everything about them is self-contained on your pages, which results in you having absolute control over everything. On the other hand, external links are different.
While they’re usually, at least partly, established with sites, you partner with. There’s always uncertainty involved because you can’t control the content on the other end or, in worse cases, defend against it. That’s why you must take every precaution to protect yourself/your site, and your visitors from harm.
What are external link icons, and why should you use them
One way of highlighting a link as external is to add an external link icon that serves as a reminder or warning (if you want to look at it like that) that the visitor is leaving your site and, with it, the cone of protection you guarantee. You’ve probably seen this already, if not anywhere else, then certainly on Wikipedia, which uses the box with an arrow as their icon, which has subsequently been recognized as the unofficial default icon.
You could join the bandwagon and go with the same icon or choose one that’s unique, but we’re getting ahead of ourselves – let’s first cover the basics.
Without a doubt, the main thing you’ll look to accomplish by adding icons to your external links is security, as we’ve already mentioned (for everyone involved). However, there are other benefits like navigation – you can make external links open in a new window or tab as opposed to internal links that open in the same.
An icon immediately lets your visitors distinguish between the two link types and know how they’ll open, so there’s no need for backtracking if you want to return or manually open the link in a new window/tab if it’s automatically done so.
How to add external link icons
Now that you have a good sense of what benefits you can take from adding icons to your links, let’s see how you can add them to your site. Naturally, you can use code, which is the answer for everything regarding a website for all intents and purposes. The obvious drawback is accessibility – not everyone can use code, and those that can use it at varying levels of expertise, so it can’t be considered a commonly acceptable solution.
Using WordPress, you’ll likely turn to plugins for help. After all, they’re the reason it’s such a popular platform. Among the seemingly endless selection of the repository, we’ve found a plugin that covers all your link-related needs – WP Links, and we’ll be using it to show how you can add icons to your links.
WP Links – use the easy way out
Upon installation, you’ll need to hop on over to the plugin settings and configure how you want your links to behave. There are a few tabs here, but we’ll focus on external links first.
In this tab, you’ll be able to determine various features of your external links applied throughout your pages. This includes how the links will open (in the same window/tab or a new one), if search engines should follow them (the “follow” and “nofollow” selection), adding attributes and titles for backend organization, CSS classes for visual customization, and finally enabling and choosing an icon for your links.
These options enable you to customize how your links behave in certain situations fully. They’re all extremely easy to set up, requiring only a tick of a box or making a choice from the dropdown menu, and are applied sitewide.
Several factors should be considered when determining how your links behave. The content you publish, your user base, and their tendencies, especially regarding devices used to reach your site or how search engine algorithms comb over your pages, are all part of the package, etc.
For example, if most users browse your pages with their phones, it’s prudent to have links open in the same window because of navigation limitations.
Adding icons to links
Finally, we come to the topic at hand – at the bottom of the page, once you select one of the options from the dropdown menu related to icon type, a whole new section opens. If you count having no icon as an option, there are four choices in total.
Image
Usually, this will be your go-to choice for icons. The “image” icon type will give you twenty circle and arrow icon variations. Selecting a recognizable icon like this will go a long way with your visitors instantly recognizing it and knowing what it stands for.
Dashicon
Dashicons represent the default icon font for WordPress. As such, it isn’t a surprise you can use them since the database is already there.
However, they don’t have any commonly known connections to external links, or links in general for that matter. Using them on your frontend recognition could be a problem because they’re not considered standard solutions.
Font Awesome
Much like Dashicons, Font Awesome is a font that’s relatively commonly used on sites around the web. Both feature instantly known icons, like Facebook or YouTube, because of their popularity.
However, there aren’t any natural connections to links. You could potentially add specific icons to links that redirect to those sites, like a YouTube video, but there are a couple of problems there.
First, the recognition of the external link is still not present, and there would be an enormous amount of work required to add specific icons to specific links.
Position and skipping
Regardless of the link type, you choose the last two features that can be applied simultaneously—the position of the icon (left or right of the link) and skipping the link. Icon position is self-explanatory, but let’s go over why and how a link is excluded from the icon set.
When you’ve decided an image will serve as a link, there’s no point in having an icon to accompany it, so here’s a useful option that lets you set up the plugin to automatically skip all those links while still being applied to everything else.
If you want to, you can make it so that the icon will be skipped for any link with the <img> tag. It’s worth pointing out that this is the only way to exclude links from having icons, so if you want to exclude any, add the tag.
Exit confirmation
While not directly related to link icons, the exit confirmation pop-up window upgrades upon the same purpose, i.e., letting the visitor know they’re leaving your site. Knowing you can use WP Links to enhance things for your users might prove helpful.
We’ve all seen these as they’ve become more and more common. There isn’t too much to them. The premise is quite simple – upon clicking an external link, the visitor is prompted with a notification.
The notification is fully customizable. You can add the most important things – the text and title by inputting text in the appropriate fields. Both the pop-up window and the text fields it contains can vary in size and color, and you can even add a button that cancels leaving the page (also susceptible to size and color changes).
Implementing the exit confirmation and icons to your links will make it hard for visitors to leave your site without proper knowledge. Subsequently, the overall security of your pages will improve, leaving your visitors with only positive experiences.
Summary
Taking actions to improve the visibility of external links on your site isn’t something that comes to mind when going through the mandatory checklist. And, granted, the web isn’t the same free-for-all it was a decade ago because numerous security measures have been put in place that has become standard practice.
However, some still look to take advantage of unsuspecting users when their guard is down. As there isn’t much you can do in terms of policing other sites, the least you can do is make sure your visitors know when they’re not under the protection your site provides.
Add to that the ease WP Links allows you to handle these icons and links in general, and you owe it to yourself, your site, and your visitors to give it a try.
Used to write about games and gaming in general, but has since switched to testing and writing about web development software. Still plays a lot of games, just for the fun of it.
Latest posts by Matej Milohnoja (see all)
Where Should We Send
Your WordPress Deals & Discounts?
Subscribe to Our Newsletter and Get Your First Deal Delivered Instant to Your Email Inbox.
Thank you for subscribing.
Something went wrong.
Keep reading the article at WP Newsify. The article was originally written by Matej Milohnoja on 2022-08-11 11:46:49.
The article was hand-picked and curated for you by the Editorial Team of WP Archives.