HTML – your site’s building blocks

Basic HTML concept

A website must have a layout or structure in order to add style and functionality to it. This is where HTML or “Hypertext Markup Language” comes into play. What it does is it creates the layout of your website through the use of tags.

Tags

A tag usually consists of a opening and closing tag. Imagine it as a box or a block and your content(text, image etc.) goes inside of it. You can stack them with each other and you can also nest a tag inside a tag.

<tagname> Your Content </tagname>
    <tagname>
    Another Content
    <tagname> Nested Tag Content</tagname>
</tagname>

There are also stand-alone tags or self-closing tags that don’t need an opening and closing tag. These are usually input elements like textbox or checkboxes.

<input type="text">

 

Attributes

Tags can also have attributes, this provides additional information about the element. Attributes also adds hooks to CSS and Javascript using id’s and classes.

<input type="text" id="username" class="input">

 

Final Thoughts

It is important for you to understand some basic concepts of how to create your site’s layout. We learned that it’s like stacking boxes together to build the foundation of the website. There are lots of different tags that are used in a website, a good place to start is W3Schools.

In the next article, we will start coding and used some common tags.

Responses

thirteen − seven =

This site uses Akismet to reduce spam. Learn how your comment data is processed.