Re: CSS for Zsh website?

[David Wales <daviewales@xxxxxxxxxxx>]

On 5 March 2022 12:12:52 am AEDT, Daniel Shahaf <d.s@xxxxxxxxxxxxxxxxxx> 
wrote:
>> If there's consensus that we don't want to use my minimal CSS, and
>> that we do want to adapt fancy CSS from a compatibly licensed project
>
>I think that's a false dichotomy. "Not reinvent the wheel" and "Prefer
>fancy to minimal" are not synonymous; rather, they are orthogonal. That
>is: it's entirely possible to design fancy styling from scratch, as it
>is to reuse someone else's minimal styling.

Agreed. Sorry for the imprecise language on my part.


On 5 March 2022 12:26:16 am AEDT, Daniel Shahaf <d.s@xxxxxxxxxxxxxxxxxx> wrote:
>Lawrence Velázquez wrote on Thu, Mar 03, 2022 at 21:44:48 -0500:
>> On Thu, Mar 3, 2022, at 7:12 PM, Bart Schaefer wrote:
>> > On Thu, Mar 3, 2022 at 3:31 PM Lawrence Velázquez <larryv@xxxxxxx> wrote:
>> >>
>> >> On Thu, Mar 3, 2022, at 5:37 PM, Axel Beckert wrote:
>> >> >
>> >> > On Thu, Mar 03, 2022 at 12:08:11AM +1100, David Wales wrote:
>> >> >>     max-width: 80ch;
>> >> >
>> >> > Please don't artificially restrict the width of text on websites
>> >>
>> >> Hard disagree.  Legibility decreases with line length.
>> >
>> > Soft disagree.  Setting width to 80 characters is no more necessary
>> > than allowing it to be 100% of the viewport.  The only time to use
>> > character widths is with fixed-width fonts.  Set margins, not widths.
>> 
>> Agreed!  I didn't mean to defend the specific CSS that was proffered.
>
>I'm confused.  Didn't you just now post a link that explains why widths
>should be set rather than margins?  Quoting from there [with emphasis
>removed]:
>
>    There isn’t one margin size that will work for all web pages, but
>    the core advice is the same as on the printed page—focus on line
>    length.

I'm not an expert in CSS, typography or even Zsh! However, I believe that limiting the text width to a certain maximum number of characters is best for readability. In fact, another page of the same typography website suggests that the maximum text width should be between 45-90 characters.[1]

I'm not precious about which particular CSS should be used. I'm open to reusing something from another project once this group has reached consensus on the desired style. However, in defence of the CSS ch unit for variable width fonts, I think it provides a very direct way of restricting the number of characters in a line. According to the MDN docs, the ch unit is equal to the width of the digit 0 in the current font. So, if we accept the premise that there should be no more than 90 characters in a line, then specifying 90ch as max-width should be a pretty decent approximation, even if some lines have 88 characters and others 92 due to the variable width font.
I'm not sure how this could be easily  achieved with margins.

As for my specific choice to use 80ch, I wanted to minimise line length without cutting the edges off the code blocks. Looking at the Yodl source, it looked to be hard wrapped to approximately 80 characters, so I hoped this would be a good balance. However, the code blocks are monospaced, so 90ch might be a safer max-width for the variable width body.

I also included `overflow: auto` for the pre tag to ensure that any code blocks longer than the max-width would get scroll bars.


[1] https://practicaltypography.com/line-length.html