Blog

6 CSS tools all Front End Developers should be using

As CSS is getting more complex to write web developers need to be making the most of the vast amount of CSS verifying tools that are widely available.

The variety of tools available will give pointers on errors in the CSS code right up to producing practical stats about the code.

 

  1. CSS Shrink
  • A nifty little tool used for reducing (minification) the file size of your CSS which leads to page load time improvements
  • Minification can make source code hard to read so this step should only be taken once the website is fully built.
  • It is also a good idea to keep a version of your un-minified version of CSS in case you have to revert back or further develop.
  1. W3C CSS Validation service
  • Checks CSS to make sure it complies to the W3C CSS specifications
  1. CSS Lint
  • This tool points out any syntax errors
  • CSS Lint will show any potential issues related to browser compatibility, performance and accessibility
  • The source code is also available on GitHub (https://github.com/CSSLint/csslint) if you wish to use it offline on your computer or web server
  1. CSS Stats
  • Supplies you with a list of stats on your sites CSS for example how many font declarations are made in your style sheets
  1. Can I Use (CSS)
  • This is a good reference to help you see how well supported a certain CSS attribute is across a variety of web browsers.
  1. Codrops CSS Reference
  • A good website for educating or further learning of certain CSS elements, function or pseudo-classes.