It is important for end-users to have quick and responsive websites. This improves your business metrics, such as engagement, retention, and conversion. Using fast and reliable CSS contributes to creating appealing sites.
In this article, you will learn essential practices to help you create fast websites. Additionally, you will learn about patterns that negatively affect the speed of your sites. These patterns and practices are generic and you can use them everywhere.
RECOMMENDATION: We recommend getting familiar with the documentation of the Bootstrap theming guide before starting work on your theme. For more information, see Theming Bootstrap on the Bootstrap site.
Good CSS practices
We recommend following these practices when creating your Sitefinity CMS websites.
- Create reusable styles with CSS classes.
- Use shorthand properties where possible.
- Use a CSS reset stylesheet.
- Make your CSS readable, add comments, and validate it.
- Use a CSS preprocessor.
- Compress the CSS for production.
CSS practices to avoid
The following CSS code patterns may impact your sites negatively. We recommend using the provided alternatives instead.
IMPORTANT: These CSS patterns may result in CSS leaking in the New content editor.
- Do not use
!important rules, especially on element type selectors.
- Do not use type selector, ID selector, or combinators (
>, +, ~).
- Do not use selectors with higher specificity and do not use unnecessary selectors.
- Do not mix tag names with ID or class name.
- Do not declare the same CSS rule repeatedly.
- Do not use the same selector repetitively.
- Avoid using inline styles.