Web design for low connectivity

From KM4Dev Wiki
Jump to: navigation, search

Original Message

From: Carl Jackson, posted on 2009/03/04

Dear Friends,

I am putting a toe back into the world of commissioning a website design after many years out of the loop. The last time I was involved in this process we specified access orientated technical criteria so the site would work just as well in low connectivity situations. I imagine this is now hopelessly out of date (but pasted below for historians of Web 1.0). I am not even sure is a website should be the focus anymore, maybe it should be a technical specification for a portfolio of access oriented social media and mobile phone interventions.

If you have recently written a technical specification for low connectivity access and could share I would be most grateful. Or if you know a good technical designer with experience in this area please share details.

Technical Spec for Web Build Circa 2006

The design of the site must take into account variable levels of internet connectivity, hardware and desktop applications. It is important to ensure that the site is accessible by users based in the UK, overseas, in the office or at home. It is also important that the site is accessible to disabled users.

The designs should be produced as xhtml-compliant templates and CSS. These and any graphics must be designed for fast download with minimum file sizes. The logic of the site structure, the designs and the xhtml should allow all pages to be built programmatically as dynamic pages, quickly and efficiently, from content data, meta data and navigation data held in a content management system database.

Technical specifications for the site must therefore take into account the following factors:

  • Pages should be provided as xhtml-compliant and CSS
  • Xhtml should be designed for "standards compliant" browsers but should "degrade gracefully" to older browsers (version 4 and below), so pages are still usable
  • Pages should be usable in popular but minority browsers such as Opera and Firefox
  • The logic of the site structure, the designs and the xhtml should allow all pages to be built as dynamic pages, programmatically from different possible page components held in a database. They should be such as to ensure good performance, easy maintenance, and affordable programming costs. This is especially important for the navigation and other standard elements - for example the number and complexity of the different templates which are needed to be held by the system for these elements should be minimized.
  • Style classes should be standardized across the site so that any variations in different sections of the site or changes across the whole site, can be easily managed
  • The number of stylesheets to be used should be kept to a minimum.
  • Navigation and standard display graphics should be in gif or jpeg format
  • Pages should conform at least to the W3C Priority level 2 for accessibility.
  • Where javascript is used, pages should work for the user without it - all content and sections of the site should be accessible for non-javascript users
  • Pages should be designed for a screen resolution of 800x600 but taking into account larger resolutions
  • Flash should not be used
  • Frames should not be used
  • Animated graphics or other animations should not be used
  • Graphics files should be small (except for content in areas which require large files, e.g. pictures illustrating research)
  • Java applets should not be used.

Contributors

All replies in full are available in the discussion page. Contributions received with thanks from:

Carl Jackson
Joitske Hulsebosch
Jaap Pels
Gabriele Sani
Christian Kreutz
Peter J. Bury

Related Discussions

Summary

Detailed Description

[the meat of the topic – clearly, crisply communicated summary of the topic. Where relevant, a brief story – no more than 1-2 paragraphs - of how this topic has been turned into practice, ideally from the KM4Dev archives? If the example is long, separate into a separate subsection]

Examples in Application

[One or a few practical examples and references that illustrate the topic or show how it is done in practice]

Recommended Resources

[Links to publications, websites, contacts and general resources shared in the e-discussion]