Surprise: theme is changed

As you should notice, since monday afternoon, the blog changed to a new look. Here’s a quick summary of the objectives and developments of this theme, which is the third version of the blog.

Three main objectives:

  • Change look: the design of blogs is changing quickly, and the old theme was becoming a bit old, he reached the venerable age of 1,5 year,
  • Optimise performance: As you know, performances of a site are now used to calculate the Google page rank. The previous theme was not optimized,
  • Alignment with WP 3.0’s standards: The previous theme was developed with versions 2.6/2.7 of WordPress. Since then, new versions of this blog engine brought new features and API allowing easier theme development, and better performances.

The design

The new theme fixes, I hope, some shortcomings of previous theme: Sidebars took near 40% of the page width, content in the footer was not very useful, like the accessibility links, unfortunately. Everything was finally quite dense and partitioned by frames, and lines.

The original inspiration comes from Recovery Corrupted file repair. Do not ask me why this site decided me to develop the theme. I don’t know.

I am not a designer. So I try to keep, as possible, a simple design. The other sources of inspiration comes from:

The general principles used:

  • A width equal to 960px,
  • One sidebar, of reasonable width, providing more space for posts,
  • footer more useful, 3 or 4 columns.

The theme may evolve in the coming weeks. I have some remaining questions for the header and footer: color, size …?

Performance Tuning

The previous theme (and plugins) contained several errors:

  • styles were distributed in multiple stylesheets (a regular page would load up to 5 CSS files,
  • I didn’t choose plugins that use the same Javascript library (JQuery, Mootools, …), and all the scripts were loaded every time,
  • Style sheets and scripts weren’t compressed.

The new theme corrects as much as possible these problems:

  • Only 2 or 3 CSS files are loaded, and they are compressed,
  • All plugins use jQuery, as a unique Javascript library. Scripts are loaded into the pages where they are used, and most of them are loaded at the end of page.

For photo viewing, I used previously Slimbox based on Mootools. Because other plugins use jQuery (Contact Form and Sexy Bookmark), I changed library. I chose Shadowbox, for three main reasons: it remains light (even if it requires jQuery), it is easy to use, it resizes the images based on the available size.

The other performance improvement is the use of sprites: multiple images (icons) of 16×16 pixels used throughout the pages are loaded only once, in a single image. The main advantage is that we send only one HTTP request regardless of the number of images to display. For more details, please visit sprites on « A List apart ».

I am waiting few days to see if performances are really improved.

Inside the engine

For HTML / CSS, according my spare time, I didn’t try to develop with new technologies such a CCS 3. Unlike the previous theme, I didn’t use a CSS framework, and I tried to get the simplest structure as possible.

Since version 2.6, WordPress has made great progress, and each version provided a number of tools to help developers of themes. So, this new theme uses

  • functions like body_class, post_class,
  • comments on several level,
  • thumbnails,
  • menus (available in the version 3.0),
  • multiple dynamic areas.

The way of building pages index.php, single.php and comments.php was inspired from the theme default of WordPress and the theme Twenty Ten.

The sidebar and two columns left footer, are fully dynamic and managed by the Widget.

The concept of menu appeared with version 3.0 is very useful. It allows creating structures more or less independent of the content. The main menu of the header can now be anything other than a list of categories or pages. The term menu is restrictive, because the tool can be used in many cases: the first band of links could be a menu, for example.

Conclusion

The change of the theme has two main concerns: aesthetics and performances.

The principle of simplicity followed in this design, will make easier all changes/evolution.

I hope you enjoy this new development, and get an enhanced visual comfort.