Hey there. This stuff is half for me and half for you. You see I'm learning web development and computer programming, and so I want to test my knowledge and see how well I can write a tutorial on something basic which I already know, so here it goes:
Now first you must understand what HTML actually is. HTML stands for Hyper Text Markup Language. HTML only displays the content of a webpage. Formatting and styling should be stored in a separate sheet usually styled in CSS and Javascript.
HTML contains tags, what are tags you might ask? Tags are simply words in <these things>. For example <html> is a tag, and it is how you start every document.
Every document should have a basic structure like this:
HTML Elements
You will notice that there are two of each "tags". Ex:<html> and </html> These are called elements.
The tag without the "/" after the "<" in "<html>", means this is where the content of the tag begins. The "/" after the "<" in "</html>", means that this is where the content of the tag ends.
Headings and Paragraphs
Headings and Paragraphs are placed in the body section of the document: <body></body>
"Headings" are just exactly that, HEADINGS. For example the "Headings and Paragraphs" I put before this paragraph is a heading. Except when you make headings you use the elements<h1>Heading</h1> through <h6>Heading</h6>. Font size and thickness(boldness) of your heading text depends whether you use h1, h2, h3, h4, h5, or h6. <h1> is the largest heading while <h6> is the smallest.
Example of Heading:
Now lets move on to "paragraphs". What are paragraphs in an html document? They don't have to be real paragraphs, they will just be displayed as simple text. Paragraphs are displayed using the <p> elements.
Example:
Adding LINKS
Adding a link is fairly easy. To add a link you use the <a> elements.
This is how you would make a link:
The "href" in the start tag is the actual LINK you will be taken to. The "target" simply describes how the link will open. In this case "_blank", means it will open in a new tab. If you want it to open in the same tab simply don't add "target". The "Visit W3Schools!" is how the link will actually read. It will read "Visit W3Schools!", and when you click on that text it will take you to "http://www.w3schools.com/". And of course you need the end tag: </a>
Adding Hyperlinks
What is a hyper link? A hyper link is one or a few more words in a certain part of text in the html page which you can click on and it will take you to a specific link. Adding hyperlinks is very easy. You simply add them in a paragraph like this:
The text will read like this: "Here is how you make a HYPERLINK". When you click on "HYPERLINK" you will be taken to Otland's main page.
Remember this is an extremely BASIC tutorial, so please don't post bad comments.
Now first you must understand what HTML actually is. HTML stands for Hyper Text Markup Language. HTML only displays the content of a webpage. Formatting and styling should be stored in a separate sheet usually styled in CSS and Javascript.
HTML contains tags, what are tags you might ask? Tags are simply words in <these things>. For example <html> is a tag, and it is how you start every document.
Every document should have a basic structure like this:
HTML:
<html> /*Defines that this is where the html document begins.*/
<head> /*This is where internal style sheets and different functions are stored if they aren't in an external style sheet. Don't worry about this for now.*/
<title> /*Defines what the title will say, you know the little bar at the top of your browser which says "Otland" when you access this site.*/
</title> /*Defines the end of the title*/
</head> /*Defines the end of the styling information.*/
<body> /* Pretty self explanatory, defines the [B]body[B] of a web page, this is the part that will actually be displayed when someone accesses your webpage.*/
</body> /* Defines the end of the body content of your webpage.*/
</html> /* Defines the end of your HTML document.*/
HTML Elements
You will notice that there are two of each "tags". Ex:<html> and </html> These are called elements.
The tag without the "/" after the "<" in "<html>", means this is where the content of the tag begins. The "/" after the "<" in "</html>", means that this is where the content of the tag ends.
Headings and Paragraphs
Headings and Paragraphs are placed in the body section of the document: <body></body>
"Headings" are just exactly that, HEADINGS. For example the "Headings and Paragraphs" I put before this paragraph is a heading. Except when you make headings you use the elements<h1>Heading</h1> through <h6>Heading</h6>. Font size and thickness(boldness) of your heading text depends whether you use h1, h2, h3, h4, h5, or h6. <h1> is the largest heading while <h6> is the smallest.
Example of Heading:
HTML:
<html>
<body>
<h1>This is the biggest heading</h1>
<h2>This is the second biggest heading</h2>
<h3>This is the third biggest heading</h3>
<h4>This is the fourth biggest heading</h4>
<h5>This is the fifth biggest heading</h5>
<h6>This is the smallest heading</h6>
</body>
</html>
Now lets move on to "paragraphs". What are paragraphs in an html document? They don't have to be real paragraphs, they will just be displayed as simple text. Paragraphs are displayed using the <p> elements.
Example:
HTML:
<html>
<body>
<p>This is a paragraph</p>
</body>
</html>
Adding LINKS
Adding a link is fairly easy. To add a link you use the <a> elements.
This is how you would make a link:
HTML:
<a href="http://www.w3schools.com/" target="_blank">Visit W3Schools!</a>
The "href" in the start tag is the actual LINK you will be taken to. The "target" simply describes how the link will open. In this case "_blank", means it will open in a new tab. If you want it to open in the same tab simply don't add "target". The "Visit W3Schools!" is how the link will actually read. It will read "Visit W3Schools!", and when you click on that text it will take you to "http://www.w3schools.com/". And of course you need the end tag: </a>
Adding Hyperlinks
What is a hyper link? A hyper link is one or a few more words in a certain part of text in the html page which you can click on and it will take you to a specific link. Adding hyperlinks is very easy. You simply add them in a paragraph like this:
HTML:
<html>
<body>
<p>Here is how you make a <a href="http://otland.net/forum.php">HYPERLINK</a></p>
</body>
</html
The text will read like this: "Here is how you make a HYPERLINK". When you click on "HYPERLINK" you will be taken to Otland's main page.
Remember this is an extremely BASIC tutorial, so please don't post bad comments.
Last edited: