Example
Introduction
This is Gazetteer, a template designed for laying out content in a newspaper-style format. This design is my own; any resemblances to existing websites are coincidental.
“The design does not use any tables”
This template is marked up in XHTML 1.0 Strict and styled with CSS, allowing for greater compatibility and transformability. The design does not use any tables, resulting in greater design flexibility and cleaner code.
I hope you like this template. You are free to use this design for any purpose you wish — personal, commercial or otherwise — without any obligation. If you publish a website that’s based on Gazetteer, please email me your site’s URI.
Features
Screen stylesheet. Gazetteer uses a comprehensive screen stylesheet that has been tested for consistent rendering in Gecko (Mozilla Firebird 0.7), Opera (7.01) and Internet Explorer (6.0).
This means that people using standards-compliant browsers will see the same format and layout of your page.
Print media stylesheet. Gazetteer has a print media stylesheet that styles the page in a format appropriate for black and white printing.
To see the effect of this stylesheet, select print preview from the file menu, or direct this page to a printer (NB: print only this frame if you are viewing this template in a multi-frame document).
Alternative stylesheets. This template contains alternative stylesheets, which allow you to view different layouts of the page.
“Alternative stylesheets”
The alternative stylesheets are: Compact (for viewing the page on handhelds), Crimson (a different colour scheme), Larger Fonts (for improved accessibility) and Print Preview (to see what the page looks like when printed).
To view the alternative stylesheets in Gecko, look in the use style submenu under the view menu (for Mozilla), or use the stylesheet switcher in the bottom-left corner of the browser’s window (for Firebird).
If you are using a different browser, you’ll need to download this template, renamed one of the stylesheet files (they end in .css) to default.css, and open/refresh the HTML file.
Accessibility. This design incorporates accessibility features for people with impaired vision. The template tentatively conforms to the WCAG double A rating and § 508 guidelines for web content accessibility.
The relative simplicity of the template’s underlying markup ensures that your page can be easily transformed for rendering in aural, tactile (braille) and other non-visual user agents.
Additionally, the majority of document metrics (widths, lengths and spacings) are font-size relative. This means that a user can increase the default font size of your page (using their browser) without compromising it’s layout.
Important Note
Please note: this template is a simple HTML file (with stylesheets); it’s not like a word processor. You’ll have to manually write the text in each column separately, and there’s no automatic balancing of column lengths. You have been warned!