I talk about properly formed links or proper HTML anchor tags in all of my articles, workshops, and classes. This article serves as a tutorial and reference guide on the proper formation of HTML links.
Links tie the web together, linking one site to another, one web page to another. They are critical to helping us find information and understand what is being written.
In “What You Must Know About Writing on the Web,” I describe a link dump:
Ugly is as ugly does. Don’t clutter up your site with ugly link dumps.
A link dump is when the blogger is lazy and just pastes the link into their post such as http://lorelleteaches.com/2012/10/14/what-you-must-know-about-writing-on-the-web/ instead of the properly formed What You Must Know About Writing on the Web.
Which is easier to read?
A properly formed link makes it not just easier to read the post, it is clean and presents professional looking content. It invites the reader to click.
How to Create a Properly Formed HTML Link
To create a properly formed link, you may use the Visual Editor toolbar button called link or Hypertext Link.
Type the words or phrases you wish to use as the link anchor text.
Select them.
Click the link button.
Paste in the address.
Type in the link description (title) which is required by web accessibility laws in most countries for commercial or public websites – it’s a good habit to learn.
Click OK to complete the steps.
The text should appear in a link.
In the HTML or Text Editor, you may use the same link button, or type it in manually.
The HTML link tag is called the Anchor and begins with an A.
The “href” is the hypertext reference link followed by the link in quote marks.
The “title” is the title of the site. It may be the same as the anchor text or it might be different, as shown in the above example. If the anchor text is “great article on how to blog,” the title might be “How to Write Well on a Blog by Lorelle on WordPress.” It should be in a proper sentence format, starting with a capital letter and ending with a period, though that is not always required.
The anchor text in the above example is “Lorelle on WordPress” followed by the closing anchor HTML tag.
Types of Links
There are many types of links.
A traditional link is any link that connects the reader to an external site. This is also often called an external link or outgoing link.
A link to another web page on your site is called an internal link or intrasite link.
An incoming link is any link from another site to yours, however it is most commonly referred to as a link to the root domain address, the dot com, for example, often called the “front page” of the site.
A link to an external site directly to an article on that site will generate a trackback link and comment if both sites have trackbacks enabled. The link on your site is an external site, but the link in the comments of the referenced site is a trackback link. These are also known as referrer links as you are referring someone to another site.
An image link is a link wrapped around an image. Embed the image into your post or Page and wrap a link around it. Affiliate links are often used this way to turn an image into an advertisement.
An affiliate link is a link to an ad or a paid link. Many bloggers earn extra money by providing affiliate links to sponsors and advertisers.
A link list is a list of links. The list maybe set as a bullet or numbered list, or feature the content in a list format with explanations, reviews, and recommendations with the links, helping to educate the reader about the linked content. Some link lists feature the links wrapped around images such as the articles commonly found on Smashing Magazine. Many people create their top 10 list of links on a subject or their recently bookmarked or discovered web pages and resources.
A blogroll or link list is a list of links to external sites or resources. These were popular in the beginning of the web in blogrolls, sidebar lists of links. They are now out of fashion and not appreciated by search engines in SEO as they have been long abused. It is highly recommended that you create a resource list of links on a Page on your site, or write about each reference or resource individually on posts.
There are also many types of links specific to your site, using their description to designate the type of link rather than a unique form of link. These including author links, tag links, category links, title links, archive links, permalinks, comment links, etc.
Link Format Guidelines
Now that you are familiar with what a properly formed HTML link is, it’s time to go over some linking guidelines.
Do Not Click Here: The old days on the web, everything had to be explained. “Click here” was developed as an instruction to teach people where to click to access more information. It is no longer necessary, and when encountered, tends to appear condescending to the reader. Incorporate the links naturally into the text. If you must guide them, use “visit this site for more information” or “you may find more information about this here.”
Link to one or more words: It is highly recommended that you link to more than one word to give the reader more area to click through to the article. While it might be interesting to link to many articles with every word, it’s old fashioned, cumbersome for the blogger as well as the reader, so use it rarely and judiciously.
Links are Recommendations – Tell Readers Why: When you link to a site, you are recommending your readers leave your site to go elsewhere. This used to scare people, but the web is a strange business. In a regular store, if someone tells you to go away, you may leave and never come back. On the web, you tell people to go away and they not only go away happy, the often come back and bring their friends. Don’t just link without reason. Tell your readers why you recommend they leave your site for this new site, and they will trust you and come back for more.
Tell Them Where You Are Sending Them: Use words within the context of the article and in the Anchor Text of the link to let the reader know where you are sending them. If the link is to an external site, make sure they understand that clearly or add a reference such as with this example (external site). If the link is to a PDF or other type of file or downloadable file, add (PDF) or (text file), or some other text that indicates what the destination is for the link.
NEVER Force a Link to Open in a New Window: There was a myth going around that no one would come back to your site if you sent them away with a link. Or that people should click an external site link and force it to open in a new window or tab so the reader could keep reading. This has not only proven to not be true, it violates web standards for accessibility and many federal laws for doing so without warning. People now know how to use the back button and how to open links in tabs. Let them control their experience. If you must use this feature, warn the reader with (opens in new window) in the link.
Punctuation INSIDE the link: Quote marks are always outside of the punctuation and the link, as explained in “What You Must Know About Writing on the Web,” on Lorelle Teaches. Put periods at the end of sentences outside of the link.
Learn How to Cite Properly: Giving credit where credit is deserved is not just right, it’s proper manners. In “Copyright: How to Quote and Cite Sources” I go into details about how to use blockquotes and how to properly cite (link) to sources. Learn how to give credit to the brilliance of others, and you will be rewarded by the generation of a trackback, an invite for the referenced person to check out what you have to say.
Design Links for Readability: Links are to be designed to stand out from the text, be underlined, and not to interfere with the readability of the text. The underline is so strongly associated with links, if you underline text within an article, people will often click it. Designing for links does not mean you must underline the link in your design, but consider adding underline when the mouse hovers over the link to reinforce the concept of a link. Choose colors carefully so the link is visible but also easy to read.
Links change lives, I know by experience. The simple act of linking to someone’s site, specifically something they’ve published, sends your readers there to visit with your letter of recommendation. Link wisely and carefully. Honor the power of the link to connect the web as well as people together.
Here is a link list of resources and articles to help you learn more about how linking works, and how to link better.
Linkability – Link Popularity
The Power of the Link « Lorelle on WordPress
The 10 HTML Tags You Must Know to Blog | Learning from Lorelle
Copyright: How to Quote and Cite Sources
Changing a Life With a Link – - Blog Herald
When Your Comment Inspires Posts – Blog Herald
Site Optimization: Checking Loose Links
Tracing Your Blog Links
Dear Blog Emperors: A Link Relevancy Test
Feeds Change How You Write Links
The Magic and Fun of Incoming Links
The Agony of Link Hunting
Why A Link Post Should Be Like Mingling at a Party
Why You Want To Link To Other Blogs
Why Writing a Link Post Should Be Like Planning a Party
How Do You Find Relevant Blog Posts To Link Too?
Why Writing a Link Post May Be Less Like Partying and More Like Work
WordPress Tip: Writing Customized Post Headlines, Title Tags, And Permalinks
The Dos and Don’ts of Blogging
Caring About the Little Links on Your Blog
WordPress Tips: Exploring the WordPress Text Widget (See sectons on adding links to sidebars)
7 Blogging Steps Even Veteran Bloggers Forget
Filed under: blogging, Web Design, web writing Tagged: affiliate links, anchor, anchor text, blockquote, citation, cite, download links, external links, how to write on the web, HTML, hyperlinks, hypertext, hypertext links, image links, instrasite links, linking, links, pdf links, quoting, seo, trackbacks, web, web writing, wordpress, writing, writing for the web 
