Online style guide

Extracts from an online style guide created for a content migration project. For concision and because every institution’s style and CMS is different, I have anonymised this information and chosen not to include the full style guide.

Overall Guidance

Writing for web

Web users scan pages for headings, lists, links, images and keywords. Generally this behaviour, different to that when reading printed material. Therefore, copy produced for print (e.g. the season guide) needs to be repurposed for web to cater to this different behaviour.

Always think about what information the user is looking for and make sure they can find this quickly. For us, that will most likely be:

  • Time and date of event, exhibition, screening etc.
  • Location (on or off site, and in which space)
  • Exhibiting artist(s)

These resources should be helpful:

Testing on mobile

Always check everything on a mobile after making them. Otherwise coherent pages may become garbled by mobile display. You can also test from mobile from your desktop computer by…

Common mistakes

Please add to this when you spot something that someone repeatedly gets wrong.

  • Referring to the [institution]
  • Always write the mobile number in the international style (with the country code) e.g. +44 0207 etc.
  • Additionally, every single image needs a description and credit when it is uploaded. When it is used across the site…

Style and Formatting

  • Single space after full-stops. At the end of a sentence always use a single space before the next sentence.
  • Commas: always include a single space after a comma.
  • Hyphens: limit use of hyphens except for…


Numbers, dates, titles and durations

Referring to the [institution], job titles, etc.


Sending a page live

Make sure to check every single link on a new webpage before you send it live. Log out of the site, run the checker, fix everything that needs fixing.

Creating links in text

Add an email address link

Add an internal link

Add an external link (to another website)

Adding a link to a PDF document


Ensure any ‘Contact Us’ mentions include mailto HTML links to the relevant contact. If you are copying & pasting…

Telephone Numbers

Always write the mobile number in the international style. Not all mobile OS recognize phone numbers automatically, so generally you should always link telephone numbers in html:

  • <a href=


Commissioning photography

  • At least half of the commissioned images should be…

Editing existing images

  • Be careful with images that are themselves considered artworks. These should not be…

Saving images

Existing images are saved on the shared server. There are duplicates, strange file names, stranger folder names, missing credit information and it’s a total mess. Try to find the original, uncropped, largest files. Be careful to copy these out locally so you are not directly editing the originals in Photoshop. Once you have uploaded your final versions to the website, you can delete the local copies.

Saving images for web

All images should be uploaded at:

  • 1500 pixels (on the longest axis) where possible
  • 150 dpi (dots per inch)
  • RGB
  • With a maximum file size of 1 MB
  • Saved as jpgs for web, with web friendly file names, metadata stripped
  • And don’t upload gifs or tiffs to the site, it might break
File names

All images should be named in a standardised manner. Use a filename that explains what your image is about. This will help you find it again in the Media Library, and will help Google recognise it BUT it should still be standardised

For exhibition and associated images, I recommend:

Uploading images
  • Description and caption information, which explains to the website user what they are looking at, is really important. Please take time to explain exactly what the image is, not only is this the field that will be read out by an audio screen reader for…
    • An example of a description might be…
    • alt attributes provide…

Adding video

Most content types, such as Exhibitions and Projects have custom video URL fields. For content types where you need to enter the video URL:

  • Upload the video to [host]
  • Once you have uploaded the video, select the video so you are taken to the video page
  • Copy the video URL


Italicise titles of artworks, publications, events in running copy and crediting information.

Then as follows for crediting:

  • Artist’s Name, Title, Year. Photo: First Name Last Name
  • Credits should not include “© [institution]”, as users are already on the site but sometimes we are legally obliged to give information with copyright, so we may have to add “© details, Courtesy of…” etc., if the image is cleared for use on our site by DACS or similar.
  • Event images, images depicting people in the space, and similar ought to be described and then followed by a credit
    • e.g. Visitor in


Accessing CMS

  • Ensure you are using a modern browser, ideally latest version Chrome, do not use Safari 7 or lower. Do not use Internet Explorer at all.

Basic Rules

  • Never delete an existing webpage without creating a…
  • Do not change slugs of existing pages or modules, even if…

Adding events

  • Take the event details from the Event Form, create a draft then ask ticketing to create the ticket.

Adding exhibitions

It’s up to you how what order you do this in, but the most logical might well be:

  • Prepare all images and upload to the asset library
  • Add the Artist
  • Add the Exhibition
  • Add the Gallery guide
  • Add in any rich content (video from youtube if available)
  • Add the exhibition related events if there are any forthcoming 
  • Add install images (when they exist)


Published by c.f. prior

writer, swimmer, climber, gardener