The look of the World Wide Web is constantly changing and websites often become outdated and lose visual appeal. Fresh looking, well designed, easy to use websites generally share the following features:
Simplicity
Simplicity is key in modern web design. A simple design not only looks better but is also more user-friendly. Web users want to get the information sought in as little time as possible. The more complicated a webpage, the longer it will take to find this information. A simple website design loads faster, is clear and easy to read, and is easier to navigate.
Animated content, splash screens, and other elements that move or blink can be distracting and should be used sparingly. Heavy use of icons, unusual fonts and overly flashy colors can overwhelm the eye and should also be avoided. Instead, professional looking photography and simple typography should be used to create visual appeal.
Subtle 3D Effects in Moderation
3D effects are illusions that make things appear more like they would outside of the computer in the real world. Some examples of these effects can be seen on the Google home page (www.google.com). The shaded area beneath the Google logo is a drop shadow, a popular effect that makes an object appear to be floating above the background. The input field below the logo is an example of a beveled edge created by subtle color changes along the edge of a shape. Beveled effects help distinguish elements from the rest of the page and strengthen container properties. The buttons below the input field appear rounded and glassy. This is an example of the glass effect.
These effects can add richness to a web page and can be powerful devices for directing attention to important information. Also, 3D effects can be used to suggest that an element is clickable or interactive. However, if overused 3D graphics can significantly increase file size and cause confusion, so these effects must be used sparingly.
Soft, Neutral Background Colors
Many websites have white or nearly white colors as backgrounds. This does not distract from the content and gives the page a soft, neutral base on top of which brighter colors can be used to direct attention to important information.
Plenty of White Space
On a web page the term white space refers to the blank space between elements such as columns of text, buttons or images. White space is an important part of any design. Properly used white space can give a page a stylish or sophisticated appearance. The balance between positive and negative space is vital to creating visual appeal. A page with too little white space appears cluttered and complicated while over use can give the impression the page is unfinished.
Hierarchy of Text and Big Typography
The size and boldness of text are used to control attention. The reader's eye will look first at the largest, most accessible information. The bulk of the information, the body of the text, should be the smallest. A clear contrast between font sizes is necessary to develop a clear hierarchy of information. Ideally, in any design there are three clearly different intensities of text.
There is a trend in modern Web Design toward the use of large font sizes beyond 36 pixels to draw attention to the most important information. Larger fonts are easier to read. Also, typography can be very attractive and making it large is a great way to show it off.
Professional Looking Photography
Using photos is a great way to make a website more appealing and improve the look. However, poor quality photos can ruin even the nicest looking design. Photos displayed on websites should be clear and in focus, with the proper lighting, and a clean, uncluttered background. They should also be dynamic and lively; a photo of students interacting at an interesting event for example, rather than a posed group or lecturer speaking. The colors in a photo should fit the color scheme the rest of the site uses and should never clash with the design. When suitable personal photos aren't available, almost any image imaginable can be purchased online. www.istock.com is a great place to find inexpensive, professional looking stock photography.
Consistency
Consistency is important in all areas of design. Repeating elements and consistent treatment of type within a design shows the viewer how the site navigation works and how to find the information they seek. Good websites have pages that share a consistent layout. Though the content changes from page to page, the way it is displayed should stay the same. Without consistency a web user might think they have landed on a different site when the main elements change. A great way to ensure websites have this consistency is to use a template. Consistency across departmental sites will be an important consideration as we go through the redesign process.
Our design team is currently brainstorming and laying out initial design ideas for this project. If you have any suggestions, concerns or ideas of your own, now is a great time to let us know. We would like faculty and staff from all departments to be involved in the graphic design process. Our goal is to design appealing departmental websites and incorporate the latest technology and trends in web design. Please do not hesitate to voice your opinion.
Simplicity
Simplicity is key in modern web design. A simple design not only looks better but is also more user-friendly. Web users want to get the information sought in as little time as possible. The more complicated a webpage, the longer it will take to find this information. A simple website design loads faster, is clear and easy to read, and is easier to navigate.
Animated content, splash screens, and other elements that move or blink can be distracting and should be used sparingly. Heavy use of icons, unusual fonts and overly flashy colors can overwhelm the eye and should also be avoided. Instead, professional looking photography and simple typography should be used to create visual appeal.
Subtle 3D Effects in Moderation
3D effects are illusions that make things appear more like they would outside of the computer in the real world. Some examples of these effects can be seen on the Google home page (www.google.com). The shaded area beneath the Google logo is a drop shadow, a popular effect that makes an object appear to be floating above the background. The input field below the logo is an example of a beveled edge created by subtle color changes along the edge of a shape. Beveled effects help distinguish elements from the rest of the page and strengthen container properties. The buttons below the input field appear rounded and glassy. This is an example of the glass effect.
These effects can add richness to a web page and can be powerful devices for directing attention to important information. Also, 3D effects can be used to suggest that an element is clickable or interactive. However, if overused 3D graphics can significantly increase file size and cause confusion, so these effects must be used sparingly.
Soft, Neutral Background Colors
Many websites have white or nearly white colors as backgrounds. This does not distract from the content and gives the page a soft, neutral base on top of which brighter colors can be used to direct attention to important information.
Plenty of White Space
On a web page the term white space refers to the blank space between elements such as columns of text, buttons or images. White space is an important part of any design. Properly used white space can give a page a stylish or sophisticated appearance. The balance between positive and negative space is vital to creating visual appeal. A page with too little white space appears cluttered and complicated while over use can give the impression the page is unfinished.
Hierarchy of Text and Big Typography
The size and boldness of text are used to control attention. The reader's eye will look first at the largest, most accessible information. The bulk of the information, the body of the text, should be the smallest. A clear contrast between font sizes is necessary to develop a clear hierarchy of information. Ideally, in any design there are three clearly different intensities of text.
There is a trend in modern Web Design toward the use of large font sizes beyond 36 pixels to draw attention to the most important information. Larger fonts are easier to read. Also, typography can be very attractive and making it large is a great way to show it off.
Professional Looking Photography
Using photos is a great way to make a website more appealing and improve the look. However, poor quality photos can ruin even the nicest looking design. Photos displayed on websites should be clear and in focus, with the proper lighting, and a clean, uncluttered background. They should also be dynamic and lively; a photo of students interacting at an interesting event for example, rather than a posed group or lecturer speaking. The colors in a photo should fit the color scheme the rest of the site uses and should never clash with the design. When suitable personal photos aren't available, almost any image imaginable can be purchased online. www.istock.com is a great place to find inexpensive, professional looking stock photography.
Consistency
Consistency is important in all areas of design. Repeating elements and consistent treatment of type within a design shows the viewer how the site navigation works and how to find the information they seek. Good websites have pages that share a consistent layout. Though the content changes from page to page, the way it is displayed should stay the same. Without consistency a web user might think they have landed on a different site when the main elements change. A great way to ensure websites have this consistency is to use a template. Consistency across departmental sites will be an important consideration as we go through the redesign process.
Our design team is currently brainstorming and laying out initial design ideas for this project. If you have any suggestions, concerns or ideas of your own, now is a great time to let us know. We would like faculty and staff from all departments to be involved in the graphic design process. Our goal is to design appealing departmental websites and incorporate the latest technology and trends in web design. Please do not hesitate to voice your opinion.
Here are a few more that I would add that fall into the "usability" category:
I agree with the fact that simplicity is a good guide when creating a webpage. The best websites on the Internet have a consistent design, is simple to navigate, and have usually one color style. I like the use of a strong navigation menu towards the top of the screen.
What you explained is exactly right and upto the point.Thank you.
Clean and clear websites are great for letting a person scan a page without being distracted by flashy effects. However, consistency is certainly the main consideration for usability.
I agree with all the above although I do believe that even if you've got an amazing looking slick site, if the usability of the site isn't good or could be better then time has been wasted on design. What is a good method is: whilst in test phase to put through a usability study-get 50 people to use the website to achieve a common goal, measure the effectiveness and streamline where possible from feedback.
Make the site convert!
You're exactly right, simplicity is key.
Google started the trend with their uncluttered look compared to Yahoo and AltaVista and thankfully it's been widely adopted though sadly not nearly enough!
Stone Pier Caps