Thread: Re: Documentation website reading widths

Re: Documentation website reading widths

From
Álvaro Herrera
Date:
On 2025-Feb-02, Noob Trall wrote:

> Hello. As per old Wikipedia’s design, it is hard to read text from a
> wide screen since it spans like so without any limitations:
> I understand it may be so because of the widths of SQL queries.
> I propose to add a switcher alongside the «Dark mode» one to select
> reading width, and change «max-width» property of paragraphs inside so
> that it would be easier to read.

What examples of websites can you list that work this way?

-- 
Álvaro Herrera         PostgreSQL Developer  —  https://www.EnterpriseDB.com/



Re: Documentation website reading widths

From
Daniel Gustafsson
Date:
> On 4 Feb 2025, at 08:29, Cédric Villemain <Cedric.Villemain@Data-Bene.io> wrote:
> On 03/02/2025 08:51, Álvaro Herrera wrote:
>> On 2025-Feb-02, Noob Trall wrote:

>>> Hello. As per old Wikipedia’s design, it is hard to read text from a
>>> wide screen since it spans like so without any limitations:
>>> I understand it may be so because of the widths of SQL queries.
>>>  I propose to add a switcher alongside the «Dark mode» one to select
>>> reading width, and change «max-width» property of paragraphs inside so
>>> that it would be easier to read.
>>>
>> What examples of websites can you list that work this way?
>
> I second the request or to do something here, I think wikipedia is doing that:
> https://en.wikipedia.org/wiki/LaTeX ---

To play around with something like this and to see what it would look like; in
a website inspector disable the col-11 class on the pgContentWrap div and then
use with width attribute on the div to limit the width.  (An actual fix might
be very different but this allows one to see easily.)

I only use small laptop screens so I've not really come across this as a
problem but with the very wide screens that are common on desktops today I can
see a very wide textblock being uncomfortable to read.

--
Daniel Gustafsson




Re: Documentation website reading widths

From
Noob Trall
Date:

For me that’s col-6. It looks like this:



I think everything fits nicely. Maybe decluttering buttons via visual cues like color or boldness or something else to make them more prominent than the chapter’s text or some redesign would be nice too. But in terms of reading I believe it is much superior


 
Вторник, 4 февраля 2025, 18:34 +03:00 от Kushal Hada <kushaldeveloper@gmail.com>:
 

 

On 2/4/25 6:10 AM, Daniel Gustafsson wrote:
Hello. As per old Wikipedia’s design, it is hard to read text from a
wide screen since it spans like so without any limitations

Hi Team,

As a workaround, maybe make the browser window not maximized to take up the full screen?

For everyone else, continuing on what Daniel suggested can you please try changing the col-11 to something like col-xl-4, col-xl-5, col-xl-6 or something like that and reply with what looks best to you? If there is consensus on which number is good, this could be an easy win. For example,

<div id="pgContentWrap" class="col-11 col-xl-5">

It looks like we are using bootstrap 4 based on this file name bootstrap-4.4.1.min.css so we can continue to use this col- names. 

col-xl-* means it will only affect screen sizes wider than 1200px so this way we won't step on the toes of people with narrow screens (I would very much like to keep the current experience when I need to look up something quickly on my phone). 

I have attached a sample screenshot with this email. Please take a look.

Action Item: Please reply with your preferred column size (e.g., col-xl-4, col-xl-5, col-xl-6, or any other number between 1 and 12 for Bootstrap) that you think looks best.

 

Very respectfully, 

Kushal

 
 
--
Noob Trall
Отправлено из Почты Mail