IMSLP:Site development/Site design

This is an ongoing project to establish and implement a consistent design for the Petrucci Music Library website. Please add your suggestions or remarks on the associated talk page, or start a thread in the Forums if you expect a longer discussion.

Contents

Goals

The goal of a good site design is not only a pleasant visual impact, but first and foremost a functional design which allows for an easy and intuitive navigation both for the new and the experienced users. Another goal is to provide a certain degree of visual continuity across the entire site.

General aspects

Coding

  • All code must be valid XHTML 1.0 Transitional styled using valid CSS.
  • The site must work with all major browsers on all major platforms. This does not necessarily mean that the site must look exactly the same in all browsers. ("graceful degradation", "progressive enhancement")
  • All styles that are used in multiple places should usually be defined in an external style sheet. Styles that are used only in one instance should usually be inline.
  • If possible and practical, deprecated XHTML tags should be avoided.

Fonts

We use the defaults provided by the underlying software (MediaWiki). This has the following advantages:

  • The font family is generically specified as sans-serif (in the Monobook skin). This is in general more legible on a computer screen than serif. Choice of a specific font would be problematic, as no single font is available on every user's computer.
  • The font size is based on the user's browser settings, and is implemented in such a manner that in most browsers, extremely small sizes will automatically be avoided.

For the coding of new design elements, this means the following:

  • A font family should not be specified at all
  • Font sizes should be specified in relative terms (%, em, keywords like "smaller"...), not in absolute terms (px, pt, mm...). Note that too many different font sizes are just confusing. If there is no clear reason for doing otherwise, the normal default font size should be used.

Colours

We should aim for a fixed colour palette for (almost) all elements of the site. This is a necessary basis for a unified and organic appearance of the site as a whole. Of course, the palette can be changed over time.

An attempt has been made to establish such a palette, but with only limited success so far.

Individual parts

Page title

On several pages, for example the composer category pages, the first header (page title) is redundant. Unfortunately, composer categories are technically indistinguishable from other categories, where the page title may actually be needed. Thus there may be no easy solution to get rid of the superfluous header.

Work pages

see Work page redesign