HTML Basics - Part 1
If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!
There are a lot of women out there who have websites, but have no clue how to edit them or do much with them as someone else created the site and you’ll have to fork out additional cash just to have minor changes made.
Well, that sucks! And although you’ll here tons and tons on PHP, Javascript and all kinds of other crazy lingo, the bottom line is that without knowing the basics of HTML you’ll never really ‘get’ any other programming language (at least, that’s been my own personal experience lol).
So, I’ve put together a bunch of mini tutorials that should help out with some of the basics.
There are several tags that every HTML document must have before it can be viewed in a web browser. Tags are commands that tell the website browser what to do with the text contained within the tags.
It’s important to note that HTML is simply text - and it’s read from left to right just like we would read a book.
Text contain within HTML tags are not visible on the actual webpage that visitors view. The result of those tags will be visible however.
Let’s take a look:
These tags are <html>, <head>, and <body>
<HTML> <–opening tag
<HEAD> <–opening tag
This is where special information about
Your webpage will go, known as Meta Tags</HEAD> <–closing tag
<BODY> <–opening tagYour document text goes here
</BODY> <–closing tag
</HTML> <–closing tagNote that each tag used has an opening tag < > and a closing tag </ >. This is very important to remember. Every tag you use must have a starting spot (opening tag) and and ending spot (closing tag).
As you can see above, the <html></html> tags are placed at the very beginning and very end of the document. The HTML tags tell web browsers that the entire page is HTML.
Your content is all placed between the <body></body> tags. The <head></head> tags will be discussed separately as this is where special notes are place, including your page title, page description, page keywords, and some other fun stuff.
For now, we’re going to concentrate on what goes in between the <body></body> tags. (For a in depth list of tags that can be used within the Body tags, visit HTML Tag Directory). For now, let’s play with some common font attributes:
<i>Italic</i>
<b>Bold</b>
<u>Underline</u>Let’s look at an example. Copy & paste the following into your HTML Editor. Don’t worry about the lack of information in the <head></head> tags right now, we’ll fill that in later on.
<html>
<head>
</head><body>
This is where all of our content goes. From here I can <u>Underline text</u> or perhaps this isn’t dark enough for you, so we can <b>make the text darker by using the Bold tags</b> or if you’d like to see some fancier text, <i>we can use the Italic tags</i>.
</body>
</html>When you preview this document in your HTML editor, you’ll see the following:
This is where all of our content goes. From here I can Underline text or perhaps this isn’t dark enough for you, so we can make the text darker by using the Bold tags or if you’d like to see some fancier text, we can use the Italic tags.
That’s it for the first part of this lesson. Congratulations! You’ve just written your very first HTML page :)
One important note when creating a website: The first (or main) page of your website must be named ‘index’. Browsers automatically recognize the index page as the first page to display when some enters your url (domain) into their web browser.
Dianne, You are talking about me! I am having a web sight designed, hoping to launch it soon. I have been tying to learn about HTML, meta tags, etc. I will print this information out and hopefully begin to understand things at least on a basic level. Thank you so much. I know this will help a lot of people.
[...] Wahm-Cafe has a nice beginners HTML tutorial series. Check it out. [...]