Writing a Web Site - HTML VIT102

Learn to create web pages.

Explore different methods of laying out an HTML page.  Investigate some of the techniques employed by web developers to Navigate between web pages. Experiment with the use of images and background images on web pages. Use style sheets to change the look and feel of a web page. Build a web site based on a client design specification.

This course is designed to provide the student with a "starting point" for understanding the world of Web Development. It will provide sufficient training for you to start producing your own HTML pages and publish them to the Internet.

Duration:   100 hours



  • Understand the basics of HTML and create your first HTML Page
  • Explore the use of HTML tables to layout a web page
  • Recognise the many different types of HTML links used to navigate a web page and web site. Understand the importance of navigation in relation to people browsing your site
  • Learn how to add images to a web page and understand the importance of page weights and download speeds
  • Understand the web safe palette and the use of style sheets to control the look of a web page
  • To be capable of designing and planning a basic web site that satisfies a client requirement
  • Understand the importance of interpreting web site specifications in the planning and constructing of a web site
  • Make your web site visible to the outside world


There are eight lessons in this course as follows:

Lesson 1. Getting Started

What is html, What is a tag, Create an html page, Write a file, File Naming, View your First Page, Your First Page Explained, Structure of an HTML page, Structure of Tags, Tag Attributes, Adding More Detail to a Page, Laying out Text, Adding Colour, External Style Sheet, Validation

Lesson 2. Page Layout
What is CSS, Defining a Style, Using CSS for Web Page Layout, Importing CSS Styles into HTML, Styles used for page content and layout, Margins, Padding, The Box Model, Maximum Heights and Widths, Using the Display Properly, Position, Float, CSS Units, Common Layouts, Text Layout, Terminology

Lesson 3. Navigation
What is a Hyperlink?, External Links, Text Links, Naming Links, Image Links, The Target Attribute, Email Links, Internal Links, Navigation Bar, Navigation and Useability, Terminology.

Lesson 4. Images and Page Weights
Image Format, Selecting Image Type, Sourcing Images, Viewing Images on a Web Page, Background Images, Tricks with Background Images, Page Weight, Optimal Page Weight, Image Optimisation

Lesson 5. Colour and Style
Designing with Colours and Styles, Colour, Understanding Hexadecimal Named Colours, Named Colours vs Hexadecimal, Web Safe colours, Tags that Support Colour, CSS -Cascading Style Sheets, Cascading Styles, Font Matching, Inline Styles Using an ID, CSS Classes, IDs and Classes, External Style Sheets (ESS), Linking a Page to ESS

Lesson 6. Designing a Web Site
Planning your Design, Interviewing a Client, Design Review, Prototypes, Signoff, Designing a Home Page

Lesson  7. Building and Testing a Web Site
Planning a Site Before you Build, Prototype Design Navigation and Build, Test during and after Build, W3, Html Standards, Well Formatted html, Validation, Usability Checks, Checklist

Lesson 8.  FTP
What is ftp, Anonymous ftp, ftp Client, Registering your Domain, Web Hosting, Affording the Overheads


Learn How HTML Works

- then learn to write, edit, troubleshoot with html.

HTML works in a very simple, very logical, format. It reads like you do, top to bottom, left to right. That's important to remember. HTML is written with plain (or raw) text. What you use to set certain sections apart, such as bigger or smaller text, bold or underlined text, displaying a picture or table of information, a hyperlink to another document or resource is a series of tags.

What is a tag?
Think of tags as commands. HTML tags are just simply text, but so the browser can understand that the text is a tag and not text to be displayed, all tags are contained between opening < and closing >, for example: <title>. The text between the arrowheads is the HTML keyword and must be one of the many HTML tags supported by the version you’re using. 

HTML tags were originally designed to express the structure and meaning of a document, not its display – so we have paragraphs <p>, blockquotes <blockquote>, headings <h1> and <table> for example, and <em> for emphasis of text. Later, developers demanded control over presentation, so elements such as <b> (bold) and <font> were added. Many of these features were added by the browser companies, hoping to gain larger support by developers and greater marked share – they were not part of the original standards. HTML 5 has returned us to a focus on structure, allowing CSS to control the display.

Using Tags

Let's say you want add a heading to your document. You will put a tag at the exact point you want the heading text to start and another tag where you want the heading to stop, for example:

<h1>This Text is a Heading.</h1>

H1 is the highest level heading – h2 to h6 are also available. The browser will determine how an ‘H1’ is to be displayed. 


Enrol Now!

Fee Information (S1)
Prices in Australian Dollars

PlanAust. PriceOverseas Price
A 1 x $730.46  1 x $664.05
B 2 x $395.01  2 x $359.10

Note: Australian prices include GST. 

Select a payment plan:

Courses can be started anytime
from anywhere in the world!

All orders processed in Australian dollars.