Minify CSS

How minify CSS to save space

Speed performance

How minify CSS to save space

Minified CSS files can give you the opportunity to save some space in terms of KiB (kibibytes): SeoChecker lists you in a table like the one below all the unminified CSS files, their size and their potential saving:

minify css

 

If you minify your CSS files, this will result in a saving in terms of loading performance, because usually they tend to be larger than it's needed.

For instance:

/* Header background should match brand colors. */
h1 {
  background-color: #000000;
}
h2 {
  background-color: #000000;
}

can become:

h1, h2 { background-color: #000000; }

that uses a lot less bytes than the first one and it results completely equivalent to it. It can also be used without whitespace:

h1,h2{background-color:#000000;}

You can minify your CSS files in two ways:

  • if you are a professional developer, the best solution for you is to arrange an automated workflow to minify it automatically. You can use a tool such as Webpack or Gulp.
  • if you have a small site that is not updated frequently, there is the option to minify the files manually with an online service: you simply have to paste the CSS code in the service and you will obtain a minified version of it.

Related guides

Learn more about Speed performance

Seo Audit

SEO Audit

On page SEO performance and page checkup.

Over 300 parameters for the deeper page analysis.

Try it now

Share this Guide

Did you like it? Share it!

Share this tool

Web tools for modern developers. Try these one!

Over 50 generators, builders and validators to improve your SEO and web performances

Home Back to top of the page