Open westonruter opened 3 years ago
What is the next step here? Does the responsibility to define these accessible styles lie with the AMP team? Do we want to provide a test implementation right away that can later be ported to the AMP infrastructure?
I think it can be done either way, yes. We could come up with an initial draft of styles that can be used to provide the initial no-JS compatibility and then add them to the noscript > style[amp-noscript]
, and then surface those styles back up to the AMP team to be incorporated into each component's as a new *.noscript.css
stylesheet.
In any case, this is blocked by https://github.com/ampproject/amphtml/issues/36051, since we'd need to be able to override !important
styles.
As of https://github.com/ampproject/amphtml/issues/20609, AMP now supports a
noscript > style[amp-noscript]
element to include styles specifically targeting pages on which JS is disabled. This is particularly important to ensure that certain AMP components have all their information accessible to such users. For example, in https://github.com/ampproject/amphtml/issues/20609#issuecomment-901426550 there is the example ofamp-accordion
where all accordion sections should be forcibly expanded in no-JS context, which can be achieved with this CSS:(Disregard the use of
!important
not being allowed in AMP, for which I've opened https://github.com/ampproject/amphtml/issues/36051.)In the same way as there is an
AmpRuntimeCss
transformer to inlinestyle[amp-custom]
there should also be a transformer to populatenoscript > style[amp-noscript]
with styles that ensure AMP components are able to be rendered accessibly to users with JS disabled. Part of this effort should include contributing basenoscript
styles to each component which we can then be downloaded from the AMP CDN.