When visited links look unvisited

Something’s bothered me for a while about sun-sentinel.com’s links, and today I finally figured out what it is. The site’s CSS makes “active” links look like normal links rather than visited links. Let’s say I’m on the home page and I click a link to visit a story:

Now, after I’ve read the story, I use the browser’s back button to return to the front page, where the story I’ve just read does not appear to have been visited:

Only if I click elsewhere on the page, to “deactivate” the first link, does it properly change to the color for visited links:

This problem doesn’t seem to happen in Netscape browsers, but Internet Explorer apparently keeps links in the active state even after you leave the page and return. The Sun-Sentinel should change its style sheets so active links have the same color as visited links — or another color entirely — but not the same color as unvisited links.

Al Jazeera article pages are IE-only

Al Jazeera, the Arabic news channel, introduced an English-language Web site several weeks ago, after the United States invaded Iraq. Repeated hacking and DNS failures kept the site initially inaccessible. The site returned, but it still only works for readers using Internet Explorer.

The problem is on the site’s article pages, where all of the body text is buried inside a hidden INPUT field, then copied into a DIV with some Internet Explorer-only JavaScript. Readers using Netscape-family browsers or Internet Explorer 4 and anyone with JavaScript turned off will only see articles’ headlines, not their text. What’s more, anyone without JavaScript won’t even get to any articles, because there’s a ridiculous JavaScript-only redirect on the home page.

There is absolutely no valid excuse for coding this browser-specific and, frankly, terrible. Content must be placed where it belongs, not inserted with JavaScript. Al Jazeera’s Rube Goldberg contraption may indeed work for most American readers, but for many others it’s no more intelligible than the Arabic site.

Iraq maps: Why reinvent the scrollbar?

During the war with Iraq, many online news sites used interactive maps to display troop movements and battles. I won’t attempt to evaulate the accuracy of these graphics — Eric Meyer and Rex Sorgatz discussed that March 27 on the online-news list — but I do want to discuss the interfaces they used. While print designers regularly created large full-page graphics, online producers were challenged to compress lots of information into the lowest common denominator of 800x600 screen resolution. Some sites invented unique navigation systems for their Flash-based maps rather than using conventions their readers probably already understand, like scrollbars.

CNN.com’s troop movements map is one of the least intuitive. It tells readers to “use the small map below to move around the large map”:

Nytimes.com’s map uses a slider to zoom in and out on a map originally designed for print:

But the text, which shrinks and grows too, is quite difficult to read at some zoom settings. I also found myself regularly having to drag and recenter to read some blocks of text cut off at a margin.

Washingtonpost.com’s day in review map does use a vertical scrollbar, which in my mind is a better interface because people already know how to use it. Readers click icons on the map for text, which appears in a separate area:

But since the Post does not have an overly complicated map like CNN and it doesn’t put text on the map itself like the Times, I’m curious why there is a scrollbar at all. The same information — the base map and the clickable icons — could shrink and display acceptably on an 800x600 screen without scrolling. This is the approach used in usatoday.com’s map, latimes.com’s map, and msnbc.com’s map. Like the Washington Post, all of these maps put their text in a separate area off to the side.

But putting these clickable icons in one place and the text they show somewhere else is not very intuitive either. Readers have to shift focus from one portion of the graphic to another to read the text. Sometimes it’s not even obvious enough that clicking the icon has done anything. The best interface I’ve seen is on the csmonitor.com’s map, which displays “tooltip”-type text when you roll over:

One of the things I like most about working in online news is the fact that the medium is still young enough to require a lot of experimentation — we don’t really know yet what the ideal design is for standard article pages, let alone interactive graphics and multimedia. The number of detailed, professional-looking maps produced on deadline is evidence of how much online journalism has grown in a few years. But we need to learn from our experimentation rather than just using Flash for Flash’s sake. A regular static map is superior to some of these “interactive” interfaces.

How not to change your URL

The Palm Beach Post’s Web edition recently moved from portal site gopbi.com onto its own domain, PalmBeachPost.com.

Gopbi.com/partners/pbpost/ now correctly redirects, but gopbi.com/pbpost/ — where the newspaper’s home page also was previously available — does not. Rather than a redirect, gopbi.com/pbpost/ gives you a “page not found” error. Bad idea, when there are some sites (not very many, but a few) that link to the now-broken URL. The Post ought to have a redirect on all its old URLs.

The site’s new URL scheme has some odd behavior too. Palmbeachpost.com/sports/ displays another error message. Palmbeachpost.com/sports/content/ displays the home page’s content under a “sports” header. Only palmbeachpost.com/sports/content/sports/ actually gives the sports page. Such URLs are a poor choice, being neither short nor hackable nor tease-from-print-able.

Don't 'include' content with JavaScript

To cover the war with Iraq, many news sites are using an automatic feed of the latest stories from the Associated Press wire. But on some of those sites, readers without JavaScript or with JavaScript turned off simply cannot see the lead stories. Not only is this journalistically unacceptable, it makes these sites look downright silly.

Here are three news sites where most of the content in the lead front page package disappears for visitors without JavaScript (at another, all Iraq content disappears). Use the “with JavaScript” and “without JavaScript” links to switch between screenshots of these sites earlier this morning — both as the designers intended and as they will appear to the approximately 9 percent of Web readers without JavaScript.

At the Las Vegas Review Journal, the “Latest News from the Associated Press” is nowhere to be found:

Screenshot: with JavaScript · without JavaScript

At The (New York) Journal News, the only “War with Iraq” news appears to be a set of editorial cartoons and a Baghdad time clock that doesn’t work:

Screenshot: with JavaScript · without JavaScript

And at Tampa Bay Online, the lead photo is missing and there is no “ongoing coverage from the wire”:

Screenshot: with JavaScript · without JavaScript

These three sites have this problem because they try to have the user’s browser “include” the latest headlines directly from one of the AP’s servers. These sites need to program their own servers to regularly download the AP’s latest Iraq headline for server-side inclusion, rather than relying on the JavaScript. If programmers cannot deliver on basic journalistic needs like that, the Web editors could at least include a useful <noscript> section of HTML, such as a link to a separate page with those headlines:

<script type="text/javascript" src="http://customwire.ap.org/lineups/IRAQ-bulleted.js"></script>
<noscript><a href="http://customwire.ap.org/lineups/IRAQ-bulleted.html">Iraq news from the Associated Press</a></noscript>

I’m sure there are many other news sites that use these Associated Press JavaScript files inappropriately. While you’re looking at screenshots, though, I also need to single out a major site that uses JavaScript for a different purpose — to rotate several photos onto its front page. Without JavaScript, there’s no photo at all displayed at the Washington Post:

Screenshot: with JavaScript · without JavaScript

The fact that most people do have JavaScript turned on is no excuse for news sites to look stupid to those people who don’t.