CSS speech properties are not a dependable way to control how a screen reader announces a web page. The historical speak property belongs to CSS aural/speech styling, and its behavior and support should not be treated as ordinary visual CSS support.
Build the meaning into HTML
<button type="button" aria-label="Close dialog">
<span aria-hidden="true">×</span>
</button>The control has an accessible name without depending on a speech stylesheet. A decorative symbol is hidden from the accessibility tree; the button is not hidden. Read the button lesson for a complete working example.
Inspect rather than guess
Open developer tools and inspect the accessibility tree. The button should be named “Close dialog” and have the button role. Focus it with Tab and activate it with Enter or Space. Test with the screen reader and browser combinations your project supports when spoken behavior matters.
Related speech features
Do not confuse historical speak with the experimental speak-as property or the speak-as descriptor inside @counter-style. They have different syntax, scope, and compatibility. A browser parsing a declaration does not establish what a particular screen reader will announce.
Common mistakes
Do not use speak: none as a substitute for choosing correct HTML semantics or hiding decorative content with appropriate accessibility markup. Keep essential information as readable text and retain labels on form controls.
Sources
CSS Speech Module describes the speech model. MDN: speak-as identifies that separate experimental property. This reference preserves the historical URL while directing ordinary interface work to native semantics.