Pagespinner 4.6.3: Quirky and erratic

Pagespinner 4.6.3 is quirky and erratic. While Pagespinner allows its users to create the kind of basic, accessible web page this series has been aiming for, it doesn’t make it very easy, and it sometimes work against the user. My quest continues. [First published November 2006.]

I am on a quest to find freeware or shareware applications that are capable of creating accessible web pages. Web professionals need to know a lot to create truly accessible sites to the strictest levels of compliance, but I’m interested in the ordinary user.

I want to know whether these applications allow ordinary folk to achieve basic tasks such as adding alternate text to an image, marking up paragraphs, headings and lists with the correct HTML tags, and using a good title for the page. These are the sorts of common things anyone creating a web page, at whatever level, should be able to do. And they shouldn’t have to fight the software to do it.

Pagespinner

Pagespinner costs US$29.95. It works with Mac OS X 10.2, 10.3, 10.4 / Mac OS 9.1 and higher. Version 5 has been announced and supports Intel Macs. The PageSpinner package can be used free for up to 21 days to try it out.

The Process

I opened Pagespinner and chose a New Empty HTML Page from the Starting Points dialog box. Pagespinner created a new HTML 4 page with a relevant Doctype and head tags, and the cursor ready in the body portion of the page.

Aside: I was on my third or fourth visit to the Starting Points before I noticed that the button is actually labelled ‘New Emtpy HTML Page’. I wonder how long that typo has been there?

I pasted in a few paragraphs of text and clicked the Live Preview button. As expected, my text had all run together as it wasn’t marked up with paragraph tags.

Paragraphs

It was easy enough to select each paragraph in turn and add p tags, either using the default Command Return keystroke or the Toolbar button or menu item.

Another option was to select the text, choose Edit > Convert > Text to HTML… and then to choose between various combinations of paragraph and break tags.

It’s an interesting quirk that when entering text by typing you can use Command Return to create new paragraph tags as you type, but the new tags are created at the cursor. If your cursor is already inside an existing paragraph tag then an invalid nest of tags is created. You must either press the arrow key 4 times or click to move outside the existing closing tag.

This makes the shortcut almost useless. It would be a nice feature if the software could figure out where you were and what you were doing and allow you to just type fluidly, creating correct paragraph tags as you typed.

Character Encoding

The default character encoding seems to be iso-8859-1. I prefer UTF-8, but was unable to find any way at all to set Pagespinner to use it. If I used the New Page Assistant I could type in UTF-8 and Pagespinner would remember it for the session, but that memory would not survive restarting the application. The only other choice built in to Pagespinner is SHIFT-JIS.

Headings

Next I added a heading and came across a stumbling block: how to mark it up from the available tools. Finally I found it in the last place I’d think to look: under a Size menu.

It’s been many years since I saw any strong connection between heading level and size — that’s truly old-fashioned thinking. Thanks to stylesheets we can make any level heading appear however we want it: big, small, green. While the size of a heading may reduce as its importance diminishes, these days it’s arguably more common that we’ll use similar sizes for the lesser headings and use color, font or a style such as italics to distinguish heading levels.

I’d certainly expect to be able to assign headings from a toolbar button, but there isn’t one. There is a button on the Toolbar to call up the HTML Assistant where you can make numerous choices, including selecting headers of various levels, but it’s long-winded for something that should be simple.

Emphasis

On the other hand, the Toolbar has the now rather redundant buttons for bold and italics. Under General Preferences it’s easy to set the bold and italics buttons to enter strong and em tags, enhancing their usefulness.

Lists

Adding a list was interesting: I added a few list items, selected them and clicked the List button on the toolbar. Each list item was correctly marked up with li tags, but the list tag itself (probably ul or ol) wasn’t added. To add the list tags I had to select my text and use the List topic in the HTML Assistant. Making a list is therefore a two-step procedure, with the commands you need in two very different places. Odd.

At least I was able to create my properly marked-up list.

There is an option in the Preferences to enable a List menu, but a list remains a two-step procedure. Moreover, Pagespinner happily marks up empty lines with list item tags, creating empty bullet points in the output.

As a web professional I hand code my pages, using a text editor and downloaded or homegrown AppleScripts to help. Perhaps I’m spoiled that my scripts remove empty lines from a list, but if I can do it with a small AppleScript then software people are paying for should certainly do it.

Photos

Next up was adding a photo. When I clicked the Toolbar button the HTML Assistant dialog box appeared. It was easy to browse for my image, set various attributes and Insert the image. Unfortunately, Pagespinner was happy to allow me to insert my picture without entering anything in the Text description text box. The resulting code also didn’t include the empty alt tag that might be appropriate in this circumstance.

When I undid the insertion, added alt text and clicked Insert, the alt text appeared as expected.

Not every image requires a text equivalent, but every image does require alt text. It’s simply a matter of what you choose to enter: sometimes a description of the image, sometimes wording reflecting the function of the image, sometimes a space or a ‘null’ string, ie, no text. The alt text attribute however must not be omitted.

Pagespinner needs to handle this differently.

Good alt text

Alt text is also not the same as a ‘text description’ and it doesn’t actually help anyone to equate the two.

If I were writing a page about how to distinguish a cat from a dog I may have photos of both, and the alt text may be appropriately ‘cat’ and ‘dog’ respectively.

If I used those same cat and dog photos simply as decoration, the appropriate alt text may well be ‘ ‘ (a space).

If I used a cat photo as a button for ‘next page’, then appropriate alt text would be ‘next page’, not ‘photo of a cat’. It’s the function of the image that’s crucial. Occasionally that may require describing the image, but often it does not.

Honestly, the best way to really grasp what alt text is and how it needs to work is to spend a day or a week surfing the web with the images turned off (mimicking the experience of a blind visitor, or Google). You’ll soon understand two things:

1. what alt text is and why it’s absolutely necessary,
2. how incredibly frustrating the web can be without correctly marked up images.

What you won’t understand is the experience of the blind visitor. If there is no alt text at all, then a blind visitor often hears the path and filename instead. Here’s a genuine path and filename example from a CMS I use daily:

"/NR/rdonlyres/E1D2C882-5CE3-46A8-950A-6D14EC70FD08/0/david.jpg"

Just imagine listening to that even once or twice per page!

For a truly enlightening experience download the video of Darren Fittler’s presentat
ion at the Webstock conference held in Wellington, May 2006.

Web Accessibility - a user’s perspective Darren Fittler at Webstock. I strongly suggest you choose one of the video formats for best effect.

Miscellaneous Tools

Pagespinner makes it easy to preview the document, with a built-in viewer or in a web browser. This is very handy for seeing how the page is coming along.

The globe in the menu bar is the icon for Web Tools, including several validators. Make a choice and confirm you wish to open the link in your web browser. The Validator’s page opens up and you can proceed from there.

Pagespinner also has an AppleScript menu, with some supplied scripts. You can also create your own scripts and add them to the menu. When I tried the script to paste a text file into an existing XHTML Strict document it stepped me through a sequence of about three operations. The last was to convert the text to HTML. Unfortunately, while Pagespinner added p tags, it didn’t add the closing tags required by XHTML, creating an invalid page.

My conclusion

Pagespinner 4.6.3 is quirky and erratic. Version 5 has been announced and I would hope it’s been substantially overhauled. While Pagespinner allows its users to create the kind of basic, accessible web page this series has been aiming for, it doesn’t make it very easy, and it sometimes work against the user. My quest continues.

Useful links

• Guidelines on alt texts in img elements — The fundamentals: replacement, not description, Jukka “Yucca” Korpela.
• Alt text is an alternative, not a tooltip, Roger Johansson, 456 Berea St.

This article was first published in About This Particular Macintosh in November 2006 and may have been modified from the original.

Popularity: 9% [?]

Confused? You've found you're at KnowIT when you expected to be at TiKouka at MacTips? The blog has been moved over here and you were automatically redirected. Found something broken? Please let me know.