How can I ensure my web content appears in Reader view?
What rules do I need to follow to ensure that content appears in the Reader view mode?
Chosen solution
jscher2000 said
A scoring system is used to identify the "main" section of the content, but I don't know how to document it without extensive experimentation Maybe you can follow it better than I can: https://dxr.mozilla.org/mozilla-release/source/toolkit/components/reader/Readability.js#625 (_grabArticle function)
Thanks very much. I'll pass it on to a techie to make sense of it.
Read this answer in context 👍 0All Replies (8)
Unfortunately, there is not a lot of documentation on this topic.
In most cases, Reader View will work on any website that is structured with the correct HTML tags that are standard. I know, for example, that it is very important to have your blog post, page content or whatever it may be wrapped within the <article>
HTML tag.
Here are some web pages that I found about the topic:
- How Does Firefox Reader View Operate (FF version 38.0.5) - Stack Overflow
- Is there a documentation about reading mode in firefox? - Mozilla Support
- How do I make my site compatible with Firefox's Reader View feature? - Webmasters Stack Exchange
- Reader View - Mozilla Wiki
- Firefox Reader View for clutter-free web pages - Mozilla Support
I hope this helps.
Modified
Thanks very much. Answers my question but unfortunately doesn't solve my problem. I'll keep an eye open for any new documentation.
Huwami
Modified
Do you have a link to your website? I can take a look to see how you can fix it to make it work with Reader View.
I apologise for the late reply
The website is https://nice.org.uk
These are examples of the pages that don't work:
The bullet points at the end are lost
https://www.nice.org.uk/standards-and-indicators/how-to-use-quality-standards#identify - the link at the end is lost
On the first two examples, it seems Reader View uses just the contents of the <article> tag.
On the third one, it looks like a random chunk ("Measure the quality of care" section, without that heading) is pulled out of the middle to display in Reader View. I don't know what is going on there, but it's a bit of a tag soup...
I suppose what I'm really looking for is documentation that can be given to developers and web team members to ensure that any pages they write or generate via templates they develop will be able to be displayed as expected in reader view mode if they follow given rules.
I'm not a developer but I do find the feature very helpful. It's a pity Mozilla doesn't promote it more.
If that documentation doesn't exist it would be nice for Mozilla to let everybody know whether it can be expected in future.
A scoring system is used to identify the "main" section of the content, but I don't know how to document it without extensive experimentation Maybe you can follow it better than I can:
https://dxr.mozilla.org/mozilla-release/source/toolkit/components/reader/Readability.js#625 (_grabArticle function)
Chosen Solution
jscher2000 said
A scoring system is used to identify the "main" section of the content, but I don't know how to document it without extensive experimentation Maybe you can follow it better than I can: https://dxr.mozilla.org/mozilla-release/source/toolkit/components/reader/Readability.js#625 (_grabArticle function)
Thanks very much. I'll pass it on to a techie to make sense of it.