Post Featured Image

Three Tips to Polish Your CSS Work, Delight Clients

Editor’s Note: This is the second post in a series on the benefits of clean coding. For specific information on HTML, look to this post with advice on clean HTML coding.

Clean code is akin to a well-laid-out and error-free email. It conveys your message clearly and without ambiguity, saving time and energy for all parties. Less thoughtfully written code resembles a hastily scrawled note, full of spelling and grammatical mistakes, which opens the door to misinterpretation and aggravation.

Taking the time to write clean CSS benefits you, your team and your client. Grouping, naming and indenting your code are very important factors in writing clean code and much of what we said in our post on writing clean HTML code (link) also applies to CSS. But there are additional steps you can take to ensure your CSS sings.

1. Remember the Alphabet Song

Chances are you will find yourself writing the same lists of descriptions multiple times in a single piece of code, for example, ‘font, width, border, margin, padding.’ Putting that list in alphabetical order ‘border, font, margin, padding, width’ not only makes for better readability but will make it easier for you to immediately spot and correct any duplication of terms.

2. Be Mindful of Browser Support

This is an area that changes regularly so do ensure that you and any developer peers keep up to date on what browser vendors are using for prefixes so you write code that has the best browser support. You can hand code or use third-party text editor services that can help you plug in the most current vendor prefixes to fully automate that process.

3. Put Comments in Your Code

Adding comments to code can act as a visual memory aid to clearly indicate why you (or a peer developer) did what you did at a particular point in time. If you use comments, do write them in a straightforward, conversational tone so the meaning is very clear. I find it particularly useful to add in a comment whenever my code includes a mathematical calculation to flag and explain which kind of calculation is being performed and how the result of that calculation should be expressed.

Clean Code Benefits You, Clients

Clean and uncluttered code translates to a faster running website, teams that work faster and more efficiently, and clients that are likely to recommend developers who take the time to write code that is reusable and easy to modify.

Less is more when writing code.

If you write code with the reader firmly in mind, you will focus on the importance of creating clean, readable, and accessible code that not only makes sense in the moment as you’re writing it, but is still fully comprehensible a year or two in the future.