Advanced CSS Web Design — A 1-Day Course

 Open Public Course Closed In-House Course Free Lifetime Support

Advanced CSS Course Synopsis

This one-day advanced CSS training course aims to enable experienced web designers to tackle and overcome the tricky problems which can make advanced CSS techniques difficult to implement in a cost-effective manner. Delegates will learn to diagnose, resolve and/or work around the most common problems, bugs, and browser incompatibilities encountered in advanced CSS web design. Expert instruction on these challenges is accompanied by best practice advice on how to create elegant, managable and affordable CSS in timely fashion.

Advanced CSS Course Background

The W3C’s cascading style sheet standards (CSS) have been more successful than many people expected. Every day web sites convert from slow, inflexible, and unmaintainable table-based HTML-formatting to fast-loading, graphically rich pages, using clean simple HTML/XHTML and table-less CSS. Improved performance and usability rarely goes unoticed by users or providers.

Nearly a decade after its launch (1996), CSS has delivered on it’s basic promise. Designers can now makeover web sites without having to touch the content or the markup; speeding up development by an order of magnitude. CSS-based content management systems (CMS) allow authors to publish accessible, semantically and syntactically correct web pages without having to master the finer points of HTML and XHTML markup. While programmers can find and manipulate content without having to tip-toe around minefields of explosive JavaScript and bad HTML markup. In short, the presentation, structure and content of web pages can be cleanly separated from one another and almost everyone is benefitting (except, perhaps, the vendors of old-fashioned WYSIWYG design tools and content management systems).

However, once you go beyond these basic goals, life in the CSS Zen Garden is far from a bed of roses. The biggest problem in advanced CSS web design, is that the world’s most popular web browser (Internet Explorer for Windows) supports only the most basic parts of the CSS standards (CSS1 plus bit of CSS2) and implements critical parts of CSS (e.g. box dimensions) in non-standard ways.

It is a problem which every advanced CSS designer has to face, whether their CSS is written for a cross-browser public website or for IE-only intranets and web applications. Nor will the fundamental problem be resolved by forthcoming releases of IE7 and Windows (members of the IE development team have made it clear that they consider security and user features to be higher priorities than CSS).

IE’s poor support for CSS2, CSS2.1 and CSS3 is not the only significant obstacle to advanced CSS web design. Every popular web browser has CSS rendering bugs (even the CSS-compliant ones like Mozilla/Firefox, Opera and Safari), and the most popular browser has many quite serious bugs. Since these bugs are often triggered by advanced CSS layout techniques (particularly sophisticated use of CSS positioning and floats), learning how to deal with them is an essential requirement for deploying the technology.

This advanced CSS training course is designed primarily to help experienced web designers overcome these problems, by clearly identifying their symptoms, causes and solutions. In a small number of cases, a complete solution may be technically impossible. In such instances, delegates will learn how to identify the risks, how to avoid triggering the bugs and browser incompatibilities and how to limit their negative side effects when they cannot be entirely avoided.

Target Audience for this Advanced CSS Course

• Web designers
• Web developers
• Web usability and accessibility consultants

Advanced CSS Course Prerequisites

• Successful completion of our basic CSS training course (Website Design Using Cascading Stylesheet Standards); or equivalent CSS training and/or hands-on CSS experience
• The ability to code syntactically correct (i.e. valid) HTML/XHTML
• The ability to distinguish semantic markup from a machine-coded pile of <div>s, <span>s and <table>s

Note: If you are unsure about whether your existing CSS skills, knowledge or experience meet these criteria, please telephone 0870 200 7273 and ask to speak to Dave Fisher (the course author). You can test the syntactical accuracy of your HTML/XHTML by running your pages through the W3C’s online HTML validator.

Advanced CSS Course Delivery

This advanced CSS training course consists of expert instruction, hands-on practical exercises and whole class discussion.

Whereas the hands-on exercises in our basic CSS course provide the opportunity to practice and experiment with generic CSS principles, the exercises in this advanced CSS course are more narrowly focused, i.e. on overcoming the most common problems in advanced css design with precise and effective technical solutions. While this means that the exercises themselves provide less opportunity for self expression, mastery of the techniques involved provides the platform for creativity, innovation and effectiveness when delegates return to the production environment.

Once such technical mastery is achieved, the advanced CSS practitioner may choose from a wide range of more or less suitable techniques for achieving similar graphic effects. Through instruction, whole-class discussion and in response to direct questions our expert tutor can provide advice on best practice in given situations, ensuring that deleates not only understand the options open to them, but the pros and cons of making particular choices.

Publicly scheduled dates, locations, and prices

Outline Advanced CSS Course Contents: