What Is CSS?

MDN defines CSS as a stylesheet language used to describe the presentation of HTML or XML documents. If the HTML says what each thing is, a heading, a paragraph or a link, the CSS says how it looks. Keeping the two apart makes it possible to change the design of an entire website without touching its content.

The name explains the mechanism. "Style sheets" because the rules are grouped in files or style blocks. "Cascading" because several rules can apply to the same element and the browser decides which one wins based on origin, specificity and order. A general rule can make all paragraphs grey, and a more specific one can make those in the header white.

CSS is no longer released as a single version. It is developed in independent modules, for instance for grid layout, fonts or animations, each moving at its own pace. That is why it makes no sense to talk about CSS4 as a finished version.

A CSS rule has two parts: a selector, which says which elements it applies to, and a list of declarations, which say which properties change and to what value. For example, a selector for second-level headings with the declaration colour blue turns all those headings blue.

CSS can reach the browser in three ways: in a separate file linked from the HTML, in a style block inside the HTML itself or as an attribute on a single element. The difference matters for speed. Lighthouse, Chrome's auditing tool, flags linked stylesheets that the browser has to download before drawing the page as render-blocking resources, and recommends inlining critical CSS, deferring the rest and removing whatever is unused.

Media queries let the same HTML look different depending on screen width, orientation or a preference for dark mode. Thanks to them, a responsive website does not need a separate mobile version: the CSS rearranges the content.

For SEO, CSS counts in two ways. The first is speed: a large or render-blocking stylesheet delays the moment the content becomes visible and can worsen metrics such as LCP, one of the Core Web Vitals. Poorly planned CSS also causes layout shifts when styles arrive late.

The second is understanding. Google says in its robots.txt guide that unimportant style files can be blocked, but not if their absence makes it harder for the crawler to understand the page. Googlebot renders pages and needs the CSS to know, for example, which content is visible and how the page adapts to mobile.

The source code of zds.es shows a style block inlined in the HTML itself: on this glossary's entry about CMS, measured on 8 October 2026, it takes up 124,828 of the page's 186,694 bytes, two thirds. That this is so comes from our own setup, which tells the site generator, Astro, to always inline CSS instead of linking it as a separate file. The advantage is that the site's own CSS does not make the browser wait for an external stylesheet before drawing; the only ones still blocking are two small files from the consent library, of about 20 and 5 KB. The cost is that those bytes travel with every page and are not reused from one visit to the next, as a cached file would be. The icon font, on the other hand, loads from outside with a technique that avoids blocking the first paint.

• Inline the critical CSS, the part needed to draw what is visible on load, and defer the rest.
• Remove unused rules, especially when they come from templates or full frameworks.
• Do not block in robots.txt the style files Google needs to understand the page.
• Reserve space with CSS for images, ads and banners to avoid layout shifts.
• Use media queries to adapt the design to mobile instead of maintaining a separate mobile version.
• Measure the effect of every style change with field data, not only with a lab test.

• Hiding text or links with CSS that are meant only for search engines, which Google treats as spam.
• Loading several complete framework stylesheets to use a tiny part of them.
• Blocking the styles folder in robots.txt and leaving Google unable to see the page as a user would.
• Loading web fonts without reserved space or a fallback font, causing visible jumps when they swap.
• Judging a page's speed only on desktop, when CSS weighs more on phones with slow connections.