HTML – An Introduction

Why Learn It?

Whether your creating HTML pages by hand or using one of the many nifty HTML editors out there, HTML is a handy thing to know, especially in Web Design, as not only you know how to actually make a coded document, but you can spot any mistakes that even your editor may make! Also, if your looking for ‘a-little-something-something’ to add to your C.V. this is a good start, for areas such as Web Development, Web Design, programming, etc, etc.

What Is HTML?

HTML stands for Hyper Text Mark-up Language. It is the programming language for making web pages, and, unlike many programming languages, it is easy to use and learn.

What Does It Consist Of?

HTML documents basically contain the following three things:

  • The actual text content your working with
  • Tags which determine elements in the document such as headings, lists, tables and so on.
  • Tags that insert other objects into the document such as images, style sheets, sounds, little programs called applets and movies.

Tags

Tags are the key items which allow you to enter something into your document, or format text, and mostly come in pairs like in the following example:

<tag> your text here </tag> 

The first tag (the opening tag) indicates that you are going to enter some text or other object into the document.

The second tag (the closing tag) ends the task you just entered.

Some tags don’t need a closing tag, such as <hr> which presents a horizontal rule across your page. No closing </hr> tag is needed for a horizontal rule.

As you can see so far, the difference between the closing and opening tags, is that the closing tag has a “/” before the tag name.

Other tags that don’t need closing tags are Attributes. Attributes are found inside particular tags, and they determine things such as colour, size (width, height) size (pixels), src, class.

Here is an example of Tags, including Attributes:

<p style="color: blue"> Hello Everyone </p>

In this case, the tags are <p> and </p> and the attribute is style="".

Does HTML Need To Be in Capitals?

HTML Tags are NOT case-sensitive, although it is good practice writing your HTML in lowercase, you may wish to use UPPERCASE, so that you can differentiate between the HTML and the text.

What About Spacing And “Carriage-Returns” When Writing HTML?

Browsers disregard all formatting that’s not incorporated into the tags. For example, they ignore extra spaces in the HTML document or blank lines. As a result, they don’t show up in your actual documents appearance.

For example:

<tag> Hello everyone, welcome to my page </tag>

Can also be written like this:

<tag>Hello everyone, welcome to my page</tag>

The result will still be the same:

“Hello everyone, welcome to my page.”

What Are Nesting Tags?

Nesting tags are when two tags are present, and one sits inside another. This makes it easier to format the same bit of text, in many ways. So say you want some text to be bold and italic, there isn’t a “<bold&italic>” tag, so you will nest your tags.

Example:

<b><i> Hello everyone </i></b>

Notice that the tag that appears first (in this case, the bold tag) also appears very last. If a tag is right beside the text on the front end, its right beside the text on the back end as well.



octoavatar

Caroline Hagan

Caroline brings over 20 years experience as a Designer and Developer; featured in .NET magazine, the only woman in the UK accredited for Google Mobile Sites. A STEM Ambassador and Google Women Techmaker Ambassador. Previous clients include Blackberry, FIAT, Clark Shoes and Sky.


Related Posts