|
Fretting over PowerPoint's HTML conversions a few years back, I threatened
to write an add-in that did it better. The "One True Way" PowerPoint offered
was nothing like the way I was after, and it really annoyed me that there were
so few user options. The annoyance passed, I got distracted by something else
and nothing came of it. Then I heard Tom Wlodkowski* speak about designing web
sites for blind users. His message was simple. In a nutshell, it was this:
- The web opened up a new world for computer users with vision problems.
They could shop, bank and do dozens of other things for themselves on the
web where before they might have needed to rely on a friend or family member.
- The doors suddenly slammed shut again when the web turned into a graphical
multimedia flash and JavaScript-driven extravaganza. It became all but inaccessible
to users who rely on screen readers and other similar assistive devices. A
web page that's nothing but an image or flash animation may as well be a blank
page to screen reader users. There's nothing for a screen reader to read,
and the user is rudely locked out.
- Locking people out isn't smart. It frustrates potential customers. It could
get you into legal hot water. And the real topper? It's not all that difficult
to make a site accessible—without compromising its appearance to sighted
visitors.
All of this started me thinking about PowerPoint's HTML again and how to make
it accessible to screen reader users. When it came, the "AHA!" lit
up the way to a totally unexpected solution: a conversion tool that writes little
or no HTML at all!
Does this sound a little too Zen-like for words? "To make good HTML, Cricket,
you must not make HTML at all."
While PPT2HTML (the name of the tool) creates little or no HTML on its
own, it uses existing HTML files as templates and does two things:
- It extracts information from a PowerPoint presentation
- It inserts that information into an HTML template and, in effect, "merge-prints"
a series of web pages
Rather than forcing any particular "look" on the user's web pages,
PPT2HTML lets the user define the look in a template file, which looks a lot
like a normal HTML file, but uses special placeholders—"merge fields"
if you will—to tell PPT2HTML where to insert the data it extracts from
PowerPoint presentations.
An example template tells the story better:
<html>
<head>
<title>:Prefs.PageTitle:</title>
</head>
<body>
:Nav.Map:
<center><IMG SRC=":Slide.Image:"
WIDTH=:Slide.Image.Width:" border="NO"></center>
</body>
</html>
Now let's look at that line by line. The first couple lines are the basic HTML
headers that every HTML page begins with, but then there's this:
<title>:Prefs.PageTitle:</title>
This sets the Page Title that appears in the browser's title bar. This changes
with each presentation, so rather than hard-coding a literal value, we use a
placeholder:
:Prefs.PageTitle:
When it writes the HTML, PPT2HTML replaces :Prefs.PageTitle: with the
Page Title the user typed in the Preferences dialog. This way, many presentations
can be converted using the same template file. There's no need to edit the template
to change the page title each time.
The </head> and <body> tags are standard HTML.
:Nav.Map:
We want action buttons in the original PowerPoint presentation to become clickable
links in the HTML version, so we include the :Nav.Map: placeholder. :Nav.Map:
tells PPT2HTML to make the slide image a clickable image map and to make each
action button in the presentation a live HTML clickable link to the appropriate
HTML page.
<center><IMG SRC=":Slide.Image:" WIDTH=:Slide.Image.Width:
BORDER="NO"></center>
We want the slide image centered, so we surrounded it with CENTER tags.
The image tag itself is normal HTML, but instead of a hard-coded image file
name, we use the :Slide.Image: placeholder. PPT2HTML optionally exports
an image of each slide in the presentation and substitutes the name of the image
file for the :Slide.Image: placeholder.
PPT2HTML lets the user choose the image width in its Preferences dialog box.
We could supply a specific image width here, but instead we use the :Slide.Image.Width:
placeholder. PPT2HTML substitutes the image width the user chose in Preferences.
Again, this allows the user to pick appropriate settings for each presentation
they convert without having to edit their templates.
Some browsers add a border around images that have a clickable image map attached.
To prevent that, we specifed BORDER="NO".
This particular template would make very plain-looking web pages from PowerPoint
presentations, but the user can add whatever additional HTML features they like
to it. PPT2HTML simply takes whatever HTML it's handed, subsitutes "live"
info and images from the PPT file wherever it finds placeholders, then outputs
one HTML page for each slide in the presentation (or the range of slides the
user has asked it to convert).
You've probably noticed a hitch here. The PowerPoint content has been converted
to an image. Doesn't that make the pages inaccessible? It does. That's why PPT2HTML
has a lot more placeholders we can work with. Here's an example of a template
that produces much more accessible pages:
<html>
<head>
<title>:Prefs.PageTitle:</title>
</head>
<body>
<center>
<H1>:Slide.Ph.TitleText:</H1>
<p>Slide :Slide.Number: of :File.TotalSlides:</p>
</center>
<hr>
<center><H2>:Slide.Ph.SubtitleText:</H2></center>
<font size="4">:Slide.Ph.BodyText1_AsBullets.HTML:</font>
<hr>
<center>
<table>
<tr>
<td><center>:Nav.NextOrNothing.HTML:</center></td>
<td> </td>
<td> </td>
<td><center>:Nav.LinksToAll:</center></td>
<td> </td>
<td><center>:Nav.PreviousOrNothing.HTML:</center></td>
<td> </td>
<td><center><A
accesskey="H" HREF=":Prefs.Homepage:">PPT2HTML Sample
Conversions page</A></center></td>
</tr>
</table>
</center>
</body>
</html>
And now, the line by line explanation (with basic HTML omitted):
<title>:Prefs.PageTitle:</title>
Page Title as explained earlier.
<H1>:Slide.Ph.TitleText:</H1>
PPT2HTML substitutes the slide's title text for the :Slide.Ph.TitleText:
placeholder. The HTML code above makes it an HTML H1 headline and centers it.
<p>Slide :Slide.Number: of :File.TotalSlides:</p>
Screen reader users may appreciate extra navigational aids to help them determine
where they are in the presentation. Using the :Slide.Number: and :File.TotalSlides:
placeholders here produces text like "Slide 1 of 8" in the
HTML. The screen reader reads this aloud right after it reads the slide title
text.
<center><H2>:Slide.Ph.SubtitleText:</H2></center>
<font size="4">:Slide.Ph.BodyText1_AsBullets.HTML:</font>
Here, we use placeholders for both the slide's Subtitle and its Body Text.
It may seem odd to ask for both in one HTML page, but since PowerPoint slides
can have either a subtitle or body text but not both, and since PPT2HTML blanks
out any placeholders it can't "fill" with data from the presentation,
this bit of trickery is the equivalent of code that says:
If this is a title slide layout and this slide has a subtitle then put the
subtitle here
If this is not a title slide and it has body text, then put the body text
here
Using :Slide.Ph.BodyText1_AsBullets.HTML: instead of one of the other
body text placeholders forces PPT2HTML to format the body text as HTML text,
complete with different levels of bullet indents.
Next, we begin a table to hold the text-only navigation aids we're about to
add
<td><center>:Nav.NextOrNothing.HTML:</center></td>
The first cell of the table is a link to the next slide in the presentation,
but it becomes blank if we're on the last slide in the presentation (ie, there
IS no next slide). The :Nav.NextOrNothing: placeholder does this automatically.
There are several other placeholders that produce slight variants on this.
<td><center>:Nav.LinksToAll:</center></td>
:Nav.LinksToAll: produces a list of slide numbers, one for each slide
in the presentation. Each displays as a link to the corresponding HTML version
of the slide.
In other words, you'd get "1 2 3 4 5" and could click on "5"
to go to Slide 5.
:Nav.PreviousOrNothing.HTML: is like :Nav.NextOrNothing.HTML:
except it goes to the previous, rather than the next slide.
PPT2HTML replaces :Prefs.Homepage: with the Home Page URL specified
in the Preferences dialog.
Accesskey="H" allows the user to press Alt+H+Enter to activate the
link without having to locate it manually. By using different placeholders for
the Next and Previous links, we could also supply access keys for these.
The <hr> and font tags are simply there to spruce up the page a bit for
sighted users.
These examples should give you a flavor of how PPT2HTML works. You can see
more template examples, sample PPT2HTML conversions and examples of all of PPT2HTML's
placeholders at http://www.rdpslides.com/ppt2html/.
* Tom Wlodkowski is Project Director of the Access to Convergent Media Project
at National Center for Accessible Media.
http://ncam.wgbh.org
For links to sites with accessibility information:
http://www.rdpslides.com/webresources/
(see the Accessibility section)
Download a free working demo of PPT2THML:
http://get.pptools.com
|
