Facebooks is brilliant… it connects me to my friends and keeps me upto-date with them. It’s great at getting me to the content that I want to read and producing a bunch of page impressions. However I do have a few grips with it in terms of accessibility/useability, I’ll take a look at 3 of the most annoying gripes: dropdown menus, the search box and news feed preferences sliders.

Dropdown Menus

I am a firm believer in un-obtrusive JavaScript (it doesn’t remove functionality if you don’t have JS enabled) and Facebook drop down menus are coded in JS only. Therefore the menus don’t work for no-JS users, this is a accessibility nightmare*.

There is a <div> tag that contains the drop down information that has a inline style of “display:none;”. By default the arrow next to dropdown links is always displayed, which is applied by a class of “with_arrow”. This needs to be addressed because when there is no JS enabled you cannot get to the drop down menu even though the drop down arrow suggests you can. My suggested solution is:

Every page

• Remove the drop-down <div> from the HTML
• Remove the “with_arrow” class from the nav
• Add a JavaScript function that attaches the “with_arrow” class to the menu <div> and adds the drop-down <div> into the HTML

Section pages (in this example “Friends”)

• On the friends page add a sub-nav which contains all the contents of drop-down <div>
• Add a JavaScript function that “display:none” the sub-nav

This will produce something like this:

Figure 1: New menu example, within news section

This would mean that when a non-JS enabled user clicks on the friends button they would navigate to a page with a sub-level of navigation that allows them to get to exactly the same pages as JS enabled users (and it would have no effect on navigation for JS enabled users).

Search box

The search box on every page has another little drop-down-esque menu to allow users to search different things. Again this is JS only and this can be made more accessible by doing the following:

Drop-down

• Remove the link with the JS dropdown
• Replace it with a <select> form item with the same options
• Add a JS function which replaces the <select> with the current drop-down

Search input and button

• Add a submit button in the HTML after the input box
• Add a JS function that “display:none” the button

Figure 2: New searchbox example

This will mean that non-JS enabled users will be able to search within the areas that JS enabled users can. Again it has no effect to JS enabled users.

News feed preferences

To edit your preferences for the news feed (logged in users home page), there is a rather spiffing bunch of sliders. Again… you guessed it, JS only.

Figure 3: Current news feed preferences

Now, I hate using my own work as an example (alright I don’t, I love tooting my own trumpet) but I’m going to now. On the Virgin Radio (the site I work as a designer/developer) we have a similar sort of thing as the news feed on Facebook (we call it VIP Lounge and you need to be a VIP to view it). In order to make the page accessible you’ll get the following if you don’t have JS enabled:

Figure 4: Virgin Radio’s VIP Lounge - without JS

… and with JS enabled you’ll get:

Figure 5: Virgin Radio’s VIP Lounge - with JS

See… a non-JS enabled user gets the same functionality as a JS enabled one does. I would suggest that Facebook does the same thing.

In conclusion

I’m really not dissing Facebook, they do a lot of things right (like email updating, simple interface, etc.), I just wish they could have spent a bit of time getting the site working first without JS and then adding in the fluffy nice JS features.

* At least the drop-downs are click activated and not hover activated. Have you ever seen a OS that has dropdowns that activate on hover? No. Then why is it alright to do it on the web? It’s not.

Ok perhaps a bit of a sensationalist title, it should probably read “Digg’s community reaches critical mass”. Anyways…

The power of Digg over the past 2 years is a brilliant example of the neu-webbe. However I have always thought that in order to hit the real big time Digg needed to broaden it’s horizons, by expanding it’s user base beyond “first adopter” technologists. Sadly digg was too late to the park and has started for the first time to lose users (as you can see by this disturbing alexa graph).

It’s a common problem with community driven websites, when a website grows it’s usually because it’s community has a passion for something. Diggs’ community had (has) a passion for tech related news and sadly even though Kevin & the crew have tried to do to diversify digg algorythmn, this hasn’t managed to diversify the stories on the front page. Why’s this? Digg’s community is submitting tech biased news because thats what they care about. No matter how diverse a algorythmn is if you only have one type of input then the output is skewed.

So what’s the future for digg? I think digg reached it’s peak near the end of last year and it’ll now slowly loose users for a few months and it’ll saunter back down to the user base it had near the start of 2006.