Theoretically, the Cascading Style Sheets specification was conceived to give
Web authors a way to control and structure Web-document styles
independent of the program or application generating the document. In
practice, however, CSS requires browser support. And evolving Web standards
have spawned numerous browser versions, which, in turn, handle CSS documents
differently.
Theory and practice are beginning to converge, however, with major Web
browsers nearing full support of CSS--at least the first level of
CSS as defined by the
World Wide Web Consortium
(W3C). Eric A. Meyer is the author of the newly released
Cascading Style Sheets:
The Definitive Guide, as well as a formidable body of
online information about CSS. In this interview he discusses how
CSS is used, where CSS is headed as a standard, and what he covers in
his book.
- Houston:
What exactly does the term "Cascading Style Sheets" mean?
- Meyer:
Cascading Style Sheets is a standard way to separate a document's
structure from its presentation. This sounds very abstract, but the benefits
are quite surprising and profound. In theory, CSS makes one's life easier by
creating a centralized description of Web document appearance. Any Web
designer will likely come up against a situation where he or she really
should use them, and many will no doubt use CSS to do things they never
could do before.
- Houston:
How does someone use CSS?
- Meyer:
All anyone needs to do is create a stylesheet--via a text editor or a
point-and-click program--and then hook it up to a document. That can be
done by embedding the stylesheet inside the document, or by associating a
separate stylesheet file to one or more documents. The styles then
influence the appearance of the associated document(s).
A stylesheet is a text file with a certain format. An HTML file is the same
thing; it's just specially arranged text. An HTML file can be written in
a text editor and then saved as a plain text file. CSS files are no
different. A set of CSS rules can be inserted into an HTML file (or an XML
file, but the book doesn't cover that), or created as a standalone CSS
file. In the latter case, styles can be associated with a document using
a certain HTML element or importing it through an embedded stylesheet.
Point-and-click programs come into it for those authors who would rather
not write straight files in a text editor. Programs such as Frontpage,
Dreamweaver, and Homesite can generate HTML. There are also programs
to generate CSS, for example, Style Master and Topstyle. All of these
programs provide an interface to construct HTML or CSS, and then write out
the result as a specially arranged text file.
- Houston:
Is there anything particularly important to understand about the term
"cascading"?
- Meyer:
"Cascade" is the mechanism by which more than one stylesheet can
be interleaved, and the potential conflicts among them resolved, to arrive at
a single set of styles to be applied to a document. For example, this
mechanism allows authors to create several fragmentary stylesheets and
then combine them in different ways. Each combination could produce a
different set of styles, and therefore a different way of presenting
documents.
- Houston:
Does every Web site or page use CSS--or should they?
- Meyer:
No, not every site uses CSS, although yes, they should! I don't know
of any authoritative statistics with regards to usage, but I do know that
major sites like Amazon.com, CNN.com, and the Internet Movie Database
use CSS to enhance their appearance.
Personally, I can't think of a general situation in which CSS should
not be used. CSS may not be appropriate in the case of a page
being just one big image. What's great about CSS is that it can be used
without cutting off older browsers. If a user views a styled document in
Netscape 2, the styles won't come through but the page content will.
Compare this to something like Flash, where you're out of luck if you don't
have the correct browser plug-in. No plug-in, no content.
Check out Eric A. Meyer's
Top 10
Authoring Tips for CSS.
- Houston:
So what are the drawbacks with CSS?
- Meyer:
Browser support. The early implementations of CSS were not very
good--I'm thinking here of Internet Explorer 3.x, and Netscape Navigator
4.x. The bugs and other flaws in these browsers can make life very difficult,
especially for authors just starting to learn CSS. They begin to learn
bug-sensitive practices instead of the correct way to do things.
The only other potential drawback of CSS is its surprising complexity for
such an apparently simple standard. It's easy to draw incomplete (or even
incorrect) conclusions about correct CSS behavior. I've been wrong about
the correct way to do things numerous times. It's tough to keep it all clearly
arranged in one's head. Everyone who uses CSS struggles with that
problem.
- Houston:
What is your background with CSS?
- Meyer:
I was attending the Fifth International World Wide Web Conference in
order to present a technical paper on a project I'd done at
Case Western Reserve
University. I saw a presentation on CSS1 and was completely
blown away. I started experimenting, but my initial attempts to use CSS1
weren't quite as successful as I felt they ought to be. The styles looked
correct, but browsers just weren't displaying things as they should. With the
kind of arrogance usually reserved for the naive, I assumed the fault must
be in the browser, not my authoring.
Upon further investigation, I found very little information regarding CSS1
support available on the Web, save for Braden McDaniel's page
concerning support in IE3 for Windows95. Since I'm an unrepentant
Macintosh user, this wasn't much help to me, but it did inspire me to create
a similar page concerning Macintosh browser support for CSS1.
This fairly simple act eventually led me to produce an entire body of work
concerning CSS and CSS support, including an
ever-growing number of articles, the CSS Browser Compatibility Charts at Web Review, and the W3C's
CSS1 Test
Suite. The latter two are probably the foundation of my
knowledge, since in order to write tests and rate browser support, I had to
understand CSS thoroughly. And as it happens, much of what was going
wrong in my early experiments was the fault of the browsers--although I
did discover I was making several mistakes.
- Houston:
What's the difference between CSS1 and CSS2?
- Meyer:
-
CSS1 is the first level of a CSS specification as defined by the W3C.
CSS2
is all of CSS1, plus a lot more. One of the most interesting aspects of
CSS2 is positioning, which means the ability to position elements with regard
to other elements, or with regard to the browser window itself.
My book
includes a chapter on this. CSS2 also includes features like generated
content (which lets you define your own numbering schemes, for example),
properties to describe printed pages, methods for describing table layout (to
some degree), styles for aural browsing, and a good deal more. CSS1 is also
oriented primarily for screen devices; that is, for styling content on
computer monitors. CSS2 makes an effort to overcome this limitation by
addressing other media types, making it possible to create separate style
sheets to be applied to a document depending on the display media.
- Houston:
Does your book cover both?
- Meyer:
-
The book only deals with CSS1 and CSS2 positioning because the majority of
CSS2 hasn't been implemented by anyone. I decided early on to stick to
CSS1 because real-world use had shaken it into fairly stable condition.
Readers can try this out for themselves in available browsers. I added
information about CSS2 positioning once it became clear that
implementations would be available soon after the book's publication. As
browsers expand their CSS2 support and we see how things really work, I
hope to write a second edition.
- Houston:
Is there going to be a CSS3?
- Meyer:
-
Yes, and the W3C Working Group is working on a roadmap of sorts
which outlines the direction
CSS3 will take. One big change will be that CSS becomes a
collection of smaller modules instead of one giant specification. This will
allow faster changes to given sections of the specification as needed.,
instead of waiting for a specification-wide uber-update.
Some new things being considered for CSS3 are paged media,
internationalization issues, and harmonization with other W3C standards for
vector graphics, mathematical markup, and multimedia. There are also
plans for more complete descriptions of CSS2 elements.
- Houston:
-
Given the history of browser incompatibility, what is the state of
affairs for CSS with the most current browser releases?
- Meyer:
-
Things are pretty good with Microsoft's IE5.x for Windows, although
there is still some distance to go. From what I can tell, the issue isn't
bugs--those seem to have been largely eliminated--but a simple lack of
support for various parts of CSS1.
Opera 3.6 has
pretty good CSS1 support (at least it isn't bug-ridden), and
it's missing only a few parts of CSS1. Preview releases of Opera 4 look very
impressive in their support of both CSS1 and CSS2. Similarly, the recent
preview release of Netscape 6 features some very nice CSS1 and CSS2
support. Tentatively, the only issues with those browsers will be what to
play with first!
MSIE5 for the Macintosh, on the other hand, boasts what could be the first
complete, bug-free support of CSS1 in a released browser. The jury's still
out on that one, but things look very positive. One reason is that MacIE5 is
the first browser to deploy Doctype switching.
- Houston:
What is "Doctype switching" and why is it important?
- Meyer:
Doctype switching is the ability to designate a document as
"standards-compliant" or "bugwards-compatible," which is a great boon to
authors. It allows us to ease out of the thicket of buggy behaviors without
"breaking" old pages that may depend on the bugs in older browsers. Those
of us carrying the banner of "Standards First!" have been searching for a
way to break free of the flaws which have been fossilized into deployed
browsers. Doctype switching will help this problem once it--or something
very much like it--has been widely adopted.
There are currently plans to include something similar, or perhaps even
identical, in Netscape 6. Opera may or may not follow suit; I expect that
they will, but that's just my gut talking ... which may have more to do with
the burrito I had for dinner than any objective assessment of Opera's
development.
- Houston:
How does CSS compare to or interact with other languages and
technologies such as DHTML, XML, and embedded fonts?
- Meyer:
CSS is a part of "DHTML," for which there really are no standards to
describe. It's a marketing buzzword to describe the intersection of HTML,
CSS, Javascript, the DOM, and probably almost any other Web standards
you could imagine: SMIL, SVG, and so on. Embedded fonts were described
somewhat by CSS2, but nobody really supports that right now. They may
be more fully described by CSS3.
As for XML, it's possible to use CSS for styling XML documents. I haven't
had much time to experiment with this, but I've talked to people who have
done it with current browsers. As both CSS and XML move forward, this
could lead to some interesting shifts in how documents are authored and
presented. This is one of those areas I hope to have time to play with now
that the book's actually done. Who knows? Maybe it will figure into a second
edition.
- Houston:
Is CSS internationalized yet, or will it be?
- Meyer:
The short answer is that CSS2 is fine for Latin-derived languages
throughout Europe and the Americas. However, more work is needed to
accommodate Asian languages. For example, there is no way in CSS2 to
describe vertical writing like that found in certain forms of
Japanese. CSS3 is supposed to address some of these things.
CSS uses the
line box model, which refers to the way a line of text is laid
out. Even though it might seem simple, the act of laying out lines of text
and then stacking them on top of each other to arrive at a paragraph becomes
surprisingly complex when you add variables such as superscripts, the
ability to affect the vertical alignment of text, text of different sizes
on the same line, and so on. Chapter Eight in the book discusses how line
boxes are created, and how this affects the way text is laid out.
- Houston:
Who is the audience for Cascading Style Sheets: The Definitive
Guide?
- Meyer:
Any Web designer or author who is interested in sophisticated
document appearance, and who could use a tool which will save him time
and energy, and who is interested in keeping up with the continuing
evolution of the Web. That should cover just about everyone, I think.
- Houston:
What distinguishes your book from other books and documentation on
CSS?
- Meyer:
I'd like to think it's my winning personality and clarity of writing--but
I think perhaps the best answer is that it not only describes the basics of
CSS in detail, but also brings in advice and information about browser
behaviors.
- Houston:
What do you see in the future for CSS?
- Meyer:
Nothing but good things! CSS is beginning to be used by other
standards. For example, Scalable Vector Graphics (SVG) uses CSS to style
text within SVG images, and it seems that CSS will be the styling
mechanism for the Wireless Access Protocol (WAP), which is to be the
foundation for sharing content on mobile devices.
More importantly, browser implementations of CSS1 are rapidly becoming
both complete and bug-free. This will allow authors to use CSS with more
confidence because one of the biggest barriers to the adoption of CSS has
been the fact that browsers handle it inconsistently. Once that problem
fades away, so will the reluctance to use it. In fact, I might even be able
to get out of the business of charting browser support! I can dream, anyway.
