Learning CSS

August 09, 2004 | View Comments (17) | Category: Design

Summary: Learning CSS. Learning CSS. Learning CSS.

Not too long ago Keith posted his Learning CSS article and I immediately thought to myself why I never created an article of my own. Then I happened to run across Justin French's excellent You've Mastered CSS, Now What? and was again reminded that not everyone is a master of CSS.

When you have been working with a technology for so long it kind of becomes difficult to tell people the best methods for learning it because maybe your methods aren't what work best for everyone. I definitely encountered my bumps and bruises and still seem to be going through some growing pains in my learning process (although I know a hell of a whole lot). The thing with me and CSS is that no matter how much I seem to know, I always feel like there is a better way to code it, which is probably true.

If you are just beginning to get into design you really shouldn't look at learning CSS as an option or something to do down the road. Start learning it immediately. I just interviewd with two different government agencies and not surprisingly, both of them were very high on CSS and the benefits that it proposes.

Even more if you are not learning CSS then you are learning tables and if you are doing so you are only making your life harder. These two design methods require two completely different modes of thinking. Start with CSS. I have a hunch it will work out for you.

Where to Begin

Before you attempt to learn CSS (or any technology for that matter) you should have an understanding of why it is important to learn is imperative. Here are some articles from the past that do a great job of explaining the benefits of CSS/Web Standards and why you should focus on that type of development over tables.

Now after reading all of that you should feel good about the decision you are making. With that it is time to move on to the tutorials that will help you grasp the basics of CSS to get you going. As there are many sites that give you a basic beginner's tutorial on CSS, there are two that I am going to recommend to help get your feet wet.

If you are more of a sitdown by the fireplace type learner (and are not using a laptop and wireless connection to view these tutorials) then you should checkout these books:

Honestly though there isn't much in those books that can't be found online already. However, it's always good to have a book to fall back on when you are tired of the computer screen.

Do As I Code

Ask any programmer the best way to learn programming and they will tell you is by doing it. The exact same goes for CSS. You can read all the tutorials you want, but until you experience the IE 3px bug for yourself then you just can't grasp it. The great thing about coding and practicing is that you don't even need a web server to do it. Open up your favorite text editor or WYSIWYG software, create an HTML file with the CSS embedded and open up your browser. Voila! Instant coding environment.

Stretching Your Limits

Now that you have played around and grasped the basics of CSS there is always new territory to be explored. This is where the CSS Vault comes in. Go look at the designs and find the ways that people are pushing design with CSS. View the source. Add the code to your own practices. Explore the resources and read about new coding concepts.

After doing all of this you should have a solid grasp of CSS. Essentially to continue learning it's a rinse, wash, repeat type of cycle. This just goes to show that once you start down the CSS path, there is no turning back. If you need some quick inspiration or just to continuously remind yourself that more and more people are joining the CSS bandwagon make sure to checkout Michael Simmons' beautiful CSS Mosaic of sites in the Vault.

Trackback URL: http://9rules.com/cgi-bin/mt/mt-tb.cgi/294

Comments

#1

Bowman's Throwing Tables Out of the Window

Zelnox

#2

And this one (hard to find tough):
http://www.happycog.com/lectures/dwws/

Rimantas (http://rimantas.com/)

#3

"...I just interviewd with two different government agencies and not surprisingly, both of them were very high on CSS and the benefits that it proposes...

Really?

Having worked for a NASA contractor not too long ago, I find this interesting. Is it really CSS that they're high on, or just meeting the Section 508 spec?

Of course 508 can be achieved with CSS, but I really tend to see the two as seperate entities.

Mark (http://www.lightpierce.com/ltshdw)

#4

I'm working for a U.S. Dept. of Defense contractor right now, and am redesigning many internal and project-based websites using CSS.

As soon as I mentioned to the existing web team that they could (more easily) pass Section 508 guidelines using semantic XHTML, and then decrease site updating time and bandwidth using CSS, they were sold.

I feel that U.S. government clients are very much in-tune with benefits such as "it takes less time to update" and can readily see how CSS and web standards can help them achieve that goal. As soon as you explain how they can save taxpayer money by using web standards, then their eyes light up and it's a green light from then on.

Any other gov't people out there who would like to expound on this topic?

Mike Rundle (http://www.businesslogs.com)

#5

I always like these articles, because no matter how well you know something, you can always learn more.

One area that I see as a real struggle for web designers is software design. There is a mountain of theory on how to design quality software that is very applicable for web designers that gets completely missed in the web design community.

You can tell pretty quickly by looking at the javascript that most designers use. So after you become an expert at html, css, js, php, etc you still have 30 years of software design principles to learn.

Better get reading.

heath weaver (http://wbmny.com)

#6

Is it really CSS that they're high on, or just meeting the Section 508 spec?

In both interviews there was zero mention of section 508 compliance. They were pretty well-grounded in what Web Standards were so I have to assume they understood that the use of CSS lead them down the path of accessibility. Therefore, the topic stayed on CSS (amongst other things).

Scrivs (http://businesslogs.com)

#7

"...I just interviewd with two different government agencies and not surprisingly, both of them were very high on CSS and the benefits that it proposes...

I too am surprised to hear the gov't so interested in CSS. I have a site that is hit mainly by gov't browsers and my stats for NS4.x are quite high. So high that a table-less css layout is out of the question.

This isn't a stumbling block for the agencies you are talking to?

seth (http://www.sethgreen.net/Display_URLs_When_Printing/)

#8

Well one agency had most of its work being done on the main public page so that made Netscape pretty much a non-issue since they always upgraded.

The second agency had a lot of internal web apps that required IE 6 (bad coding) so again NS 4.x wasn't an issue.

Scrivs (http://businesslogs.com)

#9

Hmmm... I've been wondering if somehow my stats are off. Although I'm not sure what would be causing it. I've got upwards of 50% of my users on NS 4.x? That's crazy!

seth (http://www.sethgreen.net/Display_URLs_When_Printing/)

#10

Man that is weird. I don't even get readings on NS 4.x anymore on any of my sites. So I am assuming I get less than a hundred a month.

Scrivs (http://businesslogs.com)

#11

Mike -

My point was not that Government is opposed to CSS design, but rather it's something they're only motivated in doing (from my perspective) if it's something that's being pushed to them in terms of standards compliance like ISO 9002 or Section 508.

Rarely (actually never) in my experience have I seen that the upper powers that be are motivated by someone coming in and presenting a plan to save the public money - unless it was the President himself doing that by cutting the agency's budget.

Can you expound on which specific agency / contractor you work for within the DOD?

Every site I've seen recently still has that circa '96 look and tables feel about it.

Mark (http://www.lightpierce.com/ltshdw)

#12

Oh I know Mark, I just felt like dropping my little situation into the pot :)

I work for Northrop Grumman Mission Systems, and projects I am currently involved in are for the Defense Information Systems Agency, which is part of the Dept. of Defense/Military umbrella.

I've had the rare opportunity to interact directly with DISA gov't clients, explaining the benefits of web standards, and to get them as excited about CSS/XHTML as I am. So probably my situation was slightly different than most, but just like everyone else, a simple discussion of the real benefits of using CSS will always get people interested.

Mike Rundle (http://www.businesslogs.com/)

#13

Cool. Nice looking site. I used to work for the United Space Alliance which is a Lockheed Martin / Boeing venture. As you can see by the link, they're still stuck in the mid-90's with their design.

Yours is truly, as you say, a unique experience.

Mark (http://www.lightpierce.com/ltshdw)

#14

Oh, I didn't design that DISA site— the stuff I'm working on I'd have to kill you if I showed you ;) ;)

Mike Rundle (http://www.businesslogs.com/)

#15

I didn't design the USA site either.
Considering I worked for a company that specialized in strapping people down to hitch a ride on a missle, you probably wouldn't have to kill me, just hurt me a little.

Mark (http://www.lightpierce.com/ltshdw)

#16

I'm want to learn css. Would you like to send a tutorial about css, pleas?

Eri Mulyana

#17

I am glad to read this article~
Perfect~

x5 (http://www.x5.com.cn/blog/)

Keep track of comments to all entries with the Comments Feed

Post a comment










Remember personal info?