Sent by Joe Howley on 12 December 2002 14:02
Aaron Mehl wrote:
> What am looking for is a set of Golden Rules that I can start from for
> all times. I am not talking about a book to buy or an article to read
> but something along a chart, maybe more than a page. Too much is said
> on each browser and confuses me and I end up having a page that works
> in none.
Well, I can't give you any specific rules at the moment - but I think I
can help you along in the general Golden (or at least Shiny) Rule
department. The trick here is that XHTML is what you use to structure
and describe your information. Mark up and describe your content
faithfully and accurately (and validly). Then we come to the wonderful
world of CSS (struggling to keep this on topic). The trouble is, it's
hard to define Shiny Rule for CSS aside from "make it validate." The
CSS should, ideally, present your marked-up information in a helpful and
aesthetically pleasing manner.
Browser compatibility, I'm afraid, is all you. If you know your
audience (eg an intranet running IE5.5), design for that, but on the
greater web, there's just no way to be sure what people will be using.
Thus we come back to the importance of your markup - all the css in the
world won't help a non-graphical browser, so don't sacrifice your markup
for the sake of pretty appearance.
> I. Xhtml or HTML
Whatever works for you. XHTML is, of course, more forward-compatible,
but maybe HTML has something you need.
> II. Strict or Transitional -quircks
See above.
> III. Structural design Divs spans, is there a difference between class
> and id
> Should the html tags be used for structure?
Class v ID is easy, a class is a _type_ ("flavor") of an element that
can be used throughout a document (if you declare div.chocolate, you can
have any number of <div class="chocolate"></div>s in your document).
An ID is like a name for one specifice element (declaring div#george,
you can only have one <div id="george"></div>).
DIVs are, theoretically, for DIVisions of content. A SPAN simply SPANS
a set of content. One difference is in their structural role - a DIV is
block-level, getting its own box in the page layout, while a SPAN is
inline. Think of the difference of drawing a square around a paragraph
of text and highlighting a few sentences (if that helps....).
> IV. Units of Measure what to use and where ems pxs etc
This is one of those Holy Wars which we try to avoid (because it'll all
end in tears), but the general idea is that ems are relative to each
other and thus most friendly onscreen in terms of letting the user
resize teh text in his or her browser. Px are absolute pixels
measurements and thus fixed onscreen. We're edging onto the browser
compatibilty fracas here because some browsers (Moz, Op) will let you
resize text no matter what the unit, while some more widely used
browsers (IE) are fixed in px terms and only resize ems and %s.
And then some folks argue that you should use pts on print stylesheets
and print sheets only, because they're designed as a print sizing technique.
Ultimately, see I.
> V. Colors to use are we still stuck with web safe or not? Hex names
> or color names?
See I. Sorry, it depends. Personally I think that if you have to have
a color match an image exactly you've already lost the battle. Here's
the dirty secret - you have no control - _none_ - over the platform your
webpage will be viewed on. Browser, operating system, color settings,
monitors - all out of your control. For this reason, I don't believe
there's any such thing as "websafe," and I say to hell with it and use
whatever hex code I want. Images are transparent if they need to blend
in. This is, however, my opinion.
> VI. Centering
Text? You can use text-align: center. Elements? Well, give it a width
and declare both margin-left and margin-right to be auto, or else just
declare both margins to the same width, but there's compatability and
behavior issues both ways.
> VII. Positioning Divs pictures uls ols etc. which it the best way?
See I. it's all about the context you're trying to do this in.
> VIII. muliple style sheet
Well, for different media, it's a good idea. In terms of modularization
throughout a site, again, see I. (Boy do I feel like a jerk saying that).
> IX. inheritance
?
Wow, I'm sorry, I wrote way more than I intended to, and wasn't as
helpful as I would have liked. Maybe we can clarify this list into the
basic issues of css application that new users will need to understand,
and then come up with brief summaries of each of the options and how
they can be used. Sounds like wiki material to me.
Hope this helps, please ask again for further clarification of anything,
===
joe howley
http://joe.sameperson.net/
