Ads 468x60px

ProBlogger: Essential HTML for Bloggers Part 2

ProBlogger: Essential HTML for Bloggers Part 2

Link to @ProBlogger

Essential HTML for Bloggers Part 2

Posted: 06 Oct 2012 07:09 AM PDT

This guest post is by Matt Setter of MaltBlue.com.

If you were with us yesterday, Part 1 of this series will have put you in very good stead for making sure the code of your blog posts is perfect HTML!

As you’ll recall, yesterday we looked at:

  • What is a tag?
  • Formatting
  • Alignment
  • Lists.

Today, we’re focusing on the final important aspect of our Introduction to HTML, and that’s links.

Links

Adding links is one of the most common and essential operations that we can do in publishing blog posts. Whether we're citing references in our work, linking to other blog posts, articles, and videos, or making email addresses available so that we or others can be contacted, links are essential.

Linked post example

Have a look at the screenshot above, from a recent post here on Problogger.net. It has seven links—and that's just the first part of the article. The remainder of the article has 31 more.

In the WordPress visual editor, there are two buttons for managing links. One to add them, and one to remove them. In your editor, past in a few paragraphs of text from yours or another blog and then select some of it and click the add link button.
Link buttons

When you do this, you'll see the link editor window, below, open with two fields available: link and title. When you fill out these fields and click add link, your text becomes a link.

Link dialog

Let's say that you were linking to an article here on Problogger.net, Blogging for Startups: 10 Essential Tips to Make it Work. You put the name in the title field and the link in the URL field.

What does it look like in the source code of the page? Here it is.

<a    title="Blogging for Startups: 10 Essential Tips to Make it Work"    href="http://www.problogger.net/archives/2012/09/05/blogging-  for-startups-10-essential-tips-to-make-it-work/"    >Blogging for Startups: 10 Essential Tips to Make it Work    </a>

The code above is what it would look like, if the article name was also the text that was linking to the article. It's been formatted for easier reading. You see that the text is surrounded first in what's referred to as a tag, or in this case <a> and </a>.

Then, inside of these, there's two further parts, called title and href. The title is what is displayed if you hold the mouse over the link for a second or more, and href contains the link that will be opened when you click on it. That’s nice, straightforward, and simple, yes?

In your editor, click on the HTML tab in the upper right and have a look at the link that you've just created. Play around with the text inside the tag and the text in the elements in the opening tag, in the title and href areas. Then switch back to the visual editor and see what's changed. Hold your mouse over the link and click on the link. You see how easy it is?

Now there are a series of other options that you can add in, besides title and href, but on the whole, the majority of them are not used that often and are likely not needed that much in the context of blogging. There's a few more things we can do with links, though.

Internal links

So far we've looked at external links—by external, I mean any document that's not the one we're currently reading. What about linking within our document? Let's say that half-way down our document, we had a list of the most to least highly populated states in Australia.

Let's say that we linked to it right at the start of our post so that readers could skip right down to it without needing to read the text in between. How would we do this?

In your editor, in visual mode, copy in a few paragraphs of text from another website. Give it a heading "Australian States" and then add the text "Most Popular Australian States" right at the top of the document.

In the heading, "Australian States" create a link, but don't give it a URL. Change to HTML mode and make it look like the code below:

<a name="australian-states">Australian States</a>

You see that in the href field, we've filled out a name field? This is now what's called a named anchor. Now create a link around the text at the top of the page and set the URL to be #australian-states. When you preview the post, you'll be able to click on the link and go straight down to the link in the document.

Here is an example of the HTML:

<h1>Australian States</h1>    <a href="#australian-states">to australian states</a>    <p>Die Hypovereinsbank wirbt Kunden für das Sparkonto HVB PlusSparen Top-Sparzins   mit einer Zinsbindung von drei Jahren. Lässt der Sparer das Geld dort 36 Monate   liegen, erhält er 2,25 Prozent Zinsen pro Jahr. Muss der Sparer aber vorher an sein   Geld, gibt es nur sehr bescheidene Zinsen. test.de sagt, was das Sparangebot   taugt.</p>    <p>Die Hypovereinsbank wirbt Kunden für das Sparkonto HVB PlusSparen Top-Sparzins   mit einer Zinsbindung von drei Jahren. Lässt der Sparer das Geld dort 36 Monate liegen,   erhält er 2,25 Prozent Zinsen pro Jahr. Muss der Sparer aber vorher an sein Geld, gibt   es nur sehr bescheidene Zinsen. test.de sagt, was das Sparangebot taugt.</p>    <a name="australian-states">Australian States</a>    <ul>    <li>Queensland</li>    <li>New South Wales</li>    <li>Victoria</li>    <li>South Australia</li>    <li>Western Australia</li>    <li>...</li>    </ul>

Here is an example of what the page would look like:

Example of internal links

Not that much to it, is there? You can now link to external documents and within an existing document.

Essential HTML for bloggers

Well, there you have it. We've now gone through a fairly gentle, yet firm, introduction to HTML so that, as bloggers, we are able to be more hands on when crafting our posts, with the WordPress editor.

We've looked at basic formatting, alignment, links and lists and have a better understanding of the changes that are made when we click or un-click the respective buttons.

From here on, though you may choose to keep using an editor for managing your posts and I wouldn't blame you if you do, you've now got the knowledge to step beyond it. I hope that you enjoyed this basic HTML for Bloggers and are able to feel more empowered than you did before.

If you want to know more, leave us a note in the comments and we'll see what we can do.

Matthew Setter is a freelance writer, technical editor and proofreader. His mission is to help businesses present their online message in an engaging and compelling way so they're noticed and remembered.

Originally at: Blog Tips at ProBlogger
DMS_468x60_LS_banner4.gif

Essential HTML for Bloggers Part 2

Would You Read Your Blog? - DailyBlogTips

Would You Read Your Blog? - DailyBlogTips


Would You Read Your Blog?

Posted: 05 Oct 2012 04:14 PM PDT


Producing great content constantly is like wrestling a bear for 12 rounds without a bell. Earning a living writing requires most of us to churn out content from daybreak until after Jay Leno's done counting sheep, and it's really easy to lose the freshness that brought readers to our blog in the first place. So, how can you keep on producing stuff people actually want to read?

The key is to step back from your work, evaluate these elements in your blog posts and create something you'd click on if you saw it in an online search. If you'd enjoy reading what you wrote, chances are other people will, too. If you're falling asleep before paragraph two, here's where you can make adjustments.

The Title

The funny thing about titles is, if they don't grab you by the collar, shake you silly and beg on their hands and knees to be read, the rest of the article is likely never to be seen. Readers are constantly bombarded with thousands more articles than they could ever read, so make the title truly stand out. Make them want to open the box and peek inside. Grab 'em from the start or there's no point in writing the rest of the article.

How can you do this? Here are several ways:

  • Ask them a question they're dying to know the answer to. "Is your blog doomed to failure?"
  • Offer them inside information about something they're highly interested in. "What the best bloggers know about generating revenue."
  • Make a bold statement that contradicts everything they already know. "The top bloggers could care less if you read their posts."
  • In other words, pull them into the article before they have a chance to think it through. Of course, you've got to back up your title with great content, but you need to get them in the door to begin with.

    The Relevance

    A great title gets you a click. That's it. Your content is what will keep readers engaged in your writing. Don't forget – there are thousands of other blogs out there begging to be read. Always deliver on the promises made in your title. If you've a

sked your reader a question or promised him an inside scoop in the title, he'd better get the goods in the blog post. Otherwise, you've lost credibility – and readership.

Is the information in the blog post valuable to readers? Will they learn something, have something to think about or be motivated? Or, is this just another post like thousands of others online – easy to forget and even easier to ignore next time? Make the blog post relevant to readers. Add value. This keeps them hooked, and brings them back for more.

And always read. Especially read about good writing.

Visual Appeal

I don't mean the design of your blog, or the photos, colors, fonts and graphics. I mean the writing. But it's just words! How can I make it any prettier? Ever looked at the front page of The Wall Street Journal? Now that's intimidating! Column inch after column inch of nothing but a hard-looking read. Honestly, my college textbooks looked like the Sunday comics in comparison. Granted, it's better than it used to be, but it's still daunting for anyone who isn't immersed in politics and finance.

Now take a look at USA Today. They usually cover many of the same news stories as The Wall Street Journal, but they're presented in a breezy, unintimidating format. The paragraphs are short and sweet, broken up nicely by lots of pictures and subheadings. It doesn't challenge the reader – it invites her along. Make sure your blog posts look fun and simple like Sunday's funnies, not tough and intimidating like that big, bad bully The Wall Street Journal.

'Nuff Said

Remember, you're just writing a blog post. It's not an exhaustive analysis of the subject, just a snapshot of the current issues. Know when to shut up, or your readers will shut you up with a click to the next blog. Craft a good ending and let it go. See? Like this.

Christy Wilson is a freelance writer specializing in writing for small businesses, fitness blogs, health blogs, grilling blogs and other online writing. She attained her bachelor’s degree in Journalism/Mass Communications from Samford University with special focus on Public Relations.

Wanna make money with your website?


Original Post: Would You Read Your Blog?