Web Development
Web Developer Guidelines
Visual Design Recommendations

Checkpoint 1.19 - Mobile-PDA

Only external CSS is used instead of inline styles

WCAG 1.0 Priority 2

WCAG WCAG Guideline 3. Use markup and style sheets and do so properly.

The cascading nature of CSS stylesheets means that inline styles take precedence over embedded styles and externally referenced stylesheets. Inline styles create redundancy and increase maintenance by putting style in multiple places throughout the web site. This requires more attention to maintenance and can lead to style omissions and errors. It also hinders the use of global stylesheets and user-specified stylesheets.

Requirement

Use only external CSS stylesheets. Do not use embedded styles or inline styles.

Recommendation

CSS can be added to the mobile page in the same way as for a normal HTML document, using <link rel="stylesheet" href="external.css" type="text/css" />

Note: Many mobile browsers prioritize markup before presentation, thus loading stylesheets and images last. This sometimes causes markup to appear briefly without styles while the external stylesheet loads.

Checking Tool

View the source code of the document and look for the required <link rel="stylesheet"...> element and ensure there are no <style> elements or style="" attributes on any other elements.

Information Source

The original source of this information is located on the W3C web site  (www.w3.org/TR/WCAG10-TECHS/#tech-style-sheets)

 

Back to top