Introduction to HTML and CSS 2 day remote one on one training course - £450 plus VAT

Please note:

Due to the current coronovirus situation this course is currently only available as a live remote one on one course.

Once things are back to normal we will be running public dates in London, Manchester, Sheffield, Leeds, Nottingham and Birmingham, as well as in-person one on one courses and private (closed) courses.

Click here to register your interest in this course and we will keep you informed when any new dates are added.

Synopsis

This HTML and CSS training course will give you an introduction to Hypertext Markup Language (HTML) - the language of the world wide web.

You will learn how to write your own web pages and to style them using Cascading Stylesheets (CSS).

Duration

2 days

Cost

£450 plus VAT (£540 inc VAT) for our remote live one on one course, accessed over the internet - click here for details

Dates

We can arrange dates to suit you - please contact us for further details or to book this course.

Prerequisites

There are no prerequsites for this course

Detailed course contents

Introducing HTML

  • What is HTML?
  • HTML files
  • HTML and the internet
  • HTML and browsers
  • Common browsers
  • HTML versions

HTML page structure

  • HTML page structure
  • The document type declaration
  • Document type settings
  • HTML 4.01 versions
  • New DTD in HTML5
  • Validating your HTML
  • The header section
  • The contents of the page
  • Writing an HTML page
  • What is an element?
  • The html, head and body elements
  • Contents of the head element
  • The title element
  • Contents of the body element
  • More on Headings
  • The p element - paragraphs
  • Spaces and tabs in text
  • Emphasising text within paragraphs
  • Adding a strong emphasis
  • b and i elements
  • Line Breaks
  • Adding comments to HTML
  • Special characters in HTML

Adding links and images

  • Embedding images
  • img element attributes
  • Image formats
  • Image height and width
  • Specifying image height and width
  • Creating links
  • Opening a link in a new window
  • Absolute vs relative paths
  • Relative paths
  • Linking to a particular part of a page
  • What links look like
  • Using an image as a hyperlink

Image maps

  • Image maps
  • Creating image maps
  • The map element
  • The area sub-elements
  • The shape attribute
  • The coords attribute
  • Map element in a separate file

HTML logical elements

  • Addresses
  • Abbreviations and acronyms
  • Defining terms and phrases
  • Quotations
  • The Meta element (Meta tags)
  • Setting the content type
  • Specifying the character set
  • New charset attribute in HTML5

Styling your HTML

  • Styling your HTML
  • What is CSS?
  • Internal style sheets
  • Specifying styles in a separate file
  • CSS rules
  • CSS rules for multiple elements
  • Declaring Styles Inline
  • Background colour
  • Colours
  • 3 digit hex values
  • Functional notation
  • Functional notation using percentages
  • Colour names
  • Background images
  • Formatting text: colour
  • Formatting text: alignment
  • Formatting text: decoration
  • Formatting text: indentation
  • Formatting text: text transformation
  • Fonts
  • Generic font families
  • Font style and weight
  • Font size
  • Deprecated tags and attributes

More CSS

  • Reference by ID
  • Reference by class
  • Being even more specific
  • Pseudo-classes
  • Block and inline elements
  • The CSS display property
  • div and span
  • New in HTML5: section and article

Lists

  • Lists
  • Ordered lists
  • Declaring an ordered list
  • Unordered lists
  • Declaring an unordered list
  • Definition lists
  • Declaring a definition list
  • Displaying lists
  • Formatting lists

The box model

  • The box model
  • Borders
  • Border styles
  • Border width and colour
  • Shorthand border definition
  • Setting individual borders
  • Padding
  • Padding individual sides of an element
  • Margins
  • Setting individual margins
  • Using margins to centre a block element
  • Height and width
  • The full size of the element
  • The full size of the element – IE bug
  • Visibility
  • Positioning
  • Static positioning
  • Fixed positioning
  • Relative positioning
  • Absolute positioning
  • The z-index property
  • Float

HTML Tables

  • Data vs layout tables
  • Example: Using a table to display data
  • Defining a table
  • Add a caption and summary to tables
  • Column widths
  • colspan and rowspan
  • Formatting table data

HTML Forms

  • What are HTML forms?
  • HTML form example
  • The input element
  • New input type values in HTML5
  • New input attribute in HTML5: autocomplete
  • New input attribute in HTML5: required
  • New input attribute in HTML5: placeholder
  • Password fields
  • Text areas
  • Radio buttons
  • Checkboxes
  • Hidden fields
  • Submit buttons
  • Reset buttons
  • Labelling form elements
  • A form’s action
  • Form submission methods

XHTML

  • XHTML
  • XHTML: differences from HTML 4.01
  • XHTML DOCTYPE declaration
  • Changes to document prologue

Next steps

  • Using JavaScript for form validation



FAQs

  • What are the course times?

    • Most course days run from 9.30am to around 4pm, however as we are currently only offering one on one remote courses during the current crisis, we can be quite flexible if you would like to do different hours.

  • Do I need anything?

    • For our live remote one on one courses you only need a computer with the Chrome browser, and speakers or headphones to hear the instructor. When it comes time to do an exercises you can either connect to our computer to do them, or do them on your own computer. We will advise for your specific course what software you would need to do them on your own computer but don't worry, you can connect to ours if you prefer.

  • How can I pay?

    • Once you have booked you will receive a confirmation email, and shortly after that, an invoice. For online courses payment is required before the start of the course. Payment can be made by bank transfer (BACS etc), cheque or card.


Other courses