1. FredFrap.com
Fred Frap’s homepage as a whole is still very busy. The color scheme was poorly chosen and distracts readers from what is meant to be focused on. I dread this site because my eyes are over-stimulated. Also, the way the information is organized in a floating manner makes the homepage far from user friendly.
2. Yahoo.com
Yahoo’s homepage, on the other hand, is easy on the eyes. It does its best to create clean lines of separation between each section so you can see where everything is located without feeling overwhelmed by the choice of what to click on. This page has much information to offer, yet it does so in a more tasteful way.
Wednesday, October 22, 2008
Monday, October 6, 2008
Good and bad design
I think an example of good design is the old Facebook.com, which was simple in design and didn't have many of the bells and whistles it does today. It was an effective tool for socializing online because there wasn't a bunch of nonsense you had to sort through in order to get to what your friends were trying to say to you. It was a simpler time.
An example of a Web site trying to do too much with its layout would be new Facebook. I think Facebook has gone off their rocker and 99% of the stuff on the site now is worthless. What's up with that map with people in different countries having lines drawn between them? I don't need that. I've been used to the little log-in box being in the same place for the past four years. Why change it up on me now?Facebook: Don't mess with success.
Good v. Bad Designs
The Bad: Creation Museum
This site is an example of bad design because it does not have much of a hierarchy on the page, has no photo (just a background picture), and has hard-to-read text because of all the neon colors. The title of the museum is also broken up into different font sizes, styles and colors, which makes it hard to determine what the name of the museum really is. The rest of the text is simply stacked below the title, without a particular order of importance. And the use of bright colors and shadows is very distracting because it clashes with the background.
The Good: Indian Legal Affairs
This site is an example of a good design because it looks clean, attractive and easy to navigate. Although there are several different colors on the site, they complement one another well and match the colors in the photo on the top of the page. The site also has an air of professionalism and order, which is shown by the descending font size of the titles as you scroll down the page and the menu bar on the left side of the page.
This site is an example of bad design because it does not have much of a hierarchy on the page, has no photo (just a background picture), and has hard-to-read text because of all the neon colors. The title of the museum is also broken up into different font sizes, styles and colors, which makes it hard to determine what the name of the museum really is. The rest of the text is simply stacked below the title, without a particular order of importance. And the use of bright colors and shadows is very distracting because it clashes with the background.
The Good: Indian Legal Affairs
This site is an example of a good design because it looks clean, attractive and easy to navigate. Although there are several different colors on the site, they complement one another well and match the colors in the photo on the top of the page. The site also has an air of professionalism and order, which is shown by the descending font size of the titles as you scroll down the page and the menu bar on the left side of the page.
Good Web Design vs. Bad Web Design
Good Web Design
I think ESPN is an example of a site with good Web design. The site includes a lot of information, but is not overwhelming. The text is black, which keeps it simple, so as not to clash with the photos. Additionally, the site utilizes tabs to link to different sports, which prevents clutter on the home page. Finally, the pictures not only coordinate with the topics on the home page, but they are placed on the page from largest to smallest, which shows importance.
Bad Web Design
An example of bad web design can be found on the Tally-Ho uniforms website. The site is extremely distracting. The flashing ad caught my attention before the title did. The cloud background with planes flying across the page also prevented me from focusing on content. There are too many fonts used and the sizes vary across the page. The designers also went overboard on the use of "special effects." If I were trying to purchase uniforms, I would stay away from this site regardless of the deals they offer because it is entirely too hard to read.
I think ESPN is an example of a site with good Web design. The site includes a lot of information, but is not overwhelming. The text is black, which keeps it simple, so as not to clash with the photos. Additionally, the site utilizes tabs to link to different sports, which prevents clutter on the home page. Finally, the pictures not only coordinate with the topics on the home page, but they are placed on the page from largest to smallest, which shows importance.
Bad Web Design
An example of bad web design can be found on the Tally-Ho uniforms website. The site is extremely distracting. The flashing ad caught my attention before the title did. The cloud background with planes flying across the page also prevented me from focusing on content. There are too many fonts used and the sizes vary across the page. The designers also went overboard on the use of "special effects." If I were trying to purchase uniforms, I would stay away from this site regardless of the deals they offer because it is entirely too hard to read.When Good Web Design Meets Bad Web Design
Good:
Music Web site Pitchfork is a prime example of excellent Web design because the site's elements are unified, simple and in harmony. The site is clean, with similar fonts and colors, as well as a tidy organization. Each section of the site is clearly labeled and slightly different then its neighboring sections, yet there's a unity in fonts, colors and layout. The navigation bar on the left follows from page The site also keeps advertising off the main part of the page, clearly in the margins.
Bad:
Poolesville Online's Web site shows a few flaws in Web design. For one, the site is a bit cluttered, with everything seemingly squeezed into its position. The site attempts harmony with its main stories on the homepage, but ends up making each story look the same, eliminating any sense of prominence. The site's ads change size, oftentimes cutting into editorial content. There's also a running scroll on the main page, which is distracting and serves no real purpose. While there is a navigation bar at the left, the color of it changes, making it somewhat distracting. The page also shifts left or right based on which link you click. Poolesville Online isn't horrible, it just lacks in simplicity, harmony and cleanliness.
Music Web site Pitchfork is a prime example of excellent Web design because the site's elements are unified, simple and in harmony. The site is clean, with similar fonts and colors, as well as a tidy organization. Each section of the site is clearly labeled and slightly different then its neighboring sections, yet there's a unity in fonts, colors and layout. The navigation bar on the left follows from page The site also keeps advertising off the main part of the page, clearly in the margins.
Bad:
Poolesville Online's Web site shows a few flaws in Web design. For one, the site is a bit cluttered, with everything seemingly squeezed into its position. The site attempts harmony with its main stories on the homepage, but ends up making each story look the same, eliminating any sense of prominence. The site's ads change size, oftentimes cutting into editorial content. There's also a running scroll on the main page, which is distracting and serves no real purpose. While there is a navigation bar at the left, the color of it changes, making it somewhat distracting. The page also shifts left or right based on which link you click. Poolesville Online isn't horrible, it just lacks in simplicity, harmony and cleanliness.
Good vs. Bad Design
Good Design:
The Chicago Sun Times, one of Chicago's main newspapers, has a really good webdesign. The main story from the day's paper is usually front and center on the page. It is also easy to navigate through as links to the other sections are at the top. The front page also allows you to scroll down and find an easily accessible list of the columnists that have written today. Besides the one big story, all its pictures and headlines on the front page are not very big, allowing someone looking for a specific story to scroll through without being overwhelmed by one or two story headlines and/or pictures.
Bad Design:
In direct contrast with the Sun Times web design is Chicago's other paper, the Chicago Tribune. While the Tribune usually has the better content, the front page of its website is much harder to navigate. Unlike the Sun Times, its sections are not at the very top, but on the side. It also has much bigger headlines and much bigger photos on the front page, making it overwhleming if one is trying to search for a specific news story. It also has no links that shows which columnists have written recent columns. (you would have to scroll through the entire list of columnists to find out who wrote when.) The front page is also further cluttered by large advertisements. On news stories, the link to change a story to print form is also located at the very bottom of the article, so one has to scroll to the bottom of the article each time he/she wants to print.
Good and Bad Web design
Good design:
Washingtonpost.com is one example of a well-designed Web site that makes its content easy to read and navigate. It has a main story and photo to attract the reader to the headline news of the minute, with the most previous past posts directly below it. The Web site banner is easy to find and makes it clear what the Web site is at the top. The main colors of text on the page are black and blue so as not to be too distracting. Also, each category of news throughout the page is separate in a nice and neat box which makes navigation that much easier.
Bad design:
The Jerusalem Post's Web site, Jpost.com, is similar in layout to the Washington Post's with its main news at the top of the page accompanied by a large photo, but the site overall is much more difficult to read. The main obstacle to the page is its overload of ads, which make it confusing to differentiate between what is news and what is not. They have a large ad at the top of the page about the same size as the flag that reads The Jerusalem Post that one almost isn't sure whose page it is right away. The rest of the news sections are broken down into columns, but those are also interspersed with columns of ads and classifieds. There are also a lot of different colors used throughout aside from the standard blue or black text, such as bright red, green and orange, which makes it hard for the eye to focus on one section at a time.
Washingtonpost.com is one example of a well-designed Web site that makes its content easy to read and navigate. It has a main story and photo to attract the reader to the headline news of the minute, with the most previous past posts directly below it. The Web site banner is easy to find and makes it clear what the Web site is at the top. The main colors of text on the page are black and blue so as not to be too distracting. Also, each category of news throughout the page is separate in a nice and neat box which makes navigation that much easier.Bad design:
The Jerusalem Post's Web site, Jpost.com, is similar in layout to the Washington Post's with its main news at the top of the page accompanied by a large photo, but the site overall is much more difficult to read. The main obstacle to the page is its overload of ads, which make it confusing to differentiate between what is news and what is not. They have a large ad at the top of the page about the same size as the flag that reads The Jerusalem Post that one almost isn't sure whose page it is right away. The rest of the news sections are broken down into columns, but those are also interspersed with columns of ads and classifieds. There are also a lot of different colors used throughout aside from the standard blue or black text, such as bright red, green and orange, which makes it hard for the eye to focus on one section at a time.
Sunday, October 5, 2008
Good and Bad Web sites
Good Web site:
Baltimoresun.com is an example of a good Web site. The main story (about another Ravens loss) is clearly displayed in its own box with a picture, accompanying text and additional links. The font for the headline is also the biggest on the page, indicating that it's the focal point for visitors. There is another box next to the main story with the most recent headlines. The rest of the site is pretty easy to navigate. As you scroll down there are links to the other print sections as well as links to the paper's blogs. There is unity throughout the site with the blue headlines and black text, and further down the page sections are broken up with red text.
Bad Web site:
Rogerart.com is an example of a bad Web site. There are too many colors on the page and there is no clear indicator at the top of what this site is even about. The links in the picture are to other sites that I think the creator ("Roger") of this site designs. Further down there are some big images with writing all over the border of someone (Roger?) painting. I can't tell what this site is even about, and along the sides there are links to what look like ads but turn out just to be links to other sections on the site. There is no sense of unity or hierarchy on this page.
Baltimoresun.com is an example of a good Web site. The main story (about another Ravens loss) is clearly displayed in its own box with a picture, accompanying text and additional links. The font for the headline is also the biggest on the page, indicating that it's the focal point for visitors. There is another box next to the main story with the most recent headlines. The rest of the site is pretty easy to navigate. As you scroll down there are links to the other print sections as well as links to the paper's blogs. There is unity throughout the site with the blue headlines and black text, and further down the page sections are broken up with red text.
Bad Web site:
Rogerart.com is an example of a bad Web site. There are too many colors on the page and there is no clear indicator at the top of what this site is even about. The links in the picture are to other sites that I think the creator ("Roger") of this site designs. Further down there are some big images with writing all over the border of someone (Roger?) painting. I can't tell what this site is even about, and along the sides there are links to what look like ads but turn out just to be links to other sections on the site. There is no sense of unity or hierarchy on this page.
Good and Bad Website Design
Good Website:
FoodNetwork.com is an example of a well designed website. It is very easy to tell right off the bat what the website's content is based on. It is also very easy to use with a clearly defined navigation bar with drop down menus at the top of the screen. There is also a search bar at the top for easy use. If you're looking for a particular recipe there's a recipe finder you can use by putting in different search criteria. The site also shows good contrast with using different fonts and colors for the navigation, titles, and content. The site exhibits a fairly simple design and doesn't go overboard with flashy pictures and graphics. There is also harmony and repetition throughout the site with font, titles, and colors.
Bad Website:
UsabilityNet is a good example of what not to do when designing a web page. You should be able to tell what kind of site a web page is by just pulling up the home page. On this site it takes some snooping around to even figure out what it's purpose is. What this site does is list a navigation bar at the top and then just re-list the links with their content below. It would look better if the designer had simply placed a larger mission statement on the home page and then let the user select within the navigation where they wished to visit. This site also does not show any contrast. Titles are not that much larger then regular font on the page. The navigation should also be somewhat distinct from the content of the page but it's not. There isn't any differentiation in fonts, which there should be to distinguish between titles and content. The page also doesn't let you see everything put together on the same page and you have to scroll down to see the rest of the content. This is another reason why the content links shouldn't all be jumbled on one page. About the only thing going for this site is simplicity, and that is because this site is simply bad.
Bad and Good Websites
Well-designed website:
An example of a good website is www.nytimes.com. It has a simple, clean look and is easy on the eyes as it utilizes dark colors for font (black and blue) against a white background. The name is squarely in the middle and at the top of the website and the colors are used in a consistent manner with blue for headlines and black for categories. The ads are placed to the sides and are small so they are not obtrusive.
Everything is also easy to navigate with a sidebar on the left with links to different sections of the paper. Tabs are also employed to let users go to other parts of the paper that may be of particular interest, such as the print version or what are the most popular articles.
Poorly designed website:
An example of a bad website is http://www.kongkaffe.no/. The color scheme is tacky and strains the eyes and is overwhelmingly brown. The site also has a lot of unnecessary images and animated graphics that spin, blink or move but have no purpose. Fonts are not consistent and in different sizes with no rhyme or reason. Worst of all, the website loops rather annoying music while you are on the site without any option to turn it off.
There is a side bar on the left that help users navigate through the site. However it seems that the middle and right columns of the website could be utilized much better if it was more organized and had more useful information.
An example of a good website is www.nytimes.com. It has a simple, clean look and is easy on the eyes as it utilizes dark colors for font (black and blue) against a white background. The name is squarely in the middle and at the top of the website and the colors are used in a consistent manner with blue for headlines and black for categories. The ads are placed to the sides and are small so they are not obtrusive.
Everything is also easy to navigate with a sidebar on the left with links to different sections of the paper. Tabs are also employed to let users go to other parts of the paper that may be of particular interest, such as the print version or what are the most popular articles.
Poorly designed website:
An example of a bad website is http://www.kongkaffe.no/. The color scheme is tacky and strains the eyes and is overwhelmingly brown. The site also has a lot of unnecessary images and animated graphics that spin, blink or move but have no purpose. Fonts are not consistent and in different sizes with no rhyme or reason. Worst of all, the website loops rather annoying music while you are on the site without any option to turn it off.
There is a side bar on the left that help users navigate through the site. However it seems that the middle and right columns of the website could be utilized much better if it was more organized and had more useful information.
Websites-Good vs Bad
Good:
http://www.hp.com/
This website is very easy to read, which is important because it is selling products and you would not want to get users confused. The web page design is simple and I like its use of harmonious fonts and colors. The clear links and navigation tabs, makes maneuvering to the various sections of the page easy. The placement of pictures of its products grab your attention. I think this website is good overall because it fulfills its purpose by making it easy to view and buy hp products.
Bad:
http://www.alternativetransportservices.co.uk/
How do I count the many ways in which this website is bad??? It is supposed to be providing a service but besides its jarring heading in neon green that says "Alternate Transport service," I have no indication of what they do and how to get this information. The background is black and the text is brightly colored, making it difficult to focus and read. The flashing icons and pictures littered throughout the page are also very confusing. The page is loaded with so much text that you have no idea what you should click on. If you do however decide to click on the navigational tabs on the top left corner of the page, it takes you to other pages that are just as colorful and confusing as the main page. This is probably one of the worst websites that I have ever seen.
http://www.hp.com/
This website is very easy to read, which is important because it is selling products and you would not want to get users confused. The web page design is simple and I like its use of harmonious fonts and colors. The clear links and navigation tabs, makes maneuvering to the various sections of the page easy. The placement of pictures of its products grab your attention. I think this website is good overall because it fulfills its purpose by making it easy to view and buy hp products.
Bad:
http://www.alternativetransportservices.co.uk/
How do I count the many ways in which this website is bad??? It is supposed to be providing a service but besides its jarring heading in neon green that says "Alternate Transport service," I have no indication of what they do and how to get this information. The background is black and the text is brightly colored, making it difficult to focus and read. The flashing icons and pictures littered throughout the page are also very confusing. The page is loaded with so much text that you have no idea what you should click on. If you do however decide to click on the navigational tabs on the top left corner of the page, it takes you to other pages that are just as colorful and confusing as the main page. This is probably one of the worst websites that I have ever seen.
Thursday, October 2, 2008
Good and Bad Website Design
Ugly design: Miniclip free games site. This site bombards the user with graphics and video. The ads take over the screen and it is hard to figure out what is an ad and what is a game. There is a video of a game and also a video of an ad. To get to the list of games you have to scroll way down the screen and then through a massive list written in a small font.
Nice design: University of Maryland homepage. UMD's homepage is simple and does not require much scrolling. It has the links bar across the top and other links down the left side making the link you want easier to find. It also has a compact area where you can scroll through events while on the page which is convenient but still pleasing to the eye and does not require scrolling.
Design Analysis
Ugly: Craigslist.com
The Web site that immediately jumps to my mind when I think of inefficiently designed sites is Craigslist. Though there are no lurid lime greens or hot pinks jumping off the page, the essentially monochromatic blue design is very minimal on contrast, making it hard to really read anything. Though it does make use of a grid pattern, the site is very texty and fails to really separate any of the elements with space, meaning that the viewer's eye is not really drawn anywhere. There is so much text, one essentially has to use the "find" function of one's Web browser to be able to locate the desired link.
Effective: Cnet.com
Cnet.com packs a lot of content in the first page scroll. When opening the site, you can immediately tell where your eyes are supposed to go: the main "iTunes-scrolling" box in the upper-left corner that features one of six different stories. It features site navigation across the top, an eye-catching and convienent location. It also features a horizontal design of "stories" organized by topic, meaning that once someone scrolls down, all the information is right there. Not only does this prvent "scroll fatigue," but it makes finding information very quick and easy.
Wednesday, October 1, 2008
High school websites: Nice and Ugly
http://phs.prs.k12.nj.us/ComputerClub/ is the website for the Computer Club at my high school in Princeton, NJ. Interestingly, the Computer Club has a pretty bad website. Instead of a proper title, the page says "New Page 1" at the top. There's really no organization to the page, which is long, and you have to scroll way through to get to the links, which appear throughout the page instead of on the side. Also, there are several different fonts and colors, and the site doesn't look very nice.
http://numina.prs.k12.nj.us/ is the website for the art gallery at my high school. It's a really nice website- the home page is black and white with the navigation bar placed horizontally in the middle across the screen. The background is one big photo of the gallery, which is nice because it provides a the user with a visual but doesn't distract.
http://numina.prs.k12.nj.us/ is the website for the art gallery at my high school. It's a really nice website- the home page is black and white with the navigation bar placed horizontally in the middle across the screen. The background is one big photo of the gallery, which is nice because it provides a the user with a visual but doesn't distract.
Subscribe to:
Posts (Atom)
