Basic HTML

I have been working thru the use of internet for more than a decade now. But never in those years that I put myself into learning how to create a website with HTML and CSS codes. Those plain texts that I see makes me feel so bored. So it never gets into my interest to learn it myself. Until I came into this goal of being a part of Happiness Engineer. But one of their most significant qualification is to have a substantial knowledge in HTML and CSS. This is NOT an entry level position, applicants must have a mastery beyond the basics of WordPress. So I realized, it’s time for me to start gaining knowledge and equip myself at least for 3 to 6 months before I apply for the position.

So let me share with you what I learned from www.freecodecamp.org

What is HTML
The Header Tag
Headline with the h2 Element
Paragraph Element

What is HTML

HTML is short for HyperText Markup Language. HTML is used to create electronic documents that are displayed on the World Wide Web. Each page contains a series of connections to other pages called hyperlinks. It is a form of programming language that is used to make web pages on the internet viewable. So it can be said that it is because of HTML that web pages are interesting to look at.

Let’s start by creating a simple heading for a web page using HTML.

The Header Tag

For example: <h1>Welcome to my Page</h1> This is an HTML element.

Most HTML elements have an opening tag and a closing tag.

Opening tags look like this: <h1> the header tag. This is usually the title of a post or just to simply emphasize a text on the post.

Closing tags look like this: </h1>

The only difference between opening and closing tags is the forward slash after the opening bracket of a closing tag.

If you use this as your post title <h1>Welcome to my Page</h1>

it will look like this

Welcome to my Page

Easy! Right?

Headline with the h2 Element

h1 elements are often used for main headings, while h2 elements are generally used for subheadings. There are also h3, h4, h5 and h6 elements to indicate different levels of subheadings.

Earlier, we created our h1 element <h1>Welcome to my Page</h1>
Now for our h2 element, let’s use <h2>About Me</h2> 

And this is how it would look like

Welcome to my Page

About Me

Paragraph Element

The HTML <p> element simply represents a paragraph of text.
Take a look on the below example.

<p>Hi this is Cams an Online English Trainer at Bizmates. I also work for XTDirect as a Remote Call Center Agent. XTDirect is a company that offers cable subscription in the US. During my available time, I do a self study about HTML and CSS code aiming to pass the qualification for Happiness Engineer in the future.</p>

If we put our heading, sub-heading and the paragraph, it will look like this:

Welcome to my Page

About Me

Hi this is Cams an Online English Trainer at Bizmates. I also work for XTDirect as a Remote Call Center Agent. XTDirect is a company that offers cable subscription in the US. During my available time, I do a self study about HTML and CSS code aiming to pass the qualification for Happiness Engineer in the future.

That’s it for today. Let’s all absorb these codes and their functionalities one day at a time. I’ll post more about it and HTML5 in the coming days.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

Blog at WordPress.com.

Up ↑

%d bloggers like this: