Recently, I’ve received a few error 404s on a request for “siteinfo.xml.” siteinfo.xml is a file used by Amazon’s A9 search engine’s browser toolbar SiteInfo, and is automatically fetched for every website a user visits.

This sounds pretty similar to Microsoft’s Internet Explorer’s infamous favorites icons feature. For every site a user visited with Internet Explorer, the browser would automatically request a file called favicon.ico, to be displayed in the browser’s location bar and bookmarks. A lot of people were not happy—all of the sudden web servers would begin to get swamped for requests for this mysterious favicon.ico that did not exist. These requests polluted many web server logs, and were very annoying.

On some sites, especially dynamic ones, 404 errors are very expensive. Unfortunately this is true of most Drupal-powered sites, including mine. When using Drupal’s “pretty URLs” which uses Apache’s mod_rewrite to, well, make URLs pretty, all requests that the web server does not process (including errors) will go through Drupal. Going through Drupal means a long boot-strapping process to initialize Drupal and load all its modules, and at least one database request to find out a URL does not exist and to return an error 404. Too many requests for a non-existent file can basically become a DoS attack.

It seems Amazon’s A9 developers didn’t get the memo people don’t like tools that request files that don’t exist.

Granted, it’s not too bad: I don’t think this toolbar has much market penetration, so it’s not as if millions of people are killing my site. The siteinfo.xml specification page also mentions that the file is fetched through A9 and cached, so the file will not be requested for every user that visits, but only for the first one.

Kudos for Amazon’s programmers being a bit brighter than Microsoft’s, but eh, I can’t say how much more bright for designing a system that is a bit too similar to the favicon.ico debacle.

I’ve outlined some of the design decisions I made when designing Sands, including why some links are black, the use of a em-relative layout, and why I think they are more usable, in a post on Drupal’s forums: Any theme with high usability?

Sands is an attempt to create an all-purpose, drop-in replacement, "generic" theme like Bluemarine. It has design attributes taken from Drupal.org's proprietary Bluebeach theme and friendselectric.

Some features:

• Higher contrast colors, underlined links, and relative font sizes
• Novel styling of node information, comments, and block menus
• Semantic XHTML, heavy use of CSS
• Segregation of style information, including an easily-modifiable colors.css containing all color and background image definitions
• Designed in mind to be easily modifiable to create your own custom themes
• Uses many subtle gradiented background images to create a "smooth," more high-contrast look
• Uses Mark James' Silk CMS Icons for emphasis on selected links
• Uses the PHPTemplate theme engine.

In April 2006, I forked Sands into two different themes: Sands and Sands_CSS:

Sands

Uses tables for layout, like Drupal's Bluemarine. Use of tables guarantees maximum compatibility with CSS-impaired browsers, like Microsoft Internet Explorer 6 and earlier.

Sands_CSS

The progressive theme previously known as Sands, that uses a 3-column, source-ordered, elastic CSS layout.

Screenshots

Warning: screenshots are old and have not been updated.

Below are some screenshots of various pages with what they looked like dressed in the Sands theme. Of course, you can see for yourself what they look like by downloading the theme and trying it out yourself!

Screenshots were taken with Mozilla Firefox 1.0.x on Debian Linux, dressed with a modified GTK Clearlooks theme.

Getting Sands

Sands is developed and kept in the Drupal contributions CVS repository. It has a project page on Drupal.org where you can download the theme and submit bug reports.

• Sands project page
• Sands_CSS project page

If you're impatient, here are direct-download links to Drupal.org:

• Sands
  • Drupal 4.6 version
  • Drupal 4.7 version
• Sands_CSS
  • Drupal 4.6 version
  • Drupal 4.7 version

Frequently Unasked Questions (FUQ)

What browsers does this theme work with?

All the modern generation ones, including Firefox 1.0, Internet Explorer 6, Safari/Konqueror, and Opera 8. There may be some issues with browsers older than that.

To see any known rendering issues please see Drupal's issue tracker for Sands. If you've a new one, please contact me or preferably, create a new issue at the aforementioned issue tracker.

Why are the form controls black in the screenshots?

I'm blind: I use a high contrast theme for my UI windows/widgets that is dark grey/black, so the form controls look the same. On a "normal" machine with a white-ish color scheme (i.e. the defaults) they'll be white, just like you'd expect. Sands doesn't make any attempts to change colors on form controls (and I don't think it should).

What were Sand's inspirations?

Theme-wise, I drew design features I liked from:

• Bluemarine
• Friendselectric
• Drupal.org proprietary Bluebeach theme

How do I change the colors of the columns?

The colors of the columns are in both colors.css and columns.css, not just only colors.css, as one would initially think.

Setting the colors of the columns depends on the way the columns are contructed, so their colors are placed in columns.css to allow sharing of the other Sands and Sands_CSS stylesheets.

What is the elastic, source-ordered, 3-column CSS layout based on?

It is based off of Ruthsarian's skidoo_too layout.

I cannot select text in Microsoft Internet Explorer!

This is due to some extremely odd bug triggered when a page contains the <base href="..."> tag, as Drupal 4.6 does. I gave up trying to find a way around it a long time ago.

If you want to get around it, upgrade to Drupal 4.7, which no longer uses the <base href="..."> tag, or use the Sands (not Sands_CSS) theme, which uses tables for layout.

There are grey borders around images in Internet Explorer...

Internet Explorer 6 does not intuitively work with transparent PNGs, which is why you see grey borders on these images. There are many scripts that will fix this problem, but they do not work with the way Sands has transparent PNGs for both <img> tags and as CSS "background-image"s. I've not had time to look into this, but patches are accepted!

May I remove the tagline with your name at the bottom of the footer?

Yes, you may. You are under no obligation to keep it there; I wanted emphasize the things I link to in it (the theme, Drupal, the GNU GPL, and myself), and few people change the defaults.

How do I remove the icons?

You can remove the icons by editing style.css, and removing the inclusion of the icons.css style sheet.

I've used Sands as a base for a new theme, but why do things suddenly break (such as the breadcrumbs, no icons, etc)?

If you've renamed your theme from "Sands" or "Sands_CSS" to something else, you need to modify template.php. Sands requires a few custom theming functions contained in this file, and functions will only execute in this file if the function is prefixed with the name of the theme.

For example, if you're using Sands, and you create a new theme "blah", you need to modify function names that begin with "sands_" to "blah_" for them to be called.

How do I modify the width of the columns?

Changing column with both Sands and Sands_CSS is easy, though not necessarily easy. In columns.css, simply change all occurences of "14em" with your desired column width (in ems). You can give the left and right columns different widths as well, if you follow the logic of the CSS.

I’ve moved my Sands theme to a new location, at samat.org/drupal-themes/sands. The URL is nicer and shorter, and sets me up for the other Drupal themes I would like to create.