Dark Background Anti-Pattern

Dark backgrounds on web pages are generally a bad idea, especially in Confluence. They cost a lot more to initially develop and maintain. They even prevent re-use of your assets in most cases.

Adaptavist have developed 2 dark-background themes so far - it can be done, but it's not for the feint hearted. It's much more work than you would expect for the average Confluence site.

At some point in the future, Adaptavist plan to develop a dark-background theme configuration for Builder that can be used as a basis of dark background theme designs.

It costs more to develop

Browsers default to using a white background. Changing that to almost any light coulour is trivial for the most part because you can leave the text colour and most other things untouched and it will still be usable.

However, when you use a dark background, you have to start doing lots of extra work - just making text readable becomes a painful task.

• You have to make a stylesheet that correctly sets all the text colours to a colour that gives high contrast against the dark background. This is simple on a static web page, but when you try applying it to a beast like Confluence and realise how many styles you have to work with, it suddenly turns in to a very time consuming task
• But you have to take account of certain macros that have a light background (eg. the warning macro) and then force the text inside those to have a dark colour!
• There are certain Confluence macros and features that just aren't usable on a dark background. Unless you want to edit the source code, which takes time and could result in bugs, it's just not worth it.

When you start developing with a dark background, you will repeatedly run in to areas of Confluence, plugins, content, features and all manner of other things that need further tweaking.

It costs more to maintain

All new plugins that are developed for Confluence assume a light background. They are developed and tested, for the most part, on a white or light-grey background.

If your site has a dark background, you're likely to run in to problems each time you install a new plugin. In many cases you'll have problems just upgrading plugins because their internal CSS or HTML output may have changed. This also includes Confluence itself and the Builder theme - do an upgrade and subtle changes could result in you spending hours re-working your dark-theme CSS files.

Furthermore, there will be areas of Confluence that you didn't realise existed. Things like the "Insufficient Privileges" pages, the custom "404 not found" page and numerous action pages for plugins, etc. Your users will find those pages eventually and start complaining if there are bits of them that are unusable.

Image nightmares

As well as needing to change all the text and link colours, you also need to make sure your images are designed for the dark background. Many non-regular images are developed on a white bacground, like the image below:

Unable to render embedded object: File (kit.gif) not found.

Now, what happens when that goes on a dark background?

Urg! That looks nasty. So, you have to spend time replacing the white part of the background with whatever background colour you have used. Multiply this up by lots of images on the average site, and you're looking at a lot of expense. There are also cases where it gets tricky to put in the dark background - for example your image might have a drop-shadow on it which suddenly turns in to a drop-glow when you put it on a dark background.

Also, there are vast libraries of stock photos, clip art and all kinds of other images that all tend to be designed for use on a white background. When you use a dark background, or other strong colour, you make it harder to use all those existing images.

Summary

Avoid dark backgrouns like the plague. We've had to implement a few and it was very painful, time consuming and resulted in ongoing regular tweaks to the CSS and content.

If you absolutely must have a dark background, contact us and we'll see if we can help.