Code A Day

The 1st beginner layout we created introduced the basic elements of an html page. In this lesson you will learn about more things to put in your html page with html headers, paragraphs and creating links(otherwise known as links)!

Copy the above code, paste it into a file called “index.html” and upload it to the root folder of your website. Lets begin.

The first new element in this file is the “h1″ tag. The “h1″ tag is a header tag. There are 6 header tags ranging from h1 to h6, h1 being the biggest. The header tags usually go at the top of your page or at the top of a new section on your page. You would typically place the name of your web page between the header tags, thus we have <h1>Andys Website</h1> in this example.

We extended the paragraph from our first Beginner Layout example and included a “hyperlink”. The “hyperlink” tag starts with “a” then “href”, which I believe stands for Hyperlink Reference. Then, the website that you would like to point to. So, the first part of a hyperlink looks like this: <a href=”http://www.codeaday.com”>. Now, in order to have a hyperlink, something has to be linked, and then you have to close the hyperlink with a closing “a” ( </a> ). Now, the linked item can either be text or an image. For now, we will just link text. Here is what the whole hyperlink looks like: <a href=”http://www.codeaday.com”>HTML</a>.

Here is what the code should look like after you are done:

If you want your hyperlink to open up in a new window then you need to add the target=”_blank” tag to your hyperlink. It should look like this: <a href=”http://www.codeaday.com” target=”_blank”>HTML</a>.