• Do not
override the default layout properties with an element selector rule,
as this creates maintenance difficulties when the expected behavior for
most uses of the element is changed. The example:
P { margin:0; }
will
no longer provide paragraph breaks. If this is the desired behavior in
one scenario, create an id or class selector instead. Note: this does
not apply to colors or fonts, or any element that is guaranteed to
adhere to the new layout consistently across the site (<body>).
•
Ensure classes and ids identify what an element represents, not how it
should look, e.g. "page-title" = good, "column-1" or "white-border" =
bad
• Only create common classes and ids across pages where the
elements themselves are common, e.g. "page-title" is used on almost all
pages and is identical when it is; "vehicle-image" might also appear on
many pages as well, but be a different size, have different margins and
border on the inventory list view vs the model showroom screen.
• Class selectors should be used for items that occur multiple times in one page, id selectors should be used for unique items
•
CSS rules embedded within FTL files should be removed and distributed
to the template css files to insulate the individual templates from
global rule changes.
• Rules should be created within the stylesheets for inline CSS styles.
|