The AWMC website was redesigned during summer 2004 to improve the presentation of content, streamline editing and bring its structure and coding into compliance with web standards. These changes improve our ability to update the site rapidly, and will also make it easier for a wide variety of users to find and read its content, including those who use mobile devices and voice- or Braille-capable user agents, as well as those who have adjusted their browser settings to provide larger fonts or high contrast color schemes.
One consequence of this change is that users of older web browsers that do not comply with web standards will not be able to view the site as formatted. We have tested the site extensively with Firefox, versions 0.8 and 0.9, the newest, standard-compliant free browser from Mozilla. We have also tested the site with the widely-used Microsoft Internet Explorer 5.5 and 6. Although the latter browser is not standard-compliant, we have been able to make it perform correctly on our site by using Dean Edwards’s amazing IE7 CSS-based IE Compliance Patch (thanks to Gary Bishop for the tip). Other, newer browsers probably work fine as well, but we have not had the opportunity to test them. Over the past few months, roughly 70% of our website visitors are using Internet Explorer, with another 20% using Netscape and Mozilla browsers.
The site has also been tested with Jaws for Windows, the widely-used screen reading software developed by Freedom Scientific (our thanks to Jason Morningstar, who runs the Accessible Electronic Content initiative for UNC’s Center for Instructional Technology, who conducted the test). As many web designers have recognized, good web design and web design for the visually impaired are complementary imperatives (see Kirk Biglione’s piece on this subject: Suddenly Accessibility is Beautiful). Thus, compliance with web accessibility guidelines emerges as much more than a requirement; it substantively improves the website. You can read more about this site’s accessibility features below.
How the website should look
Fig. 1 - AWMC website in a modern browser
Fig. 2 - AWMC website in an older browser
If you are using a conventional browser (visual user agent), our main page should look similar to that depicted in Figure 1. You should see a dark blue header across the top of the page, with the title in large, white capital letters, followed by the AWMC logo on the right-hand side.
Below this, the left-hand third of the page provides links to a number of permanent features including popular quick links, several mechanisms for navigating the site, a brief descriptive statement about the AWMC as well as contact information, a funding report and a list of staff and affiliates.
The right-hand portion of the page is devoted to summaries of the most recent content updates on the site. No site content is ever eliminated, so you can always find older articles via the indexes or the table of contents.
If, in your browser, the site looks like the image in Figure 2 instead, then you have a non-compliant browser. You should still be able to read all the content on the site with a non-compliant browser, but you will not get the slicker ‘look and feel’ of the new design.
Design considerations
Web publication: XSLT transformations to XHTML
The Hypertext Markup Language remains the standard language for delivering content to user agents over the World-Wide Web. In 2000, the World-wide Web consortium issued a standard describing a new dialect of HTML, formulated according to two principles: disambiguation of format and content, and reformulation in accordance with the XML standards. This recommendation specifies XHTML, and it is this specification that guides the markup of the AWMC website. We do not have the space here to include a detailed discussion of the benefits of using XHTML, but there is an excellent on-line article on the subject: HTML versus XHTML.
The conversion of our XML/TEI source into the XHTML that is served to your browser is accomplished using another W3-specified mechanism: eXtensible Stylesheet Language Transformations. XSLT is:
a language for transforming XML documents into other XML documents.3
Web formatting for visual user agents: CSS2
One of the core differences between HTML and XHTML is the disambiguation of semantics and formatting. In XHTML, the markup represents only the meaning and basic structure of the page content (text, graphics and links). The layout, colors, fonts and other aspects of formatting must be effected by other means. The technology of Cascading Stylesheets (CSS; also defined by W3 recommendations) provides this capability. Our page layout was inspired by the CSS Zen Garden.
Fonts and character encodings
Compliance with web standards, combined with attention to accessibility issues, makes it possible to provide all users of the AWMC website with legible and accurate representation of text in the many ancient and modern languages that are employed in the discussion and study of ancient history and geography. The Unicode Standard:
specifies the representation of text in modern software products and standards ... [providing] a unique numeric code for every character, no matter what the platform, no matter what the program, no matter what the language. ... Unicode enables a single software product or a single website to be targeted across multiple platforms, languages and countries without re-engineering. It allows data to be transported through many different systems without corruption.4
The AWMC website encodes all its text in the 8-bit encoding of Unicode (UTF-8), which is the default encoding for XML. Your browser must be configured to auto-detect font encodings in order for our web page to display correctly. Firefox should do this automatically, but if it does not, select Tools -> Options -> General -> Languages and in the ‘Character Encoding’ box, set the Default Character Encoding to ‘Unicode (UTF-8)’. In Internet Explorer 5.5 and above, select View -> Encoding -> Auto-Select.
You must also have good Unicode fonts installed on your system in order to correctly render text on our pages. Any UTF-8 font that provides full coverage for the following Unicode subranges will work with our site: Latin and Latin-extended, Greek and Coptic (including Greek extended), Spacing Modifier Letters and Combining Diacriticals, as well as standard punctuation and numbering subranges. Our Cascading Stylesheets invoke a number of specific fonts in an order intended to provide both broad compatibility and stylistic consistency. If the first font listed in each category is not available on a given system, the next one is selected. Our font utilization is as follows:
- Page headings:
- Trajan
- Palatino Linotype
- Times New Roman
- Times
- the system’s default serif font
- Subordinate headings and illustration captions:
- Lucida Grande
- Lucida Sans Unicode
- Tahoma
- Arial Unicode MS
- Legendum
- Arial
- Helvetica
- the system’s default sans serif font
- Paragraph text:
- GentiumAlt
- Palatino Linotype
- Times New Roman
- Times
- the system’s default serif font
Font Sizes
Control over the sizes of fonts has been placed in the hands of users who employ standards-compliant browsers. Instead of forcing our characters to be a particular exact size, as many websites do, we encode our font sizes in relative terms, using measures in ems. Thus, the size of all text is relative to the basic size determined by individual font encodings and browser settings. To increase the basic size of all fonts in Firefox, select View -> Increase Text Size from the menu bar. In Internet Explorer, versions 5.5 and greater, select View -> Text Size and then select the next larger size. The basic font size can be reduced in a similar way. Please note that earlier versions of Internet Explorer do not handle font measures in ems correctly (you should consider upgrading to a newer browser).
Accessibility Features
The AWMC website complies with the accessibility provisions of Section 508 (29 U.S.C. 794d) for Web-based Intranet and Internet Information and Applications. These provisions are based on the work of the Web Accessibility Initiative of the World Wide Web Consortium. While these provisions are only binding on federal agencies and their contractors, they provide an excellent guideline for all types of websites. The following list summarizes the compliance issues that currently apply to, and have been verified for, our website (see the full list on the Section 508 website):
- (a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content)
- (c) Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup
- (d) Documents shall be organized so they are readable without requiring an associated style sheet (Figure 2 demonstrates this capability)
- (g) Row and column headers shall be identified for data tables
- (j) Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz
- (m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, the page must provide a link to a plug-in or applet that complies with §1194.21(a) through (l).
- (o) A method shall be provided that permits users to skip repetitive navigation links
Adherence to Section 508 dictates is verified by regular testing and evaluation, using the Cynthia web content accessibility validation solution, backed up by manual tests for those aspects of design compliance that automated systems cannot perform on their own. User tests with Jaws for Windows provide further confidence. Elements of design and process also contribute to site accessibility through such aspects as user-selectable font sizing and auto-resizing page layouts that accomodate different browser window sizes and screen size settings. The use of valid XML, XHTML and CSS elements throughout the website production process (and the use of W3-provided validation solutions for these) ensure reliable and repeatable results.
If you discover any aspects of this website that you believe constitute an accessibility problem, please contact us with the details.
