©1995–2012, Fairlight Consulting
PayPal: View Cart

Introduction


The web has grown since its earliest days of plain text and sparse graphics. Some of us still remember the days before HTTP, when technology like Gopher was new. Some of us remember even earlier times. And sometimes, remembering is a Very Good Thing To Do.


In these days of increased bandwidth, it seems that every designer is rushing to embrace the most bloated content delivery methods available, for all the wrong reasons. It's flashier. It's chic. It makes people go, "Wow!" And sometimes, they embrace this technology for the worst reason one can do anything--simply because they can.


In this new paradigm of a world filled with sites dominated by Flash (both literally and figuratively speaking), gratuitous audio, Java applets, and more graphics than are even marginally reasonable, content has taken a back-seat. That is disturbing, as content is what the web is supposed to be about.


Unfortunately, the designers of this bright, shiny, multi-hued world of theoretical virtual splendor have forgotten a few things. Even more unfortunately, they have forgotten some very important things that web designers from ye olden days knew as the basis of good, solid web design.


This article hopes to reconvey that seemingly lost (and to some, arcane) knowledge, in the hope that it inspires a renaissance of rational web design.


Content, not Glitz


The primary rule of all web design should be to deliver content. It doesn't matter what that content is, so long as it has meaning, and so long as that meaning is not lost in the blur that so many web sites have become these days. Without solid content, your site is nothing; it may as well not even exist.


Nobody ever said content had to be dull. A picture can be worth 1000 words. Of course, putting several hundred thousand words on one page is just a bit of sensory overload. And yet, that is precisely what some designers are doing--putting dozens (or even hundreds) of images in a single page. All too often, this page is the main page for a whole web site. It is a useless barrage on the senses. It's snazzy, but it doesn't help anyone get anywhere any faster. It doesn't tell anyone anything more, past a certain threshhold. It serves no purpose except to pad the wallets of graphic designers.


Nobody said that web sites have to be sterile, barren places, devoid of any fashion or sense of identity. Even I would not go that far. However, past a certain point, the intended effect is lost, and an unwanted effect is gained--people are turned off of a site. The reasons are varied. Some sites suffer from poor layout that confuses users--some vast number of them computing neophytes that can barely handle a mouse, much less navigate the myriad corridors of convolutedly designed pages. Some sites simply load too slowly on anything but broadband, when broadband penetration is still far from 100%. Still others may not run very gracefully on anything but the latest and greatest hardware. And far too many fall victim to the whim of designers that understand nothing but graphics--leaving text-only navigation, be it with browsers like lynx, mobile phones, or with screen-reading software for the blind--entirely out in the cold, thus isolating large segments of would-be visitors.


All of these problems are anethema to the singular goal of a web site, which is to convey information to all those who seek it. Not just some. Not a few. Not the privileged elite running 3mbit broadband to dual Xeon 2.8GHz systems with 6 Gigs of RAM. To the masses. Yes, even to the lowly, impoverished, underprivileged masses that have only average (or even outdated) systems, and who haven't adopted broadband yet. Much as I personally begrudge AOL's very existence, if you take that single example, there are over 30 million people right there in one lump sum who are largely on nothing better than v.90 dialup service. And yet, designers forget reality almost completely when designing a site--or worse yet, ignore the reality in the pursuit of their holy quest for their version of aesthetic bliss.


This article was intentionally labeled Web Design 001 both because it focuses on what should be the basics, and because it goes back further than any 101 course would--it goes back to the roots of what web design should be about, which isn't really taught anywhere anymore, unfortunately.


In striving to deliver content, not glitz, the web designers of any calibre, from novice to "expert" (I don't believe in experts, per se--just knowledgeable people) would do well to follow the design goals and considerations that follow in this article.


Flash-be-gone!


One of the primary annoyances when browsing the net today is the proliferation of Flash-based sites. Flash is very powerful, and in some cases very useful. If you have to do an animation, or a slideshow presentation, or you have something very specific, Flash is a decent enough tool for the job.


However, people take it to extremes; they take it to the extreme that you cannot use a site at all without Flash. This locks out users that use any browser for which Flash is not an option, and it completely locks out text-only users, as well as blind users that can only navigate through screen-reading software.


Additionally, it just plain makes a site far slower loading, even on 1.5mbit broadband connections. Many users find it tedious to wait, wait, and wait some more. And what's more, they're perfectly right--they shouldn't have to. Unless the content specifically requires something Flash alone can offer, it should not be used. Flash is rather like fats and oils in the U.S. "food pyramid" for the nutritional guidelines--common sense tells you to use it sparingly, but instead people are subjected to Super Size Value Viewings of nothing but Flash.


Anyone with a Flash-intensive site that has no text-only alternative should really reconsider what content they're delivering, and evaluate what portion of the audience they're excluding from their content.


Unsuitable for Framing


Frames, when they first appeared, were lauded by many. I personally used frames on at least three sites, and regret having done so. For a start, frames are a navigation nightmare for text-only browsers. Pages based in frames also tend to have trouble printing correctly--even from the latest versions of the ubiquitous Internet Explorer.


The truth is, frames were poorly conceived from the start. There is nothing that you can do today with frames that can't be done equally well (or better) using CSS and/or DHTML.


Additionally, frames require special care--and practical duplication of a site if you want them to be accessible by non-frames-capable browsers. For the designer that's interested in reaching the entire audience, they're more pain than they're worth.


What's in the Fine Print


Cascading Style Sheets (CSS) have many virtues. When used correctly, one can design pages that display decently in both text-only and graphical browsers, and which read decently under screen readers for the blind. There are considerations to keep in mind, but by and large, CSS has been a boon to web design.


However, there is one facet of web design in which CSS has given rise to poor design; CSS allows you to mandate a particular font family, or even specific font--and worse, hardwire its size. And it is this particular use of CSS that will drive many users away, if they get impatient enough that they're not willing to spend time fishing out their magnifyng glass so they can read so many of the sites out there which use a font size more suited for your average bumblebee than for humans.


Remember, flexibility and inclusiveness are everything. Design your site so that the person with average vision can read the display from 3 feet away on a 17" monitor running at a resolution 1024x768 or higher. Better yet, allocate the font or font-family you want, but leave the size alone or use the browser-adjustable sizing constraints of CSS so that users can adjust the size to what is readable for them.


A common complaint regarding comments on people's choice of miniscule font sizes is that they can fit more on a page that way. That is yet another design flaw, however, and is no excuse for the practise. Instead, it is an indication that the design is sub-par to start.


Less is More


A colleague and dear friend of mine recently loaded a web page. My friend happens to be blind, and his screen reader told him there were more than 250 links from the "front page" of the web site. Frankly, that is absurd.


The tendency to design multi-columnar displays and pack in everything but the kitchen sink has become so prevalent that many users (including many neophytes who are not used to online technologies) are daunted by the sheer vastness of some sites, and the bewildering array of available selections on any given page. Many people tend to avoid such sites altogether, instead going somewhere simpler where the same information may be had.


An old rule is a very good rule in this case. K.I.S.S.--Keep It Simple, Stupid. If your page is not a discussion forum or other catalogue-type page, and has more than ten links, re-evaluate your design. Break things down into sensible subsections. Try and keep all navigation as done by the TAB and ENTER keys down to ten keystrokes or less.


It's Just a Menu!!!


Oh, the exquisite pain of seeing a sidebar or top-of-screen menu at the top of every page which takes upwards of 30 seconds to load. Honestly, I'm not sure which are worse--the half-functional Java-based menus that expand and collapse trees in realtime but slow the page down incredibly, or the ones that reload the entire page to redisplay the whole menu in its new state.


Both are terrible.


Further, there are the menus that fade, slide, shimmer, light up like a Christmas tree, and even ones that wash the dishes--assuming you've padded your web designer's bank account sufficiently.


Folks, it's just a menu. It's meant to get you where you're going, not occupy your attention for several days. It's nothing more, nothing less, and there's no reason that it should consume the amount of resources that so many of today's menus do. Again, keep it simple, and watch your link count. If you "need" to compact your menu to the point that it expands, collapses, and basically plays like an accordian, you have poorly laid out your site, and should investigate migration of many of those links to sub-pages which may have their own, simpler menus.


PDF is Not Always Necessary


PDF, besides running neck and neck in competition with TIFF images for "Most Bloated Format", is not always necessary. Yes, if you want to provide a document that prints consistantly across all platforms and environments, it's a great technology. However, putting the system requirements for a software package into a several-hundred-kilobyte PDF is simply absurd, when they could just as easily go into a 2K web page with a simple table or bullet-point list.


Use PDF where appropriate, but make sure that its use is absolutely necessary. Don't waste people's download (and plug-in load time) with PDF unless you really need to.


Make Navigation Easy


Many sites are poorly laid out, in that they require you to go from point A to point F, and then require you to take a still lengthier route to get back to where you were to begin with. Navigation is cumbersome at best.


Any site should be able to be navigable from one major area to the next within one, maybe three clicks, no more. Pay close attention to ease of navigation, and don't rely on the browser's "Back" button. Make it polished wherever possible.


Remember Text-Only Browsers and the Disabled


As many of the above points indicate, not enough attention is given to text-only browsers, nor to blind or otherwise disabled users. I have several blind friends, and I hear (via online voice chat) their screen readers go full-tilt trying to read them all the available links. While I don't have any paralysed friends, I can only imagine a quadriplegic with a stylus in their mouth (as I saw a few times at university) trying to navigate overly-complex sites with deliberation and determination. These folks have it hard enough. The least a designer can do is try and make the experience as easy as possible for all possible users of their site. Some sites are so poorly designed, they may as well have "We Don't Serve Handicapped People" banners at the top.


Likewise, many in the technical community still use lynx and other text-only browsers. We go to the web to get information, not to be entertained--or distracted.


One of the oft-overlooked and simplest ways to help is to use ALT tags for your images, and to use regular SUBMIT buttons for your forms rather than embedded image buttons. Sometimes, it's the little things.


Another thing to watch is your choice of colours, and the contrast between them. Remember people that are colour-blind.


Consider ease-of-use at all times.


Only Use SSL Where Necessary


Many sites use SSL site-wide. This pointlessly slows down the loading of 95% of most sites where no sensitive data needs encrypting. Use SSL for the pages leading in and out of sensitive areas, but otherwise use the faster-loading non-encrypted versions of your pages.


Be Easily Reachable


Almost nothing about web sites gets people more frustrated than the lack of easily accessible and accurate contact information. The contact information for a Responsible Party should be in plain sight, no less than one click inwards. You shouldn't make people have to waste time and effort hunting for it. If at all humanly possible, you should include a phone number where a Responsible Person may be contacted, especially if your site is an online business presence.


Summary


I fully realise that much of what I've just said runs counter to contemporary conventional wisdom in the area of web design. That's the whole point.  Contemporary design theory (and practise) is wrong, and alienates far more users than necessary.


One can hope that the more web designers (or better yet, the people paying them) that read this, the more we'll see web design taking a few steps back and looking seriously at major accessibility and design issues that plague the current mindset and conventional wisdom.

Web Design 001 - For Modern Web Designers Who Think They Know It All