Why We Should Start Using CSS3 and HTML5 Today

Advertisement

For a while now, here on Smashing Magazine, we have taken notice of how many designers are reluctant to embrace the new technologies such as CSS3 or HTML5 because of the lack of full cross-browser support for these technologies. Many designers are complaining about the numerous ways how the lack of cross-browser compatibility is effectively holding us back and tying our hands — keeping us from completely being able to shine and show off the full scope of our abilities in our work. Many are holding on to the notion that once this push is made, we will wake to a whole new Web — full of exciting opportunities just waiting on the other side. So they wait for this day. When in reality, they are effectively waiting for Godot.

Just like the elusive character from Beckett’s classic play, this day of full cross-browser support is not ever truly going to find its dawn and deliver us this wonderful new Web where our work looks the same within the window of any and every Web browser. Which means that many of us in the online reaches, from clients to designers to developers and on, are going to need to adjust our thinking so that we can realistically approach the Web as it is now, and more than likely how it will be in the future.

Sometimes it feels that we are hiding behind the lack of cross-browser compatibility to avoid learning new techniques that would actually dramatically improve our workflow. And that’s just wrong. Without an adjustment, we will continue to undersell the Web we have, and the landscape will remain unexcitingly stale and bound by this underestimation and mindset.

Adjustment in Progress

Sorry if any bubbles are bursting here, but we have to wake up to the fact that full cross-browser support of new technologies is just not going to happen. Some users will still use older browsers and some users will still have browsers with deactivated JavaScript or images; some users will be having weird view port sizes and some will not have certain plugins installed.

But that’s OK, really.

The Web is a damn flexible medium, and rightly so. We should embrace its flexibility rather than trying to set boundaries for the available technologies in our mindset and in our designs. The earlier we start designing with the new technologies, the quicker their wide adoption will progress and the quicker we will get by the incompatibility caused by legacy browsers. More and more users are using more advanced browsers every single day, and by using new technologies, we actually encourage them to switch (if they can). Some users will not be able to upgrade, which is why our designs should have a basic fallback for older browsers, but it can’t be the reason to design only the fallback version and call it a night.

Selectivzr1
Select[ivizr]2 is one of the many tools that make it possible to use CSS3 today.

There are so3 many4 remarkable5 things6 that we, designers and developers, can do today: be it responsive designs with CSS3 media queries, rich Web typography (with full support today!) or HTML5 video and audio. And there are so many useful7 tools8 and9 resources10 that we can use right away to incorporate new technologies in our designs while still supporting older browsers. There is just no reason not to use them.

We are the ones who can push the cross-browser support of these new technologies, encouraging and demanding the new features in future browsers. We have this power, and passing on it just because we don’t feel like there is no full support of them yet, should not be an option. We need to realize that we are the ones putting the wheels in motion and it’s up to us to decide what will be supported in the future browsers and what will not.

More exciting things will be coming11 in the future12. We should design for the future and we should design for today — making sure that our progressive designs work well in modern browsers and work fine in older browsers. The crucial mistake would be clinging to the past, trying to work with the old nasty hacks and workarounds that will become obsolete very soon.

We can continue to cling to this notion and wait for older browsers to become outdated, thereby selling ourselves and our potential short, or we can adjust our way of thinking about this and come at the Web from a whole new perspective. One where we understand the truth of the situation we are faced with. That our designs are not going to look the same in every browser and our code will not render the same in every browser. And that’s the bottom line.

Screenshot13
Yaili’s beautiful piece My CSS Wishlist on 24ways14. Articles like these are the ones that push the boundaries of web design and encourage more innovation in the industry.

Andy Clarke spoke about this at the DIBI Conference earlier this year (you can check his presentation Hardboiled Web Design on Vimeo15). He really struck a nerve with his presentation, yet still we find so many stalling in this dream of complete Web standardization. So we wanted to address this issue here and keep this important idea being discussed and circulated. Because this waiting is not only hurting those of us working with the Web, but all of those who use the Web as well. Mainly through this plethora of untapped potential which could improve the overall experience across the spectrum for businesses, users and those with the skills to bring this sophisticated, rich, powerful new Web into existence.

For Our Clients

Now this will mean different things for different players in the game. For example, for our clients this means a much more developed and uniquely crafted design that is not bound by the boxes we have allowed our thinking to be contained in. However, this does come with a bit of a compromise that is expected on the parts of our clients as well. At least it does for this to work in the balanced and idealized way these things should play out. But this should be expected. Most change does not come without its compromises.

In this case, our clients have to accept the same truism that we do and concede that their projects will not look the same across various browsers. This is getting easier to convince them of in these times of the expanding mobile market, but they may still not be ready to concede this inch on the desktop side of the coin. Prices might be adjusted in some cases too, and that may be another area that the clients are not willing to accept. But with new doors being opened and more innovation, comes more time and dedicated efforts. These are a few of the implications for our clients, though the expanded innovation is where we should help them focus.

In short:

  • Conceding to the idea that the project will not be able to look the same across various browsers,
  • This means more developed and unfettered imaginative designs for our clients,
  • This could lead to increased costs for clients as well, but with higher levels of innovation and
  • Client’s visions for what they want will be less hindered by these limitations.

For the Users

The users are the ones who have the least amount invested in most of what is going on behind the scenes. They only see the end result, and they often do not think too much about the process that is involved which brings it to the screens before them. Again, with the mobile market, they have already come across the concept of varying interfaces throughout their varied devices. They only care about the functionality and most probably the style that appeals to them — but this is where their interest tends to end. Unless of course, they too are within the industry, and they may give it a second thought or more. So all this talk of cross-browser compatibility really doesn’t concern them, they really leave all that up to us to worry about.

Users only ever tend to notice anything if and when something does not work the way they expect it to from one place to the next. In most cases, they are willing to show something to a relative, friend or colleague, and suddenly from one device to the next, something is different that disrupts their ability to do so. That is when they actually take notice. But if we have done our jobs correctly, these transitions will remain smooth — even with the pushing of the envelopes that we are doing. So there is not much more that is going to change for the users other than a better experience. Average user is not going to check if a given site has the same rounded corners and drop-shadow in two different browsers installed on the user’s machine.

In short:

  • Potentially less disruptions of experience from one device to another and
  • An overall improved user experience.

For Designers/Developers

We, the designers and developers of the Web, too have to make the same concession our clients do and surrender the effort to craft the same exact presentation and experience across the vast spectrum of platforms and devices. This is not an easy idea to give up for a lot of those playing in these fields, but as has been already mentioned, we are allowing so much potential to be wasted. We could be taking the Web to new heights, but we allow ourselves to get hung up on who gets left behind in the process — and as a result we all end up getting left behind. Rather than viewing them as separate audiences and approaching them individually, so to speak, we allow the limitations of one group to limit us all.

16
Perhaps a divide and conquer mentality should be employed. Image Credit17

So this could mean a bit more thought for the desired follow through, and we are not suggesting that we strive to appease one group here and damn the rest. Instead, we should just take a unified approach, designing for those who can see and experience the latest, and another for those who cannot. It wouldn’t mean more work if we design with those users in mind and produce meaningful and clean code up front and then just adjust it for older browsers. Having to remember that not everyone is afforded the privilege of choosing which browser they are using. And if necessary, this approach can be charged for. So it could lead to more revenue along with exciting new opportunities — by bringing some of the fun back into the work that being boxed in with limitations has robbed us of.

In short:

  • Conceding to the idea that the project will not be able to look the same across various browsers,
  • A more open playing field for designers and developers all around; less restricted by this holding pattern,
  • More exciting and innovative landscape to attract new clientele,
  • Division of project audience into separate presentational approaches and
  • Probably less work involved because we don’t need the many hacks and workarounds we’ve used before.

So What Are We Waiting For?

So if this new approach, or adjusted way of thinking can yield positive results across the browsers for everyone involved, then why are we still holding back? What is it that we are waiting for? Why not cast off these limitations thrown upon our fields and break out of these boxes? The next part of the discussion tries to suss out some of the contributing factors that could be responsible for keeping us restrained.

Fear Factor

Fail better18
The fail awaits, and so some of us opt to stay back. Image by Ben Didier19

One contributing factor that has to be considered, is perhaps that we are being held back out of fear. This might be a fear of trying something new, now that we have gotten so comfortable waiting for that magic day of compatibility to come. This fear could also stem from not wanting to stand up to some particular clients and try to make them understand this truism of the Web and the concessions that need to be made — with regards to consistent presentation across the browsers. We get intimated, so to speak, into playing along with these unrealistic expectations, rather than trusting that we can make them see the truth of the situation. Whatever the cause is that drives this factor, we need to face our fears and move on.

It’s our responsibility of professionals to deliver high-quality work to our clients and advocate on and protect user’s interests. It’s our responsibility to confront clients when we have to, and we will have to do it at some point anyway, because 100% cross-browser compatibility is just not going to happen.

Comfortable Factor

A possible contributing factor that we should also look into is that some people in the community are just too comfortable with how we design today and are not willing to learn new technology. There are those of us who already tire of the extra work involved in the testing and coding to make everything work as it is, so we have little to no interest at all in an approach that seemingly calls for more thought and time. But really, if we start using new technologies today, we will have to master a learning curve first, but the advantages are certainly worth our efforts. We should see it as the challenge that will save us time and deliver better and cleaner code.

To some extent, today we are in the situation in which we were in the beginning of 2000s; at those times when the emergence and growing support of CSS in browsers made many developers question their approach to designing web sites with tables. If the majority of designers passed on CSS back then and if the whole design community didn’t push the Web standards forward, we probably still would be designing with tables.

Doubt Factor

Doubt is another thing we must consider when it comes to our being in hold mode, and this could be a major contributor to this issue. We begin to doubt ourselves and our ability to pull off this innovative, boundary pushing-kind-of-work, or to master these new techniques and specs, so we sink into the comfort of playing the waiting game and playing it safe with our designs and code. We just accept the limitations and quietly work around them, railing on against the various vendors and the W3C. We should take the new technologies as the challenge to conquer; we’ve learned HTML and CSS 2.1 and we can learn HTML5 and CSS3, too.

Faith Factor

I want to believe20
Faith can be a good thing, but in this case, it can hold you back. Image by fotologic21

Undoubtedly, some of us are holding off on moving forward into these new areas because we are faithfully clinging to the belief that the cross-browser support push will eventually happen. There are those saying that we will be better off as a community if we allowed the Web to evolve, and that this evolution should not be forced.

But this is not forcing evolution, it is just evolution. Just like with Darwin’s theory, the Web evolves in stages, it does not happen for the entire population at once. It is a gradual change over time. And that is what we should be allowing to happen with the Web, gradually using and implementing features for Web community here and there. This way forward progress is happening, and nobody should be held back from these evolutionary steps until we all can take them.

“It’s Too Early” Factor

Another possible contributor is the ever mocking “It’s too early” factor. Some members of the online community faithfully fear that if they go ahead and accept this new way forward and begin designing or developing in accordance, then as soon as they begin completing projects, the support might be dropped and they would need to update the projects they already completed in the past. It’s common to think that it’s just too early to work with new standards until they are fully implemented in many browsers; because it’s just not safe to assume that they will be implemented at all.

However, one needs to understand the difference between two groups of new features: the widely accepted ones (CSS3′s media queries, border-radius or drop-shadows or HTML5 canvas are not going to disappear) and the experimental ones (e.g. some OpenType features are currently supported only in Firefox 4 Beta22). The widely accepted features are safe to use and they will not disappear for certain; the experimental features can always be extracted in a separate stylesheet and be easily updated and maintained when necessary. It might be a good idea not to use experimental, unsupported features in large corporate designs unless they are not affecting the critical design elements of the design.

Validation Factor

We cannot forget to mention that there are also many of us who are refusing to dabble in these new waters simply due to the fact that implementing some of these techniques or styles would cause a plethora of vendor-specific pefixes to appear in the stylesheet, thus impeding the validation we as professionals strive for.

Many of us would never put forth any project that does not fully validate with the W3C, and until these new specs are fully standardized and valid, we are unwilling to include them in their work. And because using CSS3 usually means using vendor-specific prefixes, we shouldn’t be using CSS3. Right?

23
Jeffrey Way’s article But It Doesn’t Validate24

Well, not quite. As Jeffrey Way perfectly explains in his article But it Doesn’t Validate2625, validation is not irrelevant, but the final score of the CSS validator might be. As Jeffrey says,

“This score serves no higher purpose than to provide you with feedback. It neither contributes to accessibility, nor points out best-practices. In fact, the validator can be misleading, as it signals errors that aren’t errors, by any stretch of the imagination.

[...] Validation isn’t a game, and, while it might be fun to test your skills to determine how high you can get your score, always keep in mind: it doesn’t matter. And never, ever, ever compromise the use of the latest doctype, CSS3 techniques and selectors for the sake of validation.”

— Jeffrey Way, But it Doesn’t Validate2625

Having our work validate 100% is not always the best for the project. If we make sure that our code is clean and accessible, and that it validates without the CSS3/HTML5-properties, then we should take our work to the next level, meanwhile sacrificing part of the validation test results. We should not let this factor keep us back. If we have a chance for true innovation, then we shouldn’t allow ourselves to be restrained by unnecessary boundaries.

All in All…

Whatever the factors that keep us from daring into these new CSS3 styles or new HTML5 coding techniques, just for a tangible example, need to be gotten over. Plain and simple. We need to move on and start using CSS3 and HTML5 today. The community will become a much more exciting and innovative playground, which in turn will improve experiences for as well as draw in more users to this dynamic new Web, which in turn will attract more clientele — effectively expanding the market. This is what could potentially be waiting on the other side of this fence that we are timidly facing — refusing to climb over it. Instead, waiting for a gate to be installed.

Until we get passed this limited way of looking at the situation, only then will we continue falling short of the full potential of ourselves and our field. Are there any areas that you would love to be venturing into, but you are not because of the lack of complete cross browser compatibility? Admittedly, I was a faith factor member of the community myself — how about you? And what CSS3 or HTML5 feature are you going to incorporate into your next design?

Will You Use HTML5 / CSS3 In Your Next Design?

Will you use HTML5 / CSS3 in your next design project?27Market Research28

(sp) (vf) (ik)

Footnotes

  1. 1 http://selectivizr.com
  2. 2 http://selectivizr.com
  3. 3 http://www.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/
  4. 4 http://www.smashingmagazine.com/2010/06/17/start-using-css3-today-techniques-and-tutorials/
  5. 5 http://www.alistapart.com/articles/responsive-web-design/
  6. 6 http://www.smashingmagazine.com/2010/10/11/local-storage-and-how-to-use-it/
  7. 7 http://caniuse.com/
  8. 8 http://www.modernizr.com/
  9. 9 http://selectivizr.com/
  10. 10 http://html5boilerplate.com/
  11. 11 http://opentype.info/blog/2010/08/14/better-web-typography-with-opentype-features/
  12. 12 http://24ways.org/2010/my-css-wish-list
  13. 13 http://24ways.org/2010/my-css-wish-list
  14. 14 http://24ways.org/2010/my-css-wish-list
  15. 15 http://vimeo.com/17137962
  16. 16 http://www.flickr.com/photos/michaelsgalpert/5071561135/
  17. 17 http://www.flickr.com/photos/michaelsgalpert/5071561135/
  18. 18 http://www.flickr.com/photos/prettyuglydesign/4673681658/
  19. 19 http://www.flickr.com/photos/prettyuglydesign/4673681658/
  20. 20 http://www.flickr.com/photos/fotologic/408096004/
  21. 21 http://www.flickr.com/photos/fotologic/408096004/
  22. 22 http://opentype.info/blog/2010/08/14/better-web-typography-with-opentype-features/
  23. 23 http://net.tutsplus.com/articles/general/but-it-doesnt-validate/
  24. 24 http://net.tutsplus.com/articles/general/but-it-doesnt-validate/
  25. 25 http://net.tutsplus.com/articles/general/but-it-doesnt-validate/
  26. 26 http://net.tutsplus.com/articles/general/but-it-doesnt-validate/
  27. 27 http://polldaddy.com/poll/4226870/
  28. 28 http://polldaddy.com/features-surveys/

↑ Back to topShare on Twitter

Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine. He runs responsive Web design workshops, online workshops and loves solving complex performance problems in large companies. Get in touch.

Advertising
  1. 1

    Try telling that to a client, who’s 245 strong team on the office floor still run IE6, who sees employing an IT consultant to upgrade the lot as an expense he could without.

    It would be great, but simply not possible. Yet. Please stop force feeding us with this stuff, we know it’s great.

    0
    • 2

      You don’t have to tell it to the client! There is no reason you would!

      I work with several client who is a lot bigger than 245 and they all use IE6 yet their site is built in HTML5 and full of CSS3!

      0
      • 3

        Link?

        0
      • 8

        it really comes down to if you have that massive client organization – all running IE6 – to create an entire web presence that is not only completely 100% IE6 compatabile but also putting in the time to add CSS3 and HTML5 features.

        That’s a lot of extra money there that’s needed….and if they aren’t willing to pay for that extra overhaul, doing something like that is completely useless.

        it always comes down to the client. its never black and white. I love CSS3 and HTML5 but would never put in extra time to do it just for the hell of it (or for progression’s sake) especially when my clients still run their stone age computers and browsers.

        0
        • 9

          That’s backwards. It’s supporting IE6 that’s expensive, not using HTML5 and CSS3.
          How does using cost you more? OR ? Or ommiting type attribute for link and script?

          0
        • 10

          Doesn’t matter how design looks, ie6 mostly requires fixes in that or other way, so it gets around 30% more of extra code and implementation time, while migrattion from html4/xhtml to html5 doesn’t.
          Looks like right time to tell your client to pay you extra not for html5 and css3 but for ie6?

          0
      • 11

        Just because you can, doesn’t mean you should.

        As a designer/developer, I always have to take a step back to think – does the client really need this feature? If it’s something that I (personally) want to put in just because I can, I tend to leave it out unless it’s requested.

        0
      • 12

        You realize how little sense it makes to build an HTML 5/CSS3 website for a client who uses a 10 year old web browser right? How many hacks hold it together? Why would HTML 5 even be a consideration for this audience?

        0
      • 13

        I think a lot of people here have misinterpreted having “corporate experience” as building a website for a business that will be viewed externally. Try deploying an internal use web app on an international level with a large user base with diverse system requirements.

        There’s no WAY you’d build that in HTML 5/ CSS 3. 90% of our user base is IE 8 or less with IE 6 and 7 being the majority. The extra effort isn’t worth it and the hacks necessary to make html 5 work with those browsers creates a debugging nightmare. Additionally server side technologies like ASP.net and many add-on components(both free and purchased) are not written for HTML 5 compliance, further complicating the development process.

        0
      • 14

        I really want to see that webpage. Seriously – I REALLY want to see it.

        And yeah – this kind of articles are boring – we all tried out all new stuff – we use it where possible and we don’t where the client is bitchy – and the client is bitchy and has all the right to be since it’s his money.

        0
      • 15

        Could you please tell me how css3 work on IE6 and IE&?

        0
        • 16

          You don’t need to get it work on IE6, that is not necessary. You should be using CSS3 to enhance the user experience for users who use modern browsers.

          However, if you cant get your head around the mind-blowing idea that websites can (and should in most cases) look different between browsers you could use things like CSS PIE (http://css3pie.com/) to emulate some CSS3 effects.

          If you wish to use CSS3 Pseudo Selectors such as :nth-child or :nth-of-type to make your code more semantic and meaningful and make your CSS do all the work you can use the awesome tool that is Selectivizr (http://selectivizr.com/)

          Hope that helps!

          0
    • 17

      You can still cut support for IE6 in the 95% of your projects where your client is NOT running IE6.

      0
      • 18

        To be honest i don’t even care if my client uses ie6. Its his clients that i should have to worry about. And you can say o stop developing for ie6. If that result in a loss of 10% in profit. I don’t think your client spent his money wisely.

        0
      • 19

        I cut IE6 support as much as i possibly can. I encourage it at every chance I get.

        0
      • 20

        Heh,

        Once upon a time, I actually thought the same. Hell, screw IE6! Then I started dealing with online stores.

        Here’s an example of why you shouldn’t cut support for IE6.

        Just launched a small wholesale online store. Nothing too special. Gets about 300 unique visitors a day.

        It’s been operating for a little over three weeks.

        From those three weeks, looking at the stats. I can see a little over 5% are IE6 users.

        I can only drill so far down into the stats but saying that 5% could equal close to $900 a week in sales or over $45,000 a year.

        IE6 sucks but throwing good money out the window. Sucks even more. lol

        0
        • 21

          I hear you. But I had to cast away the ie6 crowd for the benefit of encryption.

          I feel that the only way to make ie6 obsolete is to end the coddling and post on your site that you don’t support it.

          The same with Flash. I love flash and wish that more portable devices would support it…I hate the ipad & iphone for this very reason! We live in a world were minimum download speed packages are 7 mps. We can afford a little weight cant we?

          0
    • 22

      It´s our job to develop on the current technology. I´m not seeing any problems to develop websites in HTML5 and CSS3. Clients and Users using iE 6 are a question of consultation, not a barricade. Stop developing for browsers like iE6 because some system administrators are too lazy to modernize their intern system.

      0
      • 23

        It is not our job to develop with current technology. In all reality, it is our job to make our clients money. If you drop support for IE6 when a client’s company relies on it (not because of a lazy admin but because the cost of upgrading a worldwide company is too expensive), then you are not doing your job.

        0
        • 24

          It is a lot of work to get people up and running on a new browser, but aren’t there simpler solutions to mass deploying a new browser (your choice of the big names that aren’t IE)? I mean, if the company is world wide, they should have back-doors for admin access to systems to pop a newer browser on.

          IE6 is nearing 10 years old. Granted the latest service pack is from 2008, but that is FAR from the support needed to have a safe, reliable, up-to-date browser. Didn’t I hear too that Google is dropping support for IE6 in many of its apps?

          0
          • 25

            Many companies still run Windows XP on their systems, and the base browser is IE6. All of the admin restrictions make it impossible to do quick updates, even as simple as upgrading or downloading browsers.
            Google and many other companies have dropped support for IE6 which is great, and a step in the right direction. Unfortunately they will need to drop support for IE7 and 8, older versions of Firefox, Chrome Safari and others before HTML5 and CSS3 can become a true web standard.

            0
          • 26

            IE6 is older then 10 years and Microsoft itself has dropped support for it. It has both come to it’s end-of-life and MS sites are being updated which look completely wrong in IE6.

            0
          • 27

            I didn’t actually believe that Microsoft has also dropped browser support for some of their websites, so I jumped onto a PC I keep around specifically for IE6 developing and what do you know; first Microsoft site I looked at.

            Industry Solutions – Microsoft Dynamics, http://www.microsoft.com/dynamics/en/au/industries.aspx is completely broken in IE6.

            I am thinking that the push to CSS3 and HTML5, is closer than expected.

            0
        • 28

          or just don’t take them on as a client :)

          it always comes down to the client and their business. One of ours has a huge basis and a lot of traffic in Asia, a lot which still use IE6 statistically speaking…something not having to do with lazy admins but with their client outreach. It’s a pain but a neccessity at times…unfortunately.

          0
        • 29

          Oh, please support IE6 if client wants it. Just charge for that so that it would be less expensive to upgrade, than to continue walking with dinosours. Unless your time and sanity is worth nothing.

          0
    • 30

      I’m in full agreement with Shaun. Using the proper techniques, the client shouldn’t know any different.

      There may be an additional expenditure of effort, but, at least in my opinion, it is worth it to drive the industry forwards rather than leaving it to stagnate.

      0
      • 31

        it will always cost more. if the client isn’t willing to pay it, then that really truly is their fault. it’s like restoring a super old car along with adding a brand new engine, interior, and the highest standard of safety features.

        it sure costs a hell of a lot extra, but if that’s what they want, they gotta pay it.

        0
        • 32

          This comment irks me. It does not cost more at all to work in html5 and css3 whilst supporting IE6. Working with the tools like selectivzr and Modernizr make you work with a whole different approach of coding for the capabilities of the browser and not a browser version specifically. We have found that aside from a few of the usual ie6 fixes we spend less time if any ,worrying about ie6 or ie8 or whatever. We just dont need to talk about it and we are too busy enjoying talking about how csstransitions or translate or scale are blowing our mind in the browsers that support them and how neatly we have handled the ones that don’t. Clients, and only those that care to ask about this sort of thing, appreciate that ie6 is archaic and are excited to learn that the experience is much better in the browsers they may be running say at their home rather than office. This “hardboiled” (Andy Clarke) approach delivers your best work right now!

          0
          • 33

            Got to agree with Lewis here, I don’t understand the whole “It costs more to develop in HTML5 or CSS3″ since I started using HTML5 and CSS3 I seem to be developing sites faster, they are cleaner and way more semantic.

            The “Hardboiled” approach is the way to go.

            0
          • 34

            i’ve simply found it takes longer adding extra html5 or css3 items to a site. i do a lot of little things along the way which i wont charge any extra of course, but if a client lists 10 crazy html5 thing they want on their site, the site would obviously take more time to build than if that was never on there before. same with adding flash attributes to a site or things like that. i say it costs more only because it may take more time. i’m not talking about css rounded corners or anything like that though :)

            0
    • 35

      The simple fact that your can show bleeding edge technology in your portfolio will work to attract the right kind of customers, so if you know how to position yourself, you have a lot to win by early adopting HTML5+CSS3. Particularly if you do a good job in applying graceful degradation techniques.

      While I understand that large software houses may have trouble adapting to technology changes, freelancers and smaller teams like ours have little excuse. Not adapting NOW and sticking your head in the sand will just result in being outdated once these technologies go mainstream.

      Obviously, this isn’t stuff you want to throw at customers using IE6 as their primary browser. But then you’re probably worried with things other than design and creativity to start with.

      So here’s a suggestion: choose the right customers.

      If your customers find it relevant to project an image of innovation and being on the bleeding edge, you’ll find they are much more receptive to using new technology.

      Incidentally, yesterday we wrote a whole new piece on HTML5 and various projects where we’re applying it. I don’t mean to do shameless plugging (moderators: feel free to edit this paragraph out), but I think this might be an interesting read to some:
      http://seegno.com/blog/2010/12/09/making-the-web-a-better-place

      0
    • 36

      Surely the only real problem is when someone is using IE6 without JavaScript? In all other cases, the website can and should look acceptable for the capabilities of the browser used. There is no real argument from a client perspective as long as they know different browsers have different capabilities.

      What I do want to know however is – what are the implications for SEO if we start using HTML5 now? How does Google at el handle having multiple H1 tags on the same page for instance? I am yet to find a clear answer.

      0
    • 45

      I work for a large financial services company, we’ve got tens of thousands of employees (and millions of customers who use our sites) and internally the browser that people are forced to use is IE6. That said, we’re currently rolling out a reworked CMS and we’re using a fair amount of HTML5/CSS3. It means taking care about what you choose and how you tell people about the differences that they can expect between the IE6 view and the better browsers, but it’s possible. Honestly.

      0
    • 46

      I don’t see what the problem is here.
      Design websites that are functional in IE6 and legacy browsers and is enahnced in the current browsers. For example rounded corners, drop shadow etc etc for the contemporary browsers and square corners, no shadow etc for IE6 and similar. You can’t just drop all your support for IE6, people are still using it, that’s just not being a professional.

      0
    • 47

      I completely agree with you Abbas. Stop spreading unusable advice on novice ears. It felt forced from the first paragraph, and so I skipped straight past all the filler. Oh, but wait, look how many words are in this post. Well then, it must’ve been a well thought out piece of literary genius! This isn’t like moving the web from tables to CSS. It’s gonna take awhile to transition whether you keep making illogical posts like this or not. If even Apple can’t get the internet off the html4 gravy train, I doubt your opinions will have any effect… sooo it may be time for your writers to turn off their iphones and get back into the industry they’re blogging about.

      Please take these opinions with a grain of salt, as I will yours.

      0
    • 48

      Vitaly Friedman (editor-in-chief of Smashing Magazine)

      December 10, 2010 10:35 am

      Abbas, it’s not like we are trying to force you into using CSS3/HTML5 an any costs. Yes, sometimes it may be impossible to use it, but more often than not it’s possible and it would save designers a lot of time, spare headache, make the code better, cleaner and easier to maintain and enrich user experience. And it’s worth arguing for!

      In our experience many designers are reluctant to use the new technologies, such CSS media queries or others. We often hear the same reasons for not using CSS3, like “there is no full cross-browser support yet” and we strongly believe that it’s just not the right reason. Of course, if the project settings do not allow for CSS3, it’s fine, but if it does, we should embrace the technology and move the Web forward instead of looking back over and over again.

      And this is the reason for this article: we wanted to address this issue once and for all.

      0
      • 49

        So… when’s Smashing Magazine switching to html5? :)

        0
      • 50

        But Vitaly, it sometimes feels like we’re being forced into using HTML5/CSS3 and as if we’re to scared or lazy to learn it. Not just on posts here on Smashing but also on other blogs. I know that’s not what you meant but it feels a pit pushy sometimes.

        I’m trying these new techniques out now for a couple of months and they certainly are cool and more semantic! (Most of my skills I learned from posts here on Smashing so thanks for that!)

        The truth of the matter is if I would show a design in Photoshop to a client and code it, the client wants it to be exact in browsers as on the design I showed him. At least my clients do, and can you blame them?

        So if I would use CSS gradients, and 30% of the browsers just show a solid color my clients will raise questions. And if I can achieve the same gradient effect using a background image, making it look fine in all browsers, why should I use the CSS technique? Because it’s cooler? My clients just want their sites to work in all browsers, they don’t care about CSS3.

        Then there are all these CSS3 selectors that only work in recent versions of FF, Chrome, Safari etc so it’s not only a IE problem anymore.

        Same goes for html5 elements like header, footer, nav, aside etc. If the site does not work at all in ie6, 7 & 8 with javascript disabled, why should I even bother to integrate them if I could just use plain div’s. Does my client care about whether I’m using a div or section element? As long as they’re both equally SEO friendly I can imagine the clients want to have an element that is most browser consistent.

        And I would want the same if I was running an online business focused on a broad target audience.

        So I think it’s important to learn all these new techniques, play with them and get comfortable with them. But no, I don’t think we should start using CSS3 and HTML5 today. At least not the elements and selectors that decrease user experience in older browsers and don’t have decent fallbacks.

        0
        • 51

          Fynn, thank you for your comment. I can see that it can be problematic once the client has seen the design in Photoshop, but you can also show the design in the browser. Personally, I think that some CSS3 classes and attributes are hardly useful — I don’t think that text-shadow or animations will be used in practice a lot; CSS3 should not be used to create fancy effects, yet it can be used to keep the code cleaner and easier to maintain. It can be used to effectively solve some problems that were quite difficult to solve before.

          Yes, some CSS3 features are too early to use, but others are not. And yes, I completely agree with you that “we should [not] start using CSS3 and HTML5 features today which decrease user experience in older browsers and don’t have decent fallbacks.” Some of CSS3/HTML5 new features do that, and some don’t. In the latter case, we are pretty safe to start using CSS3/HTML5 today.

          0
          • 52

            Thanks for the reply Vitaly.

            Well.. have to say I’ve hardly seen any html5 elements that can be used right now that do have a decent fallback on non-js supporting browsers. However, I think these articles of Jeffrey Way might (also) be useful to check out which html5 they can use safely;

            - http://net.tutsplus.com/tutorials/html-css-techniques/25-html5-features-tips-and-techniques-you-must-know/

            - http://net.tutsplus.com/tutorials/html-css-techniques/quick-tip-html5-features-you-should-be-using-right-now/

            About CSS3, I’m not sure yet.. I have to play with it a little more to know which styles I can use right now.

            You can agree or disagree with the article and both parties have interesting motivations. But it sure keeps the discussion sparkling and it probably will get people into playing with html5/css3, and that’s always a good thing :)

            0
          • 53

            I think as a designer it’s smart to show your clients your mockups first in Photoshop, especially if you have several of them to show them. For some, it’s much easier (at least in my case) to create the artwork in PS and make a JPG to show. Also, I don’t want to waste my time on something they may not approve. In my opinion, you should never do work that you won’t get paid for so if that means getting a quicker result through PS, that’s definitely the road I’m going to take.

            0
      • 54

        I’m a web designer, i’d love to be able to pitch to clients the wonders of CSS3/HTML5, but unfortunately you have to cater for everybody.

        A lot of clients don’t care about web standards, they just want their site to look good, to work correctly and make them more money than their last one.

        It can be a very awkward conversation with the client when he/she calls the office complaining the customers/visitors cannot view they’re website properly.

        Like I said: yes, it’s a great development in coding but until it can be fully implemented, across all browsers please don’t tell me it’s OK to use it.

        0
        • 55

          I’m leaning towards Abbas given the experience I’ve had working at a large enterprise in the telco space (30+K employees, global locations, million plus customers, etc…). I worked on the management team for the PBX servers – basically the web frontend/backend for these boxes (think logging into your home router and config’ing it – same idea).

          Given the huge requirements and customer base we always had to take into account all variables and we were more or less forced to say that we cannot support everything. This was usually the more newer web stuff and some of the really old web technologies. Yet, we still supported old IE browsers 6,7+ because we simply had to. We could never be as agile as a solo developer or a small web company – even if we wanted to and knew that using newer tech. would allow us to develop faster, cleaner, and make codebases more maintainable. There is always the cost factor, man hours, and dealing with all the other issues and projects. (Also, we had to support remote users/technicians who still used modems – due to redundancy/failsafe reasons – and they would never care about fancy CSS3 nor have the bandwidth to support so much JS/CSS3 support).

          Thus, I feel it’s all too easy for those on the bleeding edge of web development to champion for moving forward. I’m really liking HTML5/CSS3 and am using it – but now I am working for myself – this couldn’t be the case w/ my former employer until after 3-4 years (maybe) from now.

          Also, there are like 10 new articles on average on Smashing, Nettuts, etc… that I have to tuck away and read later just to stay on top of what is going on w/ latest web development – this could never work in the real world or a place where I used to work.

          Finally,
          I wish people would address the fact that with HTML5 – which tries to make HTML more level and structured – there needs to be more compliance and working together with the browser vendors. E.g. Trying to support current CSS3 techniques requires a css3 option along w/ vendor-specific css3 options. That does not fly because you can’t ask developers working someplace to invest time to learn stuff where it might be different tomorrow and expect them to get their work done and on time.

          One more thing that I can acknowledge was badly done at my last business. I felt my job could have been done better and we could have supported newer technologies (at least internally) if there was more engagement between IT and developers. Our IT department was usually the weakest link since they forced Windows/Mac machines to keep copies of certain software (browsers included) that were too old. So IT can play a bad role and should be on the same page a little.

          0
    • 56

      Why would anybody hire an IT consultant to upgrade IE6, if you can install Google Chrome on any Windows computer without administrator privileges?
      Every elementary skilled user can install Chrome simply by clicking a link on a web page.

      Of course, it still relies on “we want to do that change” approach

      0
    • 57

      Why don’t you show them Google Chrome? Is much better than any browser, lighter and faster.

      0
    • 58

      “If you think it’s expensive to hire a professional to do the job, wait until you hire an amateur.”

      Red Adair

      0
    • 59

      I completely concur: as much as i would love to use html5/css3 i can’t afford to loose my clients that primarily use ie6 but demand sites that work 100%. So stop making us feel like we are the ones stuck in the past; it’s not the right time to start fiddling with this, or my company will go bankrupt!

      0
    • 60

      Search for the meaning of progressive enhancement.
      I hope that helps!
      .

      0
    • 61

      Progressive enhancement is a strategy for web design that emphasizes accessibility, semantic HTML markup, and external stylesheet and scripting technologies. Progressive enhancement uses web technologies in a layered fashion that allows everyone to access the basic content and functionality of a web page, using any browser or Internet connection, while also providing those with better bandwidth or more advanced browser software an enhanced version of the page.

      source: wikipedia

      0
  2. 62

    A nice Showcase of 10 HTML5 Example can be found here (in German): http://www.html5-designer.de/showcase-10-html5-seiten-die-flash-in-den-hintergrund-stellen
    I like the Browser Ball and the Chain Reaction, it shows that HTML5 will be the future of Webdesign. I really look forward to more Examples in this field.
    Have a good Weekend, greetz Mike

    0
    • 63

      Those seem to be old rehashed flash tricks, and not usable for anything except games

      0
    • 64

      Wow!!! Link for HTML5 works great in IE!!! LOL!!!
      HTML5 does not work in IE 6, 7, 8

      0
      • 65

        I don’t know if your aware but IE6, IE7 and IE8 (soon to be) out of date browsers! They will never support HTML5! I think everyone is aware of that!

        0
      • 66

        ajay anand sharma

        January 12, 2011 2:29 am

        you can use HTML 5 with a small js. through this html 5 is also working in all IE.

        0
  3. 67

    There are many technologies that don’t have cross browser support, but we find a way around it. That’s just the way it is. I think the more we embrace it, the better the support will be for the technology. We decide, not Microsoft Google or Apple.

    0
  4. 68

    No, I don’t agree with this at all. This is one of those ‘design for design’s sake’ arguments. I don’t really want to push out a bunch of forked code and half-baked features.

    0
    • 69

      The problem comes with the fact of people stuck on an ancient, hardly supported, buggy browser base that is IE. If we continue to code with IE in mind we are stuck. If we don’t force, but highly suggest that experiences will be better (or that you take that leap and force them to not be using IE < 9) in another browser, then possibilities start opening up when more users actually have a workable browser.

      0
    • 70

      I can’t help but feel the same way as Jayson, at least at the moment.

      I currently work often in *get ready for it* Flash development, and while I think a fully stable HTML5 will be great, comparatively it just seems like the current implementation of HTML5 requires a lot of “hacks” for browser compatibility checking, workarounds, etc.

      To be honest, modern and moderate use of Flash feels most comfortable, because it either renders and functions perfectly as intended, or an alternate markup is displayed. I would love it if HTML5 had the same reliability.

      0
    • 71

      Are there any screen readers that can deal with HTML5 and multiple H1s well? Section 508 compliance is a real concern for my work.

      Like Netflix, I love HTML5 and CSS3 when I know exactly what their target system is going to be (ex. PS3) but have to fall back to XHTML (Netflix uses 4.01) for everything else. I expect this from a draft standard that is under development.

      As far as IE6, the companies I have worked with that still use it don’t like it either but are forced to use it due to previous investments in other software (ex. SAP Portal) that require it. For them, it’s not just rolling out a new browser but upgrading other systems as well. Thankfully most of those systems are being upgraded now.

      0
  5. 72

    I’ve been using HTML5 for a month now. Although I only use the head info and not the new tags, because I don’t agree with hacking IE to make it work. As for CSS3, I’ve been using that for awhile now, and clients are pretty open about progressive enhancement.

    0
  6. 73

    Funnily, I had been using couple of those CSS 3 features already and wasn’t aware of it. I am not a trained designer, so I’m always hunting over the Internet for newer and cooler stuffs. I had tried couple of those HTML 5 and CSS 3 stuffs in the past, only to realise much later that I had already adopted it.

    It is very recommended who are thinking of switching over now. I’m sure everyone will love it and adopt it pretty soon.

    0
  7. 74

    :) i’m interested in css3 and html5 from some time, but tbh i used css3 but once and in a small project of my own.

    Anyway, its true that some ppl (clients) use ie6, and in numerous casesthey will not want to upgrade, but hey, you dont have to take such work :) once i said to a client that since ms doesnt support ie6 anymore the site will not be tested nor compatible in ie6 since i want to use some stuff which i know will not work easily in old browser. I believe that if you do this witch enough confidence most of the clients will accept it (from my experience), its your task to be an expert not your client.

    @the author, thanks for this article :)

    0
    • 75

      I’m sorry but the argument that “you don’t have to take such work” is naive and really just ridiculous. Some of us actually need to make money in this business and don’t have the luxury of turning down a client just because they want their site to look exactly the same in IE6.

      I agree that it is possible to use a few HTML5 and CSS3 features right now, but I’m not about to turn work down just so that I can use “cutting edge” markup.

      0
  8. 76

    I think someone said it already on CSS Tricks on their recent poll about this (http://css-tricks.com/new-poll-not-html5/): when you’re working with some governments, you have to comply with some standards and working with HTML 5 it’s not a part of them.

    Of course you could still use it, but it seems to me that’s not the best move to use the advanced features of HTML 5 and patch for older browsers if you can do the same just once but with older code.

    Obviously, this situation applies not only to government jobs.

    Having said that, I would still consider to use it on a new site and definitely use it on a web app

    0
  9. 77

    HTML5 should be learned and when the W3C finalizes the HTML5 validator then it should be used in production. Same with CSS3. It’s not a matter of HTML5 being finished, just that we can validate to ensure our code is properly formatted for CBC.

    0
  10. 80

    Christopher Anderton

    December 10, 2010 7:08 am

    On the other hand. Is HTML5 and CSS3 standards this date? ;-)

    0
  11. 81

    I agree with this article 100%. With tools like Modernizr to help us with fallbacks there really is no excuse not to start using this new technology now.

    0
  12. 82

    Problem is not HTML5, it’s CSS3 (especially CSS3 Transitions). I will use HTML5/CSS3 when Firefox4 will be launched

    0
    • 83

      Then use CSS3 transitions in such a manner that browsers that don’t support it don’t lose functionality. It doesn’t mean you can’t use it at all, you just have to be a bit reserved with it for now.

      0
      • 84

        That’s right. But isn’t it better to use a good js framework (jquery) that works everywhere instead of css3 transitions ?

        0
        • 85

          Performance are better with CSS3 transitions because it’s native for the browser.
          For sure, you can’t do better performance with JavaScript modifying DOM attributes each 30 ms. And it sounds such an hack.

          Moreover, CSS transitions are really simple to use and powerful (it works on (almost) all css properties, you can configure advanced parameters like easing). You should try.
          And degradations are always great, without javascript, without css3 support, the behaviour is always the same (exemple: sliding an image on hover), just without animation.

          However, you still can do a JS degradation for a better animation support and best browser experience ;)

          0
  13. 86

    Seeing the possibilities with CSS3 and HTML5 I’m sure designers/developers can convince clients to switch or at least code this way from here on out.

    My company works with Meredith Publishing who owns a lot of companies like Parents Magazine, Fitness, Better Homes and Gardens, etc. and working with some of their old-ass code I’m constantly finding myself overwriting all the garbage that was originally coded to be IE6 compatible, or was just poorly coded in general, and it works and looks like crap. I’m pretty consistent about inserting CSS3 and HTML5 where possible (unless it’s like an email blast or something), especially on their mobile sites, and they’re one of this company’s biggest clients. There’s a reason they keep coming back and I’m sure the partners have done a great job convincing them to think forward with their code. There’s so many benefits to it, why not? It’s kinda like VHS versus Blu Ray in my opinion (in the voice of GOB from Arrested Development) COME ON!

    0
  14. 87

    I agree with the point of view expressed in this article.
    I think demand will cause evolution to happen and the sooner everybody joins the HTML5 train the sooner browser maker will make compatible browsers.
    I also agree with the fallback implementation for those who can’t use modern browsers (or javascript or the ajax problem for disabled people).

    The problem I see in adopting yet another new technology, is that our clients aren’t willing to pay for the extra time it takes us to implement various versions of the same site.

    For the sake of encompassing change, I believe that we should start to gradually implement some new HTML5+CSS3 techniques in our work. We like the new tools and possibilities!

    Another way things are tending to take is the adoption of sloid frameworks that take care of braking the barriers of compatibility (and/or accessibilty). I think this could be the best compromise between integrating new technologies while having a (semi-) automatic fallback.

    It would be good to have a serious reference on wich frameworks are solid, open and accessiblity aware.

    0
  15. 88

    Great article, something we have debated regularly until our small freelance team recently made the decision to move on up to html5 for all our new work. However, we made some compromises like writing to the strict-ness of XHTML (closing tags and using many typical tags that are safely cross-browser compatible) Html5 is useful for the simpler doctype and building forms is a dream. Using the html5shiv allows us to still code and not worry about the older browsers too much, and we still use 960grid as its basically a one pager so its easy to adapt and keeps the layouts good in IE too.

    We were quite happy making this decision as HTML5 continues to be actively developed, so we feel we’ll be ready once browsers do start using the new tags such as and .

    0
  16. 89

    Excellent article and I totally agree with the points you raise. Users don’t care about a drop-shadow appearing consistently across browsers so why do we get so hung up on these things? All a user cares about is that the site works as expected and that the design facilitates this. If the design can make use of – and the user’s browser render – HTML5/CSS3 techniques then great but if not, it shouldn’t matter.

    100% cross-browser compatibility just isn’t going to happen but we shouldn’t hide behind that and be afraid to use the new features in CSS3 and HTML5. If we as a community don’t embrace and use these new features and encourage our clients to then who will?

    0
    • 90

      Rizqi Djamaluddin

      December 11, 2010 9:25 pm

      Agreed (and this is my take on the matter too). Not everything is fully supported, nor will they ever be. Progressive enhancement is everything; as long as things don’t explode upon a less-capable browser, there’s no need to worry.

      It should be noted that CSS3/HTML5 doesn’t always make the workflow easier — for me it’s often longer (not harder!). But it’s honestly worth it. It’s simply a matter of providing fallbacks. Some things don’t need fallbacks; text-shadow is neat but it’s not absolutely necessary. Other things do; simply supply an alternative. My HTML5/CSS3 website degrades quickly when viewed in IE6; so I just use a conditional comment to detect IE, and set CSS rules for it.

      And yes. If designers won’t start using them, the web will be stuck here forever. Actually, I think it’s a matter of finding that brilliant moment when some HTML5 or CSS3 feature blows everyone’s mind in a way nobody thought of before (like iframes, table layouts, or ajax) — when that happens, the buzz will grow and people will gradually become aware enough for all browser vendors to push for suitably proper support.

      IE 6 will always be the old man living in the house on the corner. He’s definitely going nowhere for a long time, and nobody’s going to be able to convince him to move on. We’ve just got to tend to IE 6 for now, and move on.

      For clients, I found this argument compelling: “using powerful CSS3 features makes your website appeal more to the tech-savvy audience; they’ll be using newer browsers and technology, and will relate to your website using the bleeding edge.” Clients often go for this audience on the web; most of the people using IE 6 won’t be daring enough to do an e-commerce transaction anyway (they’ll usually call their tech-savvy son or someone). They’re aware that appealing to the tech audience brings better business.

      0
  17. 91

    Marc-André Boivin

    December 10, 2010 7:21 am

    I disagree with this article. We should design for users, with client’s needs in mind, not for ourselves, or for the design community. It could happen that for some project, it’s right to use CSS3 and HTML5 but you should never make that choice before knowing who’s gonna use the website in the end.

    I’m not against evolution, but it’s not because it’s new and trend that we should use it without question for every project. And it’s the same for every new technology. I’m not gonna develop an ipad app systematically juste because it’s new and cool. It was the same thing about Flash a fews years ago.

    0
    • 92

      I agree with you, Marc-André. However, the point of the article is not to just always use CSS3/HTML5 because they are CSS3/HTML5 but to use them whenever applicable. Yes, we should design for users with client’s needs in mind, and our designers shouldn’t be artworks; they should rather be solving client’s problems and achieve their goals. The point is that we can use CSS3/HTML5 to do exactly that, it’s not about designing something with cool new tools.

      0
  18. 93

    I’d like to echo what Abbas said. I enjoy the view from ivory towers and all, but the reality is that the next “big thing” we’re all really pining after is for IE6 to officially die.

    The REAL influencers here aren’t web design/dev shops who do the work, but he companies that pay for the work. We can cry all we want about how much better life is with CSS3 and HTML5 but until companies start awarding work with that kind of scope, we are where we are. Trying telling a Fortune 500 company you aren’t supporting their old crappy browsers and see how much work you actually get.

    Why do they ask for cross-browser support? Statistics. Plenty of people out there using old browsers visiting their sites.

    IE 9 is the only Microsoft browser that has support for CSS3 and HTML5 and it’s still in beta. So it will be long time before we can all simply code without consideration for IE8 (and earlier) unless Microsoft makes some kind of herculean effort to upgrade their users to IE9. Past history does not bode well for this notion.

    The only effective push I can see happening is with the foward-thinking high-traffic sites out there. Sites like YouTube, Facebook, Amazon, Yahoo, Google etc. have enough pull with customers to actually cause them to upgrade if they systematically start dropping support for older browsers.

    0
  19. 94

    Cross-browser support is definitely a reason for concern, whether you want it to be or not – and I’m not just talking about older ones.
    Different selectors for various browsers and multiple lines of code to implement one style (eg. rounded corners) makes the workload greatly increase. Using older methods to achieve the same thing may be dated, but in the eyes of your clients it is the same and costs them less.
    If I use an image to make two rounded corners, and you use 6 lines or more (-moz-top-left, -webkit-border-topright etc), the only people that see a difference are other developers that look at your code.
    Don’t get me wrong, I use and support HTML5 and CSS3 in most of my newer projects, but when my client specifically requests IE7 (and heaven forbid IE6) support, I absolutely do not.
    You constantly see people developing new demonstrations in Safari, but are they really practical? They are usually awesome and completely innovative, however if only 20% of people use a Webkit browser, what client is going to pay you for that product?
    And to the above comment, @Shaun Ben, using article and section tags may work in IE6 but the real powerful elements do not so it is tough to say those sites are living up to the real HTML5.

    0
  20. 95

    I find it funny how many people think saying “just don’t support IE6″ solves the problem. What about IE7 and 8? They don’t support any HTML5 or CSS3 either.

    I think the best approach is to be reserved in usage of HTML5/CSS3 – stuff like rounded corners and shadows that add accents that enhance the viewing in modern browsers, but don’t break the experience for older browsers is perfectly acceptable.

    Also using HTML5 video with a flash fallback is an easy sell to clients who want their sites to work on mobile devices.

    Adding heavy JS frameworks to IE tend to just make the sites sluggish and unresponsive. To me that’s worse than missing some shadows.

    0
  21. 96

    John Avex Designs

    December 10, 2010 7:35 am

    its very easy to say “lets start using this and push the technology further”….But try explaining that to a client when their website is not displaying properly in IE or Firefox etc etc. Most clients do not care about the technology behind their websites. And explaining to them that we are just trying to push the tech further, will not register. And not get us paid…

    0
    • 97

      It depends on what CSS3 features you are using. For instance, if you are using media queries, the site will work perfectly fine in older browsers and newer browsers will get an extra something, making the experience of users with new browsers better. So why not use CSS3 in this case?

      0
  22. 98

    Why support IE6 it’s a 10 year old browser! Because the clients wants you to? Well since we are payed by the hour it would only cost them more. Most clients do understand the extra costs and limitation once you give them the right arguments.

    For styling your html5 elements in IE whitout hacks or javascript i would wanna recommend you this article: http://www.debeterevormgever.nl/html5-ie-without-javascript/ and the best thing is that this solution validates.

    Happy html5ing all! ;)

    0
  23. 100

    That article is written by someone who haven’t realized that web development is not a platform for personal artistic expression but about making money for our clients.

    If that rubs you the wrong way, make it for your own company but don’t bitch about client’s not willing to embraze the latest fads just because it’s cool and you want to.

    0
    • 101

      What if you could do both? Would you risk it? I think that’s the point. If you can get away with, then you are going a great way to helping the community as a whole

      0
    • 102

      Thomas, I replied to a similar comment above.

      it’s not like we are trying to force you into using CSS3/HTML5 an any costs. Yes, sometimes it may be impossible to use it, but more often than not it’s possible and it would save designers a lot of time, spare headache, make the code better, cleaner and easier to maintain and enrich user experience. And it’s worth arguing for!

      In our experience many designers are reluctant to use the new technologies, such as CSS media queries or others. We often read the same reasons for not using CSS3, like “there is no full cross-browser support yet” and we strongly believe that it’s just not the right reason. Of course, if the project settings do not allow for CSS3, it’s fine, but if it does, we should embrace the technology and move the Web forward instead of looking back over and over again.

      And this is the reason for this article: we wanted to address this issue once and for all.

      Also, it depends on what CSS3 features you are using. For instance, if you are using media queries, the site will work perfectly fine in older browsers and newer browsers will get an extra something, making the experience of users with new browsers better. So why not use CSS3 in this case?

      0
  24. 103

    I am sorry to say this, but if this was the first article I’ve ready on HTML5/CSS3, I would not be tempted to use either for many years to come. The text sounds very much like a proclamation made to ignite some kinda patriotic feeling in the crowd. But redundant slogans is not the way to make one see the advantages of using HTML5 / CSS3. List with examples of things you can achieve ONLY with HTML5/CSS3 would have done much better with tech crowd.

    I understand, that the scope of the article was a bit different, may be more general trend investigation. But, well, came out kinda like W3′s “we don’t develop HTML anymore, and all the old www will once become unsupported. So be COOL, use XHTML!”. And we all know how this ended:)

    Still, I DO think that we should begin using HTML5 right away. Simply for the sake of learning it, and not finding ourselves fallen far behind one day. We can always go and recode our own portfolio site w HTML5/CSS3 (which is what I’m working on now). Then we can begin using RELEVANT features on the clients’ projects. And so, slowly but surely, the web will shift to HTML5. Also, I’ve already seen some real life projects where both developer and client BENEFITED from html5 features, not simply used them ‘coz they’re trendy.

    P.S. The phrase “client have to” is only valid if followed by “pay you for your work”. In all other cases it’s an oxymoron :)

    0
    • 104

      Dear Irina,

      we have published so many articles covering the advantages and practical uses of CSS3/HTML5 in the past:

      http://www.smashingmagazine.com/tag/css3
      http://www.smashingmagazine.com/tag/html5/

      The point of this article was different; we tried to address a common mentality we’ve noticed in many such articles in the past. Please browse the archives using the links above, I am sure you will find plenty of nice examples of how to use CSS3 and HTML5 in your designs.

      0
      • 105

        Hello Vitaly, and thank you for the links. Will look through, although I think I have already read most of them – I am a faithful follower and a big fan of Smashingmag.

        I also understand the point of this article, but I think it somehow took a wrong tone, used faulty argumentation and this way missed the point.

        I DO agree, that web designers’d better start using html5+css3 starting today – where appropriate for clients, or in any way they want on their own projects, for training . I just don’t think they can be persuaded into it by arguments, that are not applicable to real life. Take, e.g. the one that got most opposition: reasoning with a client. Telling the guy he should get used with idea his site looks different in different browsers and doesn’t look in any way in ie6, but it is innovative and, oh, more expensive too….it’s just a wrong approach to the whole thing:).

        This is, of course, just my humble opinion.

        0
        • 106

          Dear Irina,

          I understand what you are saying, and I agree with you, but do we really need to convince clients of technical details such as integrated CSS3 media queries or HTML5? We can just use these new tools and technologies to create cleaner code more quickly, aguing with our clients about the advantages of responsive design. It might not work, but it might work just as well.

          At some point clients just have to understand that it’s impossible to offer users the same experience in legacy browsers and in new browsers; legacy browsers will always be out there, but it can not be the reason for us, designers, to design primarily for legacy browsers.

          Thank you for your opinion!

          0
          • 107

            “At some point clients just have to understand that it’s impossible to offer users the same experience in legacy browsers and in new browsers; legacy browsers will always be out there, but it can not be the reason for us, designers, to design primarily for legacy browsers.”

            I totally agree with you here! All the discussion comes down to how to do it better:). E.g. we can actually offer them a cheaper HTML5/CSS3 solution that will work in modern browsers, and lay out the options:
            - no support for some this feature in legacy browsers = less money spent on development
            - yes support in legacy browsers = a bit more money spent on dev.
            Just the matter of phrasing:)

            0
  25. 108

    A nice article, but I do come from a background of making it validate first… or actually stop when it validates. I would support people learning HTML5/CSS3 to keep up on their skills but probably not use it in paid work unless something the client needs can only be done in HTML5/CSS3 and they know the risks associated.

    And I certainly hope there aren’t many designers out there who convince their client of something because they “want to try something”.

    Your focus should be graceful degradation, or perhaps progressive enhancement. You choose. I like the links you provided though. I know a lot of designers who code by hand (they were mostly computer-types first and foremost) but the lack of tools is probably leading factor to design the newest standards.

    0
  26. 109

    Working in the agency world with a large marketing company, I think a carefully considered approach is the right think to do. The vast majority of my clients probably use IE6-8. Their analytics also show the majority of their users do too. So you’re left with trying to squeeze in a drop shadow here and a rounded corner there and a HTML5 video option as well. As most front-end developers probably find by the time the project has gone through scoping, IA, design and to you to build it, the time you have to build is squeezed and deadlines are very tight. So beyond the obvious things which you can get away with, it’s very hard to justify coding with HTML5 structure when you are going to have to use a JavaScript library which will slow down the experience for 90% of users, or program an animation in HTML5 canvas, CSS3 transitions when you can do it in Flash for all users.

    I’m not saying it wouldn’t be great to do that and to work with some amazing technologies, but it’s a tough sell, not just to your clients but often to your manager and their manager and the account handlers, and many more people who have a say before you can push a project live.

    The first way in which we can change things is, as Andy Clarke has mentioned, build HTML prototypes to show to the client rather than PSD fixed designs. However, even the time to do this is often pushed in many agencies. Everyone on the company needs to be on board. It’s a communication issue and one that is not easy.

    For those who have their own company or who are in very small organisations it may be a lot easier though.

    0
  27. 110

    I started using HTML5 and CSS3 a while ago. I use fallbacks for important features. I overcame the fact that my designs look slightly different in various browsers. I don’t think that my users would ever care if they see rounded corners or not.

    I also use browser sniffing to inform IE6 & IE7 users that they should consider updating or switching to a more capable browser. I think this is a good way of educating the users that don’t even know that their browser is obsolete.

    By the way, grooveshark is now using HTML5 :)

    0
  28. 111

    I think their are two sides to the argument that’s currently ensuing in the comments. That is, if you develop for a major client who must have their application running in IE6 or everything crashes and burns, then fine. Build it in a way that works.

    However, if you have a client that doesn’t know much about this sort of stuff and doesn’t make that kind of requirement then it’s in your interest to push these new techniologies. They can do a lot of great stuff, and with the greatest of ease to us, the developers. You’re basically making your life easier (and more fun!) by pushing this out.

    I cetainly agree with the main point of the article, that it doesn’t matter that it’s not fully supported. If we can get the word out there that there are requirements to getting a more rich, and user-friendly website environment it will eventually help to speeding up this perfect web that we all aspire to be part of!

    0
  29. 112

    Part of the problem here is that not all of us are pure front-end developers with the time and resources to learn and apply more levels of code to our projects to make use of half baked standards that also degrade nicely in older browsers. We are already responsible for the entire project cycle, database design, OO programming, CMS, APIs, front end development, design, production and yet we are expected to keep up with all the latest web technologies, with no obvious allocated time to do that in. Just like with progressive enhancement considerations with JS/non JS support, this is yet another level.

    So when we put the W3C logos on our website, do we also put some alternative text along the lines of “Yeah, we know it doesn’t validate, so really we don’t comply with the standards set by the W3C, and actually that makes putting their logo here pointless. But we know better than them. Honest, guv.”

    0
  30. 113

    I’m actually going to be giving a presentation on HTML5 and CSS3 use in NYS websites next month and will use many of the ideas and stances in this article to drive the point home.

    and remember, just because your client uses IE6, doesnt mean that everyone on the internet that uses that site uses IE6. as long as its usable for them thats the part that matters.

    0
  31. 114

    Using now HTML5 is a bad idea.

    The raisons :
    - This langage still in project, in draft, and he’s not very stable to sell web site with. You can design now a site with HTML5, in one or two years your site can become buged because some HTML5 tag or attributes can change or delete in the futur.

    - The HTML5 specification director himself say that we must not use now HTML5 for commercial web site, because is too early and for stability problems.

    I want add for IE6 :
    We can’t miss it in web developement, because is still used by lot of peoples in some country. For exemple, in Africa IE6 is used by 21% of the peoples (ref. statcounter stats).

    (PS : sorry for my bad english)

    0
  32. 115

    I want add for IE6 :

    We can’t miss now this user agent, because in some country he’s used by 50% of people.

    0
  33. 116

    The simple fact that your can show bleeding edge technology in your portfolio will work to attract the right kind of customers, so if you know how to position yourself, you have a lot to win by early adopting HTML5+CSS3. Particularly if you do a good job in applying graceful degradation techniques.

    While I understand that large software houses may have trouble adapting to technology changes, freelancers and smaller teams like ours have little excuse. Not adapting NOW and sticking your head in the sand will just result in being outdated once these technologies go mainstream.

    Obviously, this isn’t stuff you want to throw at customers using IE6 as their primary browser. But then you’re probably worried with things other than design and creativity to start with.

    So here’s a suggestion: choose the right customers.

    If your customers find it relevant to project an image of innovation and being on the bleeding edge, you’ll find they are much more receptive to using new technology.

    0
  34. 117

    No, I don’t agree with this article. I remember the time when a lot of websites where “best viewed with IE5″ (or so …) and when lot of people tried new fancy features because they existed (either in IE or Netscape). I dont want this bad old time back with “best viewed with a html5/css3 pre-standard compatible browser”.

    If you design a website you should always make sure that the targeted user (i.e. the customers of your customer) can use the website and you should use the technique that helps in reaching this goal.

    0
  35. 118

    I agree with this. We should keep up with the technology just as we buy a new smart phone every month… what are we on now iPhone 5? Now for arguments sake on the side of clientele. Well if you have a client using IE6 that’s his/her problem. Nothing should stop you from designing/developing the most efficient way that you can for your client. So charge what you charge regardless of what code you use. And as for Companies that have thousands of employees like the one I work for… well Firefox is FREE! and my company makes sure we have at least two browser’s on our system at all times just in case our website doesn’t show correctly. If you have a client with several employee’s 245 or more it shouldn’t be a problem for him/her to update every single employee and if not your client is just being cheap. I would seriously reconsider even keeping that person as a client. If you have a cheap client who fails to realize how to maximize their profit….then you should know, at that point, he or she is not paying you what you are worth. There are plenty of other clients out there THAT WILL PAY TOP DOLLAR FOR DEVELOPMENT. You guys are at the highest echelon of design… so stop sulking and get to work. Use the tools provided… whether it be a jackhammer 2005 or the brand new Jackhammer 2011 with Turbo bla bla whatever gets the job done for the people that you work for.

    0
  36. 119

    Well, I know this article was trying to be inspirational to tell us to force the web to mature (and those using it), but I think as it stands now, usability must prevail.

    I’ve yet to find a good HTML5/CSS3 resource, personally; but when I work on client projects, I tell them that the project is for IE8+, FF3+, etc. I like the idea of “you don’t have to use my browser of choice, but use the latest version of your browser”.

    Still, with Microsoft headed to make IE9 still contain proprietary technology, we simply must choose not to use it. To use standardized DOM references, not IE’s proprietary method. To use Javascript/jQuery and not JScript. To refuse ActiveX completely. It offers nothing but a segregating experience on the web.

    I would love to snap my fingers and watch the web become HTML5/CSS3 compliant, but thanks to many short-sighted decisions made in the past, we’ll be suffering these tribulations for quite some time to come.

    0
  37. 120
    • 121

      That’s correct, they don’t.

      The need to look exactly the same AND function exactly the same!

      0
  38. 122

    Uggh ,

    Been a web developer now for 15 years and can categorically state that most designers don’t have a clue when it comes to cross browser compatability. The web should be supportive of any browser that has at least 2-5% share of a clients site…period. If you don’t do it you are doing a disservice to your client, the customer, the developers and the support team that has to spend time, energy and money hunting down why a customer can’t see the price of product or why the screen looks funny and unprofessional. Why? because you want to use drop shadows in your css???!

    There are a number of web browser stat counters out there and I think designers should utilize these before any project. The client should be asked this question…

    What is the % of customers you are willing to have visit your website and have a bad experience? My own business, 2 in a hundred is too high.

    And finally keep in mind that corporate culture is slow to change. Upgrading browsers for hundreds or even thousands of users requires time, resources, committee approval and money and is sandwiched between other usually more important priorities.

    The key here is that old browsers take some time to die but they do eventually die. Patience my friends-patience.

    0
    • 123

      The level a website operates at where it ensures 100/100 users can see the site in the same way and it operates the same way will either be (a) basic and uninspiring (closer to a text document) or (b) costs immeasurably more to projects that are more restrictive.

      Personally, I’m fine with losing business because they are using antiquated software. Reminds me of my Illustrator teacher who was angry at the world for making software her 14 year old Mac couldn’t handle and for designing websites over 800×600.

      Being stuck in the past is no place to be on a progressive web.

      0
    • 124

      Rizqi Djamaluddin

      December 12, 2010 8:26 am

      Adding drop shadows is very unlikely to break a design.

      The key is using HTML/CSS that doesn’t break on browsers that don’t support them, and provide suitable alternatives for features that do. These are two separate processes.

      The first is simple and quick, and applies to most of HTML5 / CSS3, such as gradients, box/text shadows, media queries, pseudoclasses, and the new HTML elements. Older browsers would get a minor quality reduction, but honestly, I’d rather let IE see solid colors and everyone else see gradients, rather than having to maintain a PSD file and export on every tweak. People won’t have a “bad experience” just because of missing text-shadows, unless the design overused them (which can still be mitigated by progressive enhancement).

      The second, inversely, will add to your workflow because you’re actively countering old browsers. It’s entirely up to you, though; these are usually experimental stuff anyway, like the new box model. You absolutely don’t need to use these if you don’t want the extra workload. I don’t, myself.

      Sure, corporate culture is slow — but technology, especially on the internet, is one of the fastest moving things ever. Concepts grow old in years, trends emerge and die in mere months. Adapting new technologies has to happen swiftly or it just won’t happen. If one is to wait for IE 6 market share to drop, by the time that happens the other browsers will be way ahead, and new stuff will be around.

      0
  39. 125

    I explain in my contracts that I don’t work trying that my design looks the same in old and obsolete browsers like IE6. If the client wants this feature, I’ll charge it. And my clients understand it. And I understand that a big company may need an intranet compatible with things like IE6.

    Microsoft doesn’t want that people realize their products don’t work fine. And we are explaining our clients that IE6 doesn’t work fine, so, it’s more expensive for them. Also, we are recommending other browsers to people, encouraging them to enjoy the web 100%. Easy: Microsoft tries to develop standard complient browsers. (Well, I’m never sure…).

    0
  40. 126

    I just saw some comments about revenue loss related to not supporting IE6….

    Do you really think that IE6 users are a major source of revenue? It’s almost a 10 year old browser, if the user or the organization is not willing to upgrade browsers, as part of a security concern, I don’t think I should really care about them.

    My IE6 traffic is 1.36%, I am not going to sacrifice technology for it. Plus, I’m assuming that today, an IE6 user will accept the fact that the web is screwed up for them.

    Actually you could make a case about mobile platforms, it is increasing every day, and I would bet that most of you didn’t optimize your sites for mobile traffic. My share of mobile is 9%.

    0
  41. 127

    I am an up and coming designer looking to branch out of Illustrator and Photoshop and learn some coding and flash. Relating to this topic how many of you would recommended learning CSS3 and HTML5 right off the bat vs. learning the old system first and then trying to learn the new ones? Any suggestions?

    -http://nickhammonddesign.blogspot.com

    0
    • 128

      Tough question, but I’d say, learn XHTML and CSS2 as a ground, then progress your studies into HTML5 and CSS3. Just my opinion.

      0
  42. 129

    At my company, I am pushing removal of IE6 compatibility from our contracts.

    Laziness? Maybe.
    Frustration? Yes.
    Loss of revenue? Hardly.

    0
    • 130

      That’s what we’ve done at our company. We support IE7+ and you pay extra if you want the site in IE6.

      0
  43. 131

    why everyone talking about IE6? HTML5 and CSS3 not supported with IE7 and IE8!!
    %60 of web users use IE? I think we already can do magic with HTML4 and CSS2

    0
  44. 132

    while people use old browsers like IE6-7 developers can´t move forward… this is the sad reality :-(

    0
    • 133

      What world to you live in? If we don’t move it forward then it never well….this is the true reality?

      I don’t mean to offend by this in anyway, but if that is your thinking then why do you even read Smashing Magazine?

      0
      • 134

        PUHLEEZE! you are not stuck if you are not using the absolute latest, especially if it is still changing, I bet you don’t have the latest computer chip in your (insert device name here), I bet you aren’t driving a Chevy volt, or a Tesla! you aren’t even using color in your avatar! color photo technology has been around for a long time, dude, is your tv an internet 3d tv? you are missing out! you better get out there and get the latest of everything, don’t panic there are some good sales going on now.

        0
      • 135

        Shaun wrote: ”What world to you live in? If we don’t move it forward then it never well….this is the true reality?”
        Bryon: What world do you live in Shaun? IE 6, 7 , 8 DO NOT SUPPORT HTML5!!!!! PERIOD!!!

        If you want to use JavaScript hacks to make HTML5 work with IE 6, 7, 8….then go at it!
        What about the percentages of users with JavaScript turned off?
        You and I aren’t going to move this technology forward…lets drop the ego.
        Technology (HTML5) is moving forward by much bigger players…and some day it will be here.
        Each browser version release will get us much closer.

        This article miss leads….by stating “HTML5 is ready to use today”
        When the article title should state, “HTML5 is ready to use with a JavaScript HACK”

        0
  45. 137

    Im a big fan of websites which function and work well because the designer has carefully planed the site design, for the last few years website usability has become the forefront of design trends, now it seems to be going backwards rather than forwards. I will use html5 / css3 in the future however at this point id rather not since the supporting browsers are still in beta.

    Why would I want to use a html5 video player when more people have flash installed than a browser that supports html5. Its important to remember that we are website enthusiasts, what we find important to the future of the web other people wouldn’t care about, they just want a nicely designed website, which works for them and is accessible and cross-browser compatible.

    There’s 100′s of amazing website designs that haven’t touched html5 & CSS3.

    Just another opinion.

    0
    • 138

      Rizqi Djamaluddin

      December 12, 2010 9:00 am

      I will use html5 / css3 in the future however at this point id rather not since the supporting browsers are still in beta.

      Which browsers are you talking about? There is high HTML5/CSS3 support already available: http://caniuse.com/#eras=now,near,far&cats=HTML5

      Predictably, IE falls short, but every other major browser has support in one way or another (and suitable fallbacks are available in each as well).

      Why would I want to use a html5 video player when more people have flash installed than a browser that supports html5.

      I have just one reason, and one justification; the reason being support for non-flash supporting devices, namely iOS and the iPhone/iPad. The justification is that your statement is flawed; it doesn’t matter that more people have flash installed than HTML 5 support, because with HTML 5 you can still fallback to Flash. Double the work? Maybe. Future-proof? Yes. But then again, you can charge more for being on the edge, so it can still be worth the extra work. Clients will probably appreciate their videos being visible on a line of well-known (and fairly high-profile) mobile devices.

      There’s 100′s of amazing website designs that haven’t touched html5 & CSS3.

      And 100′s of amazing ones that do. This really proves nothing. =)

      0
  46. 139

    Will HTML5 and CSS3 do anything to change the fact that 99% of online content seems to add no value to my life?

    0
  47. 140

    Designers and even more regular people start treat html5 and css3 like web 2.0 . Like a miracle. And it is just a slogan (like web 2.0). And writers can’t live without slogans. New article hmm lets make it about html5 what else right? There is only gazylion articles about it, sth that even don’t have specification done yet. Articles where ppl explain html5 not even knowing how html5 will look in the end(or mostly just babling about it).

    Second when i wanna see some cool stuff made with help of html5 everybody are talking about… All I see so far is a bit more semantic code and bunch of goofy animation that are in no use for clients. Unless they have site with online games.

    I don’t want offend anybody i just state facts. So to all designers that are over excited by html5 better take it easy. You ppl don’t really need do everything Jobs do. So watch out to not look like xhtml 2 fans. They were also sure of their cause after all .

    0
  48. 141

    HTML 5, yes. With the IE shiv code for HTML5, you can use it right now and it works fine.

    CSS 3, no. Parts of it simply don’t work in enough browsers to make it useful, and often there is no good workaround. For CSS, use what works. For HTML 5, it’s possible to make it work.

    0
  49. 142

    I suggest you to just update your knowledge on CSS3. Start implementing it once the IE9 full version releases!! Thn you can just say ur client tht the site is compatible with all the ‘Latest Browsers’.

    0
    • 143

      Why wait till IE9, are browsers like Chrome, Safari, Firefox and Opera not the ‘Latest Browsers’?

      0
      • 144

        I want my 3d hologram

        December 12, 2010 8:40 am

        These html5 sites freeze up Firefox, Opera can’t show 30% of anything, chrome doesn’t display many of the “html5 is so cool” sites either.

        0
      • 145

        Current versions of Firefox, Safari and Chrome already supports CSS3 (almost all the selectors) except the IE. Here is the link to check the CSS3 selectors compatibility. Most of the selectors are shown in red if I open in IE8.
        http://tools.css3.info/selectors-test/test.html

        Microsoft already announced that IE9 is fully compatible with CSS3.
        Do you even bother about Opera???????

        0
  50. 146

    Vangelis Makridakis

    December 10, 2010 2:32 pm

    There is always a way to “force” each site’s users to move on and get an earlier version of their browser. Here is an example me and my team done 2 years+ ago for those who still insist on IE6:
    http://www.mapme-in.com/compatibility.php
    (a simple script that detects browser and version and redirects the user in that page)
    (The site is in Greek only, sorry.)

    This was our way as a company to tell to our viewers to get Firefox, Safari or IE7 back then… today we should add Chrome and Opera (I know), but it’s simple and direct.

    90% of the cases I’ve experienced with clients who still use IE6 or other crappy software is: “they are not searching for new solutions, simply cause they don’t know they exist!”. Sometimes they just don’t care. Other times they think that whatever they have installed is a standard on all of their client’s computers too… silly things you know.

    Anyway, we as designers and developers, would be good to inform only ONCE about the benefits of using new software and browsers, that way we can explain them that “using HTML5 and CSS3, is good for their company/business/website.

    Thanks for reading, greetings to all from Greece,
    Vangelis.

    0
  51. 147

    I can’t believe how many people keep saying “I can’t use HTML5 because my client have IE6″. That’s ridiculous : It’s our DUTY to force people to abandon IE6 : it was released on August 27, 2001, we are in 2011. Yes, 10 year. Even Google and MS doesn’t support it anymore.
    10 year, buddies. My car is younger.
    And my Country force me to change it before getting too old, dangerous and polluting.
    Who has to force people to change their browser when it’s just too old?
    Designers and developers. Me and you, whose are reading this article.
    If EVERYBODY just stop caring about it, people will have to upgrade, that’s it.
    I don’t mean that every single new technology has to be absolutely followed, but for God sake, IE6: you are kidding, aren’t you? Come on, be serious.

    0
    • 148

      I think I love you Bruno!

      0
    • 150

      Bruno– show me a resource on the web that states HTML5 is supported by IE 6,7, or 8 browsers.

      Come on… I double dare you! LOL!!!!!

      IE6 is not topic- when its user base is as little 6% of the market share and dying each day.

      0
      • 151

        I don’t know if your aware but IE6, IE7 and IE8 (soon to be) out of date browsers! They will never support HTML5!

        0
    • 152

      As a web designer for many companies throughout the UK, it is NOT my duty to force them to abandon IE6/7. It’s my duty to provide a valued service that in turn generates the client more income.

      0
      • 153

        I agree with Abbas, it is not our duty to force people to abandon a browser and upgrade. But this doesn’t mean that we cant push the boundaries of what is possible and use HTML5 and CSS3 now.

        Its better to use HTML5 and CSS3 and deliver a website that is appreciate for whichever browser the user is using, than spending time trying to educate clients when it most cases which browser they use is out of there control.

        0
  52. 154

    There is no point argueing of using or not using HTML5/CSS3…
    Everybody are right…
    When Facebook stop’s supporting older browsers, all our problems will be solved, and many will switch from IE6 to new-tech browsers…
    And that will be soon…

    0
  53. 155

    like ie7 and ie8? right they support html5(not mention about css3) unles u live in some 4rd world country u don’t need support ie6 for about a year(as it dropped below 5%). So why u ppl discuss ie6 over and over?

    And what browser fully support html5 and css3? Chrome that made half stuff by itself? Safari? Sure they both hold about 8% market in my country. I switch to html5 and css3 asap coz as a designer it is my duty to support new technologies :P. O wait i forgot i don’t get paid for that support. So for now I will stick to xhtml and css 2.1 that browsers that hold 99% of the market have no problem with. U know just in case clients won’t understand that whole duty thing.

    0
  54. 156

    It will take a long time here, in Italy, when clients decide to update their browser. Here, unfortunatly, IE6 has still got a 6-8% so, refusing to consider its, means a big loss in money terms. I agree with people who said that should be Google, Apple etc to start the “deprecated” browser war. We could try to do anything but there always be someone who will take the clients we don’t wont “cause the are obsolete. And our work will be in vain. There will never be a 100%. Never.

    0
  55. 157

    The incompatibility of HTML5 and CSS3 in IE6, is undoubtedly one of the drawbacks for designers and web developers who want their work is seen by the user as they developed it.

    But why Internet users are still using IE6 after all the comments and reports that have come out saying they have x vulnerabilities or that has no support for correcting errors that occur.

    You who believe: ¿Because why internet users are still using IE6? ¿They find it very difficult to update or change your browser?

    0
  56. 158

    I understand why we should embrace it, but call me the designer who is hesitant to move forward. Clients paying top dollar for a website don’t care how the back end code looks, they want it to look ‘pretty’ on the outside. They want to see what they approved on a mockup, online. ‘Where are my rounded corners? Why doesn’t that have a drop shadow? Why doesn’t it look like the mockup?’

    Hacking away at long codes of CSS, javascript and hacks just to make a rounded corner with no images is a waste of time. Create the image, implement it in a correct manner and you have less problems or rendering issues.

    I hate it when people want to show me a ‘cool’ feature but when I open my browser, it doesn’t work. What is the response? Oh, use Safari or Webkit. Is that the point of the website? No, don’t limit people.

    Also, we’ve stopped supporting IE6 and I find IE7 the new IE6 for me. As long as I have to support IE7, I see no point in wasting time.

    0
  57. 159

    GO HTML5! You’re doing it!!!

    0
  58. 160

    i would love to, but sadly i die a little every time one of my clients demands IE6/IE7 compatibility :( they refuse to die!!

    0
  59. 162

    Sincerely, I´m getting sick of all this HTML5 hype, beacuse let´s face it, right now it is nothing more than a lot of promises and fancy demos that CAN NOT be applied in real world unless you apply hacks for that browser, fixes for that other one, and sometimes even prays to god to make a goddamn site run properly no matter the browser you´re using. And it seems that will remain the same for a long long time. That´s usability? for who?. Sentences like : “Looking a little slow? Download Chrome!” are really better than “This site requires Flash Player to run”?. Come on…

    Articles like this one are just encouraging people to make the web even a more messy place. Can´t imagine how things will turn out when the different codes for video and all those based browser features will start taking place seriously in the market. That´s evolution for the web?. It sounds like we´re coming back to the 90´s to me…

    Thanks but no thanks.

    0
  60. 168

    Think smashing magazine doesn’t really understand what’s difference between html and css or html4/xhtml and html5. This article is mess and a really bad advice for beginner.

    Don’t use HTML5 because you can’t actually do nothing more with it except getting trouble.

    Vendor-specific prefixes are valid, read the w3c specification.

    0
    • 169

      David: Think smashing magazine doesn’t really understand what’s difference between html and css or html4/xhtml and html5. This article is mess and a really bad advice for beginner.

      Don’t use HTML5 because you can’t actually do nothing more with it except getting trouble.

      Vendor-specific prefixes are valid, read the w3c specification.

      TOTALLY AGREE WITH YOU DAVID!!!!!!!!!!!!!

      0
      • 170

        Wow Bryon. You keep posting your comments everywhere, thinking that you’re so smart, when everyone out here perceives you as a tool. Now go out there and educate yourself before you open your mouth again, sir “smashing magazine doesn’t know the difference between xhtml and html5.”

        0
  61. 171

    Now this is as hard for me to admit as for the one who´s coming out of the closet and many of you would never believe this, but…

    I´ve been designing webpages since 1998 and I´ve always used Frontpage 98 to slice the look and NEVER used any CSS and I use ASP 2.0

    (example of my web design: http://langveikungmenni.is/ )

    For an old dog like me (33 years old) and being a creature of habits I´ve stick to Frontpage for last 12 years, but now I really have to upgrade my technology.

    I´m designing my first web 2.0 look now and I´ve gathered many HTML5 resources and CSS3 and my New Year´s resolution is to move from ASP to PHP/mySQL

    This is my story :)

    0
  62. 173

    With a bit of modification to the html5 code you can implement an upwardly compatible web standard site now . Later by tweeking a few things it can become “totally” html5. Why wouldn’t you want a system where a little tweeking can give you a 2-fer site. One for computers and others for mobile devices.

    CSS3 is ready now with hacks for IE browsers before IE9 comes out.

    The web is finally ready to provide the excitement surfers enjoy!

    0
    • 174

      Totally agree with you apart from the bit about hacks.

      I don’t think we should be hacking to make CSS3 work in older versions of IE! If a users browser doesn’t support it they don’t get and seen as no-one apart from us look at a site in several browsers they don’t know there missing anything!

      0
  63. 175

    I though that HTML5 was just a draft? Am I missing something here… sometimes I read that you should design with standards in mind but here I am reading that we should design with what is available even if it is not a finalized standard.

    0
    • 176

      If your waiting for it to be a standard your going to be waiting a very long time. The W3C considers something a standard when it is 100% completely implemented by two separate browsers.

      So using this ruling then technically the CSS2.1 you have been using for years and everyone considers the standard isn’t fully implemented in two separate browsers. You should probably stop using it, because it isn’t a standard and god forbid you ever use anything that isn’t a standard. I’ve heard you go to hell for things like that!

      0
  64. 177

    are all you nay Sayers still developing for Netscape too? Developing for outdated technology prevents progress

    0
  65. 179

    I think perhaps the message that didn’t come across in this article is the idea of “progressive enhancement”. The idea of using jQuery and CSS3 to give a richer experience for those users (and clients and companies) who see the value in adopting the latest technologies / browsers. Tier down would be the current, standard methodology. And lastly, we should do our best to provide some sort of fallback for those who are sitting on antiquated systems and browsers (like IE6).

    The problem though – and I put my team and myself in this pool – is that client education is a hassle. To explain the concept of progressive enhancement and graceful degradation to a paying client (and they usually don’t pay us what we’re worth) is next to impossible. Most users don’t know that other browsers exist, let alone know that they display web pages differently…

    As much we all would like to believe the web has been around for a long time now, against printed media (the client benchmark), the web is barely a blink. In print media, an ad printed in a magazine looks 100% the same across all the magazines – no variations, no exceptions. A client sees no reason why web pages can’t look the same “on the internet.”

    Beyond this notion, try explaining to clients that they would need to pay you for the countless, sleepless hours it’s going to take to, not only add this progressive enhancement, but to get their website to display nicely across all browsers…

    CSS3 and jQuery, I feel – for the mean time anyway – will be something that we as web designers and developers adopt ourselves for the love and cheap thrill of making something that satisfies our own needs. No lecherous, stingy, everyday client is ever going to see value in this…

    Do what one can, not what one must. Push where you can. Don’t if it’s not worth the money… Pragmatic, business decisions.

    0
  66. 180

    Really, I’m astonished by the negativity of many commenters here. I’ve worked in big, corporate environments and in the public sector, and yes, I understand the need to support older browsers. But you know what? It’s not difficult. You *can* use parts of HTML5 and CSS3 and still have perfectly good sites in IE6-8. Okay, they may miss the odd little extra, but so what? Sites *can* be different in different browsers. In fact, they should be. If we want them to be identical, then we’d better all put up giant jpegs instead of web pages.

    And, of course, HTML5 tags can be made to work on IE browsers by using a shiv. For a few k of overhead, you ensure compatibility. Try it.

    And, yes, users who have an old IE *and* no javascript will lose out. But then again, anyone using Lynx isn’t seeing your HTML4/CSS2.1 sites the way you expect either. Bad luck.

    A couple of years ago, I would have been negative too, but with the explosion of device types, sizes and capabilities, we’re in a new world, and the sooner we adapt and accept that sites will vary from device to device and browser to browser, the better.

    0
  67. 182

    I’m going to be 100% honest. I disagree. I think every developer should have been learning both from the moment learning material ever existed. Practice with them, too. Learn them through and through. But I don’t think we should deploy either yet. Not fully, and not to an extent that we rely on them at all. In many cases, especially with pretty CSS3, making it so it degrades for people who can’t see it can sometimes stretch as far as having to use elaborate DHTML(javascript+html+css). That’s overboard. And, yeah, there’s also the fact that a lot of people in a lot of browsers just can’t see it. Heck, even the W3C was saying back in October to use it but not build important sites with it yet. If you wanna use it, fine. Just make sure any CSS3 you use degrades and make sure you only use HTML5 that’ll work for everyone.

    0
  68. 183

    The most easy way I found to convince customers to abandon ie6 (or not) is to let them choose between:
    * An office working (how many, anyway, people is shopping on-line at work, when their traffic is probably monitored), less IT literate users
    * A better support for mobile devices (smart phones, iPads), more IT literate (and usually more willing to spend money on-line) customers
    * Pay for support both

    Ant in most cases they choose 2nd. Most importantly its their personal decision, not a result of pressure from developer.

    Everyone gets happy :)

    0
  69. 184

    I don’t understand the point of learning and working with ANY language heavily when it’s still in beta. I have a lot more to do than learn a language that is still evolving and, as W3C says: “Implementors should be aware that this specification is not stable. Implementors who are not taking part in the discussions are likely to find the specification changing out from under them in incompatible ways.”

    And as far as cross-browser support goes, hey it’s great if my clients’ target demographic is the kind that always upgrades their browsers. But that’s not the case for the average site owner. So if I want my client’s to not be losing money on sites not working, or to be paying me extra money to find a way to make it work across browsers, then there’s not a lot of point to doing this.

    HTML5 is severely over-hyped and a bandwagon too many people are ready to jump on because its the next big thing. I’m not going to implement something on any site that is going to change tomorrow and cause me to have to go back and recode the site. I’m not going to make sites that my clients lose sales on because they don’t work across platforms. It’s just not happening and is ridiculous to contemplate. I think this “we have the power to make this happen” comes from the assumption that a lot of us don’t have clients with the bottom line of “make money”. The idea of forcing the world to upgrade, as web designers, isn’t really practical or realistic. And this isn’t the first time in the past 10+ years the “we can make the world upgrade so we can do what we want and have our jobs easier” has been tossed around either. There is always someone who think the power lies with the web designers there, but it doesn’t. It hasn’t worked before and I don’t see why that would suddenly change now.

    0
  70. 185

    My 9to5 is corporate/ political environment in which the dreaded IE6 still is used (internally) as a default browser in many of our offices (for some ungodly known reason), and while that’s changing, it has been a personal goal of mine as the UI/UX/CSS guy in the office to:

    - write code that is cross-browser with little to no hacks
    - write CSS the validates while realizing that some things that validators catch as errors aren’t applicable
    - attempt to progressively enhance the user experience, and in many cases lower my page weight, via the addition of CSS3.

    I also acknowledge that our true users, our actual demographic, are those who are considered our real world users… those who tend to use modern browsers. So, for me at least, there’s no real reason not to attempt to be progressive and willing to develop code that’s “future ready”.

    With that said, as I read some of the comments from fellow developers, I was somewhat dismayed when comments like “clients don’t care how the backend looks, the want their rounded corners, etc…” What happened to our secondary job as developers, which I believe is, to educate our clients that know no better. From my experience, those who tend to be crying out for IE6/ IE7 support have yet to dig into their own site/ demographic statistics – their cry tends to be one which is personal, not coming from a place of sense and logic. I figure that one would be able to at least make the argument that this type of “progressive” development will save them money in the long run, be it redevelopment costs or simple things like bandwidth costs etc.

    Perhaps I’m the crazy one here, but I fully believe that we, collectively, have the ability to influence the standards, the implementation of them, and the support of them via browser manufactures. While I’ll admit that HTML5 is seriously “over-hyped”, it is with good reason. And I, for one, cannot want for it’s full integration and acceptance.

    0
  71. 186

    On a positive note, many are pushing forward: http://html5advent.com

    0
  72. 187

    I guess if every user had the Chrome browser…life would be great for HTML5. Sad to say about 60% of the users have IE browser. Good luck designing sites in HTML5 for the those users.

    I’m not designing any sites in HTML5 till everyones on board…period.
    Yes HTML5 is really cool…can’t wait to use it on site but….(and there is always the but)…….
    I would have to be extremely stupid to design HTML5 sites for clients when browsers have not caught up with implementation of HTML5.
    Or you can follow the advice of this article…design a site for client in HTML5 and see what happens.
    I’m I going to use the tag for video or am I going to use Flash. You guess it….I’m going to use what my users have. Flash wins for the moment. Design things to be seen. Designing in HTML5 will not be seen by most users….SORRY!

    0
    • 188

      “Sad to say about 60% of the users have IE browser. Good luck designing sites in HTML5 for the those users.”

      Thanks, I already do, and it works just fine. Admittedly, there are some features of HTML5 that aren’t supported yet, but in terms of the markup and the additional semantics, you can go ahead.

      0
      • 189

        Browser Support
        The latest versions of Safari, Chrome, Firefox, and Opera support some HTML5 features. Internet Explorer 9 will support some HTML5 features.
        Resource: http://www.w3schools.com/html5/html5_intro.asp

        When w3 says IE9 will support some HTML5 features…it means IE6,7,8 not supported.

        Do browsers support HTML/XHTML…yes.
        Do browsers support HTML5….kind of.

        0
        • 190

          But that’s the thing, a sizable majority of users are not using current browsers.

          And if the site you are designing for is older, or just general audience, it’s a guarantee that there are a decent chunk of your target audience that don’t upgrade. Some don’t know how. Some just go into a blind panic when they see the word “download” (I’ve taught new, older users for years…this reaction is common, even when it means patching their browser…that concept is totally alien and scary to them…”what if I download a virus?”…seriously, I’ve gotten that).

          If your target demographic is younger, and/or more technically inclined, then HTML5 would be a great way to go. For the average site, it’s just not.

          0
    • 191

      So basically your pretty much never going to using HTML5 if you are waiting for everyone to be on board?

      0
      • 192

        “So basically your pretty much never going to using HTML5 if you are waiting for everyone to be on board?”

        Yes I will wait for all the browsers to adopt HTML5.

        0
        • 193

          This is never going to happen, as you will always have users on older browsers that the vendors aint going to update and by the time everyone has upgraded HTML5 will be old news and their will be something else for you to be scared of using.

          0
          • 194

            Yes it is going to happen but not today. How can you say HTML5 will be old news when browsers , mainly IE 6, 7, 8 DO NOT SUPPORT IT.
            Instead of giving out your opinion of reality, show me a resource on the web that states any of the IE 6,7,or 8 support HTML5.
            HERE I’ll start…
            Open up your IE browser and go to this link.
            http://www.w3schools.com/html5/tryit.asp?filename=tryhtml5_video_all
            Can you see the video in IE? NOT SUPPORTED IN IE BROWSER!!!

            What does this statement below mean to you?

            “Browser Support: The latest versions of Safari, Chrome, Firefox, and Opera support some HTML5 features. Internet Explorer 9 will support some HTML5 features.”

            Resource: http://www.w3schools.com/html5/html5_intro.asp
            It means IE 6, 7 ,8 does not support HTML5

            One of these days, there will be wide support HTML 5 when different browser version hit the market.

            I would love to start using HTML5 for sites but the reality is…it’s not supported fully across the board.
            I agree we should start experimenting with HTML5 but I disagree with the article for implying we should start using it TODAY for sites.
            Important ingredient missing for HTML5 is browser support! If everyone doesn’t think that’s important…

            0
          • 195

            Alright don’t cry about it! I was just saying I have been developing sites using HTML5 for months now and they all work fine in IE6, IE7, IE8 so I am just failing to understand why you keep saying ITS NOT SUPPORTED!!!!!!!

            0
        • 196

          ………………………………OMG THIS GUY IS USING WINDOWS XP STILL…………………………………….

          0
    • 197

      Not sure if you can still get into it, but i have used sublime video for a client and found that to be pretty nice, HTML5 video with flash fallback, it might be worth while checking it out

      0
    • 198

      That percentage is taken from 2006 statistics ( 60% )
      http://www.w3schools.com/browsers/browsers_stats.asp

      The correct percentage for ie6 used in 2010 is 5%.
      I know this because I have access to google analytics statistics.. taken from websites with 10000 users/day.

      The number of ie6 users will decrease as always, year by year.. IT will fade away like everything ancient.
      Trying to keep up with ie6 for the small amount of people that use grandpas computer is a waste of time. (Most likely, you don’t want them to be your clients in the first place)
      A developer should know about the hot stuff , at least in his personal projects, experiment… learn new things.
      It’s a matter of time when you will notice that clients will require HTML5 & CSS3…
      It’s called evolution.

      0
      • 199

        “That percentage is taken from 2006 statistics ( 60% )
        http://www.w3schools.com/browsers/browsers_stats.asp
        The correct percentage for ie6 used in 2010 is 5%.”

        Actually I was talking about IE browser share of the market which includes IE 8,7,6.
        Resource:https://netaverages.adobe.com/en-us/index.html
        IE 8 = 35%
        IE 7 = 19%
        IE 6 = 6%
        NONE OF THESE BROWSERS SUPPORT HTML5!!!!!!!!!!!!!!!!!!!!!
        BETTER YET — SOMEONE GIVE A LINK STATING ANY OF THESE BROWSERS SUPPORT HTML5- BECAUSE I SEE SOMETHING DIFFERENT

        0
        • 200

          it’s 28.6 % for all internet explorer versions – on w3schools stats in november.
          People will upgrade to ie9, as soon as it will be released.

          Adobe is interested to keep the ghost of iexplore up and running.
          On the netaverages, you can’t find information about those stats.
          From where they get this information ?

          “First get your facts; then you can distort them at your leisure.”
          Mark Twain

          0
        • 201

          IE8 and earlier don’t natively support all aspects of ‘HTML5′ (I put it in inverted commas, because different browsers support different parts of the specification; that’s evolution for you), but they can be made to support the basic tags by using a suitable shiv. Many of us have done that, and the sites work just great. Now, you might think that putting an extra call to a very small javascript library is something you don’t want to do, and that’s fine. But don’t pretend that IE can’t be made to cooperate, because it can.

          As with all new features, you have to make a decision as to when to introduce them and what fallbacks to use. But if you really intend to wait until nobody is using IE8 and earlier, you will wait forever.

          0
      • 202

        Those stats from W3Schools everyone tosses around are useless for determining what all visitors are using.

        Here’s why:

        These are stats for W3Schools and is representative of *their* target demographic, not all the non-designers and devs out there. People who visit W3Schools are more likely to use anything but IE and more likely to upgrade the browser. They’re probably mostly younger, thus with better eyesight, many doing graphic design too, and so more interested in high res settings too.

        Your average user, especially if the target demographic is 40s+ is not represented on that chart.

        Consider your audience and their stats when designing. If it’s available, look at the reports for the site you are working on. If your target audience is not the same as W3Schools, then you probably want to ignore their stats.

        If you read down that very page, you’ll see this statement from W3Schools:

        “W3Schools is a website for people with an interest for web technologies. These people are more interested in using alternative browsers than the average user. The average user tends to use Internet Explorer, since it comes preinstalled with Windows. Most do not seek out other browsers.

        These facts indicate that the browser figures above are not 100% realistic. Other web sites have statistics showing that Internet Explorer is used by at least 80% of the users.

        Anyway, our data, collected from W3Schools’ log-files, over a five year period, clearly shows the long and medium-term trends.”

        0
  73. 203

    Iam all for HTML5, sure its nice to have a cross browser compatible site, iam still going to use HTML5/CSS3 for my projects (Only really using border-radius)

    I find it quite depressing to cater for IE6 or someone with Javascript Off, but we just have to work with whats given to us by the client.

    0
    • 204

      I think I also love Michael Rook! :D I’ve used Sublime also and its very good!

      0
      • 205

        Not sure if sublime is still a closed beta or what, but ive got a spare beta invite if anyone wants it
        That is … if i can find the damn thing..

        0
  74. 206

    This was enlightening; both the article and the comments. Based on what I’m reading:
    1.) Steve Jobs and others overhyped HTML5. Some of you may be ready for it, the “current” browsers clearly are not, and many still use “older” browsers.
    2.) I seem to recall a similar “older” browser problem when the goal was to get everyone off of IE 1-5.5 and onto IE6.
    3.) I expect you can just save this entire article, and it’s comments, and rerun it in 10 years when y’all will be advocating HTML6 and CSS5, and wishing people weren’t still using IE9.

    0
  75. 207

    I’ll look at the following things before I’ll switch to CSS3 and HTML5:

    1. Does it make my code a lot lighter ? (-25% ?)
    2. Is it supported by all the browsers, so I don’t have to rewrite my code or use hacks ?
    3. Does it render faster ?
    4. Does it render correctly on all the browsers using the same code ? (Just because it’s supported doesn’t mean it’ll look the same, we’re talking about different engines here)

    If I get a “no” on any of those 4 questions, I won’t be switching.

    0
    • 208

      You will never switch, then, because number 2 will never be true. On the other hand, not all browsers support HTML 4 and CSS 2.1. Deal with it!

      What you really should be asking is what percentage of *your* users use browsers that don’t support what you are doing, and what acceptable fallbacks there are.

      0
  76. 209

    Elliott the web design guy

    December 12, 2010 4:35 am

    Familiarity is a comfort and change is scary to some people but the fact is that change is a good thing – that’s how progress happens. Although scary for some it is inevitable so it should be adopted and embraced.

    0
  77. 210

    I think people take browser stats far too seriously and I think people are a little overly cautious. If you’re designing a site for a huge chain, say Sears or Target, it makes sense to stick with something that works across all browsers, even IE6. However if you’re building a site for yourself to showcase your skills, then html5 and css3 is fine as most viewers of your site would use more modern browsers. Personal sites or relative projects will allow you the opportunity to experiment and start learning what we hope will be a standard for many years to come. Don’t limit yourself, use the right technology for the right viewers.

    0
  78. 211

    Nicolas Gallagher

    December 12, 2010 5:30 am

    Plenty of developers working at big agencies, working on websites that tens of millions of people visit every year, and working on consumer-facing web apps (that dwarf anything most people will be working on) are using HTML5/CSS3 right now.

    At the very least, there’s no reason not to be using the HTML5 doctype, simplified charset declaration and link/script tags, etc. Obviously, context always influences what approach to take. Using HTML5 now doesn’t mean that you have to use every aspect of HTML5 now.

    Using CSS3 is a part of producing modern, lightweight, flexible, accessible, and forward-looking web sites that serve the interests of both clients and users – now and in the near future. The speed of a site has been repeatedly demonstrated as the most important feature, affecting revenue, time spent on site, and page views. The rise of mobile internet use (and the diversity of hardware) reinforces this need. I couldn’t imagine developing a website without using HTML5 and CSS3 in some form.

    0
  79. 212

    Great post. People aren’t going to upgrade their browsers until they feel the need to. The average person isn’t going to go through the hassle (as they see it) of switching browsers just for ‘the good of the internet’ or for the good driving web technology forward. They will upgrade when they realise that the websites they want to go to don’t work because they are using an out-dated browser. It’s really a quick job to upgrade.

    It’s our job as web designers to push it forward.

    0
  80. 213

    Continuing to develop for IE 6 is for the safe and scared. They will never be convinced. They will tell you over and over why they can’t: payrolls, client base, loyalty, etc…. It doesn’t matter what you say. Let the scared and timid make their IE 6 money and stay behind while the forward-thinking and progressives use HTML5/CSS3. We will eventually force the standard and the timid will be glad we did and then they’ll have to play catch up. We will already be on to something else. Great innovations don’t happen because of ‘reasons why not’ to do something. Great innovations happen because of those who say, ‘let’s try it!”

    I’ve absolutely stopped doing anything for IE 6. Microsoft gambled wrong on the web and people continue to hover and ‘cling’ to them at the losers’ betting table. If you find yourself raged at this comment and are already making more reasons why my point is wrong, then you’ve just proven my point. You’ll never be convinced. I agree to disagree. I’m moving forward and looking for clients who are progressive. Think of it this way, there are those who are Progressive Enhancements and you are the Fallback. Enjoy your IE 6 dev. You can have my IE 6 client!

    0
    • 214

      9 years later, and those people have not upgraded. What will change that now? People have been spouting the “force the rest of the world to upgrade” rhetoric for many years…around a decade or more. And in 2010 we have people using a nine year old browser. Exactly what is different from now and the past decade, that will bring about this wonderful change? If it hasn’t worked yet, what will make it work now? A lot of us don’t want to lose jobs (read: money) by refusing to design for IE6. There are some things, as far as IE6 goes, that I refuse to do anymore (like coddle the lack of support for PNGs). On the other hand, I’m going to make sure IE6 users can still at least navigate the site too. I’m not going to have clients calling saying “hey my big customer at XYZ corporation is mad because they can’t use my site”.

      0
  81. 215

    Hi Vitaly,

    love this post, fully understand your message, .. but, it’s just a thought:

    W3C: Hold off on deploying HTML5 in websites – http://www.infoworld.com/d/developer-world/w3c-hold-html5-in-websites-

    Cheers & Ciao ..

    0
  82. 216

    Believe it or not the reality of CSS3 is already in use. All these tools and new features are being experimented with especially in the mobile market. If you don’t want to use it, you don’t have to. The tool just have to meet the needs and do what makes you feel comfortable.

    0
  83. 217

    I’d love to use CSS3, but I feel like a test subject when I do. Why can’t Firefox (example) already accept border-radius instead of -moz-border-radius? I have to repeat every CSS3 rule at least three times to make a site work on the major browsers. This is the thing that keeps me from using CSS3 actively as I’m an amateur site builder (don’t do it for anyone else, but me) and don’t have to think about IE6 etc.

    0
  84. 218

    It’s funny how it’s always the same arguments over the years: we were already saying the same back with Netscape 4 versus IE5 or 6 where it was ironically reversed with people advising to use drop shadows and gradients (an IE-only feature at the time) versus the old Netscape userbase seen as the source of all evil for web designers.

    Or the same when CSS itself was introduced.

    Or Ajax.

    CSS3 is no different and tomorrow there will be yet another cool new feature that only a few browser will support and that will become mainstream only if there are enough websites that use them.

    0
  85. 219

    I’ve used CSS3 quite a bit on my past two projects. Honestly, it’s turned out to be a great experience!

    @font-face is so easy to properly implement with free tools like FontSquirrel, and as a firm believer in Web Standards and cross-browser compliance, I was thrilled to see support for text-shadow and box-shadow (with multiple shadows, including ‘inset’) supported on so many browsers including on my 4.3″ screened smart phone.

    I think in the end, the mobile compatibility is a major part of what impressed my clients the most.

    0
  86. 220

    Amila J Wijesooriya

    December 12, 2010 4:48 pm

    Yep ill use my personal next project for sure, but not in office, if i do that in office ill have to answer stupid questions and to explain it’ll take valuable time of that i can put on to build another CSS3 and HTML5 websites, when they realized the value of this we’ll be working on CSS 10 and HTML 20 yei

    0
  87. 221

    Stop the presses, here’s an idear for you… instead of wasting time trying to persuade designers to embrace html5/css3 (who lets face it are beholden to the needs and budget of their clients) , blogging pundits AND designers should band together put their energies towards getting some real usable and universal standards (before 2075), then figure out a way to FORCE the browsers (including M$) to comply. We’ve done it many times before, French Revolution, 1776, Ghandi went and made salt in the ocean, etc.

    Pundits, don’t blame it on the designers for not embracing. If you want to use your bully pulpit (mean that in a good way I think), then use it to gather the troops and put pressure on the right places. I for one “DO NOT” want to have to work harder then I need to support the quirks of 5,000 different browsers. I don’t enjoy this. I want to design, not fix a bunch of stupid problems! I am not lazy because MY CLIENTS don’t want to have to pay for it either. So are all of us, the majority, going to keep being sheep and beholden to the self-positioning techniques of one corporation? We can have an effect if we wanted to, but it would take a little organization. If the w3c isn’t handling it and it affects our industry as much as it does, why do we let the status quo continue? If you really want to do something productive, maybe think along those lines.

    0
    • 222

      Rizqi Djamaluddin

      December 12, 2010 6:46 pm

      It’s not a matter of forcing browsers. Microsoft is well aware of the need to embrace current technologies; look at IE 9. That’s not the problem. The problem is getting people to adapt to it — IE is the sore thumb here because there’s no mechanism to ensure that users will upgrade on time. Firefox and Chrome have updaters, Safari automatically gets updated in OS X updates (and Apple pushes these updates rapidly, so using a version of OS X just a few numbers back is already “old”).

      I for one “DO NOT” want to have to work harder then I need to support the quirks of 5,000 different browsers.

      I honestly think this is one of the strongest myths about HTML5/CSS3. You don’t really need to work harder. It’s a matter of knowing what to use, and what doesn’t support it simply falls back.

      For example, see these two options:
      A) Create a CSS 3 gradient for modern browsers, and falls back to a solid color in those that don’t. Maybe 4 lines of code (1 default, -moz-, -o-, and -webkit-).
      B) Open photoshop, create a rectangle, create a gradient, export to a file in the development folder, take the relative file location, and drop it into the CSS. And later, upload it to the server with everything else, also adding a few kb and another HTTP request to loading.

      Which sounds easier? Are those gradients really absolutely necessary everywhere? I still use images for major gradients that make a big part of my designs. But for smaller ones, say, table headers, buttons, or other elements like that, it’s just a waste of effort to make an image gradient.

      As an aside, dear Smashing editorial team: Looks like you’ve got your work for the follow-up article cut out for you in the comments. =)

      0
      • 223

        Thank you for your comment, but you’re repeating an argument that doesn’t hold water. Consider that what if I do not want to live with a solid background in IE? I your B example I’ll have to do an image version plus the css3. That’s extra work isn’t it? And it’s just a tiny example. Try working with a rich site and/or a CMS with files coming from everywhere and make it all look good across platforms. Start to see what I mean? It’s a LOT of extra work.

        Why not reread what I said and think again. As designers and developers we have been sitting idly while these problems have only become worse. Bottom line is no matter how you cut it it’s “highly” inefficient to have different browser companies running different html/js engines without an agreement.

        Is IE9 fully standards compliant? I don’t think so… See http://www.impressivewebs.com/css3-support-ie9/ for CSS3. Plus what year will it be before we can give up on IE8?

        0
        • 224

          Its not really a lot of extra work…I mean if you are intent on using images for gradients, the only extra lines of code, for you, is to deliver the gradient using css3 in browsers that support them. Once you have that block of code once you can tweak it for each place you use an image.

          I ‘get’ that if you use a LOT of images its one extra block of code times a LOT … but (and its a big but) you sound like someone who is proud of your sites/CMS looking great for everyone on every browser.
          By extending that pride to delivering a great site/CMS with a faster load time too – by using less images – your site still looks great but loads faster!

          I just wonder if it’s the learning curve that worries people that it will take such a huge amount of time to do a bit of CSS3? It’s just new, it’s not difficult.

          I suggest giving it a go on one implementation and weigh up the benefits by putting it into practice.
          When we view sites that we know are making CSS3 do the work and not a shed load of images, it feels clean and fast and puts smiles on our faces.
          When we see the same site, if we chose to use images over solid backgrounds – well it’s no different to what it would have been without CSS3 which is fine, but if we use solid backgrounds we think – cool the site will be quicker to load for these guys (especially the ones on IE6 on a shared corporate connection that probably kills them on most days compared to their home internent set-up).
          In short it’s all good, it’s not hard and it makes you feel you are delivering the best for the capabilities of the users browser.
          We could argue all day over whether or not using a javascript file to allow ie to read HTML5 mark up or accept nth-child but I’ll leave that to Bryon and Shaun. (But for the record I am with Shaun)

          0
        • 225

          Exactly. Microsoft has been promising us a standards compliant browser for years. Every release of every new version is total fail.

          Microsoft: “Oh baby, it will be different next time, I promise. I’ll never do that again.”

          Seriously, when do people clue in that M$ doesn’t care and will do whatever they feel like? Empty promises, all the time.

          0
      • 226

        I like plan B !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! ;-)

        0
        • 227

          Okay man, you don’t believe in offering a better experience for those users who have the capabilites to receive one! We get it. Stay safe.

          0
        • 228

          Bryon…hate to brake this down for you…but…you’re a tool.

          0
      • 229

        Strange, my comment was posted then disappeared… Ok, I’ll try once more…

        Rizqi, it’s not a matter that a lot of us don’t understand. I’m not upset or anything, I just find that to be a pretty condescending attitude. Personally, I am rarely happy with option A of your example… having IE display a solid background color. So that leaves B… which is extra work right? And that’s only one tiny example. On a rich website, or a CMS/web app with files coming from everywhere, it’s a HUGE amount of extra work to make the site look good in all browsers (the client doesn’t rarely would accept a bland version of their site in 50% of browers). Plus in the real world, you have to look at the design as a whole, not item by item. So in essence, unless I really don’t care that my IE version is a hack, on top of extra coding time I will have to create 2 separate mocks for IE plus the “good” browsers.

        0
        • 230

          Rizqi Djamaluddin

          December 12, 2010 9:23 pm

          Sorry if I sounded condescending, I was just trying to portray the problem in a direct-to-the-matter fashion, because talking theoretical about this will never end. I really don’t mean to insult anyone.

          True, it’s one tiny example. But it’s still part of CSS 3, so it still applies, doesn’t it? I don’t really think having solid color buttons would be very “bland” — even with gradients, in general they’ll be quite subtle anyway, right? If you’re talking about large areas, such as page backgrounds or headers, then sure, use images (I do too). Again, it’s about deciding where you need appearance to be key, and where it’s not. I’ve seen web applications with more than 10 graphics that could be replicated in CSS 3, for different buttons, table headers, and other minor elements.

          I don’t understand with “a huge effort to look the same in all browsers”, could you please clarify? In CSS 3, all browsers that support it look the same, and those which don’t, also look the same. Just two variations.

          Yep, we have to look at the design as a whole. But again, how does this affect the use of HTML5/CSS3? In this regard, the drawbacks of CSS 3 on old browsers are even less prominent — people won’t care about that “OK” button being solid gray, as long as the app/site still works.

          And err, what hacks?

          Gradient backgrounds:
          background: #eee;
          background: -moz-linear-gradient(top, #fff, #eee);
          /* webkit version here */

          Done. No hacks, no extra coding, just a line of fallback.

          Special input types:

          in an input element, type=”email”. (Can’t use angle brackets here? Or must I escape them?)

          That’s it.

          Please, with all due respect, I’d appreciate an example of a practical HTML5/CSS3 feature that requires a hack and has no easy way to fallback for old browsers. =)

          0
          • 231

            First off all, I wasn’t referring to you so much in particular, more the general attitude that developers “need to be educated” because we don’t get that it’s all such a no brainier. Can all of these people really be that wrong? I’ve seen some pretty thoughtful comments…

            The two of us obviously have different philosophies about our work and/or maybe different design styles. I don’t have a problem with the gradient background example, I think you misunderstood. In that example, I think of having IE show a solid color as a hack. Then the hack ads up when you multiply it many times of all of the occasions throughout the site, plus all the other “fall backs” when you use other ccs3 (not to mention HTML5) features. After all of the fallbacks, depending on your design, you may have two very different sites. I’m not talking about where your css3 usage is a little text embossing here and there like on so many sites now… I’m talking about where major functionality and appearance of the site is created in HTML 5/CSS3.

            Here’s an example I’m working on right now: http://jjfish.jasongallagher.org. Would you really take the time to use css3 gradients to make this site look the same in IE? Don’t you agree that would take substantially more time? (plus its done in Joomla to add to the headache). Again, we are sticking just with the gradient example here. If I go with option A, I have to spend a lot of time making solid colors for IE that are still somehow catchy. Don’t like that, so I go with option B… which is even more time as I create graphics plus code a bunch of extra css which ends up with a primitive version compared to what I can do in Photoshop.

            “Yep, we have to look at the design as a whole. But again, how does this affect the use of HTML5/CSS3?”

            Because if you’re doing more then a button here and there, you have to review and perfect 2 versions… the ie and the standards complient.

            I’m not a purist and have used occasional css3 (in fact I’ve got some rounded css rounded corners going there on the twitter…), but I don’t feel I can move very far with the new stuff any time soon for the reasons I stated.

            The bottom line is anyone who says it doesn’t take extra time to use, either doesn’t care much for how IE looks in the end, or they really aren’t using much html5/css3 to begin with. I would reread what I originally wrote, because I really think that’s where the energy from posts like this should be directed.

            0
          • 232

            I think we got our agreement: use HTML5/CSS3 where it won’t hurt if it fails, and otherwise use good old techniques. That way, we get stuff that looks similar enough in many browsers, while still getting the chance to use HTML5/CSS3, allowing it to grow.

            So I guess that’s the compromise — developers just get to pick what line they’re going to draw for the acceptable fallbacks (e.g. you won’t accept a solid color, I will), and use whatever they feel comfortable with from there.

            I suppose there’s far too much misunderstanding going on in the general discussion between pro- and not-yet-pro- HTML5/CSS3; I think we all agree that it should be used in moderation. People from both sides keep thinking that their opponents are on the opposite side of the spectrum, when I actually think most of us are somewhere hovering around the center.

            Nice discussing with you, that was an interesting conclusion. Both sides probably need to chill out a bit. =)

            0
  88. 233

    HTML 5 is not the only choice though. Ignoring OSS ideals and focusing on practicality, there are plenty of RIA technologies that provide cross-browser, cross-platform and interactive experiences already. JavaFX, Silverlight, Flash.

    I would not switch over to HTML 5 until a proper development tool/environment appears, currently coding in HTML5 and Javascript is such a mess in today’s conventional HTML editors.

    0
    • 234

      What HTML editor are you using? I’m pretty sure most of us using text editors never had any mess working with HTML 5 or Javascript.

      0
  89. 235

    Congrats Smashing team for such an article. I have an hanging around to use HTML5/CSS3 in my new projects but i love to be in the comfort zone of using the old techniques. This article give a real big push so i think i could start the new project in HTML5/CSS3. Also i am confident now because “we’ve learned HTML and CSS 2.1 and we can learn HTML5 and CSS3″ :). Keep your good work and we will work together to make web a better place

    Cheers

    0
  90. 236

    Great article! I am currently starting to use more and more CSS3 stuff in my new designs and also plan to use HTML5 for every new website I make. There is really NO reason to not use HTML5/CSS3 today. When you don`t forget all about the IE-people it’s absolutely save. And besides that you show that you are willing to learn new things and develop yourself. By the way, the best point to start is to get Andy Clarkes new book Hardboiled Webdesign. Great read!

    0
  91. 237

    Here are some ways of getting around the HTML5 issue in IE for the time being: http://bit.ly/e113sW

    I would still be cautious and Silverlight is still my favorite solution for many applications… I suspect as I become more familiar with HTML5, I will utilize the two technologies together or separate as applicable. HTML5 doesn’t replace Silverlight (contrary to popular belief primarily led by headline articles in CTO/CIO magazines suggesting Silverlight is dead and HTML5 is in …or the same for Flash although I see them as having less strengths in comparison to HTML5), but Silverlight will continue to have strengths over HTML5 for certain applications (and just as well, HTML5 will have strengths over Silverlight in certain applications).

    0
  92. 238

    Wonderful article, thanks! I think there is a great need for articles like this. They may repeat themselves a bit, but judging by the incredible number of negative comments here, the more, the better! People need to understand what “draft” means, what IE supports and that HTML5 and CSS3 are to be used *now*!

    0
  93. 239

    I wish I could use CSS3 and HTML5 now, but in the real world of corporate work forget it. It better work and look the same in all browsers known to man or else it’s my fault as a developer. I need to feed the kids more than play with new toys.

    0
  94. 240

    Ah if only people would learn a ton of companies are stuck on IE6 even if they wanted to upgrade to newer technologies / Browsers. Sorry but the slow upgrade path your seeing is the fault of lazy application developers back in the early 90s, you know the ones that hardcoded their application reporting systems to appear in IE6 and they block use of any other browsers or they render so terribly its unacceptable. I have worked with about 20 companies trapped in this boat. My latest has their main call switch that is almost 8 years old now and its whole reporting system requires IE6. At the time it was cutting edge and to have a graphical reporting system was just great. Now its a nightmare. They would love to update to new browser, but are locked out till they get a new call switch which costs upwards of 5 million dollars. So…… it’s kinda hard to tell them oh just update your browser already. And for those just don’t work for that company barkers. Well one I worked for had 500,000 employees, and they were looking for partner firms to work with, guess what one of the main contract points was? Systems had to work on IE6. Guess how many people were upset they lost the 5 billion dollar contract, cause they didn’t meet that criteria. So before you potentially cost your client 5 billion dollars maybe you should get off your high horse, and realize pushing the envelope isn’t always great, not to mention the standard is so up in the air right now its not even funny. I mean they haven’t even fully locked in what codec is going to be used for the html5 video tag. Firefox and Chrome using one, Apple and MS another. So the html5 video tag isn’t even stable yet and your pushing people to use it?
    Get a grip on reality.
    Also I love all these super great examples for html5 etc but they are just really bloated programming nightmares that have much more efficient counter options that are actually cross browser compatible and fully degradable. You know those evil things call plug-ins. Mainly flash and silverlight. My favorite case in point is the Google pac-man game. It only took 30 years for someone to use CSS3 and html5 to create a game written 30 years ago with less memory requirements then the CSS3 file for the Google version. Don’t get me wrong html5 and CSS3 is great but its no where ready for mainstream use even if every person in the world had a compatible browser the standards themselves aren’t clear and are changing daily. Pretty hard to code something that is correct this month and no longer valid next month. Too much risk for such little to no real reward.

    0
  95. 242

    More than anything the reason behind not moving immediately to HTML 5 and CS3 is a financial one. It’s not entirely the fault of IE6, but implementing new forms of code requires learning, that takes time and as we all know, time is money. So I’m having to spend my time learning a technology that isn’t even full supported yet. OR spend even more time learning to use tools that fudge the appearance, bloat the sites code and will eventually be unnecessary. This is fine if you’re a student, part of a team or have clients that ooze money and are happy to fund experimentation.

    Sure if I was still working for an agency that was willing to send me off to camp for a week with expenses, great, but right now I’m building three sites, all of which are going to be robust, lean and cross browser compatible, even if they do have to ‘degrade gracefully’ in some parts.

    Frankly I’ve already had too much of my career invested in re-educating myself, years spend developing in Director, various iterations of Flashscript, DVD scripting, none of which I use any more. I honestly believe I could probably keep building websites in html 4 to the end of my days and the people paying me to do so would barely know, care or notice the difference. That or just skip this version and wait until HTML 6, it’s going to happen after all.

    0
  96. 243

    I can totaly agree here – been working as frontend developer on a project for 2 years now and we deployed site in 4 different countries and covering all browsers from IE6+ and 5 different languages (including French and Hungarian that contain some sick long words) – CSS3? – yeah I used it for rounded corners – that also called in PIE.css that called in around 10 extra bugs that I had to fix on my own since their product is still buggy. Now if I had to do it again I would totally go for rounded corners with images. And that was the only css3 thingy I used. And was it worth the time I wasted? Not at all – but who cares – they paid well.

    0
  97. 244

    Because of people like BRYON, who left dozen of comments on this post, the web will never move forward. Okay, it’s a bit of an exaggeration, but srsly, how can you think you look so smart, when everyone out here perceives you as a tool? EDUCATE YOURSELF for goodness sakes!

    0
    • 245

      I have to agree with you and the 2,143 other people who answered the poll above and said the would use HTML5!

      0
      • 246

        I’m not a hater or anything, but I’m sick and tired of people bashing on technologies that they have no clue about. I’m willing to bet you 1000$ that this guy doesn’t have a clue of any of the following:

        - the meaning of the words progressive enhancement
        - the existence of a library like Modernizr
        - HTML5 and CSS3 were built to be backwards compatible with html4/xhtml and css2
        - Surfing the web with javascript turned off because of security reasons is just not a valid reason anymore.
        - there is a fallback for a lot of CSS3 properties and HTML5 features like web forms etc.: The All-In-One Entirely-Not-Alphabetical No-Bullshit Guide to HTML5 Fallbacks (https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills)
        - the existence of CSS3 PIE (http://css3pie.com/) – I don’t really use this one, but hey, it works.
        - many excellent books and articles that will get you up and running with css3 and html5 in no time.

        Yes, many of these can be considered (javascript) hacks, and IE still has a share of approximately 60%, but what about the rest of the market? Are you going to deprive the users of chrome, firefox and any other modern browser of the awesome new things that will enhance their web surfing experience? I certainly won’t…

        0
    • 248

      Nepathean…I have an Associates of Science in Web Development w/Honors and I’m finishing up my Bachelors of Science in Web Development. So I’m educated.

      You really shouldn’t resort to name calling to prove a point.
      When the IE browsers support HTML5 then I will use it…at the moment they don’t!

      Yes I understand…there is a JavaScript hack for making IE work with HTML5. Totally get it.

      If Shaun ,Nepathean and others want to use HTML5+JavaScript hack for the no support of HTML5 on IE 6, 7, 8 then fine. We all need pioneers for pushing the technology.

      I for one will not be using HTML5 in any of my sites I design for clients till a couple of versions of IE support it.

      HAVE A NICE DAY :-)

      0
      • 249

        OK, I went a bit over the line when I called you a tool, so I apologize for that, but it really seemed that you didn’t have a clue what you were talking about. When I said educate yourself, I didn’t mean go out there and get a degree in something. What I really meant was: read a book or two on the subject, and then come back here, and if you still feel like bashing on people who use css3 and html5, then do it.

        Good luck in using css3 and html5 in the year 2020 ;)

        0
  98. 250

    TundraBlue Technology

    December 13, 2010 4:02 pm

    I’ve never had a problem convincing my clients to move away from older browsers. It doesn’t have to be a huge effort, if there is no network administrator for the company then pop a window that tells those on the intranet to download the latest browser (for windows 2000 users this will have to be Firefox instead of IE8 or IE9). If there is a network admin have him push the update out.

    0
  99. 251

    Kind of an aside from the root topic, but if that example of the 24ways blog is supposed to be a vision of the wonderful new web HTML5 and CSS3 is going to bring us – I’d be just as fine to keep the old web. That is honestly a cluttered, ugly bit of design work there – just plain painful to peruse. Is the new web going to mean another trip through 1995, with new versions of rainbow backgrounds, flashing, multicolored text and nausiating animated gifs? At least it will keep websitesthatsuck busy.

    0
  100. 252

    Anthony Alexander

    December 13, 2010 4:28 pm

    It bothers me that this article has no reason to exist, yet its the 3rd one i’ve read today

    0
  101. 254

    I’m a fan of playing with HTML5 and CSS3, but I guess the biggest factor preventing me from completely switching over is the compatibility issue, even though I know it’s impossible to cater to every single browser out there! My next project will definitely use HTML5 and CSS3, and hopefully I’ll adopt (and embrace) it sooner rather than later for my main site.

    0
  102. 255

    I thought Smashing Mag was all about Usability…

    and standards.

    HTML5/CSS3, in reality, has neither.

    ” just because you can, doesn’t mean you should..”

    Whats the next shiny new thing? the iPad2?

    0
    • 256

      But what you should look to do is push the bounderies of Usability and standards by trying to use the elements of Html5 & CSS3 that you can! If we dont push forward we will never progress.

      I do agree though to a point though it is a problem for usability and standards which we need to keep in mind on every build.

      0
  103. 257

    Can’t believe how well this site is doing. Most likely due to these kind of great articles. Total Votes: 4,459. I’ve been using HTML 5 for a while and i have to admit, surely you can hear a clear “WTF!?” trough my door but it’s a learn-while-using process. Having a lot of fun of it and it really allows you to write some beautifull code.

    Kind regards from the Netherlands,

    Philip
    BuitenAardig.nl

    0
  104. 258

    I really want to start using more Html5 & CSS3.

    I started using some basic elements but the problem i face is that some of our clients only use IE6. This is a massive problem for me as we need to then develop for that browser so the client is happy with the product.

    Also Html 5 is still only classed as “Experimental” under W3C Validation & our clients sites need to validate by law to be WAI & DDA complient. I can’t see me getting into HTML5 & CSS3 just yet but i really hope to start bringing more elements of both into our builds.

    But we should push the limits to see what will work or we will never move forward.

    0
  105. 259

    A lot of the commentators seem to be hiding behind “IE” as a reason not to embrace it but these people are failing to see a number of the benefits.

    Some examples:
    Wireframing in PhotoShop isn’t as important when you can knock up a demo site in HTML5 and CSS3 in a fraction of the time.

    On all the ecommerce sites I have stats to there are huge increases in mobile/tablet sales. HTML5 and CSS3 make it MUCH easier for non-PC to order and fill in forms. Should we ignore this market which is growing by the hour?

    I can create CSS3 versions of a site 30% faster than being stuck in PhotoShop for hours creating all the curved corners, shadows etc

    SEO
    By correctly labeling the elements with tags such as , , etc you are helping search engines know what is and isn’t important on a page.

    Jobs
    Most jobs I see these days require mobile/HTML5 and CSS3 knowledge…hmmm, actually, stick the stone age guys and girls, I’ll have more luck when I need another job!

    I have some websites (intranets) where IE6 use is above 90% so I don’t use HTML5 or CSS3

    I have some websites where IE6 accounts for under 10% so I use some HTML5 and CSS3

    I have some websites where mobile users are the biggest buyers so I use purely HTML5/CSS3 while still supporting non-HTML5 browsers who get a less whizzy (but still usable) version

    0
    • 260

      I like this article & tend to agree on the validation side of things as long as it’s semantically correct & useable when css is tuned off – http://net.tutsplus.com/articles/general/but-it-doesnt-validate/

      To me it sounds like your a freelancer Simon? Going straight to build in my opinion isn’t the right way for us as a company. The problem we face is that 90% of the time the design we start with is vastly different to the end product. Also our designers are “designers” not front-end developers like myself ( i can design, build & develop ).

      Another problem is really is IE6 as we have done work for NHS & others that only use ie6 & it needs to look right to them.

      Html 5 & CSS 3 is something i am pushing for within my company & less support for ie6 on a visual basis. We do need to push forward & brake the rules some times to get things moving.

      0
      • 261

        I contract for a company with 1,000 in the web team but I do also freelance. I have always block and visual wire-framed in PhotoShop but HTML5 allows me to build a block wireframe quickly and easily. From there I can start to add styling with just a few lines of CSS so I can see if I’m heading in the right direction for the client.

        I would NEVER recommend HTML5 and CSS3 for companies who use IE6 almost exclusively but that kind of IE6 browser percentage isn’t commonplace. What I’m trying to say is HTML5 and CSS3 are tools that shouldn’t be disregarded point blank because in the “very near future” they will both play a very important role in designs.

        I love the simplicity and structure of HTML5 and I love the time-saving benefits of CSS3. I only use both in a fraction of my work but I still use them because the benefits I listed above out-weight the minuscule percentage of IE6 users who have JS turned (based on sites I have analytical access to).

        0
  106. 262

    If your website makes £1million a month
    5% of your users are IE6 (£50k a month)
    I don’t make £50k a month… and it only takes me maybe a few more minutes, hours to fix something to work in IE6. Holding back on CSS3 and HTML5 won’t provide more than £50k extra a month.

    I tend to make sure it works, add frills using CSS3 and HTML5 like shadows, rounded corners and gradients. Ie6 users aren’t going to moan about your site not looking that much better as the rest of the web probably looks crap to them anyway.

    I think the only way to tackle IE6 is for the large websites (Facebook, Twitter, YouTube, Google) to boycott it and then they’ll be forced to upgrade or live in a cave happily :P

    0
  107. 263

    I have used HTML5 on about 3 websites now so far with support for ALL of the major browsers, IE6+.

    I think the problem here is CSS3 and NOT HTML5. All HTML5 is are a few extra elements, some that will work and others that will not, like the video tag.

    To use HTML5 semantically, you can use it today. Tags like section, aside, nav, header, article can all be used NOW to give more meaning, it’s just that you wont SEE anything different, but it WILL mean something different to those who will consume it better.

    I build all my websites with CSS2.1 then add CSS3 features to pretty it up. I will never rely on CSS3 but for those who took the time to upgrade to a decent browser, they’ll be rewarded with a slightly prettier website. But, all in all, everyone can get the content.

    0
    • 264

      Special css3 tags like shadow and rounded corners work fine in saf,chrome,ff.
      When viewed in IE, it just ignores the line of code without changing the appearance of the layout. I say yes, build using css2, but add these small css3 goodies and it will be ok.

      I think its ok to play around with some of CSS3 features, just not go over the top.

      0
  108. 265

    I have no qualms about selective CSS3 and HTML in my widely-disseminated work (that which older and less apt users are expected to interact with) so long as it is supported by the current and last versions of major browsers (Firefox, Chrome, Safari, IE) – and by that I mean as long as IE 7/8 support it.

    In my personal work, however, I actively discriminate against IE users – being that browsers are free there is no good reason for the utilization of IE by the types of users that I cater to.

    Use should be carefully considered for the next several months or so, but no designer/developer should ignore CSS3 and HTML5 until they are fully supported by the browser versions that the majority of people are using. These languages paint a bright future for the web and nearly boundless possibilities for those who will develop it, so it would be a mistake not to work with them now in some capacity.

    0
  109. 266

    HTML5 are some new tags, the canvas one usable with Javascript and some offline , draft tags.
    Css3 is a great innovation with animations and other cool stuffs.

    But if we go ahead, Javascript programming is a disaster. For video, simple effects (menù, slideshows etc), WEB DESIGN and similiar, in the next 5 years all websites will be done in HTML and CSS3 + some javascript with Adobe and Microsoft IDE upgraded.

    BUT for serious RIA and WEB APPLICATION, the way are only 2:

    1) Silverlight
    2) Flash

    The data management, Databae interactions, complex async calls to methods, and SECURITY must be done with robust languages like C# (Silverlight environment) and good tools for augmenting programmers productivity. On this blog you are not programmers, are designer. So, asking a developer to use Javascript, the mess of open source library with no tools, no debugging instruments like visual studio, NOW in 2010 is a suicide.

    And this only to use 4 or 5 new stuffs, like round corners and some animation that can be done in Flash and Silvelight in 3 minutes.
    Flash is a standard de facto, Silverlight now reach 65% people out there and is Cross platform/browser in and out and will reach 90% people in the end of 2011.

    Also in 2011 Silverlight and Flash will reach Android and Windows Phone 7.
    Only iOS is out for Steve choose, but a few million ipads are ridicolous conpared to thousand million Desktop PC and iphone is too small for a serious and complete navigation. Also there are hopes because Apple will decrease maket share if will not open to Flash and Silverlight as the competitors.

    In conclusion, HTML5 (that is HTML + SVG + CSS3 + JavaScript + [server side language combined with AJAXcalls ] + database) will be used for NORMAL websites in about 1 or 2 years to let people upgrade the browsers, and Software house to do the tools for animations , but will always give problems to designer cause browser inconstistency.

    For huge, complex and data driven applications like games and great websites and web applications, plugins will be the best choice ever cause GREAT TOOLS ,super productivity and a level of abstraction from browsers that let developer not take care of Javascript inconsistency cross browsers.

    In conclusion, in 2012 when Html5 will be mature we will have Flash 11 and Silverlight 6 with real 3d and other stuffs + HTML5 for websites and great design/simple apps, but no complex web applications (only giants can use Js to do this).

    Bye

    0
    • 267

      YOU are a serious kook.

      No none gives a shit about 1999 flash intro animations.
      Flash websites are so 2005. When a user comes to a website, they want see it quickly and not wait for some stupid menu animation or preloader effects….

      NO ONE CARES ABOUT 3D FLASH SITES! I HATE FLASHDEN TEMPLATES TOO!

      0
      • 268

        I was not talking about “stupid menu animation or preloader effects….”
        If you read carefully, i said that for these we will use HTML5 :D

        The “so 2005″ website, depends on WHO design the website, NOT the technology. Even in JavaScript you can do a boring shining intro animation., tsk.

        From what you write i can deduct you are not a developer, and probabily even not a web designer, but a simple apple consumer “Steve influenced”.
        Am i in right? You don’t know what you are talking about.

        I was talking about RIA.
        JavaScript is not good for RIA, NOW in 2010, MAYBE in 2 or 3 years.

        There are no tools, all handcoded, browser inconsistency, slow performances, difficult to debug, no databinding, low security.
        Do you understand what i’m talking about?

        Flash is a standard de facto, and like Silverlight have great tools, and it’s a mature technology.

        The world will be better if only the DAMN apple give all world developers the right to choice what f*ck tech to learn and use.
        Now the world is quite stopped cause Steve Jobs and his sheeps, waiting for the immature and DRAFT tech marketed as “HTML5″, and Google is taking advantage of this cause it have no dev tools like Microsoft and Adobe and want to damage them. Google earn on advertising, Apple on hardware, MS and Adobe on software.

        Using or not using html5 , they fight, they make a lot of money and we developers must pay this.

        HTML5 is not ready yet, we need tools, we need to be more productive, we need browser consistency, we need books, we need a clear and complete set of “what’s new”, and not “some” new features and perhaps something else GOD Steve knows when.
        We have nothing of that. PERIOD.

        The web is becoming another mess of not standard compliant webites running to the not existent eichtiemmeellefive. Go Apple, go and sell your f*king useless ipads, sheeps are buying.

        0
  110. 269

    I agree with Michael.

    Much of the above discussion related to “not being able to use HTML 5 because of Internet Explorer 6″. I just thought I’d point out that when Microsoft developed IE6, they did consider that you might add new tags at some point in the future, so there is a simple JavaScript shim that makes HTML 5 work in IE6.

    http://www.stevefenton.co.uk/Content/Blog/Date/200907/Blog/HTML-5-Browser-Test/

    If you don’t like the idea of the JavaScript shim there is a non-JavaScript method that is designed to have an easy-conversion later when you decide HTML 5 is well supported:

    http://www.stevefenton.co.uk/Content/Blog/Date/201012/Blog/HTML-5-Without-JavaScript-Shims/

    I’m not entering the discussion about HTML vs FLASH vs SILVERLIGHT at this stage, suffice to say that anyone who thinks ebay and Amazon are not complex web applications may be misleading themselves somewhat. The same goes for anyone who thinks you can’t debug JavaScript.

    0
  111. 270

    We love CSS 3 & HTML 5, but are holding back (particularly HTML 5) simply because of the IE6 reasons stated by so many others. However, we do have a slightly different approach to whether or not we use them: we look at the client’s audience demographic. If they’re targeting consumers or small businesses (who are more likely to use Firefox or a newer version of IE), we’re more likely to use CSS 3 than if they’re targeting larger corporations or the public sector (who, as we know, are more likely to be using some ancient version of IE).

    0
  112. 271

    If us developers continue to develop for IE6, well users will continue using IE6 period. As long as sites are still showing up properly on IE6…what is the whole point of upgrading!!!!

    I am all for this article and since browsers are free these days simply putting a browser detector saying “Hey…you have an old browser from the year 1999 please upgrade to today’s current browsers” If the user really wants use the site well people will change and when they do and see the difference the web will change much quickly.

    I understand we have clients but hey seriously tell them to move or find other clients and leave your old client with an old browser.

    Just look at google…They don’t support IE6 anymore!!! They are still surviving…

    So seriously lets move on!!!!

    P.S I still can’t believe people still use IE6!!!!

    0
    • 272

      PEOPLE STILL USE IE6 BECAUSE THEIR IT APPS MAINFRAME IS BUILT ON IT!

      IT WILL COST THEM MILLIONS OF DOLLARS TO UPGRADE AN ENTIRE OFFICE SYSTEMS TO WORK WITH A NEW BROWSER!

      GOOOOOOOSSSSSSSSSSSHHHHHHHHHHHHHH!

      WHEN WILL YOU PEOEPLE GET A CLUE!
      SOME OFFICES STILL USE REMOTE .DOS CONNECTIONS!

      0
  113. 274

    Fat Free Interactive

    December 16, 2010 12:13 pm

    The bottom line is that HTML5 has many features that can be used on even older browsers. Adaptation of techniques has been slow, but if we want to be successful at what we do, making excuses on why not to use HTML5 is a huge mistake.

    There’s no reason even the basic HTML5 layout should not be used on all projects.

    0
    • 275

      Very true! Even if you don’t feel comfortable using features like and with a flash fallback then you should at least use the basic HTML5 elements such as , , etc so you can deliver a more semantically correct website.

      0
  114. 276

    Special css3 tags like shadow and rounded corners work fine saf,chrome,ff.
    When viewed in IE, it just ignores the line of code without changing the appearance of the layout.

    I think its ok to play around with some of CSS3 features, just not go over the top.

    0
  115. 277

    Ironic how smashingmagazine.com is using XHTML 1.0 Transitional…

    0
  116. 278

    Common mistakes : “i have nth percent IE users” with n beeing a big number. Sometimes the analytic tool is wrong, and counts the bots in. I mean all that crappy spam bots, not googlebot, msnbot, slurp… They represent a big part of the Internet traffic and pretend to be IE6 for the majority of them.

    “it would cost millions of dollars to upgrade the browsers for a company”. No, except if the IT department is really shitty. Upgrades and installations can be made silently. One solution would be to install Chrome Frame and configure the proxy so it would add the switch to every page coming from the internet.
    One browser, two rendering engines with ie6′s one used only for the internal creepy software (and even for a selection of internet webservices if needed)

    0
  117. 279

    Reality check #1: clients and the end customer don’t give a flying fudge what version of HTML is used so long as it works.

    Reality check #2: HTML 5 works IN ALL BROWSERS.

    There is nothing stopping us moving the industry forward and using new techniques today. For those that want to carry on using old ways and hiding behind small minded views and adopting backwards looking approaches to the modern web, fine. Go the way of the dinosaurs for all I care.

    HTML 5 is here. It works. Start using it. You have nothing to lose.

    0
  118. 280

    Not too many people know about this but CSS3 PIE is a great tool to bring CSS3 into the picture. It is an HTC File that lets you use gradients, round borders, and text/box shadows in IE7 and IE8. Google CSS3 and check it out, it completely blew my mind when I saw it so now I use CSS3 on a daily basis. This is how we let CSS3 break into the nets!

    0
    • 281

      I recently used HTML5 and CSS3 on a project along with html5shiv and CSS3 PIE to fill in the IE gaps. I found my development time to be shorter and compatibility across browsers was excellent. The end result was a more economical project for the client in exchange for a stripped down IE 6 experience using a very minimal no-frills stylesheet.

      Now if a client insists on IE 6 compatibility I will do one of two things: refuse the project, or make it known that IE 6 is time consuming and will be much more expensive. Then we can look at the site stats to decide if it’s worth the huge price increase to deal with that big bag of hurt.

      0
  119. 282

    I am an end user and unfortunately I think you’ll find that a lot of government employees have to access the internet via IE6. You wouldn’t want to deprive these lunch-hour-surfees of a good surfing experience (or shopping = kaching for your client) by not supporting IE6 imho.

    0
  120. 283

    kurniawan joko purnomo

    January 12, 2011 6:47 am

    Absolutely yes, cross browser is matter . We must aways update our knowledge and our technology into our design.

    0
  121. 284

    I want to say, don’t be slave of validators and of old browsers.

    0
  122. 285

    I love HTML5 and CSS3, but it’s so hard to develop something nice because it just looks like cr@p on browsers like Firefox 3.6 and IE 6-8 which are mainly used by the vast majority of users.

    The day these browsers just jump in the bandwagon regarding the new web technologies instead of differentiate with “features” that “enhance” the experience of browsing using their browser then the web will be a much happier place.

    0
  123. 286

    Obviously there are mostly developers commenting here. As a newbie who is just learning and about to embark on a first website (not for a client), wouldn’t you say ‘Go forward young man. Build it with HTML5 and CSS3′?

    0
  124. 287

    Thanks for this post. I wanted to know what books and tutorials out there that teach html5 and css3 from a graphic designers standpoint for beginners. I want to hit the ground running.

    0
  125. 288

    Most of you are missing the entire point. Those clients who have older browsers need to be urged to upgrade. Also, havent you people learned to COMBINE everything?

    As stated, html5 is a combination and addition of older and newer markup. It’s not entirely a new thing or concept. While they elements are cool and now possible, havent we all wished for these elements for the past 5-10 years already? Now that its possible you guys all of the suddent want to back out and turn your backs on it?

    Look to the future. Look to mobile development. Look to the new design. STOP MAKING WEBSITES THAT REMIND ME OF THE DIAL UP 1990s LOOK! Innovate, be creative, and be precise. Use the right tool for the job.

    Please stop wasting time and commenting negatively on HTML5 CSS3. Learn to be the future and yet provide a solid standard for your clients with older browsers and use the right tools for the job. Sheesh, people. So freaking stuck up and elitist. Open your mind and open the possibilities for the free web. If people are lacking on upgraded browsers than its their fault. IE6 was released AGES ago. Face it, people who havent upgraded yet probably wont and are therefore useless for our target audience. They probably dont have a clue about what html even is.

    0
  126. 289

    HTML5/CSS3 is perfectly valid to use and it has been for awhile with support continuously growing. So you may have to hold IE’s hand a bit (older versions), that’s not the end of the world. Any developer worth their salt would recognize this and instead of digging in their heels find ways to embrace this change and evolve.

    I got tired of seeing so many references regarding IE6. Please refer to the following site set up by Microsoft themselves:

    http://www.ie6countdown.com/

    In addition to that popular systems like WordPress have dropped support for IE6 with references of doing the same for 7. (*Cheer!*)

    Bottom line… Educate Not Enable!

    0
  127. 290

    This is so damn confusing. I have to do what I gotta do to please my clients, and that means that I have to develop for IE6, but it makes being a web designer difficult and boring. Now, I hear that this modernizer and html5shiv can do something to make HTML 5 work in older browsers with JS. I just need someone to confirm this so I can go learn how to implement them on my websites. Even 1 percent of IE users could be thousands of dollars of lose/year so I want to make sure that IE6 gets support.

    0
  128. 291

    I think it’s good that web designers are being given new tools. Let’s not forget why the new methods have been introduced. It’s all about reducing the amount of requests being sent by the browsers.
    Reducing the requests and making the users’ browser render certain images and styles that before needed to be downloaded as another image gives more bandwidth for other uses and reduces the amount of download time.
    We can’t all get fast download speeds for our mobile devices. Personally I’m in a blackspot at home and always use my wireless connection instead.
    If the file size is reduced, it leaves room for more other mobile users’ data, giving (hopefully) a better and more reliable service.
    For example, can you imagine what it’ll be like when everybody sends out a New Year Picture message?
    If you have a continually growing amount of mobile users, you need to avoid what usually happens at New Year.
    You can read my site page here http://www.blueflux.eu/HTML5.html or read my blog http://www.blueflux.eu/MyBlog.html.

    They’re both an ongoing project and a little unfinished but you’ll get the idea.

    It’s always going to be difficult to put down on canvas what you want to express when the canvas is never the same size.
    So for now, the best option we have is to reduce the canvas size a little and add a bit on the side that we really don’t want to, so the guy/girl with the humungous screen!! Can still see a ‘complete’ design.
    There’s also a few little workarounds coming out. For example, I made the HTML5 page as a way of practicing the new techniques and finding out why there was misconception that ‘Flash is dead’ beginning to emerge.
    However, someone reminded during a conversation that there is no IE9 for XP users. XP is still everywhere.
    This made me look at my new HTML5 page and I thought, ‘why I have I just made this, maybe I should leave it for another few years?’.
    Or, now I have to design web pages with the new stuff, and check to see how it looks on IE8 or under without the support for this new stuff.
    Anyway, there is a chrome frame plug-in for IE https://developers.google.com/chrome/chrome-frame/
    and I also found this: http://www.htmlgoodies.com/primers/html/three-ways-you-can-use-html5-on-your-website-today.html#fbid=OZx17LoBBIh

    Martin @bluefluxgraphic

    0
  129. 292

    In my opinion, today’s world is fast growing and moving with the new advanced technologies everyday, so in this busy life and to upgrade ourselves with the technologies and the world, the need for all time online is necessary for those who are with stock and share markets, who are with real estate business and also for those who awaits for their friends comments or shared pictures by using social media, we should have the smart phones and these all can happen if we are using modern browser techniques that can be device dependent.

    HTML5 is device dependent and thus media queries by using css3 with HTML5 make websites responsive, Iphone / Mobile apps needs HTML5 as it has the ability to reduce the external plugins like flash.

    0

↑ Back to top