HTML Catch Up

I have just found out that the next workshop lessons that I will be attending as part of my course is web development and focusing on HTML. So before I go to this workshop I am going to look at previous website that I have created on my own. I will be pointing out how it works and a few key codes that are important to any website.

Above is my website that I created using HTML, CSS and jquery. As you can see it is very simple how the code isn’t as simple. The first bit of code is one of the most important and that is the Meta tag and link style sheet. These’s pieces of code are two of the most important. The meta tag is important for getting your website found on search engines and the more descriptive it is the better. The style sheet is used to link the CSS file to the website allowing you to customize your website even further. This link code was also used to link it the jquery to the website aswell. This is all taken place in the header.

Moving away from the header and into the body, I used a number of different pieces of code to create it so instead of going through all of the different codes I am just going to talk about the important ones used.

<H> – Heading, will text a large bold text

<P> – Paragraph, will create small regular text

<div> – Divider, will create a section of the page, size needs to be set

<a href=””> Hyperlink, will link text or image to a link

<img src> – Image, will inset an image into the webpage, size can be set

This is is most of the code that you need to create a website. However to make it look good, you will need to make a style sheet using CSS.  Within CSS there are a few important pieces of codes that are often used.

#… – Used to relate to an ID created in the HTML

Body{

Background – Set a image or colour as the background

Background-repeat – Set the background to repeat not repeat all the way down the page

}

Padding – Will create space around item

Border – Create a border

Color – Set a colour

font-size – Set font size

font-family – Set the font

I would also recommend downloading a CSS reset as it not all web browsers will read the code the same so by doing this is will set the web browsers preset to the default allowing your site to be seen the same on all platforms and browsers.

This is the basic of CSS. However there is alot more to learn and know about this but this is all you need to know to make a basic site. If want to learn more a good website is http://www.w3schools.com/. Below is the screenshots of the some of the code I used to make the website.

Advertisements