Category: WebStandards

Web Patterns

John Allsopp of West Civ fame has a thoughtful article suggesting that work needs to begin in an organized way on the idea of web patterns. dog or higher: WebPatterns and WebSemantics is his initial post on the topic. He’s also starting a site on the topic at webpatterns.org.

Here’s an excerpt: “In a nutshell, a pattern describes a problem which occurs over and over again … and then describes the core of the solution to that problem, in such a way that you can use this solution a million times over, without ever doing it the same way twice (my emphasis).

“The essence of a pattern is that it articulates a problem, then considers how that problem might be solved. It does not dictate a single solution, rather, a strategy for solving the problem.

“The idea has been taken up in a number of computer related fields, most famously in object oriented analysis and design, the seminal work there being Design Patterns Elements of Reusable Object-Oriented Software, by "the gang of four" – Gamma, Helm, Johnson and Vlissides. In this context, Brad Appleton observed, Fundamental to any science or engineering discipline is a common vocabulary for expressing its concepts, and a language for relating them together.
This really struck a chord with me. Can web design and development today rightly be called a discipline? Or is it, as I suspect, a practice in the process of becoming a discipline. If we consider Appleton’s observation, do we have a common vocabulary for expressing [our] concepts, and a language for relating them together? We certainly have technologies like HTML and CSS (though we still struggle to even use the terms "tag", "attribute" and "element" correctly – I’m still hearing "alt tag" frequently in my travels). But what about higher order, more complex structures and strategies? What do we call the parts of a page we use over and over again? What names do we have for particular navigation strategies (such as hierarchical trees, linear progressions through sections, and so on)? My survey, as well as a more detailed, though much more narrowly focussed one by Francois Briatte suggest that while it’s clear that there are many structures we use over and over again, we lack that common vocabulary to talk about these structures, and to relate them to one another.

“In short, we lack a pattern language for the web.”

Standards Advice for Dreamweaver 8

Macromedia – Dreamweaver 8 Accessibility is an article on the Macromedia site that explains a few points about making data tables accessible with captions, summaries, and headers.

After using Dreamweaver 8 for a while, I can also guarantee that all the ideas I explained in Achieve Accessibility with Dreamweaver that used MX 2004 as examples still work in exactly the same way in Dreamweaver 8.

One is enough

Business and the world are changing fast. High tech has been the impetus for this and serves as a model for rapid adaptation. The music business, the long distance business, the mail order business, the broadcasting business, the publishing business: there are many examples of business models that have radically altered in the last few years. Not all the changes have been easy for business or even wanted by business. Some companies have dragged themselves kicking and screaming into new ways of doing things.

All it takes is one successful effort. One site successfully and legally selling songs for 99 cents is all it takes. One long and demanding waiting list for hybred cars is all it takes. One overwhelming response to a political fund-raising website is all it takes. Change follows.

I’ve talked about Cradle to Cradle: Remaking the Way We Make Things before. One of the stories in this book is about a Ford Motors plant where they planted grass on the roof, opened the windows for fresh air on the assembly room floor, and discovered that they not only saved a bundle on energy but had better productivity and happier employees. I notice that Ford is the only American auto manufacturer willing to make the leap into hybred techology. If they are successful, change will follow.

There are businesses that resist change and don’t seem capable of looking for new ways of doing things. The oil companies seem to fit that category. It is as if oil companies don’t breathe the same air or drink the same water that everyone else on the planet does. It is as if oil companies have no emotional intelligence. Remember the book Emotional Intelligence : Why It Can Matter More Than IQ from 1997? One of the stories in this book was about how researchers set out a treat (for the sake of argument, we’ll say it was a marshmallow) for a child. Then they told the child that they were leaving the room for a minute and if the child would wait until they came back there would be more marshmallows. Or they could eat the marshmallow immediately. If they chose to grab the one there now, there would be no more later on. The researchers considered it a sign of emotional maturity for the child to wait for the promised marshmallows instead of grabbing the one that was immediately available. Oil companies seem to want that marshmallow right now, and the future is forgotten.

Somehow we have to show these folks the way. All it would take to help the oil companies out of this immature attachment to a brain-dead business model is one successful gas station with a pump dispensing biofuel and a line down the street of eager customers. All it would take is one energy company selling fuel made from soybeans from Missouri to be more profitable than an energy company selling oil made from petroleum drilled in the Middle East. All it would take is booming sales of energy efficient cars or energy efficient homes or energy efficient applicances. If business can’t exercise the emotional maturity to do something because if is right and good for the population in general, we have to win them over with success.

A new book is In Their Time: The Greatest Business Leaders of the Twentieth Century. This book talks about contextual intelligence, or the ability to understand the period in which you live and exploit its opportunities. Here’s an example. I sometimes drive across Texas from San Antonio to El Paso through the heart of nowhere on Highway 10. My XM radio works fine the whole trip. My Sprint phone service is spotty at best. Should my car break down in the middle of the south Texas desert, would I want to listen to music or phone for help? That’s a failed opportunity. One successful phone service that works everywhere is all it will take to change things. What is that one thing: VOIP, wireless-everything-everywhere? Whatever it is, it’s coming from some company with the contextual intelligence to figure out what’s needed and provide it.

The petroleum industry, the boxcar-sized auto makers, these are businesses that don’t show much contextual intelligence. They are like politicians who shoot themselves in the foot by making statements like "the Geneva Convention only applies to them, not to us." Leaders with such a startling lack of contextual and emotional intelligence are doomed to failure. Grabbing for that one visible marshmallow while refusing to turn just slightly to the side to consider other ideas is not successful problem solving behavior. Clinging to an old and harmful paradigm is like diving over a cliff along with the other lemmings running beside you. Stop and look for that one new way, just one, that will work and be a change for the better.

Accessibility, CSS, standards: these ideas are not harder and more expensive to implement. They are current best practices and should be taught as such. But once you’ve finally figured them out, don’t insist that they are the only way, because that one new thing may come along and stand the web design world on its head at any moment.

W3C updates Web Content Accessiblity Guidelines (WCAG)

Web Content Accessibility Guidelines 2.0: “Web Content Accessibility Guidelines 2.0 (WCAG 2.0) covers a wide range of issues and recommendations for making Web content more accessible. This document contains principles, guidelines, success criteria, benefits, and examples that define and explain the requirements for making Web-based information and applications accessible. ‘Accessible’ means to a wide range of people with disabilities, including blindness and low vision, deafness and hearing loss, learning difficulties, cognitive limitations, limited movement, speech difficulties, and others. Following these guidelines will also make your Web content more accessible to the vast majority of users, including older users. It will also enable people to access Web content using many different devices – including a wide variety of assistive technology.”

Related information for this updated working draft includes HTML Techniques for WCAG 2.0 and CSS Techniques for WCAG 2.0

Why colleges should stop teaching Fireworks as a primary web design tool

Here’s a recurring scenario in my life. Someone who took some college classes to learn to make web sites has decided to try to implement CSS and to make their sites accessible. The classes taught them to make web sites by using Fireworks to slice an image and to export the resulting table-based HTML to Dreamweaver. Now this person, who–I admit–does beautiful graphics in Fireworks, comes to me or to some discussion list I participate in and asks for help in making their Fireworks generated HTML work with CSS or fulfill some accessibility need. This question is like asking how to get a tricycle to go from zero to 60 in under 6 seconds—it demonstrates a gap in the basic knowledge of what is involved.

Some college has given this poor person a difficult handicap to overcome. That handicap is the belief that what they are doing is a best practice that will adapt to every requirement. Yes, Fireworks can generate HTML. No, learning to generate HTML with Fireworks is not the best way to learn to make web sites.

In terms of best practice, students should be learning how to structure an HTML document intelligently so that it can be presented with CSS based enhancements (including, perhaps, lovely images created in Fireworks). An intelligently structured HTML document can adapt to every requirement: CSS/accessibility for screen, print, handheld, etc.

A sliced image exported from Fireworks as a table full of empty cells, spacer gifs, images and almost no text is not the web design solution that some college classes lead students to believe it is. Classes should teach HTML, CSS, and then how to apply that knowledge with a tool like Dreamweaver.

Fireworks does have its place: to create graphics. It should be taught as a graphics design tool, not as a web design tool. Students who use Fireworks to create exportable HTML should know how to adapt it in Dreamweaver to make it meet their other requirements.

There are many options available to an instructor who wants to teach students to think in terms of building structure with HTML that will support CSS and accessibility. My own book is written in these terms, and other books I have reviewed here such as Web Standards Solutions by Dan Cederholm are as well.