Digital Thinking Blog

A few weeks ago a frustrated face appeared around the corner of my desk. “Sorry mate, you don’t do any printing do you?”

“Well yeah, sometimes,” I said.

I have a dedicated desk in a co-working space, we share a printer, and it was this shared printer that was frustrating the face in question: “I’ve been trying for hours to get this bloody thing printed, I’m absolutely desperate, I can’t find the right driver anywhere…”

“I think you just log into the dashboard and download it,” I said. “I think that’s what I did, hold on let me try,” I said, firing up the office dashboard. “You go to printer instructions…”

“Yep, I did that.”

“…and then you click…”

“Oh God!” he wailed. “It’s a link isn’t it.”

Here are the instructions that he’d been struggling with:

An intelligent, professional person, had spent two hours searching for the right driver for a Canon printer, never realizing that the “Download Driver” instruction was a link.

As he slunk back to his workspace, it seemed impolite to enquire as to whether or not he’s color blind, but I’d put good money on it; if he is, that link probably appears mid-grey, blending in with the rest of the text.

Links are arguably the most important element in any document. Without them, the web is just a collection of files stored on the Internet. The perfect link is simple, honest, and usable. Here’s how to design it.

 

1. A Good Link is Not a Button

…and a good button is not a link.

We frequently misunderstand the role of links on the web. A link describes the relationship between two pieces of data, providing context, and often providing meaning.

A link does not perform an action. The printer driver link above should not be a link, it should be a button; buttons don’t link data, they perform an action.

It’s entirely true that the vast majority of GUIs allow you to tap or click a link in order to access the linked data, but that is simply a shortcut. The primary role of the link is to establish a connection between pieces of data.

Buttons perform actions, links form contextual relationships.

 

2. A Good Link Clarifies its Purpose

Central to the problem of how a link should be used, is the fact that the anchor element is flexible enough to be used in a number of ways without breaking. A mailto: link for example should not be a link (it’s an action, not a connection between pieces of data) that has escaped deprecation by being really very useful.

We have a whole hierarchy of headings—including the relatively useless <h5></h5> and <h6></h6>—but we have a single anchor element. In an ideal world we’d have multiple anchor elements to give semantic meaning to links, perhaps a <ae></ae> element for external links (data on a different domain) and a <ai></ai> for internal links (data on the same domain). At present the nearest we can get to giving links semantic meaning is using absolute paths for external links and relative paths for internal links.

We can of course apply different styles to different classes of anchor using CSS. It makes sense that to clarify purpose, internal links should be styled in-keeping with the site’s brand, but that external links should be distinct in some way.

In Tim Berners-Lee’s 1997 thoughts on the nature of UI, he states that:

Certainly users’ understanding of how to use the web has developed since those words were written, but the essential point holds true; users prefer a UI that reflects their wider experience. While there is an argument to say that internal links should be in-keeping with a site’s brand to clarify what they link to, there is an equally valid argument that adhering to the default styles—blue, underlined, system fonts—for external links, not only simplifies an interface, but clarifies that the data being linked to is outwith the current site’s domain.

Whether inconsistency of links causes more confusion than it relieves should be addressed on a case-by-case basis. But in cases where internal links and external links are styled the same, in the interests of usability, it’s the familiar blue, underlined, system font approach that best serves the user.

 

3. A Good Link is Visited

Thanks to William Gibson-esque metaphors, we have a tendency to conceptualize surfing the web as traveling to different locations. Links are viewed as a gateway to somewhere else, when in fact they are a gateway to somewhen else. Take a look at your browser history. It’s not a map of locations, but a chronological record of events. Links are points in the timeline of our data consumption.

As important as links to future data, are links to past data: visited links. Visited links are important because it is visited links that contextualize our data consumption and highlight (by their elimination) that data that we have yet to consume.

Visited links can be a little crude—ideally a link would be compared against a user’s browser history to determine not just if the document had been visited, but if the document had been updated since the user’s last visit. Despite this, visited links are the low-hanging fruit of UI design—easily styled as a slightly desaturated, less urgent version of an active link—and provide invaluable information to the user about their experience.

 

4a. A Good Link is Always Blue

The principle formalized by psychology as the Mere Exposure Effect teaches us that the more familiar something is, the more appealing it is.

The default color of a hyperlink in a browser, is blue. Hyperlinks appear to have been established as blue by sheer chance (presumably someone somewhere’s personal preference). The fortuitous decision benefits usability because almost no one has a blue sight deficiency; unlike red and green, we can nearly all see blue.

Whether a learned behavior, or an inherently more usable color, blue links are clicked more.

(Because of this deep association, no text should ever be blue unless it’s a link.)

 

4b. A Good Link is Rarely Blue

Blue is the most popular color across the board. Blue is also the most common color in UI design, especially among technology and news sites.

The omnipresence of blue raises a challenge for designers: if the primary brand color is blue, should the links in the document also be blue, or does the use of blue in the general design obfuscate the location of links?

Whenever designing with a lot of blue, I’ve found users prefer complementary colors for links; orange, or green for example. However, with the proven effectiveness of blue links, it’s worth edging towards the blue end of the spectrum: reds should edge towards purple, greens towards turquoise.

 

5. A Good Link is Underlined

The argument for underlining is that, as with the printer driver example, underlining reinforces the color indicator; if a person is color blind, they can still see the underline.

The argument against underlining is that it interrupts the flow of text. Google removed underlined links years ago with no apparent downside—at least not enough of a downside to cause them to reverse the decision. But then Google’s links are blue, the linkiest of all link colors, and less of a problem for the color blind.

If underlining text is genuinely too disruptive, there are two simple alternatives: you can either style a pseudo-underline by applying a dashed or dotted bottom-border to the link which will be visually less impactful, or you can highlight in a different way, such as applying a background color to the link.

(As with the avoidance of blue text, never underline text that isn’t a link; users will conclude that your link is broken long before they realize you made a poor design decision.)

 

6. A Good Link Stands Out

Links should be identifiable at a glance. Interaction is inconsistent across devices, and relying on scrubbing the page to uncover links is a recipe for user frustration.

Eye-tracking research suggests that users scan through links, just after titles, to identify the parts of the page most interesting to them. This ability is even more important for screen reader users, who can’t visually scan a page for relevant content, but can (and do) scan through links to identify interesting content.

When treated as bullet points, links describe not only the data that they link to, but the content in which they sit. You wouldn’t link to information on perfume from a paragraph on mountain bikes, so it’s common sense that if there’s a link to mountain bikes, then the paragraph in which it resides will also be about mountain bikes.

 

7. A Good Link Uses Good Microcopy

If possible, keep links at the end of sentences, or the end of blocks of text; this limits the interruption to the thought process, and creates a less disjointed experience. However, never employ the “more information…” approach.

Running a search on Google for “click here” returns 5,090,000,000 results. A similar search for “read more” returns 17,090,000,000 results. What a waste.

Beyond the evident SEO failures of “read more”, “find out more”, “click here” etc. poorly written links give the impression that the current content is abdicating its authority. You are in effect saying, “this information is shallow, there’s better information elsewhere.”

If a link is designed well enough, it is clear at a glance that it’s a link, and “click here” style instructions are superfluous.

 

8. A Good Link Facilitates Good UX

It’s essential that links can be easily triggered, regardless of the delivery device; mobile sites need large enough hit areas, speech readers need distinct microcopy.

Links should follow the reasoned approach of the majority of use-cases. That means that internal links open in the same window, and external links open in a new tab. There are exceptions, a link to a privacy policy for example is an internal link but should be opened in a new tab. Whenever making this choice, ask yourself if the user is likely to need the back button. If so, use a new tab so it can be easily closed returning the user to the previous information.

No link should ever surprise a user, and that includes the type of content you’re linking to. If you’re linking to content that is NSFW, or behind a firewall, consider using the :before or :after pseudo elements to insert an icon next to the link, warning the user of what’s coming.

A link must always keep its promise. That means that when a user clicks, taps, selects, or otherwise triggers a link, they get exactly what they were expecting. And that includes ensuring that links are never, ever broken.

The popularity of video content has increased dramatically over the last few years and it’s easy to see why; videos are engaging for all age groups which also makes them an important marketing tool.

Businesses have developed dedicated video marketing strategies which generate more leads and boost sales. Video content is also being used by these same businesses to build a better brand experience and stand out from rest of the competition.

And while it’s entirely possible to create high-quality video content and share it through platforms like YouTube, there’s no guarantee that your video will get noticed by the masses. Why? There’s an enormous amount of video content being uploaded to the Internet every day.

In this post, we’ll step through five ways you can optimize your videos for search engines. By the time you’re done reading through this post, you’ll have a clear understanding of how you can implement video SEO techniques to improve your search rankings and reach a bigger audience.

Before we begin, let’s quickly take a look at the basics of video SEO and why it’s important.

 

What You Need to Know About Video SEO

The fact of the matter is that most consumers search the web when making purchase decisions. So, if you want to take advantage of video marketing, your videos should be optimized for search engines. Video Search Engine Optimization (video SEO) techniques are used by successful video content creators to improve their search engine rankings and increase visibility in search engine results pages.

Nowadays, it’s pretty common to see people consuming video content on their phones at sports events, walking around campus, doing chores around the house, and during their daily commute. Why is that so?

According to Cisco:

Every second, a million minutes of video content will cross the network by 2021. Globally, IP video traffic will be 82 percent of all consumer Internet traffic by 2021, up from 73 percent in 2016. It would take an individual more than 5 million years to watch the amount of video that will cross global IP networks each month in 2021.

Think about it for a minute. That is an estimate of enormous proportions. You might be thinking What has this got to do with video SEO? Well, SEO itself is just one important component of digital marketing. The other crucial element is converting your video content traffic into paying customers. Videos can be the perfect tool to help you do just that.

If you want to take advantage of video marketing, your videos have to be optimized for search. Here is how you can drive more traffic to your video content and make your video search results more visible while generating quality leads.

 

5 Ways You Can Optimize Videos for Search Engines

Over the years, there has been a considerable increase in the usage and popularity of video. They help explain complex topics in a simple way and they play an integral role in increasing conversion rates. Your decision to adopt video as your go-to digital marketing tool is going pay you serious dividends—assuming you optimize your video content for search.

It’s pretty easy to see that video is gaining momentum. Let’s step through some of the different ways you can use video SEO to stay ahead of your competition.

1. Search for Video SEO Keywords

You’ve probably noticed that Google has been displaying more and more videos in search results—a huge chunk of it coming from, to no one’s surprise, YouTube. Video publishing sites like YouTube and Vimeo are huge sources of traffic that receive higher click-through rates than plain text results.

Keywords are responsible for search results displayed on two of the largest search engines on internet—Google and YouTube. For this reason, if you want your video to be successful, you’ll have to use keywords. But how do you find keywords?

If, for instance, you’re in the web design niche, you could start out by running Google searches on terms like web design tutorials or web design tips and tricks.

Now that you have a good keyword to start out with, the next step is to check its search volume. We recommend using the Google Keyword Planner for this. Keywords that get anywhere from 1,000 to 10,000 monthly searches and have low to medium competition are generally good to use.

2. Optimize Metadata: Tags, Filenames, and Descriptions

Tags are keywords assigned to videos. Think of them as the set of words that sum up what your video’s content is about. For those of you who don’t already know, tags, filenames, and descriptions play an integral role in video SEO.

Since you already have a keyword picked out, go ahead and use that in your video’s tags. This is the tag that you want to focus on and optimize your video for. Remember, you can (and should) use more than one tag as long as it’s relevant to your video’s content.

YouTube gives you 5,000 characters worth of description text that you can use to describe what your video is about. And if you’re not using those 5,000 characters to gain some SEO advantage then you’re missing out. Best practices indicate that you should use your keyword (the same one you used as your primary tag) a few times in your video’s description.

Finally, make sure you save your video with your primary keyword as its filename because there are a number of third-party tools on the web that crawl through and factor in video filenames even if Google and YouTube don’t. So, instead of saving the original video file as vid1.mp4 or youtube-vid.mp4, use your primary keyword in its filename. For example, we’d save the video as web-design-tips-and-tricks.mp4.

3. Add a Video Transcript

Video transcripts are a complete textual representation of the content spoken in the video. Metadata and video tags do not offer as much detail of your video’s content to search engines as transcriptions do. Search engine bots crawl text and use it for indexing. So, a video transcript helps search engines better understand the video’s content and improve its ranking.

Follow these steps to transcribe your own video files on YouTube:

Your transcription file should be saved as a plain text file i.e. .txt. Using special characters can disrupt speech recognition matching and readability of the transcript. A double line break should be used to signal long pause or new sentence. Add >> at the start of the new line to identify speakers or change of speaker. Insert a link to your website in the audio transcript at the end of the video.

Taking this DIY approach to transcribing your video content will help you deliver more value to your viewership by improving their user experience and it’ll give you the opportunity to use the primary keyword you’re targeting for, a few more times.

4. Publish One Video to One Page

Give each video its own dedicated page on your website instead of publishing multiple videos to a single page. Google gives preference to the first video it finds on a web page and ignores any other video content it finds on the same page. To work your way around Google’s video ranking preference, organize your web pages in a way so that there’s a single video on a page (or post).

You might also be tempted to publish the same video to different web pages on your site to increase its visibility; for instance, if your video is about web design tips and tricks then you might want to publish it in a blog post that you wrote about web designs tips, and you might also want to show it to visitors who land on your Projects page to showcase your ability; this is a strict no-no.

What this does is that it creates internal competition on your website for each instance of the video that you’ve published. Think of it this way, when someone searches for web design tips and tricks on Google, Google’s algorithm has to decide which page to display in its search results. And if all of your videos views are split among three different web pages, your chances of showing up in the search results will be pretty low. However, if you had published it on a single page, and that page was racking up all the views, comments, and impressions, then you’d have a better chance of showing up in search results.

5. Create a Video Sitemap

Video sitemaps provide search engines with metadata about video content on a website and are an extension to your website’s existing sitemap.

You can use the sitemap to tell search engines about the category, title, description, length, and target audience for each video you embed on your website. In addition to this, you can also use it to give search engines more information about your video e.g. play page URL, expiration date, restrictions, and platform.

If your web page has a video on it then it’s sitemap may look something like this:

 

Conclusion

Video content is gaining momentum.

There are a number of different ways that you can use video SEO tips to increase your video’s visibility, improve its ranking, and show up in search engine results pages. We showed you some of the ways you can get started with video SEO on your own website and, hopefully, you’re in a good position to take things further.