5

I am currently working on a website. After studying HTML5 and its features I want to go ahead with it. I want to use features like offline storage, data- attribs, simple chat support etc. but because HTML5 is not well-supported yet, I am a bit confused. I have always used XHTML 1.0 transitional until now; should I continue using it or should I use HTML5?

I have seen the web giants like google have completely shifted to HTML5.

Alerty
  • 5,945
  • 7
  • 38
  • 62
  • yes I mean this feature which is coming in HTML5 http://html5demos.com/web-socket –  Jan 21 '11 at 17:28
  • Because of Steve Jobs some people seem to think many unrelated things are a part of HTML5. Check the demos more closely for information on that. It's WAY too early to change to HTML5 methods if you make a public site, for instance for a company. – plebksig Jan 21 '11 at 19:39
  • 2
    @neXib: Why are you even placing the name of Steve Jobs in there? It is not too early to start using HTML5. You simply need to give the possibility for users with less modern browsers to still be able to see something. BTW, by less modern browsers I am referring to IE 7-8. – Alerty Jan 21 '11 at 19:51
  • @Alerty: Because he hyped up HTML5 vs. Flash, which is like Apple vs. Orange (no pun intended). A lot of things people tout about HTML5 has nothing to do with HTML5 but are separate technologies that just work better with a better toolset like HTML5. Obviously I support HTML5 and I'd love to use it, but nobody that do this work for money can spend hours and hours on HTML5, and then creating a ton of fallbacks, it's not sensible. Just my opionion, as a long time webdesigner, don't mean to be all bossy :) – plebksig Jan 21 '11 at 20:02
  • @neXib: I understand that HTML5 won't be fully supported by every browser by tomorrow morning. Yet, some features are ready and those features can be used in Chrome, Firefox, Opera and Firefox. Not to mention that Microsoft is finally coming along with it in IE9. Why punish those who use browsers that can run it? Only the iOS versions of Safari do not support Flash. What is wrong with that? For example, can you imagine the nightmare for users trying to play a Flash game on an iPhone? How do you define every behavior such as user input on a small touch screen? Its not worth it. – Alerty Jan 21 '11 at 20:19
  • @Alerty: That's all fine, and I haven't used Flash in ages. What I'm saying is that if you have a limited time to create a web page for a client, why would you use HTML5 as a starting point? At least 30% of the users won't have it, for companies a core audience probably uses IE, sad as it may be. I'd still say one should have the outset of HTML5 if you can, but I think it seems a bit like people are skipping too far ahead. Firefox DOESN'T work properly with HTML5/CSS3 yet. And you listed it twice :) – plebksig Jan 21 '11 at 20:24
  • @neXib: “if you have a limited time to create a web page for a client, why would you use HTML5 as a starting point”. Depends what you mean by HTML5. The doctype is a great starting point for building web pages today, because it works in all existing browsers. All the reformulations of existing features work, or degrade gracefully. HTML5 isn't one thing. – Paul D. Waite Jan 21 '11 at 23:14
  • @Abhishek: ah, okay. I don’t know much about web sockets; I don’t think I’d describe it as “simple chat support” though. – Paul D. Waite Jan 21 '11 at 23:17
  • @Paul: I basically mean that if you make a page with Chrome being the main testing browser, using HTML5 ways to do things, you may walk into a trap, as opposed to Firefox/Chrome XHTML as a starting point. I'm not saying just doc type is that big a deal, that wasn't the only thing the OP was asking about as he involved chat, browser storage etc. – plebksig Jan 22 '11 at 00:09
  • @neXib: You can make the current browsers do much more than you might think. At the moment, you just need a bit of imagination or dig out some info about how we can use HTML5 today. Please refer to my answer. – Alerty Jan 22 '11 at 05:45
  • @neXib: sure, I see what you’re getting at. The main point I was trying to get across is that HTML5 isn’t one thing. So you’re right, you don’t use the entirety of HTML5 as a starting point, nor assume support for everything in the spec (which is still evolving, and [will continue to evolve without being versioned](http://blog.whatwg.org/html-is-the-new-html5)). But you can certainly take individual features as starting points, say if they’re a really easy way to implement something that previously would have required more work — e.g. the `placeholder` attribute for form fields. – Paul D. Waite Jan 23 '11 at 16:38

4 Answers4

6

HTML5 Features

If you mean the HTML5 features, you must understand what HTML5 really is. I would define it has the culmination of the previous specs as well as newer and richer features. It is made to support existing content (backward compatible) and to support the creation of web applications. What is really awesome is the fact that it does not only stop there. It states for the first time how browsers should deal with error handling.

Now, you need to know that not all features are implemented in browsers. You can take an HTML5 browser test to know what works and what doesn't. That does not mean that they will not work! Most browsers actually allow you to use and style any element you care to invent. The new HTML5 tags have no default style in browsers that do not support them.

The following CSS code would be enough for most browsers:

section, article, header, footer, nav, aside, hgroup {
  display: block;
}

As always, Internet Explorer (IE) has special needs. Only, there is a JavasScript magician who goes by the name of Remy Sharp that has created a JavaScript file that creates each element for IE. So you could add this in your page:

<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"
  </script>
<![endif]-->

By the way, you will have to use JavaScript to be able to test the existence of new HTML5 elements and give an alternate choice to those who have browsers that are not up to speed with certain HTML5 element and attributes. This is why there is this little generic JavaSCript function that you can use to do just that:

function elementSupportsAttribute(element, attribute) {
  var test = document.createElement(element);
  if(attribute in test)
    return true;
  else
    return false;
}

One last note, I got most of this information from the book HTML5 For Web Designers. Kudos to Jeremy Keith!

HTML5 Doctype

If you mean the new doctype one <!DOCTYPE HTML>, here is what I have to say...

It isn't illegal to use features from previous HTML/XHTML version in HTML5. Note that the new doctype does not have any number associated with it. That is because it is meant to build upon existing specs and to be valid for future versions. Therefore, I say that you go with the new doctype.

You can have a look at the spec on the W3C site. In short the spec says this...

8.1.1 The DOCTYPE

A DOCTYPE is a required preamble.

DOCTYPEs are required for legacy reasons. When omitted, browsers tend to use a different rendering mode that is incompatible with some specifications. Including the DOCTYPE in a document ensures that the browser makes a best-effort attempt at following the relevant specifications.

[...]

For the purposes of HTML generators that cannot output HTML markup with the short DOCTYPE "<!DOCTYPE html>", a DOCTYPE legacy string may be inserted into the DOCTYPE (in the position defined above).

Alerty
  • 5,945
  • 7
  • 38
  • 62
5

HTML5 is a set of mostly-unrelated features.

You can use whichever features you want; you just need to be aware of which browsers support which features.

SLaks
  • 868,454
  • 176
  • 1,908
  • 1,964
  • yes you are right even I have found some JavaScript libs to know which feature works on the browser... but is there any way to know this at the server side itself? As far as I know we cant get this info from the user-agent string –  Jan 21 '11 at 16:21
  • 1
    Yes, you can, but it's a bad idea. – SLaks Jan 21 '11 at 16:26
1

Depends entirely on the users of the website, and which features their browsers support. As SLaks said, HTML5 isn’t an all-or-nothing proposition.

Mark Pilgrim has two good chapters on detecting support for HTML features via JavaScript (which is the only reliable way to do it):

You use the same approach here that developers have always used for front-end web code — use new features in such a way that users who don’t have that feature yet can still use the site, even if the experience isn’t as slick for them.

DanBeale
  • 310
  • 4
  • 15
Paul D. Waite
  • 96,640
  • 56
  • 199
  • 270
1

Unlike other languages, you don't have to choose between HTML 5 and XHTML. I think your question is coming form seeing the DOCTYPE string at the top of HTML source. You should include a DOCTYPE, but it doesn't matter much to browser support.

The right question to ask is if there is browser support for the features you want to use. Every browser supports some features of HTML 5, since most of HTML 5 is the same as HTML 4 and XHTML. Consider your target audience and what browsers they probably use and then look up how well those browsers support the features you want to use.

In short, you don't have to decide if you want to use HTML 5, you need to decide individually on a feature-by-feature basis if that feature is well enough supported (no matter if that feature is an HTML 5-specific feature or not).

This is a good resource for browser support of some of HTML 5's new features: http://www.findmebyip.com/litmus

Computerish
  • 9,590
  • 7
  • 38
  • 49
  • -1: HTML5 is not mostly like the previous specs. It builds upon them and has multiple new features! By the way, it is "HTML5" and not "HTML 5". – Alerty Oct 07 '11 at 19:31