Category Archives: UX

MSDN Blogs: A Look at How I Would Improve It

I was browsing through MSDN blogs after a very long time and I noticed a couple of things that seem very odd. Needless to say, there are some things I love about the blogs such as the richness of content and smorgasbord of people for various cultures. Now as I go through this, please remember I am not an expert or a professional critic. These are just a few suggestions that in my mind would make sense.

Design Issue 1: No Filters By Language

When looking through blogs, seeing a whole page of content I am unable to parse only prevents me from getting to the content I’m looking for.

image

Design Issue 2: No Filters by Tags

As a user who has just showed up to the site and doesn’t have an account or doesn’t want to set one up, there should be easy filters provided such as Tags. They don’t exist anywhere but on the individual bloggers site as far as I can see.

Design Issue 3: Leaderboards are slow to load

I have seen this take a few seconds to load up and in a Web 2.0 world this is really not the best. Slow loads should be cached and performance in general should be tuned. The slower the page loads, the easier you make it for readers to get agitated / bored and go away.

image

Design Issue 4: Leaderboard ranking numbers

These numbers are HUGE and distracting. Also they are right next to other icons and information that clutters the page and makes reading much more difficult.

image

Design Issue 5: No use of Keyboard keys

image

If you use paging, especially in a blog, allow your users to use keyboards for navigation. See my piece on Keyboard UX For the Web.

Design Issue 6: Menu Incongruity

Notice the difference in these images below. When in the blogs, the text shows up in the menu. And when I click on home, the blogs link goes away. Standardize the menus across MSDN so as to promote it and provide uniformity to the end user.

image

image

I may be too critical here but it seems that the blogs need more focus on data management and presentation. The whole point of having a blog system the size of MSDN Blogs is so you can present information from your developers / other employees straight to the readers / potential hires.

Things I would change

1. Remove Leader Board and Commentator list from the pages.

Make it a link if necessary but don’t waste so much space.

2. Make appropriate use of space.

If I have a 1920 x 1200 resolution, use that space. Also, limit the scrolling one must do if you are going to use paging. Show a single page worth of information and allow the end user to navigate through the list easily.

3. Provide appropriate tags and filters.

If I am looking for information on Marketing or Human Resources, how do I get to it. Segment your content on at least this basis:

  • Country / Region
  • Language
  • Department / Product Area

Once you do that, provide landing pages for certain departments. By doing this you increase the likelihood that readers specific to HR go there more often.

4. Open Data.

Provide this information as OData or some other format that your readers can use. I would envision some great blog reader apps for the Windows Phone 7 Marketplace that worked off this principle.

5. Featured Blogger.

Introduce your featured bloggers to your readers based on the filters they choose.

6. Utilize keyboard navigation.

Your audience is going to be very technical. Give them the tools to navigate your site and limit the time it takes them waiting for loading and clicking.

7. Improve search.

The whole point of the system is to allow users to find data quickly. Perform a search for ‘human resources’ and the first thing to show up relates to Great Plains. Make search more friendly and useable.

8. Prioritize.

Some posts are more useful that others. Bloggers highlight those in a best of category on their pages. Provide a best of category that depicts the top posts of a blogger. Then, let me explore your bloggers by their name and their content. It will allow me to clearly get a feel for what content they produce and whether they are something I would consider following more closely. Something like the image below but scrollable left and right (mouse + keyboard). (Note: image below is an example created using paint. Its jus supposed to convey a look that content slides would be.)

image

9. No Limits.

Never limit the level of content your bloggers can provide. Ever! I ran into this today and it’s not likely that I will follow through to the new content unless I’m desperately looking for something. ‘We blog too much!’ Reward these people somehow. Show them that their time is appreciated.

image

10. Help me.

As a new user to MSDN Blogs, imagine going to the site and seeing the list of Leaderboards. Then as you move your mouse, OH LOOK! The names are links. That was not obvious to me. Ok Click the name. OMG! That is a great stats page. How would I have known to do that. It wasn’t obvious the last few times I came to the site.

image

I’m sure this is already obvious by now but the help needs more content. There are 6 items written and its just not enough. Here is what Popular topics should look like according to the help.

image

And here is what it actually looks like right now.

image

So with that I’d say I’ve been a big enough ass to the fine people of MSDN Blogs. I hope they see this as a means of improving what is already a fine section of MSDN. And if I can offer my help in any way, please let me know.

Advertisement
Tagged , , , , , , , , ,

Keyboard UX For The Web

The topic I broach today is both necessary and volatile. I deem it necessary because there are only a few ways we interact with web sites.

  1. Mouse
  2. Keyboard
  3. Gestures (touch)

Smell doesn’t really figure in our daily interaction. An example of sound may be saying (‘Navigate to Google.com’) on your phone.

And while the evolution of touch interaction has significantly improved since its inception, the keyboard hasn’t progressed much since TAB and ENTER. For those of you who have used screen readers such as JAWS, you know just how unusable websites can be.Try going through the Wikipedia page for JAWS and navigate to a link halfway down the page.

Just how many tabs does it take?

Well, try to follow the numbers in the image below. To get to the target marked with the large red arrow, it takes 30 tabs not counting the 2 necessary if starting originally in the address bar.

image

So the big question is, how do we fix this?

Well, you might say “Keyboards have been used for a very long time and nobody seems to be complaining.”  And I would point out that the only people purely keyboarding on a Web Site are those who are blind or visually impaired. It is rare for users to use a keyboard on a website except to type into fields. So, going back to our question, what we should really ask is ‘Who Cares?’ Most companies use user statistics before building any feature into their product. Limited resources and a large feature set means you do what gives you the most bang for the buck.

image

[Ed. Note – Sorry Roel. I don’t mean to pick on you. I just want to point something out.]

The reason I put Roel’s comment here is to drive home a point about ‘Who Cares?’ Keyboard usage is subjective and different users will give you different opinions. You have to base it on who your audience is.  For example, Lifehacker provides ‘J’ ‘K’ navigation to browse through their articles. Their audience is generally going to be computer savvy power users who aim for streamlined efficiency.

Users who are familiar with keyboard shortcuts in their OS du jour will also be the ones who are more likely to use shortcuts in web sites.

For instance, check out the keyboard shortcuts to GMail as provided by Lifehacker. GMail is definitely not used by power users only. They do make up a small based of the overall user base but the fact that they went the extra mile to provide these shortcuts shows their level of commitment to excellence.Hotmail also has a big list of shortcuts and with their UI change, they have become a prominent player for your email data.

So why do some of the most visited websites fail to provide shortcuts?

If you go to web sites that provides pages of information such as 500px you can see their navigation pages at the bottom.

image

This is a great site. They have excellent user content. The design is simple yet elegant and does not steal away from the user content. They provide ‘J/K’ navigation but I could not get it to work. And that’s not the only thing that bugs me. If you zoom into their pages, you notice the arrow keys as if to taunt you into using them (they don’t work btw.) Why is there such a discrepancy? Why not inform you users directly so that they can see how to use navigation correctly?

imageimage

Now try going to another site that offers the same type of paged content such as PeopleOfWalmart. You notice the paging right there at the top. But there is no way to navigate through the content easily on a keyboard. It took me almost 30 clicks to get to the 2nd page item for navigation.

image

As Smashing magazine says it, “Enable keyboard shortcuts in your Web applications.’ They even have a complied list of shortcuts for developers. And on their main page they have a paged list of articles on their main page.

But I can’t navigate through it!

image

So, I wish to implore you dear developer, consider your power users and add some keyboard shortcuts for navigation into your web site.

John Resig has even provided you with jquery.hotkeys so that you may easily add navigation support to your code. It supports all the major browsers (even IE 6).

Now you really have no excuse!

image

p.s. I looked for a way to enable keyboard navigation on the free version of WordPress and wasn’t able to find it. If anyone knows how to add this, please let me know. Thank you.

Tagged , , , , , , , , , , ,