일반 W3C CSS validator installation

The W3C CSS validation service is delivered as a Java servlet but can also be installed as a desktop application integrated with your favourite CSS editor. This article explains how to set up the W3C CSS checker so you can validate your CSS with a few clicks.

The W3C validator is free open source software, but the documentation for the system is minimal, incomplete and written for Java developers. This article is written for CSS developers that are Java novices. If you find this article is unclear or assumes too much about what you know, use the feedback form below to suggest improvements.

Article outline

1. Essential software

Download the Java libraries for the validator.

2. Java Runtime Environment check

Check you have the Java runtime installed.

3. Validator batch script configuration

Create a script to hold all the Java references and test.

4. CSS file validation script

Tweak the script to work with a local file.

5. Integrate the CSS validator with your editor

Example integration settings for 3 text editors.

6. CSS validator command settings

Configure the relevant CSS profile and other options.

For convenience save the 7 JAR files in a single directory with short names. The examples below use D:javacss, adjust your own directory references as necessary.

Java Runtime Environment check

You probably have the Java Runtime Environment installed as a Web browser plugin to run Java applets. To check, open a command window and call the java -version command. On Windows, click on the Start button and choose Run.

Type cmd and press Enter or click OK to open a command console. Then type java -version and press Enter. You will most likely see a Java version statement like the one below.

C:>java -version

java version "1.5.0_13"
Java(TM) 2 Runtime Environment, Standard Edition
Java HotSpot(TM) Client VM (build 1.5.0_13-b05)
      

Java Runtime Environment installation

If you get an error message when you check the Java version, that the command is not recognised, download and install the JRE from the Java SE Downloads page. When installation is complete Java should be added to the system search path, repeat the version check and you should see a confirmation message like the one above.

Validator batch script configuration

The configuration of the CSS validator requires all the supporting Java Archive file references to be passed in the Java classpath argument, which makes for a very long command line. To simplify integration with your chosen CSS editor, create a shell script to encapsulate all the command line arguments and use a numbered parameter argument to pass the CSS source reference to the script.

The -classpath argument in the examples below is split over several lines for clarity, your working version should be one continuous line with no spaces. The Java class name org.w3c.css.css.CssValidator should have a space before and after.

Windows batch script example, ValidateCSS.bat

The Windows classpath is separated by semi-colons. The numbered parameter argument is prefixed by a percent symbol. Note the file references in the classpath argument use forward slashes. Save as D:javacssValidateCSS.bat to follow this example.

ECHO OFF
CLS
java -classpath D:/java/css/css-validator.jar;
                D:/java/css/jigsaw.jar;
                D:/java/css/velocity-1.6.2.jar;
                D:/java/css/tagsoup-1.2.jar;
                D:/java/css/commons-lang-2.4.jar;
                D:/java/css/commons-collections-3.2.1.jar;
                D:/java/css/xercesImpl.jar
                org.w3c.css.css.CssValidator %1
      

To test the Windows batch script, open a command window as above, type the path to the script followed by the URL of an HTML page to check. Press Enter to validate. Note the directory path on Windows uses back slashes, .

C:>  D:javacssValidateCSS http://www.w3c.org/
      

CSS validator test results

If your validator script test is successful, you should see output that starts as follows then lists the style sheet content.

{output=text, medium=all, warning=2, profile=css21, lang=en}
W3C CSS Validator results for http://www.w3.org/

    Congratulations! No Error Found.

This document validates as CSS level 2.1 !
      

The most likely errors will be incorrect or incomplete classpath references for the 7 JAR files, so check and correct as necessary. This test requires an Internet connection.

CSS file validation script

The W3C validator requires a file:/ prefix to process CSS files, so save a modified version of your shell script to handle files, as below. The file prefix could be passed to the script rather than embedded in it, but this arrangement will make integration with your CSS editor easier at the next step.

Windows CSS file validation script, ValidateCSSFile.bat

ECHO OFF
CLS
java -classpath D:/java/css/css-validator.jar;
                D:/java/css/jigsaw.jar;
                D:/java/css/velocity-1.6.2.jar;
                D:/java/css/tagsoup-1.2.jar;
                D:/java/css/commons-lang-2.4.jar;
                D:/java/css/commons-collections-3.2.1.jar;
                D:/java/css/xercesImpl.jar
                org.w3c.css.css.CssValidator file:/%1
      

Test the script as before, but pass a CSS file name enclosed in quotes instead of a URL. The quotes allow for spaces in the file path. The Windows file path uses back slashes, to separate directories.

C:>D:javacssValidateCSSFile "D:javacssPrint.css"
      

Integrate the CSS validator with your editor

The shell scripts above will simplify the process of running the CSS validator from a command console, but any good text or CSS editor should be able to run the validator on the current file. The examples below show how to integrate the W3C CSS validator with TextPad, EditPlus and UltraEdit for Windows and indicate the equivalent settings in your preferred CSS editor.

CSS validator set up for EditPlus

The EditPlus text editor is available at http://www.editplus.com/.

1. Select Tools > Cconfigure user tools..., activate the Group Name... button and add a label for the program group, e.g. "W3C CSS Validator".
2. Activate the Add Tool button and select the Program option.
3. Insert the cursor in the Menu text field and add a label for the tool, e.g. "Validate CSS".
4. Select the button alongside the Command field to browse and select the ValidateCSSFile.bat program created above.
5. Command program selected.
6. Insert the cursor in the Argument field and use the selector alongside to add the $(FilePath) parameter for the current file.
7. Check the Capture output box. This option will list the validation results beneath the main editor pane.

This validation option can be accessed via the Tools menu and will have a keyboard shortcut assigned.

CSS validator set up for TextPad

The TextPad text editor is available at http://www.textpad.com/.

1. Select Configure > Preferences... > Tools, activate the Add button and choose Program.
2. Browse and select the ValidateCSSFile.bat script created above.
3. Select the program entry to add a label to the tool, e.g. "Validate CSS".
4. Insert the cursor in the Parameters field and insert the $File parameter to specify the current file.

TextPad applies output capture settings by default to list the validation results in the editor window. The new validation option can be accessed via The Tools menu and will have a keyboard shortcut assigned.

CSS validator set up for UltraEdit

The UltraEdit text editor is available at http://www.ultraedit.com/.

1. Select Advanced > Tool cofiguration... to access the Tool Configuration dialogue.
2. Activate the Insert at the top right and type a new menu item name, e.g. "Validate CSS".
3. Activate the Browse button alongside the Command Line input and select the ValidateCSSFile.bat script created above.
4. Command selected.
5. Insert the cursor in the Command Line field after the ValidateCSSFile.bat script and add the %F parameter to specify the current file.
6. Insert the cursor in the Working directory field to add the %P parameter to specify the current directory.

This validation option can be accessed via the Advanced menu, and will have a keyboard shortcut assigned.

CSS validator command settings

The W3C CSS validator will accept a number of additional command arguments to configure how it processes style sheets and formats the results. The general scheme is to follow the validator class name org.w3c.css.css.CssValidator with one or more option commands before the final CSS source reference.

... org.w3c.css.css.CssValidator -profile css3 file:/%1

... org.w3c.css.css.CssValidator -medium print file:/%1

... org.w3c.css.css.CssValidator -warning 0 file:/%1
      

Multiple configuration commands can inserted in your shell script, but always place the URL or file reference last in the list.

-profile PROFILE or --profile=PROFILE

Checks the style sheet against a specific CSS PROFILE, one of:

• css1 CSS level 1
• css2 CSS level 2
• css21 CSS level 2 revision 1 default
• css3 CSS level 3
• svg SVG
• svgbasic SVG Basic
• svgtiny SVG Tiny
• atsc-tv ATSC TV
• mobile CSS Mobile Profile
• tv CSS TV Profile

-medium MEDIUM, --medium=MEDIUM

Checks the style sheet using a specific media type MEDIUM, one of:

• all default
• aural
• braille
• embossed
• handheld
• print
• projection
• screen
• tty
• tv
• presentation

See CSS media monitor

-warning WARN, --warning=WARN

Warnings verbosity level, one of:

• -1 no warnings
• 0
• 1
• 2 default, all warnings

-lang LANG, --lang=LANG

Prints the result in the specified language, but is likely to cause character encoding problems when run directly from the Java command line. One of:

• de German
• en English, default
• es Spanish
• fr French
• it Italian
• ja Japanese
• ko Korean
• nl Dutch
• pl Polish
• zh-cn Chinese

URL

The URL can either represent a remote Web resource with a standard http:// prefix, or a local file path with file:/ prefix, e.g. file:/D:/java/css/CSPrint.css.

-output OUTPUT, --output=OUTPUT

Mainly used for the W3C validator service, prints the result in the specified OUTPUT format, one of:

• text (default)
• xhtml XHTML
• html HTML (same format as XHTML)
• soap12 Simple Object Access Protocol

-p, --printCSS

Supposed set the validated CSS to be included in the output, but this is always on in the current version. Therefore practically redundant.