While every client and every design is unique in their needs and wants, there are some universal design philosophies and concepts that help create a user-friendly experience.
It’s common practice to place a call-to-action in the top right corner of your screen — this is where people are used to looking for an action.
When you have several options to choose from, the simplest option is your best option.
When there is a lot of information to digest, we tend to look for ways to digest it more easily.
There are a series of principles governing speed and accuracy of a user’s ability to interact with the interface.
The quicker a user can understand and make a decision, the more in-control they feel. There should be no more than 5 navigation items - preferably 4 or less.
Don’t go crazy with animation and hover states. Use animation and hover states as tools to help with navigability and clarity, not simply to look cool.
To help reduce file size, save images at 72dpi and play around with the pixel to quality ratio. For example, a 2,000px wide image at 40% quality looks just as good and is significantly smaller than a 1,000px wide image at 80% quality.
Boxes reduce the visual spaciousness of your site. If you want to clean up your design, the easiest way is to remove boxes.
Using a 12 or 16 column grid system across the site rather than designing unique page layouts on every page will give your site a consistent feel and make your developer happy =)
Build out a “Brand” page to help you visualize your text styles before you build out the rest of the site to help give it the visual structure and consistency that you need.
Use no more than 5 different text styles on a single page.
Higher contrast is better than lower contrast for readability. Here’s a great tool to check your site’s contrast: http://jxnblk.com/colorable/demos/text/
Logos or elements currently in a disabled state are exempt from this standard. This includes inactive buttons or menu items. Placeholder or ghost text for form fields are not exempt from this standard — people still need to read those.
Don’t rely on hover states to reveal content
In general, menus should have one purpose and one set of options to choose from.
Field elements should always include focus state to help the user know where they are in the form process.
Don’t use color as the only visual means of communicating. If your user is color blind, they’ll tear their hair out trying to sort through all of your information. A best practice is to ensure your design works in grey scale first, then add color after.
All form fields should have labels outside of the placeholder text within the field. Some browsers do not show the placeholder text and it will leave the users terribly lost without a label.