@charset is not deprecated

[romainmenke]

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/@charset

What specific section or headline is this issue about?

The intro

What information was incorrect, unhelpful, or incomplete?

The @charset CSS rule specifies the character encoding used in the style sheet. Although the first character in @charset is the @ symbol, it is not an at-rule. The CSS syntax module deprecates this rule, defining it as an unrecognized legacy rule to be dropped when a stylesheet is grammar-checked, but it is fully supported in all browsers.

What did you expect to see?

The current wording implies to CSS authors that @charset is deprecated.

While the specification only mentions a change in how @charset is parsed and exposed.
The feature was not deprecated.

Something like this might be better :

The @charset CSS rule specifies the character encoding used in the style sheet. Although the first character in @charset is the @ symbol, it is not an at-rule. It is a specific byte sequence that can only be placed at the very beginning of a stylesheet.

Do you have any supporting links, references, or citations?

w3c/csswg-drafts#9838

Do you have anything more you want to share?

No response

[bsmth]

This was introduced in #31076 - @estelle do you want to take a look?

[estelle]

The CSS syntax module relevant part is https://drafts.csswg.org/css-syntax/#charset-rule.

The algorithm used to determine the fallback encoding for a stylesheet looks for a specific byte sequence as the very first few bytes in the file, which has the syntactic form of an at-rule named "@charset".

However, there is no actual at-rule named @charset. When a stylesheet is actually parsed, any occurrences of an @charset rule must be treated as an unrecognized rule, and thus dropped as invalid when the stylesheet is grammar-checked.

NOTE: In CSS 2.1, @charset was a valid rule. Some legacy specs may still refer to a @charset rule, and explicitly talk about its presence in the stylesheet.

The current MDN text reads:

The CSS syntax module deprecates this rule, defining it as an unrecognized legacy rule to be dropped when a stylesheet is grammar-checked, but it is fully supported in all browsers.

To me, the current MDN text is a good reflection of the spec.

[romainmenke]

The spec text is aimed at implementers.

For CSS authors it isn't relevant how implementers parse @charset. It is only relevant how the feature works as a whole.

For CSS authors no part of the feature was deprecated.
It isn't relevant to them that historically it was parsed differently.

I also do not agree that the current MDN text is a good reflection of the spec.

In the spec it is a note, separate from the main section. In the mdn text it is part of the first paragraph. This places greater importance on this aspect.

The mdn text associates browser support with the deprecation and legacy aspect by placing it in a single sentence. While support should be irrelevant here because the feature isn't deprecated as a whole.

---

I know the current text is causing confusion.
See : stylelint/stylelint#7492 (comment)

Do you foresee an issue for CSS authors in changing the text as I suggested?

[Josh-Cena]

My opinions:

1. The feature of @charset as a special syntax is in no way deprecated and we should call that out.
2. The syntax of @charset as an at-rule is deprecated, in the sense that in an alternative world it would just be a syntax error when encountered not at the start of the sheet. However under the status quo, all that developers would care about is that it has no effect.

Therefore I think what would both reflect the spec and developer intuition is:

1. Stop calling it an at-rule. Call it a special directive or whatever CSS terminology there is.
2. Say that it only works at the very top of the sheet and is ignored in other places.
3. Remove all mentions of deprecation; this feature is not going to be removed and I don't believe any existing behavior will be stripped in the future.

[OnkarRuikar]

To add more info to the context:

Stylesheet authors should author their stylesheets in UTF-8, and ensure that either an HTTP header (or equivalent method) declares the encoding of the stylesheet to be UTF-8, or that the referring document declares its encoding to be UTF-8. (In HTML, this is done by adding a element to the head of the document.)

If neither of these options are available, authors should begin the stylesheet with a UTF-8 BOM or the exact characters
@charset "utf-8";

From above note in the spec it seems @charset is the last resort to specify the .css file encoding, if all other mechanisms are not available.

So they suggest:

• use HTTP header Content-Type
• or <meta charset=utf-8> in HTML docs
• or use UTF-8 BOM. Make sure your IDE/editor does this.
• or use string directive @charset "utf-8";. I think this is good to have if you are not sure how your .css library is going to get deployed and edited. You may have special text, e.g. content: "शैली";, in some rule.

In short, it is no longer an at-rule but it is an alternative to BOM. Not part of the CSS language but a part of the .css file. 🤔

---

There is , however, a deprecation mentioned in the same section of the spec:

The concept of environment encoding only exists for compatibility with legacy content. New formats and new linking mechanisms should not provide an environment encoding, so the stylesheet defaults to UTF-8 instead in the absence of more explicit information.

This is about mentioning encoding while linking style sheets from other languages, e.g. HTML, XML. And we have already addressed it on MDN: the charset attribute on <link> element has been marked deprecated in 2017. Point being instead of specifying encoding on each css liking tag, specify it in the doc header.

[bsmth]

Regarding Josh's comment above, is the language in the "changes in this spec" section helpful to refer to it as an 'encoding declaration'?

@charset is no longer a valid CSS rule (there’s just an encoding declaration that looks like a rule named @charset)