Wednesday, July 21, 2010

Good and Bad Website Design

Assignment #1

Good Design features

Text: Make sure the text is the proper size, is easy to read and is not interrupted by background (contrast). Columns of text are narrower than in a book to make reading easier on the screen. If visitors cannot read the text, they will leave the site. The most important information should stand out to show hierarchy of relevance.

Navigation: Site should be easy to navigate and navigation buttons and bars should be easy to locate and use. Navigation needs to be straightforward, consistent and simple throughout the site. A large site needs to have a site map. Make sure the basics of getting to your work, your contact information, and other important parts of your site are simply and easy to use.

Links: Link colors should coordinate with page colors and need to be underlined so they are instantly clear to the visitor. Links should also change color when scrolled over and once they have been visited.

Graphics: Do not use too many graphics. If using graphics make sure they are color coordinated and consistent. Animated graphics need to turn off on their own.

General Design: A good website put the emphasis is put on the work displayed. The site needs to show your best work, and set you apart while addressing the needs and tastes of prospective viewers. The hierarchy of information is perfectly clear and work is categorized

Notes: The most important thing to remember is to make sure to use proper contrast and to stay consistent. Like in interior design, less is more.


Bad Design features

Text: Text that is too small to read, that is crowding against the left edge or that stretches all the way across the page will be hard to read and will make the viewer uncomfortable. Long paragraphs and paragraphs of type in all caps, bolds, italics, or all at once are intimidating and tedious. Do not use underlined text that is not a link.

Navigation: An unsuccessful site used unclear or over complex navigation, with complicated or too many frames, and unnecessary scroll bars in frames. Common mistakes include different types of navigation on the same site, a link to the current page on the current page (home page link on home page), poorly worded links so the visitor doesn't know where he'll go if he clicks, no links back to the home page, and confusing links to the home page.

Links: Default blue links and blue link borders around graphics, links that are not clear about where they will take you, links in body copy that distract readers and lead them off to remote, useless pages. Text links that are not underlined so you don't know they are links and dead link that do not work anymore.

Graphics: Using distracting elements and really bright colors, such animations that do not turn off automatically and blinking objects, including large graphic files that take forever to load, and using meaningless or useless graphics and graphics that don't fit on the screen.

General Design: A bad site is a site that is unclear and cluttered, has a busy or distracting background, lacks contrast, and has no focal point or too many focal points on the page.

Notes: Avoid lack of contrast, clutter and confusion.



Poorly Designed Site
URL of a Poorly Designed Site: http://www.ginasdc.com/

Text: The font chosen is boring, inconsistent (she uses different types, sizes and colors) and hard to read with my glasses and quite impossible without my glasses. Some of the text under the pictures stretched all the way across the page and is extremely small. Some of the pictures did not have any text under them, while some other did. Moreover, the text of the tabs on the front page did not contrast enough with the background and hence was also hard to read.

Navigation: straightforward, but nothing exciting or original about it.

Links: Some words are underlined but are not links (really annoying!).

Graphics: she uses no interesting graphics (but perhaps for the first page). The pictures of her projects are bad quality, obviously amateurish, and cannot be enlarged. The colors chosen are dull and the website does not show much creativity. Some of the pages are almost empty and some have so much text that it is overwhelming.

General Design: the general design of the website is classic, uninteresting and sloppy at times. The text inconsistencies are obvious and make the site hard to look at. The pictures she uses are unflattering and the font choice is poor. Based on the site I would never hire her.

Notes: The purpose of the site is to display the work of an interior designer. It was easy to understand although the first impression of the website is that of a construction store (Home Depot) not that of an interior designer.


Well Designed Site #1
URL of a Well Designed Site: http://www.musadesign.net/

Text: the text is simple, easy to read and very consistent. The font chosen is very elegant while having a great architectural quality to it, shows good thought process, and reflects the work of the firm.

Navigation: the navigation is easy, well organized and quite fun. The text pops out from the side of the pictures when needed. The transitions are fast and consistent. Everything is labeled and planned.

Links: links to different blogs were a different color (red) and hence were easily identifiable.

Graphics: the graphics are very tasteful, dynamic and young, conveying that the firm is energetic and creative. The pictures of the projects are very high resolution and professionally taken. Each picture has information about the location. The picture of the designer is also very beautiful. The simple color choice is contemporary and refined.

General Design: this website is very successful; it displays the work of the firm in a very sophisticated yet modern and interesting way. It’s simple yet eye-catching, lively yet mature and professional yet very fresh. It is easy to navigate, well organized and very pleasing

Notes: the purpose of the website is to show the firm’s projects and publications. It was really easy to determine that this website belonged to an interior design firm.


Well Designed Site #2
URL of a Well Designed Site: http://benhuckerbydesign.co.uk/

Text: the text is simple, easy to read and consistent (bit perhaps on the home page). The font choice is fun and very dynamic, but is the weakest aspect of this well-designed website.

Navigation: transition between tabs is quick, organized and easy. The navigation tab is constant and the tab chosen changes color so the viewer knows where he is at all times. In each tab, sub-tabs appear for easy navigation.

Links: links are easy to identify because they are a different color. Each link is active and takes the viewer to different parts of the website.

Graphics: The graphics are really nice and the website is interactive. The logo of the firm is graphically pleasing and is nicely aligned with the different tabs. The color scheme is modern and playful, and I love the combination of grey with the white font and the touch of purple. The photos of the projects are very high resolution and professionally taken. When the viewer drags the mouth over the pictures the location appears. The pictures of the different firm members were also very fun.

General Design: the overall design of the website is very successful and quite pleasing. The site is inviting and the pictures of the projects are quite sticking. It is very easy to navigate and the color combination and contrast of the text against the background is very pleasant.

Notes: the purpose of the website is to show the British firm’s projects, services and publications. The home page made it very easy to determine that this website belonged to an interior design firm.

No comments:

Post a Comment