Usability disaster: Videos from CNN

Apart from the fact that CNN’s video site just isn’t very interesting (for now I won’t go into reasons why), it also has a few minor issues that combined make for a genuine usability disaster.

Videos from CNN

CNN's video website

————————————————————————————————————-

Problem #1: When a video is done playing, all player functionality is disabled and after a few seconds the player automatically skips to the next video.

Solution: Don’t do this! Instead, keep all player functionality enabled (time slider, replay, share etc.) and allow the user to permanently configure the automatic skip behavior.

————————————————————————————————————-

Problem #2: The links to videos are not actual links but the very common <a href=”#” onclick=”…”>link</a> type.

The biggest issue with doing this is that it breaks a lot of functionality not directly related to the website itself. One example is that your visitors will be unable to easily copy links using the browser’s “Copy Link Location” functionality (to use on their blog for example), but one should also not forgot about all those other extensions and applications (think search engines) that depend on the ability to scrape links.

Solution: Add the real permalink as an href and override the default handler using JavaScript (see Problem #3). An added advantage of doing this is that navigating will still work even when JavaScript is disabled.

————————————————————————————————————-

Problem #3: JavaScript is used to change the playing video but the URL is not adjusted (you can get a direct link to the video, but you have to do this from within the Flash player and because of Problem #1 you have to do so before the video ends).

Solution: To adjust the link, but not reload the page, use an anchor to separate the parameters, i.e. http://us.cnn.com/video/#/video/us/2009/10/30/kark.flooded.car.kark. These URLs can also act as your permalinks, you just have to handle everything after the # as a parameter. CNN actually only supports this behavior as you can tell by following the link above, so the only change that needs to be made is that the href’s need to be set correctly. The only problem with using this technique is that using real anchors becomes a bit problematic.

————————————————————————————————————-

Problem #4: There are no links to relevant resources.

You only get a title and a short summary of the video, e.g. “Doomed boy seen on camera”, “A store worker testifies about seeing the Kehoe brothers before they were savagely attacked.”. But this doesn’t tell you anything!

Solution: Actually include links to a news article, or multiple news articles.

————————————————————————————————————-

I made use of CNN’s feedback functionality to leave my comments on their video website, let’s hope they actually do something with it.

Leave a Reply