Author Avatar

Author

Andrew Maier

Published

December 29th, 2008

Popularity

Share

Category

Full Reviews

Related Topics

0 Comments

I immediately notice the color scheme and the logo. The typography is crisp and the man standing nearby gives me a comfortable feel. I can tell this is a personal site. The subheading “Thoughts, photos, and whatnot” is inviting and succinct. The navigation is clear. I like the effect around the photos and the content area. It seems to provide the chromatic contrast necessary to differentiate the content but does not to call too much attention to itself.

What confused me

I can’t tell what the images at the top are for. One of them has a date overlay while the other has a title. Are these blog posts are are they images from his gallery? Perhaps they are from his portfolio? I could even go so far as to assume that this guy worked on ABC’s LOST.

The header on Mario’s site is a bit obtuse and ambiguous.

The link treatment is unique. I think that, in relation to the page’s copy style, the links are very high-contrast. While this makes it very easy to spot links, it also make it difficult to read. As I scan the page I find myself looking at the links more than the copy. I’m fairly sure he would like this to be other way around.

Some of the links on the homepage have a unique hover style for no apparent reason.

Well, it’s good for one thing: I can immediately spot the Google adsense given that it’s a sea of white. Hovering over links yields a pink background for every link except for the comments link. “Why do these links have different hover states?” I wonder. I would consider consolidating these styles.

Scrolling to the footer I notice a copyright and some links that validate xhtml, css, rss. In similar fashion to psd2life, these links take me to an outside source that validates this site. I know what these acronyms mean, and why I’m being redirected — other users may not.

The footer has a couple of links without context.

This brings me to my next question: What’s microblogging? I mean, is that that Twitter thing those kids are talking about nowadays? I don’t know, but Mario places an entry that begins “Microblogging:” in the middle of his regular-blogging feed.

The styling is different and this makes me wonder what the overall page structure is like. While the site layout was immediately familiar to me, I’ve begun to question my assumptions.

Anand Sharma uses a great ‘diary’ format in his personal blog.

At this, I would recommend taking a look at how others have tackled similar problems. Anand Sharma uses a great format on his personal blog, www.aprilzero.com to convey microblogging. On the right, he has a “Diary” section that lets users know what’s running through his head without elaborating. Mario may want to consider sectioning his micro-entries off like this.

The portfolio

The portfolio of this site is a no-frills catalog of work. There is no sorting, there is only one picture per project, and there are no timelines visible. We can only assume the work is in reverse-chronological order, with the most recent work at the top. The design mockups provide a fleeting glimpse of design work without allowing me to look at anything in greater detail. I like what I see, but I don’t see much. How can I tell what his full site would look like if all I can see is a cellphone on a desk?

If I were looking at hiring Mario I would have more questions and answers from this bare-bones portfolio.

The ‘leave a reply’ form is difficult to parse at first glance.

Leave a Comment Form

In scanning through the rest of his site, most of it seems very usable. My last concern is his treatment (or lack thereof) of his “leave a reply” form. Because the labels are to the right of the fields, you can only see them after you’ve typed something in — if you’re brave enough to guess what this field is supposed to contain. Having the label precede is a fairly common convention. The debate continues as to whether or not the label should be above or to the left of the field.

What I enjoyed

The site is inviting and engaging. As someone who has a predilection with color, I think the site is colorful and fun without being overwhelming. It strikes a balance. I believe that a site that displays photos should always have a muted color scheme. This lets the colors in the photography stand “above” the layout. Mario’s site succeeds in this regard.

The navigation at the top follows an established convention and is easy to use. In fact, the entire site follows a traditional blog layout. While some design purists may think this doesn’t allow for enough creativity, I think just the opposite. It allows a user to get oriented see the work as quickly as possible.

The comments on Mario’s site are fun and unique.

Lastly, I like the display of comments on Mario’s site. The comments by Mario are quickly differentiated from those of the blog’s readers. The wide spacing and the bits of color adorning each comment bring the life of the header back to the middle of the site. These subtle touches bring the page together. Sometimes it’s easy to feel overwhelmed by a sea of comments. This comment treatment makes me scan the page much more easily.

My Suggestions

• Consider providing subheaders to the various sections of your site to let users know: how the portfolio is sorted, what is the sightseeing section (Do you travel often or are these friends?), What the portfolio (?) section at the top contains.
• Make the copy stand out better against the background, right now grey on grey makes things a bit difficult.
• Make form labels precede the fields in your comment form.
• Explain where links are taking your visitors, consider providing title attributes and making links open a new window with target="_blank".
• Place a “go” or “submit” button after the search field. Without having a permanent label/button a user may become lost after clicking in the field.
• 
  The headers on Mario’s site don’t explain the page’s structure as well as they could.

  Consider differentiating your headers more, it’s hard to make sense of what header goes with what content sometimes.

• Make your portfolio more robust. Take a step back and ask: “What would a potential employer ask me?” and go from there.
• Consider consolidating the methods of commenting on your work. From what I gather users can comment via wordpress, Flickr, and Google Friend Connect. I would try and stick with one or make the integration more seamless.

All said, the site is a great portfolio and has huge potential. I think you’ve got a great eye for color and an impressive range of talents. Best of luck to you, Mario. Thanks for submitting your site!