6

While reading, I prefer that the text width is "reasonably" small and centered in the middle of the window (just to make an example, pick a blog post layout or the layout of SuperUser itself, which I find easily readable).

I am looking for a way to reduce the line width for all those pages out there which strech from one edge to the other of the window (example: a page from wikipedia). Simply zooming is not effective, because the width doesn't change, and is also not pleasing because it fattens the font size.

Is there some addon which gets this ? I have found, in the accessibility type of extensions, things like Readable which is almost there, but not quite (which is not surprising since I am not using it for its primary purpose).


UPDATE

I have found another application called Readable which almost fits the bill. Only problem is that on some pages it doesn't extract all the text but starts more or less in the middle.

Francesco
  • 674

4 Answers4

3

Have you used Greasemonkey before? Not sure how technical you want to get, but I just put this together:

// ==UserScript==
// @name           Blog width
// @namespace      http://superuser.com/users/685/brianh
// @description    Narrow line length on blogs
// @include        http://*blog*
// ==/UserScript==
var sheet = document.createElement('style');
sheet.innerHTML = 'body{ text-align: justify; font-size: 110%; width: 50%; margin-left: 25%;}'
document.body.appendChild(sheet);

You could fiddle with values inside the sheet.innerHTML to adjust sizes and positions. You can modify the excludes/includes to get it to run (or not run) on the pages you like.

There is also a firefox addon called Stylish that does similar things as Greasemonkey, but sticks mainly to styles, I believe - I have not used Stylish before so I cannot say for sure.

BrianH
  • 783
3

Normally I use the Evernote Clearly add-on to make web pages more readable. In most cases it produces a very nice output, but, unfortunately, for wikipedia, it looks a bit strange.

I just took the Greasemonkey script written by BrianH above, and changed it in a way that it applies only to wikipedia, and makes the line width approximately 80 characters wide, which makes the text more comfortable to read. All credits to BrianH

// ==UserScript==
// @name           Blog width
// @namespace      http://superuser.com/users/685/brianh
// @description    Narrow line length wikipedia
// @include        http*://*wikipedia.org*
// @grant          none
// ==/UserScript==
var newWidth = '50em';
var sheet = document.createElement('style');
sheet.innerHTML = 'body{ text-align: justify; font-size: 100%; width: ' + newWidth + '; margin-left: auto; margin-right: auto;}';
document.body.appendChild(sheet);

var headPan = document.getElementById('mw-head');
headPan.style.right = 'auto';
headPan.style.width = newWidth;
var leftPan = document.getElementById('mw-panel');
leftPan.style.left = 'auto';

And this is how it looks like: enter image description here

Stan
  • 131
  • 4
1

The readability add-on strips pages down to their main text (as best as it can judge).

https://www.readability.com/addons

paulmorriss
  • 1,871
1

You can use the Firefox add-on "Column Reader".

The user interface takes some getting used to, but basically you:

  1. Click the column reader icon
  2. Move your cursor around the web page until the red box surrounds the text you want to read
  3. Double click
  4. Set column count to 1
  5. Set layout to scroll
  6. Set margins as desired
  7. Save your settings
  8. Read