LAX APM ADA Coordinator Files (LINXS)
This website is coded in HTML5, CSS3, and various web-scripting languages including JavaScript and PHP. Backend services are provided through a content management system (CMS).
In addition to “basic” black and white, accessibledesign.pro uses three branding colors:
The “visual contrast accessibility” of these colors, including several variations, is summarized in a Color Contrast Values table.
When the website is in its default state, most body text and tabular data is composed with the Roboto typeface, while most headings (including table captions and headers) use the Comfortaa typeface. The latter is considered the brand typeface for accessibledesign.pro and its project sites. Both of these typefaces are available for free (along with many others) from Google Fonts.
The following are examples of how the brand colors and brand typography are used throughout this site.
Heading Text | Heading Text | Heading Text | Heading Text |
---|---|---|---|
Body Text | Body Text | Body Text | Body Text |
Footing Text | Footing Text | Footing Text | Footing Text |
Log Table Caption (
|
|||
---|---|---|---|
Log Header | Log Header (sorted) | Log Header | Log Header |
Log Entry | Log Data | Log Data | Log Data |
Log Entry | Log Data | Log Data | Log Data |
Log Entry | Log Data | Log Data | Log Data |
Log Footer (rarely used) |
<h2>
)Example of body text.
<h3>
)Example of body text.
<h4>
)Example of body text.
<h5>
)Example of body text.
<h6>
)Example of body text.
Note that Heading Level 1 (<h1>
) is reserved for the site header.
Example of body text with strong styling in it. Another example of body text with emphasis styling in it. Here is some body text with strongly emphasized text in it. (Bold, italic, and underlined text is deprecated in favor of defined styles.)
Anchors (links) are formatted as follows (these examples have “forced” styles so that they appear correctly): basic links; visited links; activated links; focused links; and hovered links. Here is a sample “live” link for comparison. Note that different brands of web browser may add a border or other elements around focused links, but this is independent of the styles used by this website.
Some text can be deleted, inserted, marked, or striked. ADA is an example of an abbreviation (note the dotted underline). Code text
is rarely used, with sample, variable, and keyboard even less so. (tt
is deprecated!). Inline quotes might look like this.
—Citation, please!
This is an example of a blockquote. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eu viverra dolor. Suspendisse rutrum luctus volutpat. In quis quam mi. Nam a aliquet velit. Pellentesque ornare nulla eget ante semper, et semper dui fringilla. Etiam posuere gravida massa id dapibus. Sed enim elit, varius vitae lectus ut, tincidunt efficitur lectus.
The bigly style class is used instead of <big>
(which is deprecated), but small text makes frequent appearances. Footnotes and similar references often link via superscript text, whereas subscript text is not common.
Text can inlcude hyphens (-), en dashes (–), and em dashes (—). And then there are ellipses (…). So-called “fancy quotes” are used in most cases, but "straight quotes" make some appearances (especially inside their curly brethren). Straight apostrophes (') are rarely used, with the curved version (’) preferred; both are distinguished from marks used for feet (′) and inches (″).
Preformatted text is not common at all.
A standard horizontal rule looks like this:
Some pages such as the Glossary use “separator” elements like this:
Unordered lists look like this:
Ordered lists look like this:
Definition lists look like this:
Various form elements look like this (not all are used by this site):