HTML: Advanced

Course Description:

This course is designed for those already familiar with the basics of HTML or have coding experience with older versions of HTML.

Recent mark up techniques see a move away from HTML towards XHTML and this course focuses on developing structured XHTML web pages while keeping presentation and function completely separate.

You will explore the practicalities of building sophisticated sites in a browser and platform independent manner, learn the advantages gained from a standards compliant approach and focus on working with style sheets to deliver layout and design. This is a two day hands-on course utilising a range of practical real-world exercises. The content of this course is constantly revised to take advantage of new web developments. If you wish to tailor this course to your exact requirements, please call or email.

This course includes the following modules:

Standards compliant mark up

• Overview of more advanced markup
• HTML, XHTML and XML
• Advantages of standards compliant mark up
• Converting and moving to XHTML

Structuring meta data

• Keywords and descriptions
• Search engine friendliness
• Robots tag and robots.txt

Clean, structured pages

• XHTML syntax, options and versions
• Structuring XHTML pages
• Removing presentational elements
• Working with the DOCTYPE
• Understanding natural language declarations
• Building web forms and data tables
• Working with lists
• Special characters

Browsers and user agents

• Standards compliant browsers
• Overcoming older browser problems
• Other user agents
• Cross platform design

Overview of scripting languages

• Client side scripting with JavaScript
• Server side scripting
• Dynamic HTML
• Other technologies

Introduction to CSS

• Separating content from presentation
• What can CSS do?
• CSS structure (syntax)
• Inserting styles - inline, embedded or external
• The cascade order: specificity and inheritance
• Understanding selectors

Styling text

• Deciding which elements to style
• Styling basic text elements
• Using serif and sans serif font sets
• Specifying font size and colour
• Changing or removing bullets from lists

Page layout and positioning

• Divs, classes and IDs
• Using span and div
• Understanding the box model
• Absolute, relative and fixed positioning
• Floating elements to make a two column layout
• Balance between liquidity and layout design

Styling tables

• Styling row and column headings
• Creating borders
• Adding colour

Styling links and navigation

• Creating hover effects
• Lists into interactive navigation

Styling and laying out forms

• Changing properties of input elements
• Positioning form elements
• Grouping form elements together
• Formatting text in forms
• Changing the look of buttons

Creating a print page

• Switching to a different media for print
• Showing and hiding elements
• Altering layout
• Changing font and font size for print