# リーダービューに切り替える

## [リーダービュー]
[リーダービュー]: https://support.mozilla.org/kb/firefox-reader-view-clutter-free-web-pages

[Firefox](https://www.mozilla.org/firefox/browsers) が、ページの記事を読みやすくするために使わせてくれる機能です。
> リーダービューは、ページの記事を読みやすくする Firefox の機能です。記事本文とは関係ないボタンや広告、背景画像、動画を取り除き、レイアウトやテーマを変更して、読みやすい表示にカスタマイズできます。

[Google Chrome](https://www.google.com/chrome) にも[簡易表示](https://support.google.com/accessibility/answer/2633135#read_articles)というユーザー補助機能があります。
> 一部のページは、記事の内容に焦点を当てた簡易表示で読むことができます。

どちらも文章主体のページで使わせてもらえるように感じていましたが、使えないページもありました。2 万字あっても駄目なときは駄目でした。

## [ランドマーク](https://www.w3.org/TR/wai-aria-1.2/#landmark)
[region]: https://www.w3.org/TR/wai-aria-1.2/#region

そこでランドマークの登場です。特に[リーダービュー]とは関係ありませんでしたが、実装してみたら[リーダービュー]が使えるようになっていました。
```html
<header>role=banner</header>
<main aria-label="role=main">
    <section aria-label="role=region">
        <article>role=article</article>
    </section>
</main>
<footer>role=contentinfo</footer>
```

それまでも認識はしていたのですが、[HTML](https://html.spec.whatwg.org/multipage) 要素には暗黙の [ARIA](https://www.w3.org/TR/wai-aria-1.2) ロールなるものがあり、たとえば [`<header>`](https://html.spec.whatwg.org/multipage/sections.html#the-header-element) は [`role="banner"`](https://www.w3.org/TR/wai-aria-1.2/#banner) かもしれない、程度のものでした。
```html
<header>role=banner</header>
<main aria-label="role=main">
    <article>role=article</article>
</main>
<footer>role=contentinfo</footer>
```

あまり違いがないようで、以前の HTML では [`role="region"`][region] が抜けています。

よくよく調べてみたところ [`region`][region] ロールは重要なコンテンツを含むランドマークであるそうです。もしかしたらウェブブラウザが記事を探すときは、[`region`][region] ロールを当てにしている部分もあるのかもしれません。

> A [`landmark`](https://www.w3.org/TR/wai-aria-1.2/#landmark) containing content that is relevant to a specific, author-specified purpose and sufficiently important that users will likely want to be able to navigate to the section easily and to have it listed in a summary of the page. Such a page summary could be generated dynamically by a user agent or assistive technology.