USABILITY FOR A WEB APPLICATION

What is Usability for a Web Application?
You rarely get the chance to develop a GUI from scratch, but it's a very rewarding experience to deliver a useful and usable application that your customers actually enjoy working with.I think every developer cares about usability, but there is a difference between caring about and actually creating a usable application. Since my time at Sun working with some great HCI engineers there, I've gained a deeper appreciation of the design and development process.Here are my thoughts on usability, starting with general principles and working towards the aspects that relate specifically to web applications.
In a nutshell, usability is the quality of an application:
that meets a useful subset of the goals of users
where common and frequently used functions can be learned quickly and more advanced functions can be learned incrementally, with no or minimal training and only brief uses of documentation
that has a coherence and a self-consistency, and ideally a consistency with other applications that the user may be familiar with
that primarily uses terms that the user is familiar with, in the way that they use them; especially it avoids using terms from another domain (particularly software or technology, unless the application is related to those domains)
General principles include:
avoid information overload - present the minimal amount of information the user needs to perform a task; information includes menu items, toolbar buttons, labelled items in a dialog, etc.
provide readily understood structure - use whitespace, borders or colours to define visual boundaries between different groups of related information
avoid distracting aspects or elements - consistent use of colors, font types and sizes, border or decorative elements and visual structure are all ways to aid the user to rapidly navigate and apprehend information
Best analysis and design practices for a UI include:
use multiple techniques for gathering requirements, especially:
issuing standard document templates to elicit common information and to raise a few thought-provoking questions
reading documents prepared by the customer or from the business domain
structured interviews and both single- and multi-role brainstorming sessions with different types of user or customer
visiting and observing the customer at their workplace.
use inexpensive prototypes to give and get feedback from the customer - it is better if the prototype doesn't look too much like a real application so that attention is focussed on the major issues of supporting the required tasks and delivering the required information, not on nit-picking about fonts, colours and layout (which is a far easier mode of feedback that often overlooks deeper issues)So far we've looked at analysis and design aspects. Now lets look at...
General Best Practices for Software Development
Technology selection
(ideally) Choose technology that is sufficiently mature and complete, with an active development team and a broad community of users, especially ones who are creating similar applications (e.g. fast secure scalable standards-based web apps)
Limit the amount of new technology and design patterns that the implementation team has to learn
Team structure
Ensure that the entire team has a good overview of the architecture and how pieces fit together, but...
Encourage individuals to develop specialist expertise (ideally one developer for every new major piece of technology) because every task requires detailed knowledge
Mix different levels of experience and encourage everyone to work as peers; a junior person may have some detailed technology knowledge while a more senior person may have broader design, implementation or domain knowledge; both are needed for success
Quality
Quality starts with good requirements, clear simple design and implementation, adequate functional and performance/scalability tests, all of which are the responsibility of the Analysts (if your organisation has this role) and the Development team
The QA engineers should be able to focus on integration, regression and edge-case functional testing, working against clear detailed functional and user interface specifications
Best Practices for GUI Development
Consider Accessibility
Clarify your accessibility requirements early; few developers can afford to ignore it and it is costly to retro-fit an existing application
Select a tool-set that supports accessibility automatically (if possible) while enabling you to create a rich, fast, interactive user experience
UI configuration - Even if you don't have an explicit accessibility requirement, respect the system configuration of font sizes and colours (for native apps) and allow user overrides (especially for web apps) and support keyboard users (e.g. mnemonics, accelerators, default buttons)
Internationalisation
Similar to accessibility, understand your requirements and benchmark your technology selection against those requirements
Internationalisation is more than just the ability to translate labels; it may impact GUI input/output, value formatting, collation (sorting), currencies, timezones and even broad aspects such as regional or national business practices
Choose the right navigation model and UI structure
Sequential - Some applications have a natural task-flow of eliciting and processing information that fits a sequential (forward/back or wizard-style) navigation model; these usually have minimal menu or toolbars and are largely driven by a small set of similar buttons on each page
Document - Others have a document-like model where you work in one primary window and use secondary UIs to manipulate it; these often have a menu or toolbars to invoke functions
Garden of windows - these are UIs with multiple panes that are only weakly inter-related; this can be the hardest to understand but can be very powerful and flexible (e.g. the Windows desktop can run multiple applications side-by-side; the user can control the location and size of the windows. it is important to consider in advance how the entire web application will be tiered. Pluggable Interface and Dependency Injection are two ways to allow for multiple varying implementations, enhancing customisability and configuration
Best Practices for Web UI Development
Know what's possible: understand the state of the art using different technologies, including DHTML/Javascript, Flash, Java (Applets and Web Start),
item 3: users generally scan webpages in the shape of an ‘F’
item 11.:one-column formats perform better in eye-fixation than multi-column formats
item 20: large blocks of text are avoided