Over the past three to four years web design has taken off like no one would have imagined all those years ago. Web sites are no longer just marketing tools but have become focal points for business from the corporate arena to the home business all over the world. In this two part series I have compiled thirty web design tips and split them into six areas: Layout, graphics and information arrangement; navigation, animation and interaction. The tips are basically advice and can be applied by web designers at any level.
|
"Stop and just think about how the user will navigate around the site. Come up with at least three navigational systems..." |
The look, feel and perception are mainly captured in the design of the layout for the site. With such an important step this process is not simply sketching out rough designs on a whiteboard, but rather requires planning, creativity and thought. Here are my five tips for a successful layout.
1. Preparation is essential to any project. Make sure that everyone knows their responsibilities and what they are expected to deliver and create a checklist for the whole project. It is also a good idea to make a clear outline of what is planned, so you can convey it to the team or client.
2. Timing is also an integral part of any project. Once again make sure everyone knows what they are responsible for and give them deadlines to stick to. You should also know where your content is coming from and create a schedule to stick too.
3. Stop and just think about how the user will navigate around the site. Come up with at least three navigational systems, and then test each one to see if they work and which is the most adequate for your site.
4. Experiment and test continuously. You will need to figure out how the content moves and if it flows with each other and how it all feels. If you are using flash or any of those types of media keep in mind the aspect ratios you will need to try out (e.g. 16:9/4:3 for QuickTime and Flash).
5. As with all good sites, they affect the user emotionally. Experiment with different illustrations and photographs, and where they best fit in the layout to enhance the site. Play around with it; see what colors and graphics go well with each other.
Humans are by nature visually stimulated, we like things that look good, so naturally choosing the types of graphics can turn your site from a mediocre site to a much more appealing site. Do not however fall into the trap of cluttering images all over your site, because not only will your site in turn take longer to download but humans are also very impatient and chances are the user will simply click to another site. Here are a few pointers on the compression of images and graphics.
1. JPEG or GIF? For photos and images JPEG is the one to use. JPEG allows you to save images with millions of colors, while GIF is restricted to 256 colors. JPEG also permits a higher degree of compression than the GIF, enabling large images to be downloaded quicker. The GIF format however is useful because it can be animated. The background of a GIF can also be made transparent, allowing you to see the background color of the browser window you are in.
2. If you must use a large graphic the GIF format is the way to go, mainly because it is able to be interlaced. Interlaced GIFs appear first with poor resolution and then improve in resolution until the entire image has arrived. By doing this it allows the viewer to get a quick peek of what the picture will look like while waiting for the rest.
3. Keep in mind also that PC monitors tend to look darker than MAC monitors, making images and colors look darker on a PC. To help sort this problem out there is a palette of 216 colors that the industry developed. It offers the best chance of color management across the platforms.
4. You can also specify the dimensions of your graphics in the image tag. This is useful if you have text around an image. The user can start reading without having to wait for the image to download first.
5. Another trick most designers overlook is using the cache, if you are using the same graphic on another page the image will appear straight away since it is already been in the cache.
From grammar and spelling mistakes to giving the user the entirely wrong message, what information you give and where it is placed is a very high priority. It is particularly important in relation to what kind of message you want to send to the users. Here are my quick tips on the subject.
1. As most designers would know by know the design and look of the page is very important but do not hide crucial information such as conditions and instructions just so you do not ruin the design.
2. Designing a great site is also essential but if the user goes to your page and does not know what to do or even what it is about, then the site/page is pretty much useless. Include some simple instructions that are straight to the point.
3. Guide the user if you want them to do something such as purchase a product, register or even interact with a feature you have. If you do not promote it they will simply get to the page and think “what do I do next?”
4. If you are intending to gather information from the users make the forms short and too the point. Users will not sit there and fill out three pages of questions. A good idea is to also offer them something in return for completing the form; the “what is in it for me?” mentality is still very strong.
5. From corporate giants who spend millions of dollars on their sites to simple web pages that are built in people's spare time, always check your spelling and grammar. There is no excuse and it only detracts from the hard work you have spent building the site and annoys the hell out of people.
** Click Here For: 30 Ways to Design Better Sites! - Part #2
SUBMIT