HTML and CSS : Introduction

Two Day Course

Now Available As Online Training!

Overview

Our HTML and CSS course will give you the training you need to understand the basic coding components for building a website.

This two day course is aimed at those with little or no previous coding experience. It is best suited to people who want to create sleek and attractive websites by learning web page markup and structure using HTML, as well as design using CSS. Ideal for those interested in web development, digital marketers wanting more control over their CMS or designers.

After attending this course you will be able to create a professional and engaging website as well as understanding the HTML and CSS languages, website architecture, creating online forms and more.

What are the 5 things you will get out of the course?
• Create attractive web pages from scratch
• Edit existing HTML files with confidence
• How to work with images and videos
• Format and style text with CSS
• Understand the HTML and CSS languages

You need no previous experience to attend this course.

Public Course Dates & Pricing

Course Outline

• Day one
  
  Introduction
  • The role of HTML
  • The role of CSS
  • Web standards and mandatory elements
  • Understanding a robust HTML5 template
  • The purpose of the head element
  • Understanding Meta Data
  • About element attributes
  
  Beginning to Code
  • Overview of a HTML editor
  • Making code easy to read – best practice
  • Working with the title tag
  • Write your first body content and test
  • Adding headings and sub headings
  • Overview of structural elements
  • Adding structure to the page
  • Working with paragraphs
  • Using local formatting for bold, italic and underline
  • Adding line breaks and rules
  • Using special characters
  • Adding comments
  
  Images & Video
  • Overview of supported image file types
  • About image optimisation
  • Embedding images
  • Image Accessibility
  • About Video file formats
  • Streaming HTML5 video
  • Providing video fallback content
  
  HTML Lists
  • Using the Definition List for terms and descriptions
  • Grouping related key-points with Unordered Lists
  • Structuring hierarchical points with Ordered Lists
  • Ordered list bullet options
  • Nesting Lists
  
  Hyperlinks
  • Linking pages together
  • Linking to external websites
  • Creating links within a page
  • Creating Image links
  
  Questions and answers
• Day two
  
  Data Tables
  • Overview of data tables
  • Inserting a table
  • Adding a caption
  • Structuring rows
  • Adding table headers and table data
  • Merging columns
  
  Front End Forms
  • Overview of how data is sent to the server
  • Embedding a form
  • Providing fields for user input
  • Inserting radio buttons and checkboxes
  • Creating select list menus
  • Adding reset and submit buttons
  • Understanding form action and method attributes
  • Emulating form processing by sending to a static page
  • Using inbuilt form validations
  
  Overview of CSS
  • What is the Cascade?
  • What can CSS do?
  • Where to put the CSS code
  • Separating content from design
  • Syntax and structure
  
  Applied CSS
  • Working with External CSS
  • Understanding the Element selector
  • Working with fonts
  • Understanding hexadecimal colour theory
  • Styling text colours with hexadecimal and colour names
  • Using text alignment
  • Styling paragraphs
  • Styling headings
  • Styling hyperlinks
  • Understanding the Class selector
  • Creating and applying Class styles
  • Using the span element
  • When to use the ID attribute
  • Creating and applying ID styles
  
  Questions and answers