Basic HTML For Bloggers

HyperTextMarkupLanguage - that's what it stands for. Its a way for Web browsers to present text and graphics. A code if you like. To get a better idea of what it is, click on your View menu and then Source or View Source and that will show you how a page of text is formatted in HTML (It'll also show you the keywords used in the Meta tags which can be helpful in getting your page ranked higher on Search Engines - but more on this later).

Basic Knowledge of HTML

Before we go any further let me tell you that I'm rather new to all this. I've only been into computers for the last couple of years. Oh sure I'd used computers in my work before that but only as far as word processing. I was using AppleIIs back in the early Eighties to write magazine stories but apart from knowing how to boot the machine up and format a word processing document I didn't have a clue about computers. And I still don't have much of a clue. I probably couldn't explain the difference between ROM and RAM to save my life. But I know enough to get me by - I have a Basic Knowledge of HTML codes and commands. I don't have a head for programming or writing code or any of that stuff. In fact you're talking to a guy that didn't even finish high-school. I went straight from school into the Advertising business at the tender age of sixteen. So I'm a dummy. And I'm a real dummy when it comes to complicated computer language coding and algorithms - all that egghead stuff. So if I can have a Basic Working Knowledge of HTML code and links - trust me, you can too.

"Basic HTML Keeps Me Fit & Healthy"BTW, I'm on a Mac so before I can save a file with the ".html" extension, I need to format the document as plain text. For the Open Source Word Processor TextEdit in OS X you just set the "Format" menu's "Make Plain Text" option.

So here we go. From the top...in a logical progression. It might help to open another browser window and pull up the View Source of my Welcome to Wallyworld page (the page you're reading now) and follow what I'm looking at.

Headings in Basic HTML

Coming down the page a bit you'll see the document begins with html enclosed in less than and greater than arrowheads and then if you scroll to the bottom of the page you'll see the very last bit of code is html but this time closed off with a forward slash. That's the way HTML works - you enclose the command within the arrowheads, write your text and then close it off with a forward slash.

After the html commands we have the head which contains everything in your title. You'll see the term "Robots" which is a command to the Search Engine spiders to start reading the information coming up next. And that information is the Meta Tags - both to describe what your site is all about and to give the keywords. You'll notice I only have a Meta Description here - HOW TO: Increase Your Traffic, Boost Your Google Ranking, Optimize Adsense to Make More Money, Keyword Optimization Tips, Work Online as a ProBlogger". This is because my host is convinced that the major search engines no longer rely on keywords in the Meta Tags. Apparently that's true for Google but Yahoo and the others take them into consideration. So I may have to get into the template and see if I can add some keywords here under Meta keywords.

So the head section contains the title and information on style sheets and scripts. After that we have the body which contains the markup with your content - your article/story/table - whatever you're putting in there.

That's about it. Not hard is it? All you have to do now is learn some of the HTML Tags.

We Love Basic HTML

We Love Basic HTML

We Love Basic HTML

The underline tag is written with a u. Paragraph with a p. Line break with a br. Italics with an i.

Probably the most useful piece of code is the Hyperlink - that's a fundamental of blogging - the sharing of information. Clicking on this one will take you to a site with lots of Useful HTML Code including how to write hyperlinks.

BTW I've just learnt how to shut the Hyperlink off so you don't bleed any Page Rank - everyone you link to takes some of your juice. When you add this code - rel="no follow" between the <a and the href in that string of code you stop the bleeding. The hyperlink still works - it still takes you to another page or site when you click on it.

You can also turn an image into a hypertext link so that when you click on the image it takes you to a page or site. Click on the logo below and it'll take you to my mate Michael Davies beautiful site on Cruise Boats on Sydney Harbour (complete with Virtual Reality Panoramas and High Dynamic Range photography).

To make this clickable link image Go here for the html code

Use HTML to Wrap Text Around Adsense

The code to do it is - Less than arrowhead div style="display:block;float:left;margin:5px5px5px5px;">Google Adsense Code</div more than arrowhead.