Finding Fault

You can find bad web design all over the Internet. We usually ignore it because we don’t want to look like we spend all our time just finding fault.¹ But also, a lot of bad web design comes from inconsequential and badly-run companies that come and go, so if you just wait a little, they will soon be gone leaving behind a nice and legible 404 page.

We are hoping, however, that the so-called computation engine Wolfram|Alpha will be around for a while, because its work has so much potential. So we decided to kill two birds with one stone by not only finding fault, but also performing a public service by helping improve Wolfram|Alpha’s output a little.

We found it surprising that Wolfram|Alpha, based on significant funding and research, could contain such a basic error. We looked in its main stylesheet at http://www.wolframalpha.com/css/basic.layout.css and found that it uses a powerful and dangerous design technique called absolute positioning.

  #sidebar {
    position: absolute;
    right: -157px;
   ...
  }

Finding Fault claims no special expertise in web design and CSS, but we do have a high level of skill in recognizing sloppy output. Our Firefox optimized rebuild, called Swiftfox, showed us this mess:

Opera rendered the output slightly differently but it was just as messy:

On our Google G1 phone with the Android browser, the mess turned into a disaster.

The Android browser copes nicely with almost any other web site. Here, for example, is BBC News.

All we did that was different from the norm in each case, if you could really call it “different”, was to set our font size a little larger than usual. “Aha!” we imagine hearing Wolfram declare triumphantly. “Larger fonts!! That will do it every time.” Apparently it will.

Wolfram|Alpha has a lot going for it, and we think it shouldn’t put unnecessary barriers in its own way by making simple web design errors like this.

We haven’t mentioned our exact browser versions (you can get them from the filenames) or the screen resolution and font size settings we used. We don’t want Wolfram to just tweak absolute positioning values to make things look right on some screens while screwing them up on others. The right fix is to get rid of the absolute positioning and let the browser flow the output like browsers are designed to do. The browser knows how to make things fit on the screen without overlapping. You just have to let it.

---