HTML5 Doctor » Quick Tips

HTML5 Doctor Glossary

Jack Osborne — Thu, 19 Nov 2009 15:26:26 +0000

Over the last few weeks, we’ve been working on something a little special here at the HTML5 Doctor.

You’re obviously here because you’re interested in HTML5. You might even be here because the thought of reading the HTML5 spec on the W3C site gives you nightmares. Well, fear not, for you shall be able to sleep easy once again! We’ve just launched the HTML5 glossary.

The purpose of the glossary is simple: we’re going to give you a breakdown of all the elements within the spec in clear, bite-sized chunks.

From the screenshot above, you can see that we’ve laid out the page to be as clear as possible (using HTML5, of course). At the top of the page is an alphabetised list of links to individual sections of the glossary. The rest of the page is the list of elements and their descriptions.

I’ve labeled the key points of each entry in the above screenshot:

Links labeled “Our Prognosis” refer to an article that one of the Doctors has previously published.
Each entry contains a brief description of what the element represents and its proper (and possibly improper) uses.
We always include a link to the element’s full description in the official HTML5 spec.
Code snippets show contextual examples of the element in an HTML document (shown in the screenshot below).

Not every element has a code snippet and “prognosis” link, but we’ll be doing out best to flesh out the glossary with some more examples and elements in the coming weeks.

Be sure to add the glossary to your list of HTML5 resources!

Got a suggestion to help us improve the glossary? Request a missing element or report a problem by leaving a comment below, or head over to the contact page and send us an email.

Share and Save:

HTML5 Doctor Glossary originally appeared on HTML5 Doctor on November 19, 2009.

Your Questions Answered #3

Richard Clark — Thu, 22 Oct 2009 13:52:44 +0000

We’re back with our (semi) regular round up of answering readers HTML5 related questions. Right, let’s not mess about any longer and dive straight in with the questions.

Multiple use of tags

Daniel Davis asked:

Dear Doctor,

Just a quick confirmation please.

Am I right in thinking that nav, like header and footer, can be used more than once in a single page? For example, surrounding a menu at the top of the page and surrounding next/previous buttons at the bottom.
Come to think of it, is it fair to say that all tags except html, head and body can be used more than once?
Thanks in advance, doctor.

I’ll be back soon about my dodgy knee.

You’re correct all the elements you mention can be used more than once a page. If you see this article about the header and this about the footer – they show that you can use them multiple times on a page. Also you don’t really need html, head or body tags, as all browsers will assume them anyway but it’s also safe to leave them included.

— Hope that clears things up Rich and Bruce

HTML5 + Javascript Client Web App

Girish asked:

Is it possible to create a complete client side application using HTML 5 (it will embed chat clients, stock ticker) + JavaScript, and then bundle is with underlining Firefox 3.5 engine, so that user can install it as a desktop app on Linux, and then it runs in its own window using firefox 3.5 engine. The app will store everything in local storage – like url, usernames etc, and will not interact with any local server.

It would pure HTML5 + JavaScript based client web app which would be packaged, and can be installed or launched from startup scripts.

Or instead of using firefox 3.5 engine, we can use Mozilla Prism to convert it to web app, and then bundle it, is it possible?

Technically it should be possible. Certainly the HTML5 offline applications API (via the manifest) gives you all that ability to create a client side app and it run locally without a web connection.

However, the browser is the problem. Prism might be a good way to deploy this as a standalone app, but I don’t know if Prism is running the latest Gecko engine (or whether that comes with the JS engine, etc) – and even if it does – Firefox 3.5 currently has a pretty severe bug with the offline applications: it doesn’t work!

I have logged the bug with Mozilla and I know they’re working (in fact, I believe they’ve fixed it and are now testing).

The alternative is to use Fluid (a Webkit based app) – but again, that’s only if they have updated to the latest Webkit and thus including the offline applications API (that said, quickly looking at the Fluid site, their in-progress version may have the latest Webkit).

Regarding launch from start up scripts – you could achieve this though the custom scheme handlers (but this is just Firefox IIRC): http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#custom-handlers

Equally, there may be an API that you could exploit via the standalone browser, either Prism or Fluid.

— Good luck! Remy

MIME or DOCTYPE, which one prevails

Pedro Estébanez asked:

Hello doctor,

I have found this site a very good resource for web developers and I thank you for your effort.

Now, my question:

There is a lot of discussion about hot to tell the browser we are using HTML5 or XHTML5 by setting the Content-Type HTTP header. But then I don’t know the true role the DOCTYPE plays (apart from keeping quirks mode from being activated and validation).

For example, if I compose my documents as XHTML with an according DOCTYPE and my server serves them as text/html, why XML mode is not triggered in the browser?

Thanks in advance.

Did you see this article on the site from Bruce? HTML5, XML and XHTML5 and this one from Remy HTML5 Boilerplates.

Also see this (linked in Bruce’s article) for some advice on using the right mime type. http://www.webstandards.org/learn/articles/askw3c/sep2003/.

— Cheers Rich

Outline Algorithm

Mike Taylor asked:

In Section 4.4.11.1 of the current HTML5 spec, the outline algorithm is described–yet it’s not super clear in what ways this is useful to users or developers. It would be great if some more light could be shed on the topic!

Thanks for the awesome blog, btw.

The outliner basically allows you to easily see the heading structure of a site. The outline can then figure out from the heading structure where in the outline it should sit, should you want to only parse a section of the code into another site or page for example. (I realise this isn’t totally clear). Also check out the HTML5 Outliner for checking your work.

Bruce covered it a little bit in his section article – “With very few exceptions, section should not be used if there is no natural heading for it. Check your work in the HTML 5 outiner tool. If you see any instances of “untitled section” that corresponds to a section, you’re probably doing it wrong. (It’s fine for a nav or aside element to be untitled, however).”

We’ll try and cover it in more detail in a future post but I hope this helps for now, Rich.

HTML5 and xmlns

Ad Taylor asked:

I hope this isn’t a stupid question BUT …

If I am using the html5 DOCTYPE and I am still using xhtml syntax do I need to define the xmlns in the html tag (i.e. xmlns=”http://www.w3.org/1999/xhtml”)?

Thank you for taking the time to do this.

We said, Not a stupid question, but a simple answer: No!

— Ta Bruce (HTML5 Shrink)

Developing to a changing spec

Sam Rayner asked:

I read the Super Friends Guide to HTML5 Hiccups – http://www.zeldman.com/superfriends/guide/ and it’s worried me a little.

I’ve recently been developing personal projects using HTML5 as I find I learn best ‘on the job’ and wish to become familiar with the new spec by putting it in to practice. However, it sounds like I’ve misinterpreted bits and often used new elements such as footer in the way the Super Friends describe rather than in line with the spec.

I really want to continue enjoying the benefits of HTML5 in my own non-critical web work but it seems I run the risk of having to return to it all at a later date and amend stuff due to changes in the spec.

What do you think the best course of action is? Continue with 5 but keep going back and fixing old projects? – Could become a real hassle.

Continue with 5 and leave non-visual discrepancies as they are (the code may be slightly off but it’s styled fine)? – Goes against all of my natural instincts to do things right.

Return to 4 and use class names as apposed to the new elements for the time being?

I realise this is the risk I take developing with a developing spec but I’m worried if I wait until everything is set in stone I’ll still be using HTML4 years from now!

Thanks a lot,

I understand your concerns with the spec changing from day to day. It’s hard to keep up with (there’s 6 of us and that’s tough enough).

Although I’m sure you’re aware in footers case, its content model has now been changed to allow it to act more like header.

I think essentially you have three choices for your development or a combination of the below currently:

Continue working as you are with new HTML5 elements and change them as the spec becomes more defined
Use HTML4, with HTML5 class names (as you suggested)
Use only the simplified doctype and those elements that will only be benificial in the future or add progressive enchancement (e.g. inline elements such as time.)

Its going to be a while until we can use HTML5 in development projects but in my opinion there isn’t any reason to not use it on personal projects now. You have to judge it on a case by case basis, but whichever parts you do you will be futureproofed to some extent.

— Cheers Rich

HTML5 and Browser Compatibility

A lot of people ask this type of question regularly so here’s a few links that we think are useful.

That about wraps up this round of questions, we’ll be publishing more soon, but in the meantime don’t be afraid to keep asking the doctor about HTML5.

Share and Save:

Your Questions Answered #3 originally appeared on HTML5 Doctor on October 22, 2009.

2022, or when will HTML 5 be ready?

Remy Sharp — Tue, 21 Jul 2009 14:19:00 +0000

Aside from being the year Queen Elizabeth II will celebrate her Platinum Jubilee, assuming she’s still kicking around, 2022 is the year that’s been inappropriate linked with HTML 5 in the minds of a lot of our community.

I understand why someone might think that, but it’s wrong. 2022 was misinterpreted as the year HTML 5 would be ready. That’s wrong. HTML 5 is ready today.

In an interview by Tech Republic, for a techie audience, Ian Hickson, the editor of the HTML 5 working draft, was asked to give a timeline of the HTML 5 recommendation.

One date should have come out of that interview, but another, much further away did instead: 2022 – the date of the final proposed recommendation, which actually translates to:

require at least two browsers to completely pass [HTML 5 test suites]

Let’s put this in context of another spec that has taken a very long time: CSS 2.1.

CSS 2.1 is CSS that I’m certain you’re familiar with. I’m certain you use it day to day without any thought as to whether it’s a completed spec.

It’s been in development for over 10 years, and it’s only just become a candidate recommendation (23rd April 2009).

That said, it doesn’t have two browsers completely supporting it. Only Internet Explorer 8 supports the full CSS 2.1 spec.

Did that stop you from using CSS 2.1? I suspect not. Will that stop us from using HTML 5? It certainly shouldn’t. HTML 5 is available and ready to be used today.

What is the important HTML 5 date?

October 2009.

This October is the last call for the HTML 5 working draft.

That means, that issues with the spec, enhancements, bugs, anything, it all needs to be in and submitted and written in to the spec for October this year (it can go through reiterations, the this is the main deadline).

The WHATWG is completely open for anyone to contribute their ideas and suggestions.

You can sign up to the mailing lists, look through the backlog of mailing list. You can communicate directly using IRC and there’s even a complete log of all the IRC history. All available from http://whatwg.org.

Share and Save:

2022, or when will HTML 5 be ready? originally appeared on HTML5 Doctor on July 21, 2009.

HTML5 Doctor » Quick Tips

HTML5 Doctor Glossary

Related Posts:

Your Questions Answered #3

Multiple use of tags

HTML5 + Javascript Client Web App

MIME or DOCTYPE, which one prevails

Outline Algorithm

HTML5 and xmlns

Developing to a changing spec

HTML5 and Browser Compatibility

Related Posts:

2022, or when will HTML 5 be ready?

What is the important HTML 5 date?

Related Posts: