Forgive my pessimism but I’m not the problem, my boss and my customers are.  I have been preaching, demoing, and using CSS3 and HTML5 for a while now in a number of my experiments and proof-of-concepts, but they never make it to production because some executive is still using Windows ME because nobody wants to tell him it’s outdated.  I have yet to find somebody willing to pay to have their own site gracefully degrade in their own browser of choice, if they can’t see it they don’t want to pay for it. 

Maybe I just need out of enterprise development, but this is nothing if not frustrating…

Well said!

Sweeping generalization coming… BUT

I think Designer/Developers will embrace this - and Developer/‘Designers’ will continue to whine.  Its a creative mind set against a nuts and bolts one.

Keep moving forward Andy - and here’s to MORE sterling work from Tim.

Here’s to progressive enhancement on the web!  Vive la Révolution!

I agree, in principal, but the help I need from people like you is selling these ideas to my employers and making them understand the real value they will bring to the business. I struggle daily just to sell ‘the basics’

I’m totally behind the idea that sites don’t need to look the same in all browsers, because like you said they can’t but when it comes to CSS animations I’m a little way of jumping in just yet.

Unlike the some CSS3 stuff, CSS Animations look like they’ll take a bit of learning, at least to start with. So with the minority of browsers supporting animations and with few visitors likely to see them I don’t think it’s quite worth the investment just yet. But it’s definately something to keep an eye on and slowly introduce over time as other browsers catch up.

agreed “If you are one of those people who is waiting until using progressive CSS is safe because all major browsers support the same CSS at the same time, you’re living in a fantasy world.” 

Nice post.

I’m sure I can hear Andy screaming!

I think some of you guys are still missing the point. We should start using CSS3 and HTML5 techniques now to offer people with the best browsers the best experiences. Where deemed necessary - such as in many commercial sites - offer a degraded, but functional, experience…possibly with a notice suggesting how the site could be better experienced if they upgraded their browsers.

If we as an industry don’t start pushing people towards the more advanced browsers now we’ll never get rid of the shit browsers which are holding us back!

Andy maybe you should do a post about how you convince your clients to agree to using these techniques. In most cases in is not that designers are not progressive but that clients want the design to look the same in every browser, how to convince them that this is not how they should be thinking is very hard.

I personally sneak CSS3 enhancements into my sites as drawing attention normally does more harm than good with “Can you get that to work in IE6”  popping it’s ugly head up.

We all want to use this stuff, we get excited by it… Clients don’t how do we convince them otherwis?

@Wez Maynard

What kind of idiotic statement is that, and what on earth does it have to do with this article? You are as close-minded as the idiots who are moaning about support for all browsers, surely.

Such arrogance isn’t going to win anyone over ..

I use CSS3 for personal designs, and I enjoy playing around with the latest browser-specific developments. I consider myself very active in the development of new standards. But at my job? No. Not going to happen.

Professionally, I design sites for pixel perfect consistency in ALL modern browsers, including Internet Explorer 6. And I can do it, because I’m damn good at what I do. And this is somehow supposed to make me a lesser designer, who needs a career change? Get over yourself.

re:

“I personally sneak CSS3 enhancements into my sites as drawing attention normally does more harm than good with “Can you get that to work in IE6”  popping it’s ugly head up.”

—I find that “No, IE6 can’t do that. Did you know IE8 is out?” works with non-tech-savvy clients. And the tech savvy ones aren’t using IE6 anyway.

If anyone takes a look at current browser statistics you’ll notice that the use of IE6&7 is steadily declining (~1% a month) and the share of all three version—I know, just the fact that there are three browsers, with specific quirks, alone makes me shake my head in disgust—is less than firefox alone, which is most likely the latest stable release. Add to that, a steady increase in webkit (Safari, and Chrome), and you really have to ask yourself “Why am I spending precious time making dying browsers look even remotely close to modern browsers, that take less time—and look better—with CSS3???”

I’m a big fan of CSS3+HTML5+jQuery, and with over half the browser market share able to use 90% of it, why wouldn’t I use it?? It’s all about forward thinking, in my opinion. IE6&7 are oldschool, IE8 was an ok attempt, but almost made things a little worse. IE9 is, apparently, supposed to support HTML5 and more CSS3, but I’m really hoping that IE’s market share in total will be a minority by that point. Here’s hoping!

Nothing says class like a sexist ad hominem response to somebody with a legitimate point. Yes, I’ll stay anonymous, because frankly I’d rather have my name on the fewest of these absurd debates as possible. My clients require sites to look absolutely consistent in every browser. This is because they need to keep their branding consistent and user experiences identical. Progressive enhancement, as much as I enjoy using it, simply does not fit into their business strategy. It is not my job to redefine their business strategy or “enlighten” them.

I certainly will read your article on the 23rd, but color me skeptical as to whether or not your advice is going to help sway the minds of clients with considerably higher expectations than your “Oh, just upgrade to IE8.” attitude seems ready to deal with. Welcome to the real world, where people don’t appreciate being told to find a new career due to differing professional opinions, and certainly don’t appreciate offhand sexist remarks.

Have fun coding and blogging, but you seriously need to learn to respect your peers, on your soapbox and off of it. And please respect my privacy.

Counter-punching aside, the best strategy I’ve ever found for progressive enhancement v. clients is the old “under-promise, over-deliver” adage. Any clients I’ve ever worked with that demand a “pixel-perfect” design really mean that they want their site to look a specific way in a specific browser. Since I’m thankfully capable of doing that, any modern CSS enhancements in competing browsers they discover on their site have always produced two positive outcomes:

1.) They see the benefit of a modern browsing experience.
2.) Their faith in my professional experience (and consequently, their decision to hire me in the first place) has been rewarded beyond their initial expectations.

Client happiness + Motivation to keep my skills current = Happy Designer.

I think anyone who has the minerals to backup their claims can get on as many soapboxes as they like - if they feel passionate about a subject, as Andy certainly does.

I also find it strange that someone who wants to maintain their privacy actually posts on a very public website. 

Where I work I don’t serve up the same pixel perfect designs across all browsers, because quite simply you can’t do it - not effectively anyway.

I don’t want to spend half my day coding for a browser that should have been binned years ago.  As long as they can read the content, navigate the site, and it’s not too dreary for them in their broken browser - than that’s just the way it is.

It’s no different than people who have low-quality tv sets, should they get the same quality as someone who has a HD set?  Nope.

Eric:  Well it’s the same in anything really - progressive enhancement.  A web designer evolves with the technology.  If it’s there bloody well use it.  It’s not like were serving up bad designs for IE6.

I mean I will choose to have a rounded box for an element in Firefox or Safari, it’s fine for that box to be square in IE6.  It’s no less an experience for the user.

I also feel that the longer we still say we are supporting IE6, the longer it will be here.  It’s a dreadful browser and a really poor attempt by the self-proclaimed leaders of software development.

Nick, trust me, I agree with you. My point is that in my reality my clients do not wish to film in HD if that means that some people are going to be watching it with bunny ears. I spend my time making that all views are at least able to watch at a happy medium quality, so that nobody has to suffer the bunny ears experience. Is it HD? Nope- but everybody gets the same level of “good” and for some clients that is very important (more important than providing HD for the minority). That’s my reality; Andy may dub it a fantasy world if he so chooses, but reality it is.

Do I look forward to when I no longer have to support IE6? Of course. But for me, personally, that day has not yet come, and I will use reality (e.g. actual browser numbers, not my personal preferences) to determine when I am personally ready to stop supporting it.

And on a semi-related note, what a peculiar tone the web development community has garnered over the last few years! Goodness, by the hostility presented here, you’d think the only choices were CSS3 or using tables. I’m glad to remind us all that there is such a thing as a shade of gray, and best practices don’t require using technologies that break older browsers.

And as to my privacy, I will simply restate that I hope it is respected.

(Ed says: Why would it not be?)

Ed: Because the owner of this blog does not seem to have a wholly respectful approach to discourse, and after receiving an ad hominem response to my initial post I immediately regretted entering my actual email address. That’s a good sign that something is very wrong with your tone. I am not a particularly paranoid person. :)

(Ed says: Perhaps if you hadn’t ended your comment with Get over yourself and inferred that people who choose not to design to a low common denominator or outdated software were somehow not damn good at what [they] do, we might have got off on a better footing. I’m sorry, you happen to have participated on one of our grumpy days. We encourage respectful, constructive discourse ‘round these parts. If you’re not a regular reader, I hope you’ll stick around.)

I design in browser for my own work, but for my job, I am still one with the Photoshop and work closely with a team of graphic designers. So what happens is they come to me with rounded corners for a box, and I’ll just use background images. It works on all browsers, and everybody’s happy. Sure, I could make it a plain old box and add rounded corners via CSS, but then it won’t match the design in IE6. Big deal, right? Well- it is for me. Somebody, somewhere, is seeing a box that was meant to have rounded corners.

I don’t see anything wrong with my approach - it may not be the simplest or fastest, but it will look just as good for all users, and that’s well worth an HTTP request in my book. The end result is superior and controllable. Is it a reasonable situation for me? That’s not really for me to say: Microsoft crippled the web severely, but the good news is that it will slowly heal itself. In time we will have better things. The healing is speeding up exponentially, and soon this will all be just a bittersweet memory. But to pretend that we are somewhere that we are not yet: that is the very definition of fantasy.

I don’t agree really.  Sorry lads.

I won’t stroke IE6 and keep it sweet.  It will get from me a design that is good enough for the quality of the browser.  I won’t waste time and money on a broken browser.  Broken, lacking in features, poorly presented, slow, etc…..

How else is the industry going to evolve?  We may as well be developing in tables and spacer gifs.

Harsh?  Sure, but I really don’t care anymore - I’m done giving IE6 the respect it doesn’t deserve, and if my clients can’t upgrade their browsers then me spending more time, effort and money giving them as close an experience as possible to what Safari and Firefox get - well that’s not really going to encourage them to upgrade their browsers is it?

Fair enough Nick, I can see your point, but I disagree.

This isn’t about educating users, it’s about educating IT managers who have a million user intranet that only works in IE6 that will cost millions to upgrade, or the lazy company boss who’s locked down his employees machines so they can’t choose Firefox or Chrome. And it’s also not about my clients, it’s about *their* customers. I can live with my client not having the best experience we can provide, but I’m not doing my job if I ignore their customers.

Did I tell you about the HTML emails we do? :)

Nick: I can’t honestly say, as I’ve never had a client say they don’t worry about looking their best for 20%-30% of their customers. When I’m designing backend admin UIs, I’ll take shortcuts if I know the person using them will be using a modern browser. But I still make sure the backend structure is rock solid, and would look “about right” in IE6. But no, I do not make it my life mission to make every pixel align on admin UIs. But for anything customer-facing, yes, I don’t think I’m doing a very good job if grew nonchalant about IE6 users. Papering over the cracks is my business (and business is good).

My responsibility as a designer and programmer is to write the best code I can write: nothing more, nothing less. By writing the best code I can, I am pushing myself, and hopefully I am encouraging others to write better code as well. And by “best code” I do not mean the newest and glitziest: I mean the most stable, the most efficient, the most accessible, with the greatest longevity. “Best code” is a subjective term; by taking pride in the code I create, I know that I am quietly telling others about my vision of what “good code” looks like.

I can’t mold the web in the image I would like to see it. If I were to do so, it wouldn’t involve CSS3 and likely not even HTML. I digress. We’ll get to the point where nobody uses IE6 anymore, and it won’t take a rebellion to do so. When you speak of pioneering and change, I’d rather see the entire game upended than see a relatively small improvement in web standards be widely adopted. Of course I want to use the latest and greatest, but I also want to create the best sites for the largest target audience. Patience, pioneers!

Oh my God (should it be a capital G even if I don’t think he exists?)

I’m sick to the back teeth of these fookin web designers moaning about their clients not giving a monkeys unless it’s achievable in friggin IE6.

Lets ignore all the advancements in CSS3 and HTML5 for a second.

Your the fookin reason their thinking IE6 is the best thing since slice bread. You lack communication skill. You lack the ability to put your ideas across passionately and confidently and most importantly, to make the client feel confident in your own ability.

Most of you are nodding dogs that happily do what your client says and then vent your frustration else where.

C’mon guys, people like Andy have done great in the world of web design. Your all happy to suck his dick, “Great article Andy…”, “I agree…” but you don’t put it into action because when your not sucking his your sucking the clients dick.

The next time a client frustrates you with anything IE6 related…phone them up and request 30 minutes of their time. Make it relaxed, have a coffee and tell them the ins and outs of browsers.

I did, I drove from Hull to Flintshire (North Wales) with a purpose of telling them that the core reason people visit their site is because of the content they offer. And depending on how people look at it, their experience varies.

Love your friggin job people!

(Sorry Andy, too many dicks mentioned)

Alex: So clearly not the ability then.  Fair enough.  Hope it all works out for you.

Hand up anyone who, when seeing the box shadows Andy’s applied to :hover form elements, isn’t impressed? Hands down confused IE users.

If you have a client who believes every site should look the same, grab IE 8 with a site of your choice and flip to IE 7 rendering mode. Marvel at their shock at seeing the even subtle changes. IE doesn’t even look the same as IE.

Pixel perfect is a myth. You can get close, but you’ll never get that cigar.

You couldn’t have said this any better and I totally agree with your view’s!

Isn’t the whole point of “debate” to get two different sides of an argument and to understand the different viewpoints?

For me the progressive enrichment thing is something I do with my clients - I just don’t tell them. They wouldn’t understand and I don’t have the time to explain it to them anyway. “What they don’t know, can’t hurt them”.

As for pixel perfection in all browsers, well let’s leave that for another day shall we? Does it matter if there are minute differences in the various browsers? No. Is the client going to check? Not unless they have some OCD for pixel perfection…

Anyway, I think the fact of the matter is that everyone has their opinions and choices to run their businesses. “Live with that, move on.”

Another word on the gimmick aspect. Sure, the :hover effects are a nice bit of spice on this site’s comment form. But the form is still not a good example of moving the web forward! The tab index behaves unexpectedly, as users read from left to right and expect to finish one row of inputs before moving onto the next line. This behavior is caused by using two fieldsets as columns. As I suspect most of us reading this know very well, fieldsets are supposed to be used to group related input fields, not for layout. But let’s look further - why are there line breaks in the paragraphs, which are unnecessary? Just make the labels block. Why do we have the class “col” on the fieldsets? I can see in the CSS that they assign width and float them, but the class is superfluous, as they could be targeted by their parent element: the comment form. But the fieldsets are also superfluous, as all inputs in the comment form are intrinsically related and therefore should be in one fieldset. (Several inputs even get their own fieldset.) The correct form markup would be one fieldset, with a legend at the top to denote this as the form for Comment Submission. The layout for the inputs could be better achieved with a fixed width unordered list with block list items floated to the left - that would keep the tap index correct, while avoiding unnecessary markup for layout.

Sorry to lay into the form’s markup, Andy, but I’d much rather see web designers get the basics correct before adding a :hover opacity effect to the form elements and thinking that they’re moving the web forward in some significant fashion.

I’m very excited to see what designers will create when CSS3 is the standard, and is implemented consistently across all browsers. That’s when we’ll stop using it for gimmicks and start actually designing for CSS3, not thinking “Where can I add a bit of spice to this page?”

Gotta say, I’m using CSS3 commercially and my stuff works in IE6. Anyone who uses different browser types as an excuse to not use “progressive enhancement” techniques just doesn’t want to take the time to make things AWESOME!

Andy Clarke isn’t saying ditch browsers that aren’t supporting CSS3, but embrace that you what is supported.

I think we have a lot of left over baggage from the world of print where you design something once and it gets printed exactly the same. This is the web and unfortunately their are a shit-ton (that is a quantifiable measurement, in fact) of different browsers and a shit-ton of different ways that they are skinning the preverbal cat.

Another dream that people are living in is that one day every browser will adhere to web standards. It sounds like blasphemy to even say it but as long as there’s this silly browser war going on where different vendors are competing for market share then they’re going to try and see how they can gain ground in their own ways. Enough with this particular rant.

I agree whole-heartedly with Andy Clarke and haven’t found a good reason not to use advanced CSS whether commercially or for fun

I use CSS3 on a commercial site where we use rounded corners, transparent PNGs, webkit transitions and text-shadow on buttons. Looks great in IE6

Trevor, by ‘looks great in IE6’, do you mean that IE6 users see rounded corners, transparency, animations & text shadows?

If they do then I would agree that it probably looks great in IE6. But if they don’t then I simply don’t understand your motives: I presume you use those effects to make your designs look great. So why does IE6 look great without them? Especially given that all of those effects are very easy to implement for all browsers. (Minus complex CSS transitions, but JS still works just fine for the usual effects.)

Using CSS3 is not a guarantee of poor aesthetics for IE6. Nor poor functionality, or accessibility. Brand consistency is achievable even with a ‘degraded’ version of a website. With the exception of large intranets with IE6 installed, how many site visitors are going to be checking a website in multiple browsers? Furthermore, if there were to be the off chance that something as universe altering as this happened, how long would a user continue to browse in IE6 if they experienced the site in a modern browser and saw the difference? I am going out on a limb with my assumption and say: not that long. Website users are not extremely stupid, if they find something better and are able to use it, then they will.

Another thing: Like Alex said, before webdesigners start to use CSS3-effects, which are mostly not more than eye-candy, it would be much more important that they get the basics right.

How many websites are out there, that still don`t validate, still use
s instead of

s or worse still use tables (even big ones like Amazon!)? Most people even don`t use the whole range of current selectors like +, > or even attribute selectors which are much more important for modern webdesigns than shadows, rounded corners of gradients. And these selectors are even supported by older browsers like IE7 and not reduced to Safari! It would be much nicer if every site would stop using extra classes and instead trust on selectors, instead of rounding every image, button or box! First get the basics right, then start using CSS3!

Reading through all these comments it seems as though there’s a misconception that keep being repeated: That CSS3 enhancements are merely aesthetic eye-candy and as such, inconsequential to the core functionality of the site. Regardless of browsing environment a good design (and consequently a rewarding experience) is in the details. If as a Designer you’re only adding “eye candy” to a design well then you’re not truly designing.

To quote Mr. Spool, “Changing design changes behavior. Behaviors make up UX.”

CSS3 and any future iteration of CSS offer Designers the ability to create more memorable, engaging experiences, plain and simple. Why any Designer would actively dismiss these tools is beyond me.

‘In most cases in is not that designers are not progressive but that clients want the design to look the same in every browser…’

I would correct this to say… ‘clients want the design to look the same in THEIR browser…’ ...because their browser (in my experience) is the most popular. They don’t know that a better browsing experience exists and they are among the majority. In this sense, however ironic, they are right. Whatever fancy, png-strewn, fadtastic design you promised them via a neatly controlled jpg unveiling should be rendered as-is in IE.

That said, I feel like some of the designers here are just being lazy, especially if all of this is being said in light of the 24 Ways series where, more often than not, each contributor has offered a means for dealing with IE. As long as you aren’t hacking your entire way through your CSS and you haven’t put a border radius and 50% transparent background on every single element on the page, it is a just a matter of adding a little futz here and there. You should know what the best practices are. So follow them and add the extra juice wherever necessary.