We use an 8-column grid with a 6-pixel baseline grid. Always use traditional type sizes (9, 10, 11, 12, 14, 16, 18, 21, 24, 30, 36, 48, 60, 72) and align type to horizontal baselines to ensure consistent craft in your layouts.
Your grid should always maintain 8 columns, scaled to the width of your page, with each split into 4 sub columns. Horizontal baseline rows should always be based on a 6-pixel/point grid unit.
The “thick” bar can be made thicker or thinner depending on your needs.
Choose “thick” bar location
You can make 2 bars “thick” if you need more space for other layout/copy elements.
Note that we still include our “thin” white border around the image.
Where no calls-to-action exist, highlight one important element in orange.
Only highlight calls-to-action in orange.
Make sure to include a 1pt #e6e6e6 stroke around the edge.
728 x 90
970 x 250
300 x 250
300 x 600
Mobile 320 x 50
Build all mobile units at double size to ensure clarity.
Minimum type size for mobile is 6px.
Only highlight calls-to-action in orange.
Highlight links or calls-to-action. If none are included, highlight the vehicle name.
For long-form interactive pieces, keep orange reserved for interactive elements.
Desktop
Mobile
Cover
Call attention to features by highlighting in orange.
Always align text blocks to the top or bottom of a page or object.
If word count goes over 8 to 10 words per line, use 2-column layout.
Copy should never fill more than 75% of a page unless you are building a chart or legal section.
Subheads can either lead into or be above paragraph copy depending how much space you need.
Always use padding. Images should never butt up to each other.
Use Harriet Text, rotated 90 degrees for captions.
Always keep disclaimers in one-column layout.