The Basic of HTML

Last time I promised that I will continue making post about HTML. Today, I'm gonna start presenting its basic. These are the basic HTML that you'll going to encounter everytime you start making your web pages. Below will begin the topic on how to start making and save your intial web page for editing your HTML.

How to Save and Edit your First Web Page?

• First, open your notepad. Note: (Take note that everytime you edit your HTML document, it should be open it as a notepad. This is if you are using your notepad as an HTML editor. If you are using other software, then you may open it and edit as to what type of software you are using.)
• Once you've open your notepad, just click save as. The dialog box will appear as to what type of document you are going to save your file.
• On the filename, give your file with a .htm or .html extension ( i.e. index.html). Index.html or default.html will served as your home page for your web site ( i.e http://www.yourdomain.com/). Don't missed that! This is very important for beginners.
• Choose the folder location where you preferred to save your intial web page.  
• Finally, you have to click save.

In editing your HTML document or a webpage:

• Open your save HTML document as notepad. As mentioned earlier, this is if you are using notepad as your HTML editor. If you are using other software, open it and edit as to what software you are using.
• Then, click open and you are ready for editing.
• Just click save after you made changes from your file.
• To see how it looks like, double click you html file and you will see the result.

Now, you know how to start with your web pages. Next is, I will present to you those basics tags commonly encountered as you work with your HTML file or web page. In order for you to see how it looks like, just follow the steps above then you may copy and paste the code presented below and you will see the result.

The HTML heading

The HTML headings are tags which are defined in six ways <h1> to <h6>. Below is the basic tags for this one:


<h1>This is my first heading</h1>
<h2>This is my second heading</h2>
<h3>This is my third heading</h3>
<h4>This is my fourth heading</h4>
<h5>This is my fifth heading</h5>
<h6>This is my six heading</h6>


If you try the steps above, you will noticed that tag <h1>, </h1> have the biggest font while <h6>, </h6> have the smallest font. The purpose of this is for organizing your headings while working with your contents.

The HTML Paragraphs

The HTML paragraph is defined with <p>, </p> tags. Take a look with the example below:


<p>This is my first paragraph.The next sentence...</p>
<p>This is my another paragraph</p>


This is usually the main content of your web page. You will noticed that once you've closed your paragraph with a </p>, </p> tags it means that it is the start of the next paragraph.

The HTML Link

The link is only defined with an <a> tag. Just see how the link is presented at HTML.


<a href="http://guideforhtml.blogspot.com">HTML for Beginners</a>


If you try it, you will see that "HTML for Beginners" which is what you called anchor text is the clickable title of the link. 

The HTML Images

The HTML images is defined with <img>. Take a look with sample below:


<img src="http://projectcool.com/images/earth.gif" width="50" height="50"/> 


Noticed that the link above in presenting the HTML images is the file for images. Also includes the dimension where the author is preferred to present it.

These are the basics of HTML that I can share for you today. On my next post, I will elaborate each HTML tags for you.

For the meantime, try using the steps above or you may try it here in the HTML practice editor I researched for you so that you may see the result of each tags discussed above. I suggest that you try to explore in advance using the editor or the steps I've given you in editing your initial web page. Don't worry I will proceed with the presentation only here at:

HTML for Beginners...