Can User Experience be Stunning? A Short Study of Navigation in Portfolio Websites


When someone clicks on your website URL, the very first thing they note about your website is its content. The users try to know what the website is all about. In this context, they start looking for navigation options.

I spent my entire last week studying the navigation system of portfolio websites. And I came across several websites that offer interesting and intriguing experiences, but boast of some crucial navigation errors.

Well, let me emphasize once again that the website I studied are some of the world’s most aesthetic and appealing websites. However, creativity should not kill usability of a website. If you are able to ensure that your online portfolio doesn’t boasts of the navigational flaws listed below, the website is bound to get stunning experience to its visitors.

So Manny Clicks?

Wow! Mind-blowing. These are the words uttered from my mouth immediately when I landed on the home-page of the website. However, I was not first aware what are these things I’m looking at are representing. Within a minute or two, I realized that I’m at the portfolio page of the website. I could see nice usage of white space on that page.

The triage shaped linings were drawn all over the page and whenever I hovered over it, it shows a specific project from their kitty. You need to make so many clicks to navigate through the entire portfolio, which is hated by most of the people (Kids may like it!). Though the design is modest and clean, it needs a slight improvement in its navigation system. Do remember: Fewer clicks, more sales!

Flash Animation

I clicked on a URL of a website and I was first greeted by a flash animation loading window. Before it gets completely loaded and I could see what it covers, I closed the window and visited the same website again in the evening, when I was ready to be patient. I’m sure this might have also happened to you many times.

I found that flash animation was created to help users understand the navigation system of the website. However, this wasn’t useful for me at all. To add more pain, I saw that there is a wheel and you need to drag the button continuously, either clockwise or counter clockwise, to view the entire portfolio. These are truly severe flaws of the navigation system.

Conventional Menu

Have you ever thought why more than 70% of the websites have placed their menu at top of the page?, that many too in a horizontal manner?. Actually, there’s a science behind it. Our eyes first see the things that are exactly in front of it. This position is convenient for them.

If you have ever browsed a website with its main menu at its footer, you would have surely realized how irritating it was to scroll down to the bottom of the page and go back and forth. As a part of my study, I came across many websites where designers have tried to be playful and haven’t offered a conventional menu on portfolio page.

Don’t Clone Nav-Menues!

The site in wich I saw the cloned menu was actually of a construction company. At first glance, I was very much impressed with the usability, navigation system, breadcrumbs, color combination, use of white space and font styles. There were 3 main tabs in the menu, placed in bold at the top of the page and right beneath the logo of the company.

But, suddenly I noticed that same menu tabs are repeated on the same page and in another style. I would like to strictly emphasize this: why do you need to duplicate a menu?, when users can easily follow the original one. In fact, this duplication may confuse users understanding of your website. Thus, don’t repeat menu.

No User Control

The portfolio was crafted nicely. But I ticked off something very negative on the navigation part. All the projects titles were listed in vertical format. When you click on any title, the respective project gallery opens in the same page. Now, if you want to close it, you must click on another title; as there was no close button offered.

This is also observed in landing page design. Some landing pages design don’t offer user controls such as close, skip and minimize button. Such things can only irritate users instead of impressing them!

Non-sequential Access

Portfolio design should allow users to access any project from the list in any manner. It should not be the case that to reach project ‘X’, I have to compulsory scroll through projects ‘A’, ‘B’ and ‘C’. Offering a slide view of all the projects seems aesthetic, but at the same time you must provide the users with all the project titles (clickable!) in a vertical manner. Check out if your portfolio website offers non-sequential access or not.

We really hope you find this observations useful for the next time you sit down to design a website.

Kristinakathy is a reputed web designer in India. She likes to write about, how an India web design company can help with the designing requirements effectively. She specializes in CSS, JavaScript, HTML5 and other web technologies.


Leave a Reply