Palette with Variables expanded by CSS

Potentially simplifying the work for Web designers, the working group behind the Cascading Style Sheets (CSS) Web standard is extending the language so that it supports the ability to define and call variables.



Tab Atkins, a Google developer who is on the working group has been taking suggestions this week as to what may be the best approach to represent variables in CSS.

As its name indicates, CSS is a stylesheet language, one that defines for a browser how a Web page, Web presentation or some other form of electronic content should be formatted. CSS offers a set of keywords to specify stylistic elements in a page layout, such as the font and spacing of text, and the color of the background. CSS can be embedded in the HTML page itself, either in the header or in the body. Or CSS code can be a separate file on the server, which is then referenced by the page.

To date, CSS has not yet offered a way for designers to define their own properties. Users have asked for this feature at least since the language's launch in 1998, according to CSS Working Group co-chair Daniel Glazman. Although the CSS Working Group uses the name "variables" to define this new feature, CSS variables would not have the full scope of the variable primitive found in most languages, Glazman explained. But it would allow designers to define the properties they use on a regular basis.

Nonetheless, such a naming capability would be handy, according to a draft document proposing the addition. It can cut down the amount of copying and pasting a designer must do to update a large Web site, for instance. If an organization has a standard set of colors and fonts to use across a Web site, CSS variables would allow these unique properties to be named by the designer. Then, when a stylistic change needs to be made, the designer simply reassigns the new values to the variables, eliminating the error-prone task of updating that information in each separate stylesheet and Web page.

The CSS working group is still trying to determine how the variables should best be represented in CSS. The designers favor declaring by using a reserved keyword, "var," in front of a new variable, so a new variable would be fined as var-NewVariable. But some users have expressed an interest in a specific key to define a variable, such as the "$" symbol, as in $NewVariable. Atkins cautioned against this approach as it limits the use of "$" for other variable activities, however.

While such matters may seem trivial, those who use a programming or markup language on a daily basis would benefit from the language being as consistent, and predictable, as possible. For instance, PHP has been roundly criticized for having an inconsistent syntax. Because PHP function names vary from one to the next in how they are formatted -- sometimes they have underscores and sometimes they don't -- programmers have more difficulty remembering or guessing the names of PHP functions, forcing them to consult documentation.