Website Design Using W3C Web Standards — A 2 day course

Enquire about this course

 Closed In-House Course

Synopsis

Most business-people recognise the commercial importance of the Internet, but few realize how easy it is to learn the skills required to produce a basic Web presence.

This practical workshop introduces the basic elements of the HyperText Markup Language (HTML) and its XML-compatible variant, XHTML, i.e., the standards which determine the structure and use of web pages.

Unlike most web site design training courses, this one is not locked-in to any particular vendor's web browser, web server, application server, or operating system.

Like all GBdirect website design training courses, it teaches best practice in vendor-neutral, standards-compliant, cross-platform, and completely transferable skills, i.e. you will get real XHTML training and not merely one company’s take on it.

On completion of this course, students should be able to produce standards-compliant website design which works with any of the well-known packages in this field, e.g., Dreamweaver, MS FrontPage, GoLive, IIS, Apache, ColdFusion, WebSphere, Lotus Domino, Microsoft Windows, Unix, Linux, .Net, SunOne, etc.

To an even greater extent than normal, this web site design course is delivered through hands-on exercises, backed up by expert tuition in fundamental principles and best XHTML coding practice.

Whenever possible, students use hand XHTML coding techniques to learn the fundamentals which underpin proprietary web page editors like Dreamweaver, GoLive and FrontPage.

Suitable For

The course is intended for communications, marketing and design professionals who need to develop high-quality World Wide Web pages without external help.

Publicly scheduled dates, locations, and prices

Contents

Overview of HTML

• Brief history of HTML and XHTML
• How the web works — clients and servers
• Browsers and rendering

The Basics of HTML

• Hierarchical structure: elements (tags) and text
• Basic XHTML document structure
• Paragraphs
• Whitespace and line breaks in XHTML
• Headings
• Phrase mark-up in XHTML
• Hypertext links
• Embedded images
• Lists
• Preformatted text
• Special characters in XHTML
• XHTML and Semantic markup

Simple design customisation with CSS

• Relationship between XHTML/HTML and CSS
• Linking to a stylesheet in a separate file
• Examples of common customisations

Images

• Bitmapped images
• Types of image: GIF, JPEG, PNG
• Image type tradeoffs
• Creating images

Tables

• Using tables for tabular data
• Abusing tables for layout in XHTML
• Basic table structure
• Cells that span rows or columns
• Cell alignment
• Styling table cells

More CSS

• The box formatting model
• Borders
• Margins and padding
• Collapsing margins
• Formatting edges differently
• Background colours and background images
• Selectors
• Multiple selections
• Classes <div> and <span>
• Descendant selectors
• Text appearance
• Typefaces
• Font sizes
• Other font properties
• Leading
• Text alignment and justification

XHTML

• What is XML?
• Relationship between HTML and XHTML
• Why use XHTML?
• Changes in the document prologue
• Changes in element tags
• Handling empty elements

HTML and Scripting

• Server-side scripting: forms
• XHTML Form elements
• Client-side scripting
• JavaScript
• Graceful degradation
• Examples

Embedding Multimedia

• Image maps
• Embedding flash movies
• Graceful degradation