Web browsers are designed to hide errors in HTML, validators are designed to expose errors in HTML. Just because your HTML seems OK in one web browser is no guarantee that it will seem OK in all of them.http://cq-pan.cqu.edu.au/validate/ online validator
W3C HTML Validation Service Includes HTML 4.0 validation
"Bobby approved" and accessibility guidelines
Web page purifier - <http://www.delorie.com/web/purify.html>
A matter of taste?
- Web pages that suck
- Jakob Nielsen's "ten commandments": see: http://www.useit.com/alertbox/9605.html and http://www.useit.com/alertbox/9706b.html
Top Ten Mistakes in Web Design
1. Using Frames
Splitting a page into frames is very confusing for users since frames break the fundamental user model of the web page. All of a sudden, you cannot bookmark the current page and return to it (the bookmark points to another version of the frameset), URLs stop working, and printouts become difficult. Even worse, the predictability of user actions goes out the door: who knows what information will appear where when you click on a link?2. Gratuitous Use of Bleeding-Edge Technology
Don't try to attract users to your site by bragging about use of the latest web technology. You may attract a few nerds, but mainstream users will care more about useful content and your ability to offer good customer service. Using the latest and greatest before it is even out of beta is a sure way to discourage users: if their system crashes while visiting your site, you can bet that many of them will not be back. Unless you are in the business of selling Internet products or services, it is better to wait until some experience has been gained with respect to the appropriate ways of using new techniques. When desktop publishing was young, people put twenty fonts in their documents: let's avoid similar design bloat on the Web.As an example: Use VRML if you actually have information that maps naturally onto a three-dimensional space (e.g., architectural design, shoot-them-up games, surgery planning). Don't use VRML if your data is N-dimensional since it is usually better to produce 2-dimensional overviews that fit with the actual display and input hardware available to the user.
3. Scrolling Text, Marquees, and Constantly Running Animations
Never include page elements that move incessantly. Moving images have an overpowering effect on the human peripheral vision. A web page should not emulate Times Square in New York City in its constant attack on the human senses: give your user some peace and quiet to actually read the text!Of course, <BLINK> is simply evil. Enough said.
4. Complex URLs
Even though machine-level addressing like the URL should never have been exposed in the user interface, it is there and we have found that users actually try to decode the URLs of pages to infer the structure of web sites. Users do this because of the horrifying lack of support for navigation and sense of location in current web browsers. Thus, a URL should contain human-readable directory and file names that reflect the nature of the information space.Also, users sometimes need to type in a URL, so try to minimize the risk of typos by using short names with all lower-case characters and no special characters (many people don't know how to type a ~).
5. Orphan Pages
Make sure that all pages include a clear indication of what web site they belong to since users may access pages directly without coming in through your home page. For the same reason, every page should have a link up to your home page as well as some indication of where they fit within the structure of your information space.6. Long Scrolling Pages
Only 10% of users scroll beyond the information that is visible on the screen when a page comes up. All critical content and navigation options should be on the top part of the page.
Note added December 1997: More recent studies show that users are more willing to scroll now than they were in the early years of the Web. I still recommend minimizing scrolling on navigation pages, but it is no longer an absolute ban.7. Lack of Navigation Support
Don't assume that users know as much about your site as you do. They always have difficulty finding information, so they need support in the form of a strong sense of structure and place. Start your design with a good understanding of the structure of the information space and communicate this structure explicitly to the user. Provide a site map and let users know where they are and where they can go. Also, you will need a good search feature since even the best navigation support will never be enough.8. Non-Standard Link Colors
Links to pages that have not been seen by the user are blue; links to previously seen pages are purple or red. Don't mess with these colors since the ability to understand what links have been followed is one of the few navigational aides that is standard in most web browsers. Consistency is key to teaching users what the link colors mean.9. Outdated Information
Budget to hire a web gardener as part of your team. You need somebody to root out the weeds and replant the flowers as the website changes but most people would rather spend their time creating new content than on maintenance. In practice, maintenance is a cheap way of enhancing the content on your website since many old pages keep their relevance and should be linked into the new pages. Of course, some pages are better off being removed completely from the server after their expiration date.10. Overly Long Download Times
I am placing this issue last because most people already know about it; not because it is the least important. Traditional human factors guidelines indicate 10 seconds as the maximum response time before users lose interest. On the web, users have been trained to endure so much suffering that it may be acceptable to increase this limit to 15 seconds for a few pages.Even websites with high-end users need to consider download times: we have found that many of our customers access Sun's website from home computers in the evening because they are too busy to surf the web during working hours. Bandwidth is getting worse, not better, as the Internet adds users faster than the infrastructure can keep up.
Top Ten Mistakes of Web Management
Web design and development involves three levels:Just as in a hamburger, the middle layer is the most tasty and attracts the most attention, including much of my own work on Web usability. I have come to realize that the outer two layers are more important in many ways: users only care about content (in other words, no, the medium is not the message; the message is the message) and the usability of a website is more a function of how it is managed than of how good its designers are.
- Web management
- interaction design (navigation support, homepage layout, templates, search, etc.)
- content design (the actual writing on the pages, as well as the design of any other media types used to communicate content as opposed to site interaction)
Content will be the topic of many other columns; here I address some classic mistakes in managing the design of a website.
1. Not Knowing Why
This is the number one problem, all right. I am amazed how many websites are built simply because some executive told somebody to do it without telling them what the site should achieve. And no, it is not an acceptable reason that "everybody else is doing it."Granted, these days, you need a website simply to be considered a professionally run organization (not being on the Web is like not having a fax machine: people think you are a fly-by-night). Thus, it is OK to make a "business-card site" with a small amount of corporate image building, directions to your various facilities, and the annual report and other investor information. However, doing so is not the most effective use of the Web, and a site along these lines should only be built as a result of an explicit decision not to invest in active use of the Web for business.
Most companies should start their web design project by finding out ways in which they can provide true customer value on their site. Give users benefits from spending time on your site, allow them to do business with you, and their money will follow.
2. Designing for Your Own VPs
Internally-focused sites cause companies to end up with home pages full of mission statements, photos of the CEO, and corporate history (all of which do fit on an "about this company" page; just not on the home page). Remember that your company is not the center of the universe for your customers. The site should be designed with customers' needs in mind and not to promote grandiose ideas of self-importance. Do not build a site that your top executives will love: they are not the target audience.3. Letting the Site Structure Mirror Your Orgchart
Users should not have to care how your company is organized, so they should not be able to deduce your organizational structure from the structure of your website. Admittedly, it is easiest to distribute responsibility for the site to divisions and departments according to already established chains of command and budget categories, but doing so results in an internally-centered site rather than a customer-focused site.The site structure should be determined by the tasks users want to perform on your site, even if that means having a single page for information from two very different departments. It is often necessary to distribute information from a single department across two or more parts of the site, and many subsites will have to be managed in collaboration between multiple departments.
A classic sign of a mismanaged website is when the homepage has a button for each of the Senior Vice Presidents in the company. Remember, you don't design for your VPs, so it will be quite common that you can't tell them what "their" button is on the homepage.
4. Outsourcing to Multiple Agencies
If you outsource every new Web project to a new agency, your site will end up looking like one of those quilts assembled from patches by each of the participants in a protest march. The problem with using multiple agencies is that each of them want to put their own stamp on the site: both because they have different design philosophies and because they will want to use you as a reference account. It is no fun to say "we designed such-and-such pages" if all the pages on the site look the same.Users get very annoyed when they move between pages on a site and find drastically varying designs at every turn. Consistency is the key to usable interaction design: when all interface elements look and function the same, users feel more confident using the site because they can transfer their learning from one subsite to the next rather than having to learn everything over again for each new page.
The best way to ensure consistency is to have a single department that is responsible for the design of the entire site. If this cannot be done, at least have a central group that oversees all design work and that is chartered to enforce a single styleguide. Even if the central group does not actually design any pages themselves, considerable consistency can be achieved if the various departments can turn to a single source of design advice. Even better: have the central design group maintain the templates and deliver updated and revised graphics as needed.
5. Forgetting to Budget for Maintenance
As a rule of thumb, the annual maintenance budget for a website should be about the same as the initial cost of building the site, with 50 percent as an absolute minimum. Obviously, ongoing costs are even higher for news sites and other projects that depend on daily or real-time updates. If you simply spend the money to build a glamorous site but do not keep it up to date, your investment will very rapidly turn out to be wasted.The Web currently changes so rapidly that a major redesign is needed at least once per year simply to avoid a completely outdated look and to accommodate changing user expectations. Additional maintenance is needed throughout the year to bring fresh content online, reorganize and revise old pages, and avoid linkrot.
If you have established a design styleguide and a set of page templates in order to avoid the inconsistencies mentioned under Mistake 4, you also have to budget for maintenance of these design resources. If the styleguide and templates do not evolve with changing needs, you will rapidly see design entropy set in and the site will fall apart. The most common example is the need for new stock graphics, new headerbars, new navigation buttons, or new icons. If you don't have an art director on standby for this type of requests, then the page developer who needed the new graphic will outsource it and the site's look-and-feel will start to diverge.
6. Treating the Web as a Secondary Medium
One rarely gets a gourmet meal by repurposing yesterday's leftovers. Similarly, even if you repurpose very valuable non-Web content, you will at best get a slightly valuable website. The Web is a new medium. It's different from television, it's different from printed newspapers, and it's different from glossy brochures, so you cannot create a good website out of content optimized for any of these older media. The old analogy still holds: movies are not made by filming a play and putting the camera in the best seat of the theater.The only way to get great Web content is to have your staff develop the content for the Web first. Then, if you still have a need for printed collateral, transfer the text and images to a desktop publishing application and massage it into a form that is suited for print. Of course, your print materials will suffer from this procedure, so if you want great Web content and great brochures, you will have to have two teams develop two sets of content.
Content creators have been trained to develop linear content for traditional media: they have spent their entire careers doing so. They have to consciously push themselves to work differently than their natural approach to content, so unless you force your content developers to produce their material specifically for the Web, you will end up with substandard Web content
7. Wasting Linking Opportunities
The Web is a linking medium: the hypertext links are what ties it together and allow users to discover new and useful sites. Most companies have recognized this phenomenon to the extent that they religiously include their URLs in all advertising, TV commercials, press releases, and even in the products themselves (ever bought underwear with a URL woven into it?). Unfortunately, most of these URLs are overly generic and do not provide users with any payoff that is related to the context in which the user found the URL. Do not link to your homepage in your ads. If a potential customer gets interested in a new product or a special offer, you should not force the poor schmuck to find out how to navigate the site from the homepage to the product page. Instead, link directly to the product page from the ad. Also, seed press releases with specific URLs that support your message: reporters may follow these links for additional detail and online publications may use specific links instead of generic ones to better serve their users.If you are running a campaign with a certain theme, have it include a URL to a page that follows up on that theme. The payoff page should not be a copy of the ad (the customer presumably already read the ad before going to the Web), though a link to an online version of the ad might be appropriate to help users who go to the page without having seen the ad. Instead, use each medium for what it's good at. For example, a game company could use TV commercials to make people think that a game looks good and use the Web to allow them to play a simplified version of the game.
8. Treating Internet and Intranet Sites the Same
Internal intranet Web sites need to be managed very differently from public Internet sites. The key difference is that each company only has a single intranet and thus can manage it to a much greater degree of consistency and predictability than we can hope for on the wild Web for many years. Also, employees use the intranet for corporate productivity, meaning that any waste of users' time is a direct hit to the bottom line. I am appalled when I hear of intranet managers who put advertising on their site to pay for their equipment costs. If, for example, the value of an average employee's time is $1 per minute and users spend 3 seconds more per page because of the ads, then each ad costs the company 5 cents in lost employee productivity. Even if the MIS department makes 2 cents per ad (a typical CPM of $20), the net loss to the company is 3 cents.9. Confusing Market Research and Usability Engineering
Thankfully, many sites have embraced the value of customer data for design, but unfortunately many of them rely solely on traditional market research like focus groups. Most of these methods relate to creating desire for a product and getting it sold and do not provide detailed information about how people operate the product. A Web design is an interactive product, and therefore usability engineering methods are necessary to study what happens during the user's interaction with the site.Users are not designers: no matter how many focus groups you run, they cannot tell you how to design your navigation. Focus groups are great for getting information about users' current concerns and areas where they would like help, but they will rarely teach you how to reinvent the fundamental way you do business. Listening carefully to customers will often reveal frustrations that can turn into opportunities for improvement, but once you have an idea for an improvement, you must create a prototype design and try it out with users in a usability test to see whether it really works for them.
There are endless stories of customers who say in focus groups that they would love a certain feature, but who never use it once it is launched because it is too cumbersome, too expensive, or doesn't really meet their needs in real use. The point is that market research forms the starting point but has to be supplemented with usability engineering if you want a design that works when people try to use it.
You may commission a traditional market research firm to question thousands of customers to measure whether they like your website more or less than your competition. Once you know that your site scores, say, 5.6 and your worst competitor scores 5.9, you may know that you need to improve, but you will not know how to improve. Specific insights into the detailed design of your site and the parts that must change because they are confusing, slow users down, or do not match the way users want to work can be derived from watching four or five users as they actually use your site to perform real tasks. A day or two in the usability lab and you will have a long list of changes that will improve your design.
It is less common to find sites that only do user testing and never conduct any market research, but that would be a mistake too.
10. Underestimating the Strategic Impact of the Web
It is a huge mistake to treat the Web as if it were an online brochure and manage it out of the marcom department. The Web should be considered one of the most important determinants for the way you will do business in the future.Ask your CTO and head of marketing what strategic thoughts they have relating to terms like "disintermediation", "virtual project teams", and "microtransactions." If they don't have any thoughts, they had better start thinking now - before it's too late. The Web enables completely new ways of doing business such as true globalization (for example, "work-around-the-clock", where projects are passed on to teams as the globe turns). If you don't grasp these new business opportunities you will be toast in a few years.
The two classic errors in predicting the future of a technology shift are to over-estimate its short-term impact and under-estimate its long-term impact. The Web has been hyped to such an extent that people overestimate what it can do the next year or two: most websites are not going to turn a profit any time soon. But please don't underestimate what will happen once we reach the goal of everyone, everywhere; connected. The impact of networks grows by at least the square of the number of connections, and the true value of the Web will be only be seen after extensive business process reengineering.