Looking for a good CSS file for webpage projects

[John Dalberg]

I have a hodgepodge of css files for different projects that I have
inherited from others. It's getting a bit messy and confusing and have no
desire to use them again.

For my new projects, I would like to start using a good 'bog' css file that
has a whole bunch of css declarations for a consistent look and feel and it
includes ones that redefine html tags. Anyone can share one or recommend a
site for css samples that I can use.

Also looking for websites that have tutorials on what css to use for good
looking forms and layouts.. like what font to use for form labels, what
font size for what purpose, is it pixel or point...etc I am not into a
general css tutorial but what are good "best practices for css" to enhance
readibility and work flow.

Thanks for any help.

J.

 

[SpaceGirl]

I have a hodgepodge of css files for different projects that I have
inherited from others. It's getting a bit messy and confusing and have no
desire to use them again.

For my new projects, I would like to start using a good 'bog' css file that
has a whole bunch of css declarations for a consistent look and feel and it
includes ones that redefine html tags. Anyone can share one or recommend a
site for css samples that I can use.

Also looking for websites that have tutorials on what css to use for good
looking forms and layouts.. like what font to use for form labels, what
font size for what purpose, is it pixel or point...etc I am not into a
general css tutorial but what are good "best practices for css" to enhance
readibility and work flow.

Thanks for any help.

J.

It'd be just a fast to make one yourself.

--


x theSpaceGirl (miranda)

# lead designer @ http://www.dhnewmedia.com #
# remove NO SPAM to email, or use form on website #

 

[brucie]

in post: <

I have a hodgepodge of css files for different projects that I have
inherited from others. It's getting a bit messy and confusing and have no
desire to use them again.

delete them. slowly in front of people who don't have css files is best.
also try some "being tortured" sound effect while you're doing it.

For my new projects, I would like to start using a good 'bog' css file that
has a whole bunch of css declarations for a consistent look and feel and it
includes ones that redefine html tags.

like spacegirl says

Also looking for websites that have tutorials

see below

like what font to use for form labels,

or how about not specifying any at all so the visitors preferred font is
used or just specifying the generic family so you get the look you want
while the visitor gets their preferred font for that family

what font size for what purpose, is it pixel or point...etc

percentages and use 100 of 'em as the smallest (some believe slightly
below 100% is ok but i'm not one of 'em).


css tutorials and other fun 'n giggly css stuff:
http://www.css.nu/
http://www.mako4css.com/
http://www.richinstyle.com/
http://www.blazonry.com/css/
http://www.w3schools.com/css/
http://www.websitetips.com/css/
http://www.htmlhelp.com/reference/css/
http://www.pageresource.com/dhtml/indexcss.htm
http://www.webpageworkshop.co.uk/main/css_index
http://old.climbtothestars.org/coding/cssbasic/
http://www.htmlcenter.com/tutorials/index.cfm/css/
http://www.freewebmastertips.com/php/content.php3?aid=48
http://www.canit.se/~griffon/web/writing_stylesheets.html
http://www.utoronto.ca/ian/books/xhtml2/exerpt/css-4a.html
http://www.greytower.net/en/archive/articles/tsutsumi.html
http://www.intranetjournal.com/articles/200101/csstutorial1a.html
http://webmonkey.com/authoring/stylesheets/tutorials/tutorial1.html

layout examples:
http://www.glish.com/css/
http://www.csszengarden.com/
http://www.bookofstyles.org/
http://tantek.com/CSS/Examples/
http://www.saila.com/usage/layouts/
http://www.bluerobot.com/web/layouts/
http://www.benmeadowcroft.com/webdev/
http://nemesis1.f2o.org/templates.php
http://www.xs4all.nl/~apple77/columns/
http://www.meyerweb.com/eric/css/edge/
http://www.htmler.org/tutorials/3/1.html
http://css.nu/articles/floating-boxes.html
http://webhost.bridgew.edu/etribou/layouts/
http://www.roguelibrarian.com/lj/index.html
http://css-discuss.incutio.com/?page=CssLayouts
http://ecoculture.com/styleguide/r/rollovers.html
http://thenoodleincident.com/tutorials/box_lesson/index.html
http://www.webreference.com/authoring/style/sheets/layout/advanced/

some sites using css layouts:
http://www.inc.com/
http://www.wired.com/
http://www.opera.com/
http://www.kitty5.com/
http://www.cinnamon.nl/
http://msn.espn.go.com/
http://www.virtuelvis.com/
http://www.emptybottle.org/
http://www.fastcompany.com/
http://www.littleyellowdifferent.com/
http://www.pga.com/pgachampionship/2004/

rounded corners:
http://www.albin.net/CSS/roundedCorners/
http://www.alistapart.com/articles/customcorners/
http://www.guyfisher.com/builder/workshop/css/corners/

slants: http://www.infimum.dk/HTML/slantinfo.html
lists: http://www.alistapart.com/articles/taminglists/
pure css menus: http://www.meyerweb.com/eric/css/edge/menus/demo.html
Fast rollovers: http://www.pixy.cz/blogg/clanky/cssnopreloadrollovers/

centering thingys
http://dorward.me.uk/www/centre/
http://www.w3.org/Style/Examples/007/center.html
http://www.student.oulu.fi/~laurirai/www/css/middle/
http://hicksdesign.co.uk/articles/css/vertical_centering_with_css/

master compatibility charts:
http://centricle.com/ref/css/filters/
http://www.blooberry.com/indexdot/css/index.html
http://macedition.com/cb/resources/abridgedcsssupport.html
old:
http://www.immix.net/html/CSSGuide.htm
http://devedge.netscape.com/library/xref/2003/css-support/

hiding CSS from crappy browsers:
http://diveintomark.org/safari/csshacks/
http://www.ericmeyeroncss.com/bonus/trick-hide.html
http://www.w3development.de/css/hide_css_from_browsers/

css checkers:
http://jigsaw.w3.org/css-validator/
http://www.htmlhelp.com/tools/csscheck/

cascading style sheets, level 2 specification
http://www.w3.org/TR/REC-CSS2/
cascading style sheets, level 2 revision 1 Candidate Recommendation
http://www.w3.org/TR/CSS21/

 

[Titus A Ducksass - Gran stopped chastising me so I]

For brevity, I agree with what was just said.
However, each and every user can turn off all font, styles and
colours. They can also set their own style sheets if they wish!

So go ahead and set what % you want. Just don't expect every user to
see it how you expect them to. Even - don't expect some of them to
see it at all.

1. Make your html valid.
2. Check that your html is valid.
3. Do not make any claims to being valid - you will get it wrong!
4. Make sure your CSS is valid.
5. Check.....
6. Do not ...
7. Validate, validate, validate...
8. Do not ask for opinions just validate.
--
It will be a great day when our schools have
all the money they need and the Air Force
has to hold a car boot sale to buy a new bomber.
-
It will be an even better day when schools teach children to read and write.

 

[Webcastmaker]

For brevity, I agree with what was just said.
However, each and every user can turn off all font, styles and
colours. They can also set their own style sheets if they wish!
So go ahead and set what % you want. Just don't expect every user to
see it how you expect them to. Even - don't expect some of them to
see it at all.

While technically correct, I would guess the percentage of people
that know how (or want) to do this at less than 1% (anyone with facts
disputing this number?)

I think the important thing to remember with the web is that since
the one thing we can agree on is that not everyone will see your site
as you want them to see it. Given that fact, it is even more
important that your target group sees it correctly.

And every site (even if some here refuse to admit it) has a target
audience. Sometimes this target audience is HUGE (google) In which
case it had better work on every browser you can name. And sometimes
it is small (pick any heavy metal band site) Different strokes for
different folks.

But then one of the great things about the web (and this group) is
that we have different points of view. It keeps it real.

1. Make your html valid.
2. Check that your html is valid.
3. Do not make any claims to being valid - you will get it wrong!
4. Make sure your CSS is valid.
5. Check.....
6. Do not ...
7. Validate, validate, validate...
8. Do not ask for opinions just validate.

How do you really feel about validation?

 

[brucie]

in post: <"Titus A Ducksass - Gran stopped chastising me so I changed back."

For brevity, I agree with what was just said.
YAY!

However, each and every user can turn off all font, styles and
colours. They can also set their own style sheets if they wish!

or much more likely hit their back button if the site doesn't "fit" with
their preferences.

1. Make your html valid.
2. Check that your html is valid.

"HTML validation" is a good tool, but just a tool
http://www.cs.tut.fi/~jkorpela/html/validation.html

 

[brucie]

in post: <"Titus A Ducksass - Gran stopped chastising me so I changed back."

As I said previously, in some countries if your html does not validate
you are open to prosecution.

i'm sure you mean if you don't make reasonable attempts to make your
sites accessible you're open to prosecution. valid html is one step in
that direction but is not a requirement. <pokes out tongue/>

 

[Toby A Inkster]

If it don't validate, you are open to prosecution (in certain
countries).

Name three.

 

[Titus A Ducksass - Gran stopped chastising me so I]

While technically correct, I would guess the percentage of people
that know how (or want) to do this at less than 1% (anyone with facts
disputing this number?)

Yes.
But the point is they can - and I take great pleasure in showing
anyone and everyone how to make the web accessible to themselves.

I think the important thing to remember with the web is that since
the one thing we can agree on is that not everyone will see your site
as you want them to see it. Given that fact, it is even more
important that your target group sees it correctly.

And every site (even if some here refuse to admit it) has a target
audience. Sometimes this target audience is HUGE (google) In which
case it had better work on every browser you can name. And sometimes
it is small (pick any heavy metal band site) Different strokes for
different folks.

As above

But then one of the great things about the web (and this group) is
that we have different points of view. It keeps it real.


How do you really feel about validation?

My interpretations may not be legal - they are my logic.
If it don't validate, you are open to prosecution (in certain
countries).
If you want to add the logos afterwards then make sure you have
re-validated as there is nothing worse than addling a 'I AM A PILLOCK'
logo and forgetting to alt tag it.

--
It will be a great day when our schools have
all the money they need and the Air Force
has to hold a car boot sale to buy a new bomber.
-
It will be an even better day when schools teach children to read and write.

 

[Titus A Ducksass - Gran stopped chastising me so I]

in post: <"Titus A Ducksass - Gran stopped chastising me so I changed back."


or much more likely hit their back button if the site doesn't "fit" with
their preferences.


"HTML validation" is a good tool, but just a tool
http://www.cs.tut.fi/~jkorpela/html/validation.html

As I said previously, in some countries if your html does not validate
you are open to prosecution.
--
It will be a great day when our schools have
all the money they need and the Air Force
has to hold a car boot sale to buy a new bomber.
-
It will be an even better day when schools teach children to read and write.

 

[rf]

"Titus A Ducksass - Gran stopped chastising me so I changed back."

As I said previously, in some countries if your html does not validate
you are open to prosecution.

Nope. The law says nothing at all about validation.

You can quite happily use things like
<body marginwidth="0"> <!--to keep Netscape 4.x happy -->
which will not validate but is perfectly accessible.

However, you might get into real trouble if you use the perfectly valid CSS
rule:
body {color: green, background-color: blue;}
which is quite valid but makes the text invisible to about 3% of the male
population of the planet.

brucie and I know. We live in "one of those countries". Plus, it is not
prosecution, it would be an order from the government to correct the
situation or be fined. It has happened.

 

[brucie]

in post: <"Titus A Ducksass - Gran stopped chastising me so I changed back."

England, Wales, Scotland, Australia.......

i cant comment on the others but aust is not one of them

 

[brucie]

in post: <"Titus A Ducksass - Gran stopped chastising me so I changed back."

Define reasonable.

it doesn't matter what i consider reasonable although i suspect i would
be much harder to satisfy than the appropriate organizations.

Under the Acts, sites should follow the guidelines - and there is the
problem, they are only guidelines.

luckily they only are guidelines as some (e.g parts of WCAG) hinder
accessibility not improve it.

there is a big difference between satisfying guidelines and creating
accessible sites.

 

[Webcastmaker]

Not tested under UK law yet.

I find it interesting how lawyers will use anything they can to make
money. Sue, sue, sue. Lets great a generic world where everyone is
the same. The generic human. It will eventually lead to our downfall
because in reality, we are not all the same. And you cannot write a
law that changes that fact.

Oh well, it will be an e-ticket ride.

 

[Titus A Ducksass - Gran stopped chastising me so I]

in post: <"Titus A Ducksass - Gran stopped chastising me so I changed back."


i'm sure you mean if you don't make reasonable attempts to make your
sites accessible you're open to prosecution. valid html is one step in
that direction but is not a requirement. <pokes out tongue/>

Not tested under UK law yet.

Define reasonable. Sites are either compliant with SENDA / DDA ACts
or they are not. Under the Acts, sites should follow the guidelines -
and there is the problem, they are only guidelines.

It depends on how the rules are interpreted as to what means what.
Just adding alt tags makes sites 90% better.

The RNIB are still helping individuals to pursue claims through the
courts but they get settled before getting there.

If in any doubt, contact Julie Howell at the RNIB.
--
It will be a great day when our schools have
all the money they need and the Air Force
has to hold a car boot sale to buy a new bomber.
-
It will be an even better day when schools teach children to read and write.

 

[Titus A Ducksass - Gran stopped chastising me so I]

Name three.

England, Wales, Scotland, Australia.......

If sites do not validate then they are not compliant with the
guidelines.

The SENDA / DDA Acts require that websites be compliant with the
guidelines.

I know you understand this more than others Toby and I hope you are
just playing devils advocate.
--
It will be a great day when our schools have
all the money they need and the Air Force
has to hold a car boot sale to buy a new bomber.
-
It will be an even better day when schools teach children to read and write.

 

[Toby A Inkster]

If sites do not validate then they are not compliant with the
guidelines.

The SENDA / DDA Acts require that websites be compliant with the
guidelines.

The DDA requires that websites are accessible, but it doesn't require that
websites conform to W3C standards. It is true that often invalid HTML can
be a barrier to accessibility but one does not imply the other: there are
certainly accessible websites that do not validate and inaccessible
websites that do validate.

As an example, I like to think of my own website as pretty accessible.
Changing my <body> tag to <body foo="bar"> would make it invalid (there is
no attribute "foo") but wouldn't be a barrier to accessibility. On the
other hand, <body style="color:red;background:green"> is valid HTML but a
barrier to accessibility.

On that note, I leave you with:
http://validator.w3.org/check?uri=http://www.disability.gov.uk/

 

[Steve Pugh]

The DDA requires that websites are accessible, but it doesn't require that
websites conform to W3C standards.

In the absence of any case law, both lawyers and accessibility
consultants are recommending that complying with the WCAG guidelines
is the simplest way to ensure DDA compliance. And using valid code is
a priority 2 guideline (hence needed for Level AA compliance).

Given time and some court cases a fuller definition of what the DDA
means for web sites will emerge.

It is true that often invalid HTML can
be a barrier to accessibility but one does not imply the other: there are
certainly accessible websites that do not validate and inaccessible
websites that do validate.

Very true.

On that note, I leave you with:
http://validator.w3.org/check?uri=http://www.disability.gov.uk/

One missing </p> (or one extra <p>).
However that site is so boring to look at, all it really does is
reinforce the inaccurate idea that accessibility means dull design.

Oh and I wouldn't take accessibility advice from anyone who thinks
that alt="The Disability Logo - clicking here will take you to the
disability home page" is good practice (especially as this is the home
page).

Steve

 

[Andy Dingley]

England, Wales, Scotland, Australia.......

You're "open to prosecution" for blasphemy if you include a <blink>
tag. The prosecution may _fail_, but we're all (as a general
principle) at liberty to drag any bogus argument we care to before a
court, and to claim that it's a breach of whichever statute we wish.
It's then the court's job to judge the merits of such an action. Only
if you make a habit of it and have yourself officially judge-slapped
do you lose this right.

In the current situation of almost complete uncertainty about the
_legal_ demand for accessibility, then we're still not much better
off.

If sites do not validate then they are not compliant with the
guidelines.

Is this stated anywhere ? I agree with the principle, but do any
statutory requirements really go this far ?


And what is "validation" anyway ? I certainly don't understand what
it means in obscure cases (read my comp.text.xml post). Does this mean
passing HTML validation ? Does Appendix C apply too ? What about
making a page with valid CSS that becomes unreadable owing to a
browser bug on the most popular browser ?

In Lessig's essay he argues that there is "No law of the horse" and
that this is a good thing regarding future internet legislation (or
the lack of need for it). Theft is theft, and there's no need for a
law against stealing horses when there's already a more general law
against theft that applies perfectly well. When law is framed to be
too specific, it all too often becomes an ass rather than a horse. The
idea of _lawyers_ arguing over technical standards compliance is
horrifying. As an example, look at the current US case where a
bookshop offered an ISP service to its customers, then snooped their
email to look for Amazon orders - yet the legal wrigglings have proven
(sic) that this wasn't wiretapping.

 

[Neal]

The
idea of _lawyers_ arguing over technical standards compliance is
horrifying. As an example, look at the current US case where a
bookshop offered an ISP service to its customers, then snooped their
email to look for Amazon orders - yet the legal wrigglings have proven
(sic) that this wasn't wiretapping.

Where's the wire?

They didn't intercept a transmission, they read a file sitting on their
own computer. I'm not saying it's right, but it isn't wiretapping.