AO3 Brand Book

In General

Logo

This is our logo: our logo in red

On a screen it's shown in red, colour #990000.

The logo has an aspect ratio of [INSERT]. The height is always [INSERT] of the width. Don't change the aspect ratio.

top

Fonts

Headings, Subheadings, Titles, Addresses
Fertigo
We load this font when a user first accesses the archive, but you can also download Fertigo for free yourself.
Use Fertigo on the screen and in print when writing the Archive name. Use it for lettering on icons and logos.
Body text, Serif (print)
Georgia
Georgia is a core web font; this means that everyone has it installed on their computer.
Use Georgia to print out pages from the Archive.
Body text, Sans-serif (screen)
Lucida Grande/ Verdana
Lucida Grande is an Apple system font. All Apple users have it. Verdana is a core web font. All PC users have it.
Use Lucida/Verdana for electronic materials, like web pages.

top

Colours

We use five basic colours in all our materials
HEX C M Y K R G B
red   #990000 26 100 100 28 187 0 17  
white   #FFFFFF 0 0 0 0 255 255 255  
black   #000000 0 0 0 100 0 0 0  
light grey   #DDDDDD web only 221 221 221  
dark grey   #333333 web only 51 51 51  

top


On the Screen

Resources

Download these branding resources (right click and save)

top

Logo

This is our logo: our logo in red

On the screen we show it in this red: #990000. Don't change the colour.

Fonts

Headings, Subheadings, Titles, Addresses
400 weight, Fertigo
We load this font when a user first accesses the archive, but you can also download Fertigo for free yourself.
Where Fertigo is not available, we fall back through the other brand fonts, like so: h1, h2, h3, h4, h5, h6 { font-family: FertigoProRegular, Cambria, Constantia, Palatino, Georgia, sans-serif; font-weight: 400;} . In other words: Cambria is Fertigo's understudy.
Fertigo should be used in these structural elements:
Headings
h1, h2, h3, h4, h5, h6
Main Navigation:
.navigation a
Fertigo should not be used in these structural elements:
Definition terms, captions
dt, caption
Emphasised and strongly emphasised text
em, strong
Body text
'Lucida Grande', Verdana, Helvetica, Tahoma, Arial, sans-serif
'Lucida Grande' is an Apple system font. All Mac users have Lucida. Verdana is a core web font; nearly everybody has it on their PC. Where these fonts are not available, we fall back through the stack.

Lucida/Verdana should be used in the main body of the text, like this paragraph.

top

Colours

We use these colours on the screen
Use HEX R G B
red   Logo, Mast Head, Titles, Tag Hover #990000 187 0 17  
white   Page background #FFFEF9 ? ? ?  
dark grey   Text, Borders #222222 ? ? ?  
darkest grey   Links #111111 ? ? ?  

We also use a range of light greys to colour boxes and mark borders.

System and error messages use their own separate colour scheme. This has not yet been rigorously designed, but roughly follows:

Don't use other colours.

XHTML

Our webpages are written in XHTML 1.0 Strict.

They must be well formed; they should broadly validate. This means that, in general, they should pass the checker at the W3C Markup Validation Service.

Our XHTML documents must degrade gracefully. This means that they must not lose critical content when accessed by alternative technologies, like really old browsers, screen readers, or mobile phones. It does not mean it should look the same in every browser.

These requirements are detailed in our Accessibility Statement and our Coding Standards

top

CSS

We style our webpages with CSS. The specifics should be detailed in our site docs, not in the brand book.

top

Banners, Buttons, Links

These resources should be in a public area like "Press Kit", I suspect. Links to be directed once live.

Graphic links
red icon
<a href="http://www.transformativeworks.org/"><img src="../" alt="Organization for Transformative Works" /></a>
Blah blahblah: more banners and crap go here.
tba
Plain code links
A03
...etc

top

Email

To Be Defined.

top


In Print

Our default print stylesheet is called print.css.

Fonts

top

Colours

We use two colours in our print styles
HEX C M Y K R G B
white   #FFFFFF 0 0 0 0 255 255 255  
black   #000000 0 0 0 100 0 0 0  

Don't use any other colours.

top