Levels of CSS knowledge
As you might have understood by now I’m very much pro web standards. The current widely accepted standards are: (X)HTML for page structure, CSS for design, and Javascript for behaviour. HTML is pretty well known by now, it has been there since the beginning of the web and there are tutorials everywhere that gets you started. CSS is starting to get a grip, large companies are switching their sites to CSS based layouts and the webdev blogosphere reaches more and more people.
When you promote web standards, like many of us do, you get to talk to a lot of people. If you promote it in a live chat room like #CSS on EFNet it gets even clearer: there are a lot of different levels of CSS knowledge out there. This article is going to list some of those levels along a rating of how this kind of developer will affect the web. Here we go:
Level 0
“CSS? Isn’t that a multiplayer game?”
These people have probably never made a webpage in their life. If they did it was pure HTML and they barely knew what they were doing. We get some of these people in #CSS, not because they want to start learning but because they think they’ve come to another channel, often looking for CS:S. No need to worry about these people, they probably won’t do many webpages in their lives so they can’t do much harm.
Level 1
“Yeah, I use it to remove underlines on links sometimes”
Different from Level 0, the people in this level do actually know basic HTML. They probably learned it at least five years ago and have made a couple of simple sites. They use very little CSS, only when they need to do simple stuff you can’t do with HTML only, like removing underlines and setting line-height (No! don’t even think about setting line-height with HTML). While these people could present us with some badly coded sites they rarely have any large and well visited ones. This means that they won’t do much harm either.
Level 2
“No, I don’t like divs; tables are much easier to work with”
Instead of just playing with HTML, like those from Level 1, some continued their quest. They mastered HTML tables and started using it to make things look just like they wanted. Somewhere around reaching HTML mastery they stopped looking at new ways of working. They heard about other people using “divs to design their pages” and even took some time one day to try to learn what the fuss was about. After a few hours of not getting it they gave up, went back to the familiar land of tabled layouts, and stayed there. Many do know CSS syntax and sometimes even some background but they believe it’s far too hard and ill-supported to use instead of tables.
Watch it! These are dangerous people, some even webmasters of big corporate websites. Since they have been in the business for a while many are leaders for their web departments. These are the people it’s most important to reach, and if we do it means a lot for the web. Concentrate on these people all you standards advocates.
Level 3
“Yes I’ve heard it’s good, but I can’t use it because of…”
While people in this group still don’t use CSS for positioning they do know some CSS and perhaps heard good things about it. They’ve tried making simple layouts and some even liked how it felt to work with. Problem here is that something is stopping them. Perhaps they have a Level 2 boss, perhaps their website needs to cater for Netscape 4 users, there might be many different reasons but something is in the way.
These people need to know that while CSS does not work everywhere that isn’t the end of the world. Old browsers will still get all your content, just pure content. Instead of them you will reach a new audience: there may be accessibility and usability benefits, newer browsers will get a richer experience and the site might even get easier to add content to (which will lead to more content). Tell this to the people in this group. If you’re unlucky they are not be the ones making decisions but in that case their influence on Level 2 Bosses will still be worth it.
Level 4
“CSS? Oh! Yes, I use divs for all my layouts”
It’s not unusual that these people use only divs on their sites. Each part of their page gets a div, often with a carefully crafted id (#toprightredline or even #r5_c7 with r standing for row and c for column), and then they position their divs with absolute positioning by the pixel. The result looks good, hey, it even validates as XHTML 1.1(!) but what they have missed is that most of the benefits of CSS has been lost. These pages are terrible when it comes to a screen reader interpreting it. Same with older non-CSS browsers, they won’t get the content… they will get one big block of text. When using bad class names and ids you loose the possibility to change the layout: if that red line needs to be changed to black you’ll need to change all your HTML documents too (can be hundreds). Don’t fall into the trap of telling them they are stupid or make them google “css”, they know they are smart people and they did learn about CSS from google in the first place. Tell them exactly what could be improved on their sites. Tell them what the benefits are. Keep your cool and tell them why.
People of Level 4 produce sites that are rather bad. The damage is reduced though by them often being open to new ideas. After all, not to long ago they did manage to learn and start to use CSS.
Some of the reasons for people thinking this way is because of what WYSIWYG editors are doing. Most such editors produce terrible div-only code but I’m hearing that there are gradual improvements in this field. This is a good thing and hopefully this will help people move from Level 4 to the higher levels.
Level 5
“I use CSS for design, it’s better than tables because of…”
After a lot of reading, talking to people and thinking most people arrive at Level 5. This is where you both can use CSS and know why it’s better. Some people in this level have minor problems on the sites they produce but it’s nothing serious. When asked they can argue why separating structure and design is a good thing and they have worked with CSS long enough to know the common pitfalls. I’m guessing many of the readers of this article are on this level and I feel I am. But this is not the best we can do…
Level 6
“What version of CSS? Yes, I do. Did you read my book about…”
For some people knowing how and why isn’t enough. These people strive to improve how CSS is used and are publishing great articles on new ways of using it. They constantly go back to the basic needs CSS is filling and attack problems from new angles, often resulting in more great articles. Some have actually read the whole W3C specification on CSS (sic) and they certainly know which parts are supported by which browsers. They function as role models for beginners and do great things for the web with their influence. Many work with the Web Standards Project. If you ever find an error on their site there is a reason for it. Ask them and they’ll tell you why.
That’s it. I hope this article gave you some inspiration to keep pushing the web to new victories. At which level are you? Do you have examples of people in last level?
Trevor ( 11 Jan 2006 )
Level 4 seems to be the most common misunderstanding about web standards. People assume that replacing tables with divs is the right answer. About 10 mins of helping usually turns them away from that though and start seeing the benefits :)
bnovc ( 11 Jan 2006 )
Well layed out and nice looking/interesting.
Moe ( 11 Jan 2006 )
Great article! I think i’am at level 5 but it took it’s time. To answer you’re question about trend setters, the first person how comes to mind is Roger Johansson over at 456bereastreet.com.
Gavin ( 11 Jan 2006 )
Nice little post, might even help those who are afraid of CSS understand how to make the links between what knowledge they do and don’t know. And why it takes time to piece it together.
grexican ( 11 Jan 2006 )
2v2 no mod you serve!?
Veracon ( 11 Jan 2006 )
I hate when people call CSS design ‘using divs’ — divisions are unsemantic and should be carefully used. A bunch of nested divisions really isn’t much better than a layout using tables.
Greg ( 11 Jan 2006 )
Not a helpful article, but very true and interesting. Great observation by the author.
Thomas Sydorowski ( 11 Jan 2006 )
Interesting.
Dustin Diaz ( 12 Jan 2006 )
I classify the first four groups all into one and then weed out the talkers from the professionals. I would be more interested to know how their cross-browser strategies of CSS come into play or what kind (if any) architecture’s they use to maintain their style sheets. What are their thoughts on hack management? What’s the benefit (or drawbacks) of conditional comments?
Btw, did you read my book on…
Emil Stenström ( 12 Jan 2006 )
@Dustin: Jokes aside, those are great topics for later articles! :) I’ll see what I can do.
Andrew Vit ( 12 Jan 2006 )
I like the classifications you propose. However, one thing that most CSS zealots won’t readily acknowledge is that complex flexible or “liquid” layouts are still either impossible (if you want to support IE) or very fragile without adding a table as a placeholder for overall layout. (Visit any 3-column pure-CSS site and resize the window to watch the content squeeze out the bottom.)
This isn’t the fault of CSS2. IE6 is unfortunately still the majority browser, and we still have to support it. Until we can use
min-widthreliably to keep things from collapsing too far, pure CSS layouts will be restricted to two columns or fixed-width. (I‘m a big fan of ems personally, but some clients still want those 3 columns that “fill the screen.” I’ve done a lot of complex fixed-width work using semantic markup and CSS, but I’m still waiting for a robust flexible CSS layout that can match what could be done using the basic old-school 3-column table.Emil Stenström ( 12 Jan 2006 )
@Andrew: did you try zooming the layout on this page? It’s a three-column thing and it resizes to really, really small sizes just fine. It’s perhaps not fluid though, more elastic, so I’m not sure we’re talking about the same thing.
I think CSS works just fine to do 3 col layouts with and I don’t see the problem with it.
Andrew Vit ( 12 Jan 2006 )
Emil, I would still consider your layout to be fixed-width, even though it uses ems. Whether you use ems or pixels, the width of your page is independent of the widht of the window. This is my preferred method too, since it scales nicely with the font size on the user’s browser and gives predictable results. What I was talking about are the kinds of very common table-based layouts where you have a 200px column on the left and right, and the middle stretches to fill the window when it’s resized.
A few months ago I had really high hopes for the One True Layout, but after working with it I found it has limitations in this area too. Its author simply brushes off the fact that it can’t mix 2 fixed and 1 liquid columns by saying “I don’t have any use for that kind of layout.”
Recently I read Apple’s article on Web Development Best Practices and found that I agree with much of what they say. Yes, the table is an unsemantic wrapper to hold the overall layout, but in many cases I have found this method necessary. I would like to see more opinions on these “best practices.”
Left Unspoken » Thursday Thirteen ( 12 Jan 2006 )
[...] 11.) People with levels 1-4 of CSS knowledge. I’d say that after what…2 years or more of doing this, I am finally at level 5 or at lease very close to it. Not to say I don’t empathize with these people. I used to be one of you! But you know what, the web design world is growing and expanding at a million miles a minute (thanks to those level 6’s) and you have to try to keep up with it and learn your craft and practice and get better and before you know if, you’ll be a level 5, too. [...]
jose ( 12 Jan 2006 )
I think that I’m in some place between level 4 and level 5. I’m trying to improve my knowledge about accessibility and semantic markup, it’s a long way but at the same time it’s a lot of fun!
Emil Stenström ( 13 Jan 2006 )
@Andrew: Perhaps you just do more web development work than I do. I have never had to resort to using tables for layout, and to be honest I’d rather rethink my design than doing so. I understand clients might have problem with that.
Thanks for that Apple link, always interesting to see what big corprations are doing.
Frida ( 14 Jan 2006 )
Great article!
Adam ( 15 Jan 2006 )
The best part of this article was the fact that I remember being at each step, all the way up to where i am at now :) It was fun to read and made me realize how far I’ve come
draco ( 31 Jan 2006 )
Maybe that’s why you put a (!) there, but there’s really no strict dtd in XHTML 1.1.
And to me, a
divonly site is way better than atablefull site in all senses. At least they give screen readers an easier job.I could be wrong. lol.
Emil Stenström ( 2 Feb 2006 )
@draco: Thanks, I see now that XHTML 1.1 is just an “extension” of XHTML 1.0 Strict. Removed the word strict from the text above.
Ross ( 7 Feb 2006 )
I would say I’m a level five, however I’m not really at the implementation stage - I understand why I should be using it but I don’t have the experience behind me to really utilise it - I’m currently looking at a website I frequent and have offered to upgrade their site from basic HTML to CSS. They were using the XHTML Standard and had over 290 errors, simply by switching to HTML Strict I reduced to the error count by 110.
Andrew Norris ( 13 Feb 2006 )
Interesting post. I’m a software engineer who is still learning the proper methods of web development, and I am in the process of trying to learn to get to level 5 at the moment, though in the site I’ve been building lately, I still have some stray HTML inserted for layout reasons and my CSS is pretty poorly organized and includes too many one-off classes and id-level styles. This definitely inspired me to try to work harder to clean things up and learn how to do it right. Thanks.
Chris Charlton ( 14 Feb 2006 )
I’m defenitely on transition from Level 5 to 6, w00t!
:)
Beyond Caffeine » What’s Your CSS Level? ( 19 Feb 2006 )
[...] I found this accurate and amusing little article on Friendly Bit and, of course, it immediately got me thinking. “What Level am I?” [...]
Timothy Gray ( 8 Mar 2006 )
Good stuff! Regrettably, I’m a level five. I need to get moving on that level six status…
Jeff ( 8 Mar 2006 )
You missed one - Level 10
‘Yes, I will have that done today.’
They use everything available to make things work, can tell you why and why not, and don’t worry about whether or not its ‘right’ by some arbitrary standard. Also, they are too busy to write self-congratulatory posts on a random site about how people who don’t use CSS properly write bad code. Congrats on your vacuous story.
Emil Stenström ( 8 Mar 2006 )
@Jeff: I see what you mean. Good code and getting things done are different things and from what I hear it’s not often possible to combine them. I don’t look down on the people that are not experts, this is a list that I myself have climbed, from one to five where I think I am now. My intent is not to insult anyone :) (Hope that’s clear enough)
Keith McLaughlin ( 8 Mar 2006 )
I think I’m part Level 3, Level 4 and Level 5. I’m still learning. I know the benefits. But it’s not coming to me as easily as it might have to others.
(P.S I’m working on a web standards version of my site at present).
Dawn ( 8 Mar 2006 )
Nice post. I’d say I’m somewhere between a 4 and 5 myself, and I’m actually finding that clients requirements (SEO, accessibility) are pushing me to put more of my CSS knowledge into practice. My boyfriend just made the jump from a level 2 to a level 4 with a little help from a nice job offer. I’m happy to see he’s finally making some progress and learning how capable CSS is.
Jeff ( 9 Mar 2006 )
I totally beat level 5 — the boss was really hard.
thedeplorableword | Archive | Levels of CSS ( 9 Mar 2006 )
[...] Which level are you? [...]
AllThingsDev.com » Levels of CSS knowledge ( 9 Mar 2006 )
[...] Emil Stenström of Friendly Bit has an interesting article entitled “Levels of CSS knowledge”. Emil breaks down knowledge of CSS into levels of expertise. I see myself as a level 5 with some major room to improve. Although too many times do I find myself replacing tables with div tags. Like I said, room to improve. What CSS knowledge level are you? [...]
nosebleed ( 9 Mar 2006 )
Good points. Although, I will say that it seems a little pretentious to me. As if being level 4 or 5 is REALLY that bad? I consider myself a level 5, but do I want to be level 6? As much as I’d like to be the new innovative and progressive CSS god where CSS isn’t just a “programming language”, but an art form that one knows how to shape and mold to their desires. I guess as a level 5er I think of it as a “tool that I can use to make my site pretty, and do other cool and useful things with”
Allan ( 9 Mar 2006 )
@Jeff: I guess that leaves rooms for level 11, then. Those people who can say: “Yes, I will have that done today,” AND do it correctly.
Standards are arbitrary? It’s somewhat sad that you think so; HTML/CSS standards are certainly _not_ arbitrary. They were carefully considered and thought out by very smart people for reasons that aren’t bloated by commercial considerations. It’s science, not “who can make the worst web site the fastest.”
And true professionals always _make_ time to advocate for the correct way of doing things. Just because you think it’s all a waste of time, does not mean that you are righteous in posting condescending comments in response to a well written post–vacuous indeed.
This blog is title “Friendly Bit”. If you’re not going to attempt to be friendly, please try another venue to outlet your frustration :)
Priti ( 9 Mar 2006 )
Its a well written article. I think im on level 4, although I make sure that I dont use table less layouts just for the heck of it. There is this design which is complete of images with an internal scroll of text along with navigation. After creating a css based layout, realised that it was more confusing and tedious than the table one. The code was running real long too. Hence used a table for the basic layout and divs for the scroll and other text elements. There is this one site I have created which is completely in CSS last year. Would like to know your review on it..mistakes,improvements,etc. its http://www.ishanya.com
Jeriko One » Blog Archive » Level of CSS Knowledge ( 9 Mar 2006 )
[...] I’ve stumbled upon Emil Stenströms article Levels of CSS knowledge, which was quite entertaining to read, since it covers my development in CSS quite well. [...]
Usabilità ( 9 Mar 2006 )
Qual è la vostra conoscenza dei CSS?…
Qual è la vostra conoscenza dei CSS? So che sapete cosa sono i CSS (cascade style sheets) ma a che livello è la vostra conoscenza di questa tecnica? Esistono diversi livelli come potete bene immaginare: dal semplice utilizzo degli stili…
Ukens nettips uke 10 | FWW Web ( 9 Mar 2006 )
[...] på Emil Stenströms artikkel Levels of CSS knowledge. [ Posted i: Nettipset | Kommentarer (0) | Post kommentar] [...]
Nik Steffen ( 9 Mar 2006 )
Level 5, thats about me. Mind you, I quite enjoy a good game of CS:S aswell.
Artueel blog » Blog Archive » Hoe goed beheers jij CSS? ( 9 Mar 2006 )
[...] Dat meer en meer mensen css en (x)html leren is niets nieuw. Maar hoe goed beheers jij css? Emil Stenström onderwerpt je op zijn website niet aan een quis - neen hij werkt met levels gaande van 0 tot 6, per level een korte uitleg. [...]
Ahren Gerber ( 9 Mar 2006 )
I liked this article, but I think there is a stage between stages 4 and 5. I consider myself, by your standards, to be a stage 4.5-4.75.
I am not yet confident that I could solve any CSS problem that comes my way, I still have trouble figuring out how to separate my css documents (as done in ALA) but I’m also not using fireworks DIV slicing or anything. I do my best to create semantic code, with resonable tagging, avoiding “divitis” as best I can, and I also take SEO into consideration while doing the front end coding for my company. I think that level of complexity perhaps warrants another level of development.
Johan De Silva ( 9 Mar 2006 )
I think I am at Level 5 but I never design within my limitations of CSS so some designs maybe too complex and I need to fall back to using a table for part of the frame design.
Shawn ( 9 Mar 2006 )
I work at university and help maintain 4 department and 3 audience based sites which all share the same code base. Recently we decided to go from a left aligned layout to a centered layout. It took 2 lines of code added to one wrapper to change hundreds of pages instantly. Do that with your stupid tables.
Jeff Clark ( 9 Mar 2006 )
Sadly (?) I’m only at level 5.
Kumar ( 9 Mar 2006 )
Very good article. I do feel noe i can improve and with the list you provided I can have an idea about what needs to be done. Think I am somewhere between level 4 and 5…
Thanks fot the article.
steve.ganz.blog ( 9 Mar 2006 )
The CSS Learning Curve…
Roger Johansson recently highlighted Emil Stenström’s Levels of CSS knowledge. Like many others responding to Roger’s post, I see myself somewhere between 5 and 6. And when I thought about the road that I’ve traveled to get to this point,……
MarkL ( 9 Mar 2006 )
{Hi, my name is Mark, and I’m a Level 3. Hi Mark!!}
Great article. Through my own development, I can relate to each level somewhat. I’m currently at L3 but want desperately to get to L5. I’m trying to learn divs, but for some reason, I keep hitting a wall. I do see the value and want to end my dependency on tables. {Hence, my intro.}
Tommy ( 10 Mar 2006 )
What a terribly pompous, condescending article!
I really like css as a tool, but you people who write about it are perhaps as annnoying and self-righteous bunch as I’ve ever come across.
More importantly, there are lots of people I’ve met who don’t want to learn css largely because of the obnoxious, quasi-messianic bent of its proponents, and the raft of books, blogs and articles with the thinly veiled subtext of “everything YOU do is wrong”.
Users who don’t know as much as you about something or (gasp) disagree with you are “dangerous”?
You design webpages.
No one starves if you fail. No one’s immortal soul is involved.
Get a freakin grip!
Emil Stenström ( 10 Mar 2006 )
@Tommy: See my comment to Jeff above. These are the steps I myself have climbed. I’ve also seen others move from step to step in this list. The purpose is not to be condescending, it’s to show that there is more to learn for anyone.
ryanahamilton.com » Blog Archive » What is your level of CSS Knowledge? ( 10 Mar 2006 )
[...] Levels of CSS Knowledge [...]
Shane ( 11 Mar 2006 )
I know quite a few designers who are at ‘Gold’ Level 1. How inconvenient for someone to come along and insert another level into your carefully constructed heirarchy.
Yeh, the guys I know work for a ‘market-leading’ company; they have not only removed underlines from links, but have progressed to font size (using pts of course), font family, font colors and so on. So, it’s fonts and colors basically. If they want padding (they don’t know they want it, but they do), they’ll opt for a spacer.gif.
Sod it - I’m going to demote them to Level 1.
Idea Grapes » 你是哪個等級的CSS開發人員? ( 12 Mar 2006 )
[...] Friendly Bit在今年1月有篇有趣的文章,標題為:Levels of CSS Knowledge,作者Emil Stenström將CSS的知識分為下列7個等級,並且描述了各等級的開發人員對網路產生的影響。我將內文簡譯如下: [...]
michael ( 12 Mar 2006 )
horrendously stuck at Level 4…reading and playing like mad to get to Level 5 or 6…
any help is always appreciated.
Tim ( 13 Mar 2006 )
I think it’s a mistake to assume that it’s possible to master html without mastering css.
I mean, ever tried to hand code a table based layout? 99,9% of all the table based layouts are probably created using a wysiwyg editor. And let’s face it : Dreamweaver’s design view makes it easy to twist and merge table cells to your liking, but it doesn’t make you think about writing semantically appropriate html.
So there :
html level 0 = css level 0
html level 1 = css levels 1 through 3 (wysiwyg editor players)
html level 2 = css level 4
html level 3 = css levels 5 through 6 (”Yes, I can make a doctype decision and I know what
<dl>stands for”).html level 4 = css levels 5 through 6 (anything between “I actually read the W3C specs” and “I actually wrote the w3c specs”)
Elliot Swan » Levels of CSS knowledge ( 14 Mar 2006 )
[...] Levels of CSS knowledge–What level do you feel you’re at and why? [...]
www.jammo.net » Friendly Bit » Levels of CSS knowledge ( 14 Mar 2006 )
[...] Friendly Bit » Levels of CSS knowledgehttp://friendlybit.com/css/levels-of-css-knowledge/ [...]
Stefan Asemota Weblog | Web Standards Quiz — Archive ( 14 Mar 2006 )
[...] If you are a web designer and you think you know your craft, go ahead and try out this quiz. While you’re at it, you might also want to read Emil Stenström’s Levels of CSS knowledge [...]
supa ( 16 Mar 2006 )
I agree, there should be a Level 4.5, or maybe 5.25 — it’s not enough to know and understand XHTML and CSS; the downfall is that you must know hacks, bugs, fixes and workarounds for a variety of browsers. I can code just fine, but there’s another level of knowledge you have to get to in order for your work to actually present itself as intended on certain browsers/platforms. That’s what keeps me from really being thrilled about CSS as it stands today. Tables aren’t semantic at all for design but at least they translate well.
Blog: timdream » Blog Archive » 你是哪個等級的CSS開發人員? ( 19 Mar 2006 )
[...] 你是哪個等級的CSS開發人員?,原文是Levels of CSS Knowledge;在COLOR BLOG上看到的。 [...]
Liam Hesse ( 21 Mar 2006 )
<Tommy, Mar 10> You design webpages.
No one starves if you fail. No one’s immortal soul is involved.
No, but hundreds of man-hours are lost. Wasted. Frittered away by having to comb through some horrific malformed table-based monstrosity. It damages productivity, and that is dangerous.
Take my word for it. I am a web developer, and I’ve had to fix other people’s table-based work before. It’s not just a figurative headache, I assure you.
Tip(z) » CSS-nivåer ( 21 Mar 2006 )
[...] Småroligt skrivet om vilken kunskapsnivå av i CSS man befinner sig! Testa dig själv. [...]
Matt Williams ( 21 Mar 2006 )
Great post.
How about some suggestions on how to get to increase your current level?
Website recommendations?
Book recommendations?
Dewey Williams ( 21 Mar 2006 )
There is one more level that I seem to run into often. These are the graphic/ad designers, that design a site in PhotoShop, slice the big picture into a lot of small pictures, throw it into GoLive, publish it to a server and call it a website. I have explained, argued, taught and berated some of them to no avail. They seem to believe what they are doing is web design/best practices/professional sites. I don’t know how to get through to these people.
About Web Designing » Blog Archive » Levels of CSS knowledge ( 22 Mar 2006 )
[...] In a nice post discussing various levels of CSS design knowledge Emil lists 5 levels of people who know CSS or are aware of its existence. CSS layouts are tough if you are just a beginner, and they are labor-intensive once you begin to know your way around the labyrinthine DIV definitions. Still, CSS layouts are far, far, far better than those table layouts because the way you can manipulate them. What’s my level of CSS knowledge? [...]
Brad Fults ( 22 Mar 2006 )
Excellent breakdown. Most people would have tried to break it into 3 levels, but I think all 6 of yours are necessary and distinct.
Thanks.
Emil Stenström ( 23 Mar 2006 )
@Matt Williams: The only way I’ve found works is a combination of reading and trying things out yourself. I listen to people talking about CSS daily and I think that helps to. You’ll be Level 6 if you just keep pushing.
@Dewey Williams: I know exactly what kind of people you are talking about :) I wouls call them graphic artists, not web designers. In fact, building a whole site in flash is very similar, you don’t use the features of the web, so how it that web development?
@Brad Fults: Good to hear you like it!
Dirk Diggler ( 23 Mar 2006 )
You people are way too impressed with your ability to deal with crappy browsers and somewhat implemented standards to produce a layout. You do the same thing as magazine layout designers, except they dont have to worry about people stretching their magazine page or switching the font sizes on them.
I can’t believe anyone would feel snooty or talk down on people that make web pages that aren’t all produced from xml/xslt/css/dom/give it a rest, technology is supposed to make your life easier - as a software designer I fail to see why web designers are so masochistic and get pleasure from having to use convoluted hacks to make something “standards compliant”, or work with the .0001% of blind people that may look at their site.
Emil Stenström ( 23 Mar 2006 )
@Dirk Diggler: As I have previously stated I’m not trying to talk down people. These are steps that exist, I’ve heard many people say “I’ve been a level 2 guy”. I have full respect for people that have other reasons for not using web standards.
I promote using HTML and CSS to produce good websites (not any XML/XSLT) instead of just HTML, is that such a big step? You seem to think this standards stuff is hard so let me tell you this: it’s not.
Dan Black ( 24 Mar 2006 )
I feel as though you need a level 5.5
Midnight Cappuccino » 6 livelli della CSS-aggine ( 24 Mar 2006 )
[...] Per restare in tema, da saldo 5° gradino vi presento i 6 livelli della CSS-aggine. [...]
Pig Pen - Web Standards Compliant Web Design Blog » Blog Archive » Levels Of CSS Knowledge ( 24 Mar 2006 )
[...] Levels Of CSS Knowledge from Emil Stenstrom. [...]
Narga Laboratory » Blog Archive » Levels of CSS knowledge ( 27 Mar 2006 )
[...] From thisv very good content As you might have understood by now I’m very much pro web standards. The current widely accepted standards are: (X)HTML for page structure, CSS for design, and Javascript for behaviour. HTML is pretty well known by now, it has been there since the beginning of the web and there are tutorials everywhere that gets you started. CSS is starting to get a grip, large companies are switching their sites to CSS based layouts and the webdev blogosphere reaches more and more people. [...]
Wisiwip » Blog Archive » ( 28 Mar 2006 )
[...] From : Friendly Bit [...]
Stupid Wordpress Tricks » Blog Archive » Levels of CSS Knowledge ( 29 Mar 2006 )
[...] CSS is a complicated topic. This article, by Emil Stenstrom, called Levels of CSS Knowledge, describes the 6 levels, from total ignorance (”CSS? Isn’t that a multiplayer game?”) to guru (”What version of CSS? … Did you read my book about…”). It’s an entertaing read. At the bottom of the article are some interesting related articles about the challenges of CSS, especially to those used to HTML tables. [...]
Bjorn ( 31 Mar 2006 )
Another naive CSS evangelist fulfilling his obligation to shamelessly spread the CSS Gospel. To be honest, this article stinks of elitism. Who could imagined that such an evangelist would put qualities that spread the ‘good CSS news’ in the highest category. Yes DIV’s are better than TABLES, but you don’t have to be a dick about it.
Emil Stenström ( 31 Mar 2006 )
@Bjorn: If you had read the comments I’ve made eariler to similar comments like yours you would see that these are steps I have myself been at. How is that a bad thing?
Imran Nazar ( 4 Apr 2006 )
Re: the comment about table-based sites not being coded by hand, I actually did that one: a table-and-frame monstrosity with JS, all in Notepad. And I was proud of it at the time.
That’s the point this article is trying to get across, it seems: everyone who’s learning web development goes through these steps, including the best.
Graham King ( 11 Apr 2006 )
Great article. It’s a shame about the negativity of some of the posts. There’s nothing pompous about identifying bad practice and doing your bit to promote best use of standards. (And this from someone who knows very little about the power of CSS, but knows they have a lot to learn from people like yourself, and why they should bother to do so - not sure if I’m covered in your list though!)
Holy Toledo More Lamers Version 2 ( 12 Apr 2006 )
You sound so pontific way up there on your soap box. You know what Level 6 is: Humbly to understand that there are millions of people who do this and because the w3c says “its the correct standard” that really means nothing. Heck the most popular browser in the world doesnt even follow w3c rules. Me personally, I like to incorporate at once 7-10 different languages in the LEAST into one of my web(worlds)- So if that means it is STILL going to work across the scope of web browsers and I have to go ouside the w3c “rules” to create a way to loop, hook, attach something the rules of the w3c are usless to me –just as long as it works and –continues to still work in the browser(s) - THEN , my little lernt friend- so be it. Lastly- If you love CSS so very much, learn something new, because if your a level five ( whatever that means) - and your not going to level six — your wasting away at least 3 layers….
Emil Stenström ( 13 Apr 2006 )
Anonymous (silly): It’s always nice with comments like yours from people that read one post and then assume that they know everything about you. I currently know Java, C#, C++, Php, Javascript and a few more at a basic level so I fully understand that the world is larger than just CSS. But that doesn’t matter in an article about “the levels of CSS” does it? Feel free to write your own list!
mike bliss ( 20 Apr 2006 )
I try to follow the CSS rules on my site but your article has given me a nudge to remove more design from my HTML code (mainly image alignment). I will put a link to your site from my web design page. Thanks
Justin ( 25 Apr 2006 )
well,i am at Level 4
getting back, getting ahead ( 1 May 2006 )
I appreciate this article. I was a front end coder for 5 years and was laid-off in 2001, 3 months before my company finally evaporated along with its ping pong table and fully stocked kitchen. I’ve been doing other fun things for the past 5 years since there were no jobs for quite a while. I miss the industry and I am on my way back. I am very aware that things have changed drastically and what I was an expert in back then, is basic knowledge now. I have a lot to learn to catch up to my colleagues who stuck it out. This article has been a great help in my awareness of where I am at, and where I need to be. Thanks very much for writing it.:)
Emil Stenström ( 1 May 2006 )
@getting back: Thanks for commenting, it’s always nice to hear that my writing helps someone. Surfing around you’ll find a lot of good resources to help you get back on track. I’ll meet you at your next ping pong table! :)
Dan Lee ( 1 May 2006 )
“CSS? Isn’t that a multiplayer game?” :) I love it. I would have to say that I am at level five. I understand why CSS is a good thing and I use it though I would be pants at talking about it in conversations. It would be nice to be a bit more gifted with CSS when it comes down to it.
Vitaly ( 6 May 2006 )
To be true, I do not remember the last time I used “table”s, not more then 2 years though.
I think strong Level-5 is for me, but thanks a lot to those from Level-6 who make it possible for others to know something new. The reason I make post here is to show for beginers: there are planty developers who made it professional with CSS, so JOIN! :)
Thank you,Emil.
Sorry for my English…
learner ( 11 May 2006 )
think at at level 1 :((
just trying to learn now… and so am here… will see after i trying making one site atleast…
Ruby ( 19 May 2006 )
Hi, I just found out that I am level 5 at CSS, which is quite surprising. I make website layouts as a hobby and your site is very useful. =]
Best wishes, Ruby
Seb ( 22 May 2006 )
I’m on level 5, but still feels like I’m on level 1, as I still having to constantly refer back to http://www.w3.org
En Español » Niveles de conocimiento CSS ( 29 May 2006 )
[...] Artículo Original: Levels of CSS knowledge [...]
Human Engineer » Archive du blog » Ingénieur Architecte logiciel ( 31 May 2006 )
[...] CSS : Maîtrise( niveau 5 ) [...]
Tip(z) » Vilken CSS-nivå befinner du dig på? ( 31 May 2006 )
[...] Emil Stenström gör sin indelning i kunskapsnivåer av CSS. Testa dig själv. [...]
christoph-hoerl.de | Weblog und Homepage von Christoph Hörl | Levels of HTML knowledge ( 31 May 2006 )
[...] Angeregt durch “Levels of CSS knowledge” veröffentlichte Roger Johansson in 456 Berea Street ein siebenstufiges System für das HTML-Wissen. Angefangen vom absoluten HTML-Nullpunkt in “Level 0″ bis hin zum Vollprofi in “Level 6″, der sich weniger mit Webdesign als mit zukünftigen Spezifikation und Standards beschäftigt. [...]
syzygy ( 31 May 2006 )
This is gay, another egotist site. your site layout sucks too.
jay ( 31 May 2006 )
I get very frustrated with people in level 0, 1 and 2. Anyway looks like I’m at level 5.
Deep Codes » Knowing CSS ( 31 May 2006 )
[...] Friendly Bit » Levels of CSS knowledge [...]
Los niveles del saber de HTML » EfektoMagazine ( 31 May 2006 )
[...] Robert Johansson, de 456 Brea Street se inspiró en la publicación de Emil Stenström para escribir Levels of HTML Knowledge, que a pesar de estar escrito de forma amena, refleja algunos detalles de la realidad que viven las personas que por alguna razón se tienen que involucrar con el HTML. [...]
Emil Stenström ( 1 Jun 2006 )
@syzygy: As you might notice I don’t mention myself here at all. These are the steps I’ve heard more people than myself climb, how does that make it an egoist site? You’re also one of the first person to say the layout sucks, good to know.
@jay: Those that don’t want to learn never will, so I don’t even try to convince people on the lower levels of why web standards should be used.
Internal Arts » Blog Archive » Levels of HTML and CSS knowledge… and Guitar Hero ( 1 Jun 2006 )
[...] Today I found this article on HTML on digg.com, and shortly thereafter, another article on CSS about classifying levels of competency in using HTML and CSS. Apparently, on a scale from 0 to 6, I’m a level 5 in both categories, with level 6 representing the people who create the standards. I didn’t even know my competency ranked that high. And I don’t even do this stuff professionally. I started messing around with web pages in 1997, in my dorm room at CWRU, and there were a small number of us who were blogging before it became a massively popular trend three years later. Except back then, like everybody else, I started out editing the HTML by hand. [...]
James A. Arconati ( 1 Jun 2006 )
GREAT ARTICLE, found you through del.icio.us. Made me laugh though as it means I am a Level 4 or 5 in CSS Knowledge and I also am a level 12 Paladin. *GROAN* Thank you anyway!
Emil Stenström ( 1 Jun 2006 )
@James A. Arconati: Good to see someone got the point ;)
dandyna ( 1 Jun 2006 )
level 5 for me… how i wish I wrote a book as well :)
CSS und HTML Ranking Checklisten ( 1 Jun 2006 )
[...] Emil Stenström [...]
Levels of Accessibility Knowledge – Le «blog personnel» de Joe Clark ( 2 Jun 2006 )
[...] I admit in advance that I am about to flirt with an Internet meme, the “Internet meme” (often mispronounced as though it were French and used a circumflex). But if dashing Swede Rohgayr Johansson can delineate levels of HTML knowledge and a somewhat-less-dashing Swede can delineate levels of CSS knowledge, perhaps it is time for… Levels of Accessibility Knowledge. [...]
HTML- und CSS-Level at Aarakast ( 2 Jun 2006 )
[...] Welches HTML Level bist du? Welches CSS Level bist du? ´ Bei beiden kategorisiere ich mich in Level 5 ein. Die treffens ziemlich perfekt würde ich sagen. (Außer, dass ich hin und wieder, aber immer seltener, zu div-Suppen neige) Tags: csshtmlwitziges [...]
Designers who Blog: Design, Illustration, Photography, Web, Advertising, Branding … ( 3 Jun 2006 )
[...] For a quick dip: Check out Emil’s Levels of CSS knowledge. Then swing over to 456 Berea Street for a sister article on Levels of HTML knowledge. [...]
Sean Fraser ( 3 Jun 2006 )
I’d say Level 6 but I haven’t found any reasons for using CSS3 (or, the other half of CSS2). So, I guess that would - Actually - be 5. I guess I could Malarkey two different sites, i.e., Two Tone and Mod, but IE 7 ruined that.
Simon ( 3 Jun 2006 )
I’m on level 5. Yeay baby…!
Point studios ( 3 Jun 2006 )
HTML, CSS & accessiblity knowledge levels…
Emil Stenström has started it, by his article levels of CSS knowledge followed by Roger Johansson writing about Levels of HTML knowledge and finally Joe Clark’s Levels of Accessibility Knowledge. They are all so true and convincing why don’t you……
Linky na víkend 12 na depi.sk - IT & Life Weblog ( 4 Jun 2006 )
[...] Levels of CSS knowledge [...]
二三街角 » 2006-06-04 Information Flow ( 4 Jun 2006 )
[...] Levels of CSS knowledge [...]
Night Dreaming (by Sudar) » What is your Level of web knowledge? ( 4 Jun 2006 )
[...] Well I am going to flirt with an Internet Meme which is getting spread around. It all started when Emil wrote Levels of CSS knowledge. This inspired Roger to write Levels of HTML knowledge and that got followed by Levels of Javascript knowledge, the levels of Accessibility knowledge etc. [...]
你的Web-Level是第几级? | BiZwiKi.CN - 喧闹 PK 噪音 ( 4 Jun 2006 )
[...] Levels of HTML knowledge 1 Levels of HTML knowledge 2 Levels of CSS knowledge Levels of JavaScript Knowledge Levels of Accessibility Knowledge [...]
Hecgo.com » ¿Qué tanto sabes de CSS, HTML y JavaScript? ( 5 Jun 2006 )
[...] Todo empezó con el post de Emil Stenström Levels of CSS knowledge donde en una escala de 0 a 6 propone los niveles de conocimiento, de tal forma que: 0 = “CSS? Isn’t that a multiplayer game?” 1 = “Yeah, I use it to remove underlines on links sometimes” 2 = “No, I don’t like divs; tables are much easier to work with” 3 = “Yes I’ve heard it’s good, but I can’t use it because of…” 4 = “CSS? Oh! Yes, I use divs for all my layouts” 5 = “I use CSS for design, it’s better than tables because of…” 6 = “What version of CSS? Yes, I do. Did you read my book about…” [...]
-TMA-1- » Blog Archive » links for 2006-06-05 ( 5 Jun 2006 )
[...] Friendly Bit » Levels of CSS knowledge (tags: Tech WebDesign CSS) [...]
YELLOW BOY FOR ECONOMICS » Levels of Accessibility Knowledge ( 5 Jun 2006 )
[...] June 4, 2006 @ 10:27 pm · Filed under yellow boy I admit in advance that I am about to flirt with an Internet meme, the “Internet meme” (often mispronounced as though it were French and used a circumflex). But if dashing Swede Rohgayr Johansson can delineate levels of HTML knowledge and a somewhat-less-dashing Swede can delineate levels of CSS knowledge, perhaps it is time for… Levels of Accessibility Knowledge. [...]
YELLOW BOY FOR ECONOMICS » Levels of HTML knowledge ( 5 Jun 2006 )
[...] Inspired by Emil Stenström’s Levels of CSS knowledge, I started thinking about the extreme difference in HTML knowledge among people working in the web industry. It spans all the way from people who know next to nothing about it to those who know it well enough to write the actual HTML specifications. [...]
Мысли о… » Blog Archive » Levels of knowledge ( 5 Jun 2006 )
[...] Забавные тесты уровня ваших познаний в HTML, CSS, и JavaScript. У меня пятый уровень по всем пунктам, а у вас? [...]
Techies blog » Blog Archive » HTML és CSS tudásszintek ( 5 Jun 2006 )
[...] Link: Levels of HTML knowledgeLink: Levels of CSS knowledge [...]
Crastinate » Blog Archive » Levels of Knowledge ( 6 Jun 2006 )
[...] Levels of CSS Knowledge: Yep, Level 5. This is where you both can use CSS and know why it’s better. [...]
Jeff ( 6 Jun 2006 )
I liked this article. I am just a beginner. I got started by taking a html class and thought it was fun. I got pretty good with tables, but I have hit some dead ends with them. I started to learn css for blogging and I am starting to like it. I would say that this puts me at a level three.
Practical Web Design magazine » Blog Archive » *New podcast* Choosing the right layout ( 7 Jun 2006 )
[...] How to assess your competence in HTML, CSS and Accessibility [...]
Ramenos Blog » Evaluer votre niveau en HTML et CSS ( 7 Jun 2006 )
[...] Voici deux études (en anglais) qui permettent de situer rapidement votre niveau concernant les CSS et l’HTML. Pour ma part, je me considère level 5 en HTML et entre 4 et 5 en CSS. [...]
ephraim hohn ( 7 Jun 2006 )
u r som pros :D *shake* diz is senseless.. the fact that ur rating does not go further shows ur incompetence, sry
Ricardo ( 7 Jun 2006 )
I’m at a level 2 or two, and I can use all the help that I can get.
There’s times that I use a table to position two more images on a web page.
I know there some CSS to do that, but old habits are hard to break.
I usually just use CSS on each web page instead of one external CSS page.
Because I want to keep control of each web page.
Thanks for all your information.
It lets us know that there still hope
Semper Fidelis
Ricardo
Emil Stenström ( 8 Jun 2006 )
@ephraim hohn: relax, note the jokes in there.
@Ricardo: Keep reading, there’s a lot of good blogs out there.
Stacy ( 8 Jun 2006 )
Suppose your using Firefox and you browse to http://www.w3.org/Style/CSS/, then you choose View->Page Style. What would you expect? http://www.w3.org/TR/REC-CSS1 makes a little more practical use of this. Strange that more sites don’t understand that CSS can be a more dynamic means of information transferance. Do I get it?
Emil Stenström ( 8 Jun 2006 )
@Stacy: I don’t see what you mean (probably my fault). What you show is one of the good parts about CSS, any page can have several layers of design that you can let the user pick from. It’s a nice feature.
Stacy ( 8 Jun 2006 )
Exactly my point. CSS is about presentation. Presentation can take on many flavors and if needed or useful an author should provide that. The http://www.w3.org/TR/REC-CSS1 example shows (you have to scroll a bit) that an author can offer up two vews of the same content to provide different prospectives of the data. errata verses the current status. This is all accomplished through concurrent (alternat) style sheets. A user can choose per se to see the change bars or not. Seperation of content vs presentation. An idea I think under appriciated.
Stacy ( 8 Jun 2006 )
Sure wish you had a preview and/or spellcheck option for comments. I butchered that last one :)
Stacy ( 8 Jun 2006 )
I guess what I’m saying is your site for one (out of many) could provide an alternate css that provided the following
.item_contents {
display: none;
}
or something similar… It’s late and I don’t feel like sifting through the css/tags/elements/whatever, but it would be nice to be able to turn off all comments via an alternat style sheet.
Gareth Powell ( 8 Jun 2006 )
Neat. CSS is plainly a very good thing and reminds me of a style sheet which I used for my magazines in Adobe’s Pagemaker.
So I use it to control type sizes and colors and what have you.
Where CSS totally fails - in my opinion - is getting across to people like me that it can be used for far, far more than just type definitions.
I am really not stupid and a relatively fast study but I cannot get to grips with it. My feeling is that perhaps people who DO understand CSS do not understand communication.
And so potential users of the full scope of CSS - and I am one of them - stop half way simply because no one is giving and intelligent, intelligible, interesting, explanation complete with snazzy samples.
Gareth in Sussex where it is warm and wonderful. This week.
Emil Stenström ( 8 Jun 2006 )
@Stacy: I’m well aware of the possibility of adding separate stylesheets but I don’t feel the need to add it. If an individual user wants to customize something they can use a custom stylesheet and apply it.
Debbie ( 8 Jun 2006 )
I’m at level 5 and very comfortable with that. I don’t plan on writing any books. :)
Soho Cascade » Blog Archive » Levels of knowledge ( 8 Jun 2006 )
[...] In terms of CSS, it was a Swedish blogger who came up with the 6 levels of CSS knowledge. I feel very comfortable saying I’m at level 5. [...]
Carla Pendergraft ( 8 Jun 2006 )
This seems like an inherently odd system. Usually, a higher level will include greater levels of skill. To me, it would make more sense to say a level 2 uses only the most basic CSS tags. The higher level would use perhaps more complex ones. Instead, this one focuses on attitudes toward CSS. So it’s not levels of knowledge with a gradual progression toward sophistication. It’s just a bunch of attitudes, some of which you say yourself not really “better” or “worse” than other, higher levels. You ought to reformat this whole “levels of learning” table into some other semantic structure.
Roman ( 8 Jun 2006 )
If claim “I’m very much pro web standards. The current widely accepted standards are: (X)HTML” why does this page read “” as it’s first line?
:-)
Roman ( 8 Jun 2006 )
The HTML line in my previous post was just cut out instead of converted to display HTML. Just right click the page and “View Page Source”. Then read the first line.
Emil Stenström ( 9 Jun 2006 )
@Carla Pendergraft: I believe that CSS is an entirely different mindset from table based design. To grasp that new mindset there are several things you need to understand and I believe those things are in the list above.
@Roman: Note the paranthesis around the X. I continuosly recommend that you use either HTML or XHTML (doesn’t matter which) as long as you use the strict versions. Feel free to look through the sourcecode of this site, I have nothing to hide.
ben ( 9 Jun 2006 )
I’m a class 5 mutant, and I love to play CS:S but more of a 1,3,5 level CSSer. I like CSS, it is very cool. Not the total final solution for all things. I would have to agree that a lot of articles about CSS and web standards sound very elitist and annoying, this one is partially included, although not too mean. (A side note, whether you intended it to or not doesn’t matter, it still sounds that way :)) It would be ok to just admit it, or say sorry, but that wouldn’t be very CSS-Elitist like. Still an interesting read. Thanks :) -Nightcrawler
Emil Stenström ( 9 Jun 2006 )
@ben: Sorry!
David Golding ( 9 Jun 2006 )
A very informative article - thank you. Mix of level 2 and 3 now inspired to achieve 5…
T-dude ( 9 Jun 2006 )
Word!
There is another interesting .class of people: The postbubblers. they learned the craft without knowing what IE5 or Netscape 4 was. Many of them use different techniques, tool etc, but don’t know or care about standards. However, with their fast learning curve, they probably could make a significant contribution to web standards use. I know I’ve met a few, but didn,t have the time, knowledge or patience to convince them at the time.
Emil Stenström ( 10 Jun 2006 )
@T-dude: Good addition, those people need to be talked to and convinced. Send them here :)
Evaluate your CSS and HTML Knowledge @ SEO Principle | Search Engine Optimization Blog ( 10 Jun 2006 )
[...] I came across an article that is both funny and accurate called Levels of CSS knowledge, from Emil Stenström. It lists 6 levels of CSS knowledge and explains how each one is affecting the web, from the average user to the most renowned web designers. [...]
Henrik Feldt ( 11 Jun 2006 )
You don’t have to have written a book about css to be at level 6, really ;); at least that’s what I think, and perhaps some people above have said so, too. The problem with level 6 in your article is that it assumes that if you know css very well, you automatically start to write about it and tell people how to use it. That’s not the case for me. It’s very seldom I stumble upon something that I don’t know in CSS, for example.
Although I have actually started to write a very long tutorial on how to start with CSS, it just takes too much time. What I would love to do would be to be a web design teacher - and not only html and css, but also c#/ASP.net, n-tier, javascript, graphical design (photoshop/flash/illustrator).
That would be great fun!
Emil Stenström ( 11 Jun 2006 )
@Henrik: I belive the differece between 5 and 6 is to reach out and teach other people what you know. A 5:er and 6:er might even know as much about the language. Teaching would be fun!
Spanky ( 13 Jun 2006 )
While these are funny at times. I wonder what are you doing to help change the situation? To help people understand what YOU see in CSS!! It’s like laughing at the kid whose fly is undone without telling him it’s undone … immature and doesn’t move you forward.
Step up. Be bigger than you are.
Emil Stenström ( 13 Jun 2006 )
@Spanky: This whole site is my way of helping people “get” CSS and modern web development. I’ve heard several people that has been motivated by reading this article. Feel free to give suggestions on other ways to help people, I’d love to hear them.
The Lime Blog » Role Playing and Web Design ( 13 Jun 2006 )
[...] Go to FriendlyBit to determine your CSS level [...]
arconati.net » Blog Archive » links for 2006-06-01 ( 14 Jun 2006 )
[...] Friendly Bit » Levels of CSS knowledge As you might have understood by now I’m very much pro web standards. The current widely accepted standards are: (X)HTML for page structure, CSS for design, and Javascript for behaviour. HTML is pretty well known by now, it has been there since the begin (tags: web-developer web-developer/css reference community articles blogs) [...]
wigblog » Blog Archive » Levels of knowledge…