Forum Moderators: Robert Charlton & goodroi

Message Too Old, No Replies

How to tell a mobile browser to use the 'Reader View' mode?

         

Selen

3:22 am on Jul 11, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



I don't have a mobile version of my site (it has fixed width about 960px). But it looks great in Reader View mode on all modern web browsers I checked. Is there an easy way to tell Google or other search engines to just default to the Reader View when the site is accessed from a mobile device?

If so, do I still need to create a mobile version of the site (I would not be able to make it better than the 'free' Reader View version already available in all modern browsers). Why reinvent the wheel and create something that is already done by browsers?

Wilburforce

8:20 am on Jul 11, 2015 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



"Reader" view doesn't have any defined standard, so implementation will vary from browser to browser, and doing what you ask would leave you at the mercy of future unknown changes in unknown browsers.

Unless you are on a content-managed system, the simplest way to achieve the same thing would be to create a separate stylesheet for small-screen devices, with display:none; for all things (images, buttons...) reader view doesn't usually show, and - as most reader viewers use generic styles for most other items - almost no extra css. It shouldn't take you very long to do.

Then use something like:

<link rel="stylesheet" type="text/css" media="only all and (min-width: 481px), print" href="desktop.css">
<link rel="stylesheet" type="text/css" media="only screen and (max-width: 480px)" href="mobile.css">

in the Head section of all pages. The widths you decide on are up to you, but most current phones and similar small-screen devices are wider than the earlier "default" of 320px.

Max-width and min-width works in current versions of all major browsers and doing it this way is recognised as "mobile-friendly" by Google.

You would do better, however, to take the time to design your own mobile view. It takes more css, but it enables you to address site-specific anomalies that reader views generally ignore.

lucy24

6:07 pm on Jul 11, 2015 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



all modern web browsers

Huh?

londrum

7:32 pm on Jul 11, 2015 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



if i try using the reader view on safari on my mac, all it shows is the content of the second post -- wilburforce's post. your original post, and lucy's post, and everything else on the page totally disappears. so i wouldn't rely on it too much -- it seems a bit flaky to me.

Selen

9:11 pm on Jul 11, 2015 (gmt 0)

10+ Year Member Top Contributors Of The Month



Thinking more about it.. since Reader removes everything but text it's likely to remove ads too so in the end promoting it would be like shooting oneself in the foot (unless you don't have any image advertising on the site...).