Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Blog pages are rendered too narrow #53

Open
johlju opened this issue Aug 14, 2019 · 3 comments · Fixed by #54
Open

Blog pages are rendered too narrow #53

johlju opened this issue Aug 14, 2019 · 3 comments · Fixed by #54
Labels
enhancement The issue is an enhancement request. help wanted The issue is up for grabs for anyone in the community.

Comments

@johlju
Copy link
Member

johlju commented Aug 14, 2019

This issue was reported in PR #50.

The rendering with hugo is fine but the text column is pretty narrow. This is how the page looks like at the 1920x1200 resolution:

image

Is is possible to make the text column adapt dynamically to the browser window?

@johlju johlju added enhancement The issue is an enhancement request. help wanted The issue is up for grabs for anyone in the community. labels Aug 14, 2019
@gaelcolas gaelcolas changed the title Blog pages are rendered to narrow Blog pages are rendered too narrow Aug 14, 2019
gaelcolas added a commit that referenced this issue Aug 14, 2019
johlju pushed a commit that referenced this issue Aug 14, 2019
johlju added a commit that referenced this issue Aug 14, 2019
johlju added a commit that referenced this issue Aug 14, 2019
@johlju johlju reopened this Aug 14, 2019
@NReilingh
Copy link

NReilingh commented Sep 6, 2019

Changing the text column for blog posts from fixed width to fluid is not a good idea. Typography best practices optimize for readability by taking into account a large number of factors, including line length. Basically, when the eyes track to the end of a line and need to find the beginning of the next line, it is easier for them to do this when the lines are short compared to the lines being long. Letting lines stretch to the width of the window drastically decreases readability at large window widths.

This issue is best left to the subject matter experts that designed the blogging software that is in use on this site. (There's a reason every single piece of successful blogging software uses fixed-width templates.)

Resources/Citations:

@raandree
Copy link
Contributor

This discussion has lines with a length of about 110 chars, @NReilingh blog goes to 115, docs.microsoft.com even to 135 (but fluid). Of course, there is a length limit for everyone allowing somebody to find the next line without using the finger on the screen. But I would like to be able to decide by myself what max length is comfortable for me. Max line length of 60 to 80 is mostly seen on newspaper sites and I suspect mostly to have more space for advertising.

Supporting a fluid width should allow users to select their own max length. However, a fixed width enforces this ignoring that people are just different.

@NReilingh
Copy link

@raandree The current blog design already does what docs.microsoft.com does — it defines a fixed max width and then reflows responsively to accommodate smaller screen widths. Obviously, requiring horizontal scroll to read is even worse for readability than unbounded line length at large widths, so I'm not suggesting that by any means.

I don't really understand the argument that you would like to decide by yourself what max length is comfortable for you. The site already has a holistically-designed, aesthetically pleasing, fixed-max-width, responsive design that offers good readability at all window widths. Accessibility doesn't mean offering flexibility at the expense of sensible defaults.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement The issue is an enhancement request. help wanted The issue is up for grabs for anyone in the community.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants