HTML | Web Principles Training

Course Description

Web pages are formed with HTML and styled with CSS. HTML allows you to define web page elements such as text content, graphics, tables, lists, Flash files etc.

Web browsers read this HTML & CSS code and display the specified elements accordingly. Having a solid understanding of HTML & CSS is greatly advantageous when using programs such as Dreamweaver which are designed to create pages written in these coding languages.

This course provides you with an introduction into these languages and covers the planning and design aspects of creating a website.

Prerequisites

Participants should have:

  • Basic file management skills including opening, saving and closing files.
  • Basic editing skills including the ability to copy, paste and undo.

Outcomes

At the end of this course, students will have a good understanding of HTML and the web design process and will be able to edit HTML pages.

This course (or equivalent knowledge) is a prerequisite for the Dreamweaver Level 1 course.

Course Outline

HTML Fundamentals

HTML , XHTML & HTML5 – Overview

Reasons to learn XHTML / HTML5

Tag syntax / structure / rules

Elements, Attributes & Values

Measuring units – px, %, em

Closed & non closing tags

Deprecated elements and attributes

Inline & block level elements

Nesting tags

Special characters & whitespace

Web Design Overview

File & folder naming conventions

XHTML vs HTML5 – pros & cons

Cascading Style Sheets overview

JavaScript overview

Browsers & page rendering

Firefox Web Developer Toolbar

The process of planning a site

The process of designing a site

Doctypes & encodings

Text Content

Creating mono-spaced text

Blockquote text

Abbreviations & acronyms

Setting Head Tags

Creating Title tag

Creating Meta Description tags

SEO (Search engine optimisation) tips

Layout a Web Page

Defining heading tags

Divs for creating layout blocks

Code comments

Inserting Images / Graphics

Inserting images

Optimise & save considerations

Interlaced GIFs & progressive JPGs

Image resolution

GIF, JPG & PNG file types

The ‘alt’ attribute

The ‘title’ attribute

Horizontal rules

Linking to Other Pages

Absolute vs. relative link paths

Opening linked pages in new tabs

Linking to files in your site

Linking to external sites

Creating &linking to named anchors

Creating email links

Defining Lists

Ordered lists

Unordered lists

Creating Tables

Create tables & table tags

Styling a Web Page with CSS

CSS syntax / structure and terminology

Selector types including:

element, class, id, contextual

Colour & the hexadecimal system

 

Make enquiry »