Redesign of the NCPS Website

During August 2008, Peter Redford proposed a new visual layout for the pages of the NCPS website. Peter demonstrated three pages in the new style: a Home page, an Exhibition page, and a Committee page. A small sub-committee comprising Roger Dye, Tony Redford, Barry Pearson, and Peter himself, agreed that the crisp, modern design was the way ahead.

Barry proposed that the new format should be engineered using the latest powerful implementation standards. More details are supplied below, but in summary these use stylesheets for both overall layout and details of styling. Barry demonstrated the power of using stylesheets in this way, showing how it is possible to change such features as widths, fonts, colours, and many other details. The sub-committee agreed to use this method, and provisionally agreed many of the details. This implementation method is hardly visible to the viewer, but it will make it much easier to change the page design in future. Although it is used by many major websites across the world, it appears to be used by few if any photographic society websites.

Barry also changed the buttons a little, adding "About us" and "Contact us" pages instead of the existing "Location" and "Subscriptions" pages. The "About us" page is where we will "sell" ourselves to visitors and new members. It needs more ideas and contributions.

Only the most important pages have been converted to the new format so far. Some more pages will be converted, but most older pages will typically remain as they are. (Conversion is not a mechanistic process!)

Please tell Barry of any problems such as broken links or difficulty reading the pages on certain browsers, etc. Make suggestions for further improvement.

Techie stuff

About 14 years ago the people developing technical standards for the web proposed "tables" as a way of laying out the content of web pages. For example, we often see columns of information, and/or headers and footers. Styling information was attached to the content of web pages to specify fonts, colours, boldness, and many other features. The problem was that this was all built into each web page, making it hard work to change any of these aspects across a whole website.

There is a well known solution to this type of problem, which isn't specific to the web: "stylesheets". The styles should be specified in just one file on the website, so that major changes can be made to styles and even layout "just" by amending one page. Specifications for using styles sheets for the web were published over 10 years ago.

Unfortunately, browsers didn't implement them very soon or very well. They tended to be OK where the stylesheets were just used to style individual features, such as fonts and colours. But they tended to fail when trying to layout the main components of the page. The problem was made worse by the lack of good tools for designing and developing websites that use stylesheet-positioning. So even websites that used stylesheets typically still used tables for layout purposes.

Even recent browsers haven't got everything right, but they do enough for most purposes. Web development tools have got much better. In perhaps the last 5 years that it has become sensible to design complicated pages this way, although it often still needs kludges! (And any given page may look different in different browsers, or with different browser settings).

Most of the major "visually important" websites in the world now use this approach: BBC, Times, Tesco, YouTube, and very many others. They have been redesigned and re-engineered in the last few years and adopted this method. (Some special cases such as Amazon, Google News, and Wikipedia, don't use stylesheets for positioning, but their reasons don't apply to NCPS).

Photographic societies typically haven't made the change yet. NCPS has decided "now is the right time" to switch from tables to stylesheet-layout.