This is my sister’s website for the nonprofit organization that she started earlier this year. I actually made the logo that appears in the top left corner of the site and came up with the name of the project. The name might seem random but it came from this pair of earrings my sister had that were neon orange silhouettes of giraffes that I thought were very interesting and since the project is about jewelry making combined with empowering women, we thought the name was intriguing and appropriate. The first page is a splash page with a brief synopsis of the nonprofit project. It provides information but in an artistic and readable way.
splash page
The home page has a primary navigation along the top which stays on every page. The groups make sense and provide all the information the project wants and needs to convey. The secondary navigation lies vertically along the left side. The links of the primary nav do not have a roll over state but once you click on them they change font color from orange to brown. It helps to let the user know where they are in the site so there is never any confusion. Each page also has a large purple vertical heading of the link to let you know what page you are on. Since the primary nav stays on every page there is never a point where you can’t get back to the home page.
about us page
The site does not have a deep architecture. There are a decent number of pages but it does not go deeper than the secondary navigation. The architecture is not flat; the secondary navigations are grouped specifically to the primary nav links and only show up when you click on the primary nav links. I think it’s a good thing because the groups make logical sense and makes the website much more organized and structured.
The hierarchy of typography is apparent in some cases and not so clear in others. The heading of each page is large, purple, and lies vertically along the page. This technique definitely designates it as the most prominent heading while still letting the content show through. The body font is a sans serif font which makes it seem less readable and a little dense. I would change it to a non sans serif to make it look more clean and legible. For pages such as the “get involved page,” the second headings are the same size as the body content, just the color and weight are different. I would maybe make them a size bigger just to make the hierarchy a little bit more clear. The labels of the groups are clear and accurate.
get involved page
The grid of the pages stays the same from page to page. The logo remains in the upper left corner while the primary and secondary navs stay on the top and left separated from the content by thin orange lines which serve nicely to frame the body. The first thing I noticed on a page is the picture that’s positioned fairly close to the middle of the page. It’s not a very big picture but they are beautiful photographs that compliment the material well. Because of the colors in the picture and its position on the page, it is the first thing I notice.
program page
The Giraffe logo nicely symbolizes the sense of strength and standing tall in the face of adversity and I like the fact that it remains on every page. The single photo on each page nicely compliments the content and brings a more personal touch to each page. The photo gallery section has some really nice photos and gives great representation of the jewelry pieces that the women make at the events and workshops held by the organization. The arrangement of the photo gallery is thumbnails along the left with the big picture in the middle/right. If I were to suggest changes to this page it would be to move the thumbnails to the right side so the big picture is more centered and then framed by the vertical photo gallery heading on the left and the thumbnails on the right. Also I would move the arrows used to scroll through the columns of the thumbnails to the top so they are not lost or hidden on smaller screens. And lastly I would include a number system for the column of thumbnails such as “3 of 12.”
Photo Gallery page
The color palette consists of orange, white, brown, and purple. I think it’s a nice gentle palette that works well together and has a strong feminine aspect to it. The thin orange lines along the primary and secondary navs give a nice framework for the body. The colors are also used to separate headings and to highlight key phrases within the content. The orange was definitely chosen because it’s called the orangegiraffeproject. The brown serves to compliment the orange as a darker selected state and the purple adds a feminine quality to the palette that is necessary for the theme of the project.
The objective of the site is to inform people about the nonprofit project in order to get people involved through either volunteering or donating. The site does not have a search option, but I don’t think it needs one either. There’s not a lot of content and all the information is accurately categorized under the primary navigation anyways so it’s easy to find what you’re looking for. My favorite feature would be the photo gallery. Although I suggested some improvements I think it still provides good information about what the organization does and the people involved. The photographs are high quality and well documented. I was never confused when using the site because it is well organized, you always know where you are in the site, and it’s easy to navigate from different sections. The improvements I would like to see are the ones I suggested about the photo gallery and changing the typography. The typography needs better spacing, clearer distinction from headlines, and a different font for the body so it’s easier on the eyes. Other than that I think it’s a nice clean website with good content and structure.
No comments:
Post a Comment