Accessibility, Microformats, and rule by mob

Recovered from the Wayback Machine.

Bob DuCharme has a guest post by the Chief Technology Strategist for the Commonwealth of Massachusetts, Sarah Bourne, on accessibility issues associated with microformats. She mentions both the abbr and include design patterns that others, most commonly Joe Clark, have brought up in the past.

Ms. Bourne also has an interesting note to make on the nature of the microformat effort:

I suspect that the problems with microformats lie in the fact that they are being developed by a voluntary group instead of an established standards body. The community structure certainly leads to quicker decisions, but they are not as well vetted with a broader audience. Conflicts may not appear until their decisions have been put into practice.

Standards by general consensus rarely works out. For instance, the HTML5 working group has 504 members. How the heck can you get anything accomplished when you have 504 members? What happens with a group this size is either nothing happens, or a few of the more vocal, and assertive, members end up dominating the group–in which case you don’t really have a standards working group: you have George and Jane, and the backup singers.

Update Ms. Bourne actually linked to Isofarro not Joe Clark. Isofarro features Joe’s micropatronage badge prominently in the header. I thought the site was Joe’s once, myself.


The incredible, scalable SVG

Recovered from the Wayback Machine.

One of the advantages of SVG over some other graphics capability is the fact that SVG is vector-based. A vector graphic means that images are created via *recorded mathematical primitives (circle, line, square, etc.) rather than based on fixed pixels. Because SVG is a vector graphic, the same image can be sized very small or very large and remain crisp and bright regardless of the size. Typically the image has a smaller file size, too.

This doesn’t seem like a big deal if the image is placed in a weblog post, and statically sized. My own use of SVG at this site is statically sized and I could just as easily use JPEGs or PNGs, other than the fact that I recreate the images based on the header graphic. However, over at the main Burningbird site, I’m experimenting around with using SVG as a resizable background element, and it’s this use that truly demonstrates why SVG can be such an advantage over bitmap images.

Consider computer monitors and the problems we’ve always had about differing monitor sizes. Either our content seems to extend beyond the edges of the browser, generating a horizontal scroll bar. Or it’s a skinny little bar in the midst of a vast expanse of blank space. Even if we use a background image and repeat it, we still end up with a mind numbing expanse of *nothing*.

As an alternative to the static, repeating background image, I used an SVG image I found at the Open Clip Art site, sized dynamically in the background, and statically in both the header and footer. For the background image, attributes on the SVG element provide further instructions in how the image is resized, and whether to maintain perspective or to have the image fill the given space. Right now, I have turned off the perspective, and the result is interesting when viewed in different sized windows.

Providing a dynamically sized background image is a fairly new use for SVG, so it’s not without challenges. Opera on the Mac has problems with the resizing, as well as the gradients used in the image; Safari has problems with the gradient, though Webkit works nicely. However, I originally tried this approach using an external SVG file, incorporated into the page using the object element, but WebKit had problems with the object element. At this time, Firefox 3b3 is the only browser that manages both the gradient and the sizing, in addition to SVG inline or linked externally. I expect, though, that all three–Safari, Opera, and Firefox–will do well with using SVG for a background image in their next released versions.

As for IE, the entire site shows up primarily in black and white. The site is so plain, in fact, that I have a link labeled, “Why is this page so plain”, to a page explaining my use of SVG that only shows up when the site is accessed by IE. As I’ll be incorporating SVG into all of my sites, I’ll be continuing my “B&W” support for IE to all the sites, rather than restrict access with the XHTML MIME type, as I originally did with this site.

Apple announced that it will be supporting SVG in the version 2.0 of the iPhone SDK because, according to a story on the topic, SVG is a resolution-independent image format that is highly compressible. The three variations of the same image at Burningbird demonstrate the resolution independence, with the image looking good in the site footer, the larger header image, and the potentially very large background.

Once I’ve debugged why the image isn’t loading using the object element in Safari/Webkit, I could use one external gzipped SVG file, and eliminate most of the size constraints. The only restriction with using an external SVG file is that using the object element for the background can cause some odd behavior with IE. In addition, from a drawing performance perspective, I also found the inline SVG to be the best of the two options.

Eventually, though not implemented in any browser that I’ve been able to see, we’ll be able to set the SVG background using the CSS background-image attribute. This just adds to the intriguing possibilities. update This functionality is implemented with Opera 9.5, as demonstrated in this example.

*Bonus material: a detailed instruction video from Nortel on the differences between raster and vector graphics. This is an older video, though. Support for SVG has increased, both with editing tools and with browsers. Other video formats and image lessons from the Nortel LearniT page.

Update I’m just playing around with this pattern, I’m aware that not all browsers are processing it correctly. This gave me a chance to do a little browser testing and also have a little fun with color. We’ve had so much cold and snow that I was desperate for a little color.

Burningbird Specs

IE8, XHTML, and what am I going to do with my site?

Recovered from the Wayback Machine.

I thought it interesting and even odd how few people have remarked on the fact that Ray Ozzie began the opening keynote of a conference focused specifically at developers by talking about ads.

My source for things geek, Planet Intertwingly, has had very few entries devoted to IE8. I imagine people either don’t care or are trying things out. Or perhaps they’re at ETech or on their way to SxSW. What a way to filter your audience: schedule the conferences at the same time. What sad irony that Ozzie next spoke of the Yahoo deal, as Yahoo itself was launching its latest, greatest tech initiative, which was then overshadowed by Microsoft’s rolling out of the IE8 public beta.

Not to be outdone, Apple has something today probably about its SDK. All we’re missing is something from Adobe, but it preferred to dance alone.

To return to IE8. One doesn’t have to tax one’s imagination to read the purpose behind the ‘advances’ in IE8. All of the new functionality is focused on Microsoft’s new “cloud” agenda, including client data storage support for offline working, and back button navigation. According to the “readiness” document I linked yesterday:

Internet Explorer 8 provides a simplified yet powerful programming model for AJAX development that spans browser, webpage, and server interaction. As a result, it is easier for you to build webpages that have much better end-user experiences, are more functional, and have better performance. APIs are based on the W3C HTML 5.0 or Web Applications Working Group standards. Enhancements or novel intellectual property for AJAX will be made available for standardization before the Internet Explorer 8 release.

The thing is, HTML5 is most definitely a work in progress. What Microsoft has done is cherry picked what it wanted, implemented it, threw in its own stuff and then glossed it over by either attaching it’s own bizarre “open source” license, or tossed the non-critical bits into the public domain.

The proprietary bits aside, it is typical for vendors to start implementing standards before they’re finalized, as a test and a validation. Just as typically, though, the other members of the standards group are usually aware of such plans. I am curious to hear what other members of the HTML5 working group think of IE8 and the HTML5 bits.

As for me, not hard to see that I’m unhappy. I have a choice now: do I continue to serve this site using the XHTML MIME type, in which case it will never be accessible by IE (because I now believe Microsoft will never support the XHTML MIME type); or do I “break” my site by adding back content negotiation?

I wrote previously that I had a plan I was going to implement if Microsoft didn’t support XHTML with IE8. In the back of my mind, I really thought the company would. Not to do so is the company saying that, for all its talk about standards and openness, it will implement only those standards that support its own agenda, and no others. While I expected this attitude, I didn’t expect Microsoft to be so obvious about it.

I really didn’t expect Microsoft to blow off XHTML, and now that it has, I have some work to do on my sites to follow through on my fallback plan. I’m not doing anything earth shattering, or probably all that interesting to most folks (since, seemingly, standards take a back seat to ads for today’s new web developer). I’m just dealing with the situation.

I’m also investigating Drupal, as a content tool–either alone or perhaps with WordPress. I’ve been interested in Drupal since I started looking through the site and the code base. I became more interested when Maki mentioned the SVG Toolkit for Drupal, and Elaine talked about how improved it is. Then Ian Davis at Nodalities mentioned Drupal’s RDF and semantic web commitment yesterday, and that’s all she wrote for me.

The Drupal folks seem more committed to supporting standards, all standards, than the WordPress folk. And when I read something about Drupal, I read about the technology; I don’t read about ads or mergers. This focus on technology appeals to me right now.