Make Money Online

Due to the advanced technology and latest software and applications we don’t require any HTML knowledge but it is no harm to learn the basis of HTML that might be a need at some time. When it comes to blogging we usually use Wordpress or Blogger. Both have a separate page for writing the posts which already has the necessary GUI that is needed while doing basic tasks like making the text bold, italics, linking to external or internal pages, inserting images etc. This is that you don’t need to use HTML Tags, instead, you give the command and the tags will automatically be added to the respective text.

In general if you are a blogger then it is better to know the Basis of HTML as it might be useful while writing the posts, getting your links ready, moderating comments and other frequent tasks related to blogging.

In this tutorial we will learn-

1. Making the text Bold or Strong
2. Making the text Italics
3. Underlining the Text
4. Links in HTML
5. Inserting Image

Making the text Bold

This is the simplest HTML tag. To bold the text you need to add <b> before the text and </b> at the end of the text which needs to be bold. In simple words <b> is opeing tag which starts the bold text and </b> is closing tag which stops the bold text.

Examples if use of Bold Tag

Input (We Write)-

Lets learn how to <b>Bold</b> text.

Output (Display)-

Lets learn how to Bold Text.

In the above example the word ‘ Bold’ appears dark, hence, bold.

Making the Text Italics

This HTML tag is similar to Bold Tag where we just need to replace <b> with <i> and </b> with </i>. To make the text italics you need to add <i> before the text and </i> at the end of the text which needs to be bold. In simple words <i> is opeing tag which starts the Italics text and </i> is closing tag which stops the italics text.

Example of use of Italics Tag

Input (We Write)-

Lets learn how to make the text <i>Italics</i>.

Output (Display)-

Lets learn how to make the text Italics.

In the above example the word ‘Italics’ appears bended, hence, italics.

Underlining The Text

Another important thing we need to know is How to Underline the text. It is again very much similar to Making the text bold and Italics. Replacing <b> with <u> and </b> with </u> will do the job.  Simple add <u> at the beginning of the text that needs to be underlined and </b> which is closing tag at the end which will stop the text from being underlined.

Example of use of Underline <u> Tag

Input (We Write)-

Lets learn how to make the text <u>Underlined</u>.

Output (Display)-

Lets learn how to make the text Underlined.

In the above example the word ‘Underlined’ appears underlined.

Links in HTML

Linking in HTML is a little complex for beginners that might require some practice before you will be familiar with it. To link to an external website or web page we will need to use The following tag-

<a href=”http://www.externalwebsite.com”>Text</a>

Here <a starts the linking tag where href= specifies the address in quotes and > end the opeing tag. Then we add the respective anchor text which will link to external page and close the text with </a> The looks a bit complex but is surely very east if you practive it yourself.

Example of Links in HTML

Input (We write)-

<a href=”http://www.yahoo.com”>Click Here</a> to go to Yahoo!

Output-

Click Here to go to Yahoo!

Where Click Here link to external website Yahoo. What we saw is simplest hypertext link in HTML. There are many attributes ans tweaks that can be made to make the link appear as per our needs. It will wuite new for a newbie hence I will discuss it later in some other posts.

Inserting Image

The blogpost is just a mere text if it dosen’t have pucites or music or videos. Now we will learn how to insert an image or Video in a blogpost. You can use Wordpress or Blogger’s Image Upload Function to do this but we will learn ti insert images hosted on this party website. For this we need to use Image Inserting Tag <img src=”linktoimage.jpg”> . There is no closing tag for this HTML command. Here <img start the tag src= specifies the URL or location of the images in Quotes and > closes the tag.

Examples of Inserting Image

Input (We write)-

<img src=”http://upload.wikimedia.org/wikipedia/meta/2/2a/Nohat-logo-nowords-bgwhite-200px.jpg”>

Output -

 

This command gets the image from Wikipedia and displays it over this website. We can adjust the size, border, aignment of image that we will learn later in other posts.

Tags: attributes, beginner, blogger, Blogging, bold, commands, how, html, italics, knowledge, learn, linking, links in html, make, newbie, software, tags, underlink, wordpress

This entry was posted on Wednesday, November 19th, 2008 at 12:54 pm and is filed under Blogging. You can follow any responses to this entry through the RSS 2.0 feed. Responses are currently closed, but you can trackback from your own site.