Understand Basic HTML Code

0
104

Who are all having websites and blogs which are created using any website builder or CMS or by any web designer and who are all want to learn HTML, please have an eye on this article. I am sure, it will help you to understand the basic of HTML.

It will be useful to learn the basic structure of HTML to make little changes in your website or blog without the help of web designer. For example, if you want to align images or texts you don’t need to wait for the web designer. You can do it by yourself if you know the basic HTML.

Mandatory Tags

HTML Mandatory Tags
HTML Mandatory Tags

These are the mandatory tags. Every web pages must have these tags. You can check it by opening any website page source. Let’s see how we can structure it,

HTML Code Basic Structure
HTML Code Basic Structure

Inside <head> tag, you need to put SEO tags(meta & title tag) and External CSS links. Inside <body> tag, you need to put whole content of the web pages.

Opening and Closing tag

Almost every HTML tags have opening and closing. The opening tags start with the left angle and right angle bracket having a character between them. The closing tags have the similar structure but have the forward slash ( / ) before the character. For better understanding see the below example,

opening-closing-tags
Opening & Closing Tags

Create your headings

For headline/title and sub-headline/subtitle, you can use heading tags. And it is very useful for SEO purpose.

Here is the Heading tag structure:

HTML Heading tags
HTML Heading tags

Create your paragraph

After creating headings, you may create content to describe your thought/anything. For this, you can use paragraph tag. Almost every content should be placed inside the paragraph tag.

HTML Paragraph Tag
HTML Paragraph Tag

Creating Links

For redirecting your user to other pages or websites you can use anchor tags. Anchor tag can be created inside any tags like for paragraphs, heading and images etc.,

This is how anchor tag look likes:

HTML Anchor Tag
HTML Anchor Tag

Embed images

For attracting your user or to describe your thoughts through image, you can use image tag and embed your image into the web pages.

HTML Embed Image
HTML Embed Image

You can also use anchor tag and create the link for your images. Image with anchor tag will look like this,

HTML Embed Image
HTML Embed Image with Link

Align paragraph and images

Now you can create paragraph and can embed images on it. So next how can you align it? To align your text and image you can use “align” attribute. But align attribute is not the only way, you can use CSS for it.

Align Text
Align Text

Ordered List

List items with numbers are called ordered list. You can use the below tag to put your list with the number,

HTML Ordered List
HTML Ordered List

Un-ordered List

List items without any numbers are called un-ordered list. You can use the below tag to put your list without number,

HTML Unordered List
HTML Un-ordered List

Formatting text

If you need to highlight any text or word, you can use formatting tags. It will be useful to get the eye of your user in a particular point.

Formatting text
Formatting text

I think it’s enough to understand the basic HTML structure. By using this you can edit your web pages without the help of web designer. If you want more about HTML please leave your comments below.

LEAVE A REPLY