HTML is a short acronym for HyperText Markup Language. The language consists of tags surrounded by angle brackets and can effect the way a person sees a website. It can be used in scripting languages like cgi, php, and javascript to person any number of actions.
Example of a tag:
<head>.
A basic page consists of several key points that should be placed in the layout. There will be another tutorial illustrating how to build a basic page, but below is very general example of how a web page is composed. In a way, the HTML to a browser is somewhat like Writing is to a Book. It tells a story all in itself on how the page should look.
Here is the basic bare bones structure of a page:
<!DOCTYPE html> <html> <head> <title>Your Site Title</title> </head> <body> <p>Your Site Content Goes Here.</p> </body> </html>
The Document Type, HTML Head, Title, Body, tags are extremely important and should always exist when coding a website layout or the page may not show up properly or not at all. If you notice, the tags seem to be repeated, but the second time it is repeated with a forward slash (‘/’) in front of the tag name. For every open tag, there must be a closed tag. Some tags like linebreak (br), and image source (img) tags are singular tags and the forward slash is within the url.
Just a few example of tags that do not have a paired tag:
<br />
<img src="YOURIMAGEFILEHERE" alt="IMAGENAMEHERE" />
If you put a web page together, you can label the page with the extension of .html or .htm and view it offline (without accessing the Internet) or you can load it to a server, whether you pay for a webhost or for a free account.
When breaking down the code above for the basic HTML page, you will note that there are really 3 main sections: the header, the content, and the footer.
The Header
<!DOCTYPE html> <html> <head> <title>Your Site Title</title> </head> <body>
The Content
<p>Your Site Content Goes Here.</p>
The Footer
</body> </html>
In between the body tags goes the code for all of your layout and content. In the header, that is normally where you will put in your style sheet code and any elements like javascript or other script to help allow your layout to dynamically function.
Rakesh Kumar says
Thanks remind my old college days. Those days i was little confuse in the usage of blackquote and pre tags.
My recent post Samsung RF511-S02 Price – 156-inch Entertainment Laptop
Bjorn says
I like xhtml better than regular HTML. xhtml is more strict and you must close all tags. I think xhtml is a more modern coding, and is easyer to make work in different web browsers.. But the main structure you describe here is the same for both languages.
My recent post How to maximize the link building value
Nile says
Eventually, I would like to cover more advanced tutorials. I had to update some of my old ones, so as I re-write my old ones, I will be posting those too. 😀
Frank Thomas says
that’s my 10 standard notebook last chapter the basic html tricks.
Clommo says
I`am just analyzed my template for HTML error and got 100 line mentioned error, can you suggest something to get rid of them? I`am blogspot user. thank you.
My recent post You’re Luckier Than You Think And Yes It`s True!
Nile Flores says
Try using the W3 HTML Validator – http://validator.w3.org/ It should help you with your coding and it pinpoints where your code is incorrect.
Anonymous says
This tutorial is very enlightening .. I found it helpful.. thanks a lot.
ajmal says
Actually i;m not a designer or coder but i know that html is one of the essential code. Thanks for this basic tips.
Lynn Jones says
Hi Nile, This is great information! Html is a mystery to me, but you have given me some understanding. Am I ready to tackle it……um, I’ll have to say no on that. lol
Thanks so much! You are a great help!
Lynn
Anastasia says
Nice tutorial. It gives conceptual understanding of what html is.
Matt says
Thanks. This is something I want to know. In fact I want to study web development if I have the chance.
Howard Walter says
This is an auto development mode, studies are too tough for web development.