How can I make my articles readable on smartphones reader?
When I browse on websites with my iPhone, sometimes I get an icon at the top left corner. When I tap it, I get the whole article without all the ads and other stuff on a plain white background.
The HTML in my example screenshot has no special markup - so I guess Safari is smart enough to get the right content.
But is it possible to support such browser features? How are they called and how do they work?
According to this article, you only have to wrap your text with HTML tag. The <article> element works fine as a wrapper; Safari Reader recognizes it. It doesn’t matter which wrapper element you choose, as long as there is one, other than <body> or <p>. You can use <article>, <div>, <section>
Your text should be long enough (100 words) with at least five child elements inside the wrapper. Inside a <p>-tag every <br/>-tag cuts your chapter in two chapters.