diff --git a/pages/writing/accessibility-top-100/the-new-york-times.md b/pages/writing/accessibility-top-100/the-new-york-times.md new file mode 100644 index 00000000..98fdf50e --- /dev/null +++ b/pages/writing/accessibility-top-100/the-new-york-times.md @@ -0,0 +1,114 @@ +--- +title: "Dozens of accessibility issues found on The New York Times. One developer tries to understand why. - Writing - Dustin Whisman" +description: "Dozens of accessibility issues found on The New York Times. One developer tries to understand why. This is part 9 of a series evaluating the accessibility of the top 100 websites in the US." +articleTitle: "Dozens of accessibility issues found on The New York Times. One developer tries to understand why." +layout: default +date: 2024-09-15T00:00:00.000Z +tags: + - writing + - accessibility top 100 +--- + +# Dozens of accessibility issues found on The New York Times. One developer tries to understand why. + +_This is part 9 of a [series](/writing/accessibility-top-100/) evaluating the accessibility of the top 100 websites in the US. This time I'll be taking a look at The New York Times. Read the [methodology description](/writing/accessibility-top-100/methodology) to learn about my process._ + +{% include 'partials/published-date.njk' %} + +## What was tested + +The home page and an article page made the most sense to test, but due to the prevalence of paywalls on the New York Times, those were tested as well. No subscriptions were paid to bypass paywalls—it was mostly a process of trial and error to figure out how to be able to read the whole article. + +
+ A composition of screenshots from nytimes.com on desktop including the home page and a paywalled article that does not include any visible text related to the actual article. +
These were the pages tested on desktop.
+
+ +
+ A composition of screenshots from nytimes.com on mobile including the home page and a paywalled article that includes very little visible text related to the actual article. +
These were the pages tested on mobile.
+
+ +The New York Times was tested on September 15th, 2024. + +## Testing the home page + +### Automated scans + +There’s a stock ticker on the home page that shows the Dow, S&P 500, and Nasdaq changes, but at least the green color used for positive percentages does not have sufficient contrast with the background. It also changes every few seconds with no mechanism to pause it. + +There’s a carousel at the bottom of the Opinion sidebar that is, for some reason, marked up as tabs, and the elements with `role="tab"` include links to opinion articles. Carousels are bad enough, but the choice to use ARIA to incorrectly call them tabs (which are also bad) instead of a list just makes it worse. + +There are quite a few SVG icons that don’t have accessible names, but they are also not explicitly treated as decorative by setting `aria-hidden="true"`. The ones that were spot checked were inside elements with `aria-label` attributes, so the impact is likely minimal, since `aria-label` will override any content inside the element when announcing the name. Some SVGs seem to reuse IDs for some of their inner elements, as well, with values like “Shape”, “Group”, “Page-1”, or “Artboard”, which seems like they were exported from a design tool and not optimized. + +There are multiple navigation landmarks that don’t have accessible names to distinguish them from each other. Given the context of where each `