Explaining web standards using Microsoft Word

Screenshot from MS Word: Content to be formatted in MS Word

Recently, while training a group of content authors on writing for the web, I had to explain the difference between appearance and semantics. The authors were not techies, so I wanted to avoid talking about HTML, web standards and anything else with a strong eye-glazing potential. That’s when I turned to Microsoft Word…

When is a heading, not a heading?

First off, I wanted to structure my text a little better for better scannability. One approach is to simply change the size of the text using the font size menu in MS Word.

Screenshot from MS Word: Changing the font size of text to make it appear like a heading.

Consequently, when trying to create a table of contents, Word throws an error, “Error! No table of contents entries found”. Why? While the the headings certainly look like headings. In fact, there is no inherent meaning that Word can infer and as a result can’t build a table of contents.

Screenshot from MS Word: Error in creating table of contents as there are no real headings in the content.

Semantics versus appearance

There is an alternative approach to just increasing the font size. We can assign what’s called a style to the text instead.

Screenshot from MS Word: Assigning a heading rather than changing the font size

By using the style menu to apply a “Heading” style to the text, we are giving it meaning, thus allowing Word to build a table of contents successfully.

Screenshot from MS Word: Word can interpret the meaning of headings and thus build a table of contents.

And that’s web standards without having to mention XHTML or CSS once! What about you, how do you make the complex simple?

2 Comments

  1. Ehh, thats a bit freaky, thats the

    *exact* example I used in my 6 lecture HTML/CSS course for Biology students who use MS Word.

    Heres 2 slides, I can’t publicise the course, technically the college owns the material.

    http://www.destraynor.com/images/slidea.png

    http://www.destraynor.com/images/slideb.png

  2. Get outta town, Des! That’s very interesting indeed.

    It’s an example that, IMHO, really holds resonance with people who don’t have a HTML background yet contribute web content via a content management system.

    Most are familiar with Word and can easily identify with this example, at least more so than h1 and font tags!

    My approach is to tell the participants that in addition to their day jobs, if they are contributing content to their organisation’s website, then they are also web professionals.

    The content that they contribute collectively reflects how their site is judged so structure is really really important.

    Hope you made this morning’s lecture on time!