A Guide for CSS Style Sheet

Every CSS author has his preferred way of writing code. For example, a few peoples, prefer to write each property and selector on a separate line, while other would everything on one single line instead of separate line. Some writer/authors never add a semicolon to the last property on a selector (because it isn’t necessary); others prefer to remove the space between the colon and the value of a property. The list goes on. These are just a few examples of how divergent CSS authoring can be from person to person, look into any CSS discussion forum and you will find endless ongoing debates on each of these topics, and many more. You will also probably come to the conclusion that no one is fully right or wrong, there are valid arguments on each side of the fence. However, when dealing with large-scale style sheets, or style sheets that are to be applied to large-scale websites where performance and robustness are the most important factors/aspects, personal preferences usually have to be set aside to give way to a more flexible, logical/coherent way of writing the code. 

You may also like this article: CSS Stylish Table

This approach will not be the most effective at the start (a newly hired developer will have to adapt to the conventions used in the organization, so he won’t be able to immediately start coding without becoming familiar with them), but it will make it easier for staff to edit and update style sheets created by other developers without having to take the time to understand (sometimes the correct word would be “decipher”) and become familiar with someone else’s CSS writing style. Having a set of conventions in place will also make it easier for authors to know which path to take. Even though there is always a degree of subjectivity when creating CSS solutions, if a CSS style guide is in place, many of the doubts will become non-existent since there are “rules” to be followed. It also becomes easier to detect errors, typos, and mistakes. This chapter focuses on the most important points where CSS authoring can be made more consistent and efficient. You will learn the following:

• Why you should have a CSS style guide in place
• Effective ways of formatting CSS
• How to use CSS comments in a useful way
• Best practices on ID and class naming
• Namespacing

You may also like this article: CSS Blurry Text

If you are producing a CSS style guide (as we recommend) that will be known and used by all the members of the team, it can and should include a reference to how CSS is formatted. This will make reading style sheets created by others easier and it will remove part of the subjectivity that is common among CSS authors when creating or editing the files. It should also indicate how comments should be made and encourage the use of them.

You may also like this article: Wordpress Site Architecture

Creating and implementing a CSS style guide will remove some of the inconsistency that is often related to coding CSS, where different developers have different coding styles that can sometimes be extremely difficult for other people to read and understand. This slows down the development process and promotes errors, redundancy, and code bloat. A style guide is an instrumental tool to avoid this, allowing for code re-usability and efficiency through consistency, for a streamlined team environment for developing high-traffic sites. Companies such as the BBC or Drupal have CSS style guides in place that are publicly available and act as good references for anyone who is creating one.

You may also like this article: CSS Subscription Gadget