LSW-WebDesign

Between Newbies postingat Killersites lately and spammers claiming to work for big companies but with absolutely shoddy code, it came to me the most common problems with people using CSS. Right off let me say that for newbies this should not be embarrassing, I suffered this problem as well when I started.

Beginners are hesitant to use CSS, so they commonly try to work with it bit by bit. Wrong approach - just do it. This is usually seen when someone uses CSS just to effect fonts. Another form is tables with CSS. Yes you can do so but it defeats the purpose. Take this to heart, don’t go half way, just jump in.

1. Thinking it is HTML: Forget what you learned about HTML, this in not HTML it is CSS, another language. All to often you see beginners writing CSS like it is HTML. Just replacing the Font tag with a class name on every paragraph or such.
   The idea is to use external style sheets. Every page is linked to this sheet, make a change to this sheet and every page reflects the change. By using styles inside of the tags, you add wasted code and have to make changes on every element on every page. If you merely define the paragraph tag than every paragraph will have that style, no need to ever ad class or ID’s
   Do not mix, it just makes things confusing for everyone. I see many spammers with HTML attributes, inline styles in tags next to these with Block styles in the header and even a link to an external style sheet. These are god awful monsters to control. I am Webmaster of a site that is like that, the simplest changes will almost always break the site. Beware and avoid such sites and those who build them.
   If you have any CSS, put it all in external style sheets and most any HTML attributes can and should be done in the CSS as well. Remember this is not HTML you are dealing with, do not just replace HTML attributes with styles in the code. If you are going to use CSS it will only bring and advantage if you learn to write CSS as CSS and not as a HTML attribute replacement.
2. Classes: Beginners always write classes, then you will see a dozen paragraphs with identical class names. Again this is due to this HTML style of writing we learned first and how we had to write fonts into everything. CSS is not that way.
   With CSS you can and should use ID’s. Why? Well ID’s for CSS can also be used as reference points for scripts and internal links, you need not name extra elements. Also for instance you name the upper element with an ID <div id="content">, everything in that ID can be defined specifically using that ID. So rather than 5 paragraphs with 5 classes, you need put define what a paragraph within an ID should look like. #content p { } will define any paragraph in a DIV named “content” to have a specific style, any other paragraph in another section will not use that style as it is not in that ID.
   <p id="content"> This way you can use a default style for paragraphs, but say that paragraphs in you content are shown differently than paragraphs in a footer. By using classes, you are creating far more work for yourself. Simply create a default and then redefine any elements by adding it to a ID description. In this way define links found in one ID element to look different from links in another ID element.
   Now this may seem a bit hard to follow, but keep it in mind. CSS is about minimize code. Ask yourself if you can not make things easier and smaller. A class can be used as often as you wish. An ID can be used only once per page. So use ID’s as often as possible, then when you go to use a class, ask yourself if it is really something you need. Ask yourself if you need to use it multiple times or if it is not easier just to say, anything in a element with this name should look this way. Why repeat 5 classes in 5 paragraphs when you can say that a paragraph in a element called “content” should look this way, whether 5 or 25 paragraphs.

So in short as a review:

1. Do not a use CSS inline styles as a replacement for Font tags.
2. Use external style sheets, do not mix HTML attributes, inline styles, block styles (styles in the head tags) and external style sheets. Just use external style sheets for all CSS and HTML attributes.
3. Do not use Classes for everything. Use ID’s whenever possible. It is possible to create web sites with few if any classes at all.
4. Define elements with a ID preamble to it so that those styles only go active when the defined element is in a specifically named ID.

Feel free to view my styles and source code. Once you take these tips to heart, you will discover that CSS is much easier to understand then you believed.
Darkshadow-designs & DSD CSS

So, are you one of those people who argue that accessibility is not needed? Here are some questions for you that I hope will cause you to reconsider.

Do you have statistics? How many blind users do you have? How many color blind users? How many with mobility problems? How many with cognitive problems? I get this alto, “We don’t have enough disabled people to make it worth it.” Well then how many do you have? Show me the numbers. But they can not. So if you can not tell me how many disabled visitor you have, how can you claim they are not enough?

“No one has complained so far…” Aaaaaahhhhh, OK. That simply tells me that no one complains, not that there is no problem. How often do you really complain about things and how often do you just go somewhere else? Ever complained about something in a grocery store and were told no one else has a problem finding things? How would you feel and what would you do if the store did say that to you? Yet that is what you are telling me, why make things better for a user with problems since no one else has complained. If one person did complain would you do a redesign? Really? The problem is, people with problems find web sites every day, most every web site is problematic. Would you write twenty letters a day to tell someone their web site is a problem? After how many non-replies and a number of ?no one else has complained? letters would you simply quit and if a site caused problems just leave and find a new one to try at?

Look around the parking lot next time you go to work if you are a business. Do you have handicapped parking? How often do you really have people use them? Yet you have them… so why would you have handicapped parking while offering your handicapped web user nothing? You can bet that you have more handicapped persons using your web site then you parking spots. If you wish to tell me it is law to have parking… then you mean we must make it law for web sites too? Germans have the BiTV law, the British have the DDA and Americans have section 508 of the ADA. 508 is really just for federal web sites, many states have adopted it. What we do have in most counties are laws against discrimination. Discrimination is illegal. If you make a web site for only healthy, sighted people using IE - are you not discriminating against those with disabilities or other choices in software? Is that then not illegal? Do we need a law to force you to do the right thing for your users and fellow humans?

I work for a newspaper. Very rough country here, steep streets and the like. Snow removal is something that does happen on back streets… at some point. But we are told that carriers MUST deliver to people living up steep hills on slippery, icy streets. That is important, we must serve these customers their papers regardless, it is our sacred duty. If you are a customer like that you expect it to do you not? Yet delivering a web site to someone more difficult… a Firefox user, Opera user, PDA or Cell phone user… this is to much to be expected?

Accessibility is not something you should have to do… it is something you should do of your own choice because it is the right thing to do and because it makes your web site more available to everyone and easier to maintain. Don’t be a follower doing what you must with threats of fines… do it by choice and be a leader at the front of the movement. Show your users that you care about their needs.