Drupal Theming
Many people ask us to explain what a Drupal theme is. A theme is what makes a Drupal-based web site "look and feel" the way it does. A Drupal theme is to a Drupal website as cladding is to a new house. A Drupal theme can be the web design equivalent to Spanish stucco or brick or weatherboard, or even rusted out scraps of roofing iron. Some work well in some conditions, not so well in others. Some are well suited to nearly all conditions but tend to require a bit more "fit and finish" and therefore cost.
Drupal themes come in a similar range. A Drupal theme implements the layout of the site - i.e. headings, columns, content areas, footers, as well as smaller blocks of content like "Latest News" and the login form on various pages. It also implements look and feel - the style - things like the font sizes and weights of headings, bullet lists, tabular data, form fields, etc. and the surrounding colours, graphics, and logos - the window dressing. Whereas the Drupal framework dictates something like "there's a door over here", it's the theme's job to decide if the door is an old crusty sheet of plywood you have to lift out of the way or a tastefully stained oak door with brass fittings and inlaid lead lights... or something in between.
Off the shelf, Drupal comes with a very well engineered default theme called "Garland". It's the result of hundreds of hours of work from the Drupal community and provides a very rugged yet elegant, versatile and rather polished look and feel. The only problem with it is that there are many Drupal websites on the 'net which somewhat unimaginatively use it unaltered.
When Egressive implements a theme we normally work with a graphical designer, usually selected by the customer, to come up with a graphical theme concept. The concept is usually just a picture reflecting the designer's ideas of how the site should look given the customer's design brief and branding considerations. We normally get the designer to produce
- a sample "front page" and
- a typical "content page"
- a search form
- provision for a "breadcrumb" link
- a login form
- suitable branding, e.g. a logo
- some form of navigation, and perhaps
-
- a copyright notice and a menu for links to terms of use, and a privacy policy.
- all layers are suitably labeled,
- all backgrounds are visible without text in the same layer (i.e. ensure all sample text is in separate layers),
- all specific fonts are labeled with font name (e.g. in the layer name or comment),
- all backgrounds tile cleanly, and
- all backgrounds expected to sit behind scalable text are larger than required to allow for that scaling.
Note, we use the Gimp for image manipulation - it allows us to read PSD files, but does not support "layer groups" or "vector objects" - please do not use these on images you send to us. A common problem designers face when designing for the web in general is recognising the fluidity of the web, and coming to terms with the lack of control this implies. People view websites on a variety of computers, with varying screen resolutions, colour depths, computer operating systems, web browsers, font libraries, etc. Some people use text-only browsers to view the web.
We encourage designers to avoid using specialised fonts in designs, unless they only appear in graphical form (e.g. in branding or logo graphics) as it is not currently possible to dictate what font a user uses to view a web page, nor is it likely to be possible in the near future. Also, many designers don't realise that the some fonts are proprietary (e.g. the near ubiquitous Microsoft Verdana and Tahoma fonts) and can only easily be used on Microsoft Windows - specifying these fonts will only work for users on that platform.
In our efforts to help our customers be good web citizens, we at Egressive strive to achieve compliance with World Wide Web Consortium (W3C) open web standards, and always work to XHTML 1.0-strict and CSS2.1. Drupal's developers have very consciously worked to separate, as much as possible, the way a Drupal site looks versus the way it behaves. By developing an immensely powerful theming infrastructure, Drupal allows us to achieve any website look and feel that a customer might want. The only limitations we face are
- accommodating the basic Drupal functional elements,
- the vision/imagination of the designer,
- and often being forced to support outdated web browsers, like Microsoft Internet Explorer 6 and 7, which have major bugs and lack crucial capabilities that other browsers provide.