Archive for June, 2008

Goodbye to the static website

Early days of design
When I started designing websites a few years ago, I purchased Dreamweaver and used it to create html pages. I added styling to these pages via CSS, a navigation bar linking all of the pages together and moved the pages to a web server using FTP. Thus, my first client websites came to be. The process worked for the initial project and the clients were happy.

The ongoing relationship
For me though, ongoing relationships with clients was difficult as the more clients I added to my portfolio, the more difficult it became to project my workload due to client requested changes to web pages and requests for new pages. Since I typically moved from one site design to the next, when a change request came in, jumping back in to what I considered a “finished” project was not easy to do. In addition to reviewing the change request and doing the actual work, there were often questions for the website owner and the work often took more time than I projected.

It wasn’t long before I started to react to these maintenance requests somewhat warily and realized why some peers did not offer website maintenance at all. That did not seem like a good solution though as it left a client unfamiliar with web page design without a service provider.

A good website is never finished…
It was then I realized that I was fighting a losing battle and that a good website should never be finished. How then could I continue to design and still make money?

The answer lies in the death of the static website and turning publishing power over to the content provider. Of course not every client wants to update their own content but I made a decision then, that I would only accept work from those who wish to manage this portion of the process. If I am able to provide the site structure, design, initial content load and training, then it seems realistic to expect that the client would be able to update web copy and add pages using the guidelines that were established in the initial design.

The way out
This solution, a content management system, which can be as simple as a wordpress blog or one of the many open source or commercial options available, when properly implemented can give the website owner control of their website while still reaping the benefit of a professionally managed project, design and content structure. From this point forward, I will only offer this type of solution to prospects.

It’s not what you say but how you say it…

One challenge for web designers is convincing a client that less is more when it comes to web content. I have often tried to convey that the desired action on a page should be obvious and conveyed in as few words as possible.

You know what is important but does the visitor?
Web content is typically scanned rather than read. A visitor will come to a page, quickly determine what may be of interest to them and click. To that end, a visual hierarchy - grouping like items and giving the most important items the most visual weight will help ensure that your content is viewed in the intended manner.

Short and sweet
Rather than full pages of copy, web pages should have short snippets of copy between subheadings that give the visitor an indication as to the information that appears within the section. It is better to use lists to display steps in a process, elements in a set or a group of related links. You want to provide a path for a visitor to “convert” as easily as possible (and convert can mean fill out a form, buy a product or add their own content) and not bog down the the visitor with extra words that do not lead to the goal. If you find yourself needing to provide overly detailed directions on how to use a feature, you probably need to revisit your information architecture as it is not delivering the information in the way that the visitor would choose to use it.

Click here?
If a desired action is to have the visitor click on a specific link to start a process or visit some other content, the link should be able to stand on its own and not be understood only within the context of the paragraph in which it appears. Having links stand out by using a different color and underlining will result in a better user experience. Visitors may actually scan a page for links and skip the surrounding text.

Also, people who experience a website via a screen reader scan a page differently than visitor with full vision. Without visual cues, a visitor with low vision will often scan all links on the page and if a link is titled “click here”, it provides little guidance as to the outcome of visiting that link. In contrast, a link with the text “start the undergraduate application process” will leave the visitor in no doubt as to the expected outcome. Also, using title tags on links will help visitors without disabilities gain perspective as to where the link is taking them as when they mouse over the link, the title will be visible.

When you are developing content for the web, I urge you to edit yourself. Write the copy and take a breather. Revisit a short time later and cut out all the words you don’t need. Your website will be better for it!

Don’t make me think!

If you read only one book about web design, it should be Don’t Make Me Think by Steve Krug. It is an easy read and applicable to website owners as well as designers. The book covers the basic principles of what makes a website work: how to designate links, organize content and create a visual hierarchy on a page. By using a significant number of before and after examples, Steve Krug is able to demonstrate how small changes can significantly impact the usability of a web page.

I especially liked the section of the book that covers user testing. Steve shatters the myth that usability testing needs to be expensive, in a sterile lab environment and with a large number of subjects. In fact, Steve suggests only a few users per test (to quickly correct the problems that come to light as a result of the test) and repeating a test often, until all problems are addressed. Steve does not even believe that test subjects need to be from the website’s primary user group, that generally, a test subject can be just an average website user.

As setting expectations with clients can be tough as well as at times needing to prove to clients that you, the designer, do in fact, know what you are doing, why not present each new client with this book at the time of contract signing? It can be a great tool to reference during the design process to help resolve design conflicts between client and designer. The information makes so much sense, it is hard to dispute.

Accessibility, the right thing to do.

I will admit that when I first started designing websites, I did not think about making them accessible to people with disabilities. Of course I did do some things to make my designs accessible without realizing it - using tableless page layout, separating markup (html) from presentation (CSS), using well formed markup including heading tags and identifying images using alt tags - but there was no special effort, just working toward coding using web standards.

When I started reading a bit more about accessibility though, I realized that there was much more to do and that I needed to consider more than those individuals who would experience a website via a screen reader. One must also consider hearing impaired visitors, those who cannot use a mouse (who may use a touch screen or only the keyboard), those who suffer from seizure disorders and those who may only be temporarily disabled.

In addition to it being good business to serve disabled users - they spend more time on the internet per week than a non-disabled users and their discretionary income is at $175 billion and growing, it is just the right thing to do. In America, 1 in 5 people has some sort of disability and 1 in 10 has a severe disability. Having an accessible web opens up much more of the world to people who may be home bound. These individuals can now shop and participate in a variety of social networks. Have you ever considered how satisfying it is for a person with low vision to be able to read the newspaper on their own with the help of a screen reader?

As I enhance my web design skill set, I will certainly focus on creating accessible websites. A few specific areas I will work on are forms, scalable text, tab access and using Javascript to enhance the behavior of a web page while not limiting access to the content itself if Javascript is disabled.

This is a goal all web designers should have. It’s the right thing to do after all. For more details on current accessibility guidelines, visit the website of the Web Accessibility Initiative.