HTML – The basics & help!
Are you looking for UK hosting that helps you understand basic website languages? There are many languages that can be used in building a website but many seem intimidating to use. The most important language to know is HTML because it is the base of all web pages. Other languages like Java or MySQL need to communicate with HTML in order to run. At first glance HTML may look complicated yet once you know the basics then you can eventually create the ideal website. At 600host UK our staff has put together basic HTML examples to get you started.
Hyper text mark-up language or HTML is an easy language to learn. It is made up of HTML elements that have individual attributes with specific meaning such as the title element stands for the title of a document. The HTML elements contain tags that are enclosed by angle brackets “ <>“. Within the angle brackets is the body of the web page and its contents.
The majority of elements have a start tag and an end tag that are wrapped around a range of text. The characters within the tags are mostly abbreviations for a page element or instructions on formatting. For example:
Note that the starting tag does not have a forward slash and the end tag does. When there is no forward slash the formatting is turned on and when there is a forward slash the formatting is turned off.
There are also a few stand alone tags that do not need an end tag. These tags can be placed where you want an element to appear. A good example would be the
element which is used when you need to add a single line break.
To start you need an < html > tag which tells the browser that it is reading a document. As with most tags, at the end of the document you need to close it with a < /html > tag so the browser knows the HTML has ended.
There are basic tags that are used on a webpage such as the head, title, body, or paragraph. Typically the title is contained within the heading. Examples would be:
< head >
< /head >
The body is the substance and content of your webpage. A basic webpage that included the body, head, and title would look like this:
< html >
< head > < /head > < body >
All about my webpage.
< /body >
< /html >
The
< p > element represents the paragraph and every paragraph needs a start and end tag otherwise the sentences would stay within the same line. A good example for various paragraphs is as follows:
< p >Paragraph 1 to be displayed< /p >
< p >Paragraph 2 to be displayed< /p >
< p >Paragraph 3 to be displayed< /p >
< p >Paragraph 4 to be displayed< /p >
You can also have more than one heading. With every heading there is a line break. The < h > tag is the element for a heading and you can have up to 6 headings. An example for more than one heading would be:
< h1 >Heading1 to be displayed < /h1>
< h2 >Heading2 to be displayed < /h2 >
< h3 >Heading3 to be displayed < /h3 >
And so on.
Now lets say that you wanted to include breaks for several lists of items for deserts that you make and you want more than one heading and a descriptive paragraph. A basic example would be as follows:
< h1 >Jane’s Desserts< /h1 >
< p>This website was created so I could share some of my favorite desserts.< /p >
< h2 >From My Kitchen< /h2 >
< p>
Cherry Cheesecake< br >
Blackberry Pie< br >
Apple Dumplings< br >
Peach Cobbler< br >
Chocolate Chip Cookies
< /p >
The webpage would look like this:
Jane’s Desserts
This website was created so I could share some of my favorite desserts.
From My Kitchen
Cherry Cheesecake
Blackberry Pie
Apple Dumplings
Peach Cobbler
Chocolate Chip Cookies
There are also many tags that can be used to format the text. You can change the typeface, color, size, and alignment. There are a wide array of fonts and colors to choose from but it is best to keep it universal because some typefaces and colors may not be compatible with other browsers. Examples for font tags would be:
Typeface:
< font face=“times new roman” >body of paragraph with times new roman typeface < /font >
Color:
There are two different methods that can be used to change a fonts color:
< font face=“times new roman” color=“blue“ >body of paragraph< /font >
or
Font Size:
There are seven sizes that you can choose for a font. The biggest size starts with seven and the smallest size is one. To use the tag for font size it would look like this:
< font size=2 >about the size of 12 in Word< /font >
Alignment:
You can align your text to the left, right, and center. This can be done with a heading, or paragraph. Examples would be:
< p align=“left”< /p >
< h1 align=“right”< /h1 >
< p > align=“center”< /p >
< p >Other Elements That are Useful:
Background (bgcolor) is within the body element
< li >bulleted list< /li >
strike-through (s)
underline (u)
bold < b >
& is &
< is <
> is >
Adding images: < img src=“imagename.jpg” >
Adding hyperlinks: < a href=“http://www.600host.net” >600 Host< /a >
* Please note – a space is included to show html in article please remove this when placing code in your favourite editor!
Robert Coates
600Host UK