Typography

Last modified at 11/6/2024 1:46 PM by calvarez

​​​​​​​​​​

​Optimal readability

The majority of content on Broward.org is text-based therefore, using a typeface that works well for quick & easy reading on all devices is key to an improved website experience. The new Broward.org website uses the recently released ATC Arquette font family designed by Avondale Type Company. It has 8 weights and matching italics. It is a bold but neutral sans-serif designed for ease of legibility across all screen display sizes. For more information on ATC Arquette, visit avondaletypeco.com/fonts.

A typographic system

A complete system of typographic styles based on web standards for readability & properlystructured HTML syntax has been implemented in this redesign. Selecting these styles is as simple as selecting a choice from a dropdown in Sharepoint.

Examples:

title: The Everglades

h1: The Florida Panther

The Florida Panther lives in pinelands, tropical hardwood hammocks, and swamp forests.

The Florida panther is a North American cougar population in South Florida. It lives in pinelands, tropical hardwood hammocks, and mixed freshwater swamp forests. It is known under a number of common names including Costa Rican puma, Florida cougar, and Florida puma.

h2: Section Heading

Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laboru. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum doloreeu fugiat nulla pariatur.

h3: Subsection heading

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum doloreeu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laboru.

h4: Subsection heading

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.

h5: Subsection heading

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.

h6: Subsection heading

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.


Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis.

  • The first unordered list item.
  • A second un ordered list item. This one is pretty long, so it goes over one line and onto the next line.
  • A third unordered list item.
  1. The first ordered list item.
  2. A second ordered list item. This one is pretty long, so it goes over one line and onto the next line.
  3. A third ordered list item.

This is a text link on light background.

This is a link that goes to an external website.

This is a visited link.

This is bold text.

This is italic text.

This is a button
#FirstLastHandle
1MarkOtto@mdo
2JacobThornton@fat
3Larry the Bird@twitter
It was at this moment we realized we should have gone to Italy instead.


​​