---
schema_version: "1"
id: a803b9dfdfd818bc6ed372a29757028dd3d438579ea61e6e4973462928cf134d
title: Optimize CSS
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/salesforce-pages-developers-guide/guides/pages/best-practices/best-practices-performance/pages-best-practices-perf-css.md
canonical_url: https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-best-practices-perf-css.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: a9ada77305fbbbde1b89a96ca88867220c7f52a4ada3a73b6785850b13230e90
products:
  - Visualforce Developer Guide
  - Platform Developer Content
---

# Optimize CSS

To ensure efficient delivery to the client, optimize the CSS in a Visualforce page. Optimized CSS also improves caching and reduces load times.

To improve the CSS in a Visualforce page:

-   Externalize style sheets. Remove inline CSS code from the Visualforce page and put it in a separate CSS file. This practice increases the number of initial HTTP requests, but reduces the size of individual pages. After the browser caches the style sheets, the overall request size decreases.
-   Combine all CSS files into a single file, which reduces the number of HTTP requests.
-   Remove comments and extra whitespace. Compress the resulting file for faster downloads.
-   Use static resources to serve CSS files. Style sheets served this way benefit from the caching and the content distribution network (CDN) built into Salesforce.
-   For pages that don't use Salesforce CSS files, set the `<apex:page>` tag’s `showHeaders` and `standardStylesheets` attributes to `false`. This practice excludes the standard Salesforce CSS files from the generated page header.

**See Also**  


-   [Using Static Resources](https://developer.salesforce.com/docs/platform/resources/pages-resources.md)