html5 Site Icon CSS3 Site Icon CSS Site Icon

HTML5 Basics

HTML5 Basics  Section Under Construction

Our HTML5 journey begins with these HMTL5 basic lessons and the skill level is aimed at people with little or no HTML5 experience. Each lesson is bolstered by hands on practicals that get us into the swing of HTML5. By the end of the HTML5 Basics Tutorials we will have enough HTML5 knowledge to produce a nice looking web page.

The Basic Lessons

These lessons get us started with the tools we need and give basic guidelines on creating and updating files and folders. We then explain HTML syntax and then introduce some structure to our web documents. As the lessons progress and we learn more HTML tags and become more confident we start building up a nice little webpage. To summarize, we bring everything we have learnt from the HTML4 Basic Tutorials together, which will lead us nicely into the HTML5 Intermediate Tutorials.

Lesson  1: Starting Out

In Lesson 1 we gather the tools required to create our first HTML5 page and make a folder to store our HTML5 Basic practical files in. We do our first practical and view the results in a default web browser. You'll be amazed how easy it is to get going with HTML5, try it and see.

Lesson  2: Basic HTML5 Structure

We start this lesson by exploring the syntax behind a HTML tag, by explaining start and end tags, tag attributes and some of the terminology commonly used. After this we take a quick tour on the basic structure of a HTML document. The lesson ends with a second practical where we add some HTML5 tags to the file we created in Lesson 1 and compare the results.

Lesson  3: Headings

With the basic structure of a HTML document behind us and an understanding of HTML syntax it is time to add some meat to our documents with the HTML heading tags. In this lessons practical we introduce each of the 6 heading tags and explain what they mean.

Lesson  4: Paragraphs and Line Breaks

Ok we have lots of headings but we need some text content to make them meaningful, welcome to the paragraph HTML tag. The practical explains the use of the paragraph tag and we also check out the line break tag to see their effects on our web page.

Lesson  5: Emphasising Text

Wanna make a piece of text stand out from the crowd? Here's where we use some HTML tags to do just that. Most presentation is done via the use of Cascading Style Sheets, or CSS as it's better known, but the tags in this lesson are great for emphasising text on our web pages.

Lesson  6: Ordered and Unordered Lists

Everything you wanted to know about lists and were afraid to ask. Lists are great for all sorts of things including navigation bars, collections of links and anything that needs to appear, well, in a list. We give you the lowdown on ordered and unordered lists in the HTML4 Basics tutorial.

Lesson  7: Images

Although the majority of a web page is informational text, images really improve a web page. So liven up your web pages with images and see how well placed images can really enhance a web page. Basic image use is the topic of this lesson and the practical sees us adding some imagery to our webpage.

Lesson  8: Links

Links are what help us and visitors to our web sites navigate our way around the various pages that make up the site. This lesson is all about linking to other documents or parts of documents. Whether it is paragraphs on the same page, other pages on the same website or even external links, we see how to do it here.

Lesson  9: HTML4 Basics Summary

To conclude the HTML4 Basics Tutorial section we bring all we have learnt together in a web page utilizing the knowledge we have gathered so far. Even with just a few basics you can really get your web pages looking snazzy and well laid out. We will use all the HTML tags from the HTML basics and see what can be achieved with a small percentage of the HTML tags available

Related Tutorials

HTML4 Intermediate - The Intermediate Lessons.

HTML4 Advanced - The Advanced Lessons.

What's Next

In Lesson 1 we gather the tools required to create our first HTML page and make a folder to store our HTML Basic practical files in. We do our first practical and view the results in a default web browser.

Homepage  << Prev          Next >> Starting Out

go to home page Homepage go to top of page Top