processing / processing-pi-website

Files for the pi.processing.org subdomain that documents Processing on the Raspberry Pi
https://pi.processing.org/
16 stars 10 forks source link

Design: Article layout #2

Closed gohai closed 5 years ago

gohai commented 6 years ago

The different sections would benefit from some breathing room before/after. It might also be worth limiting the (maximum-) width of the text in paragraphs. Right now the text will go as wide as the container is, but I believe it's best not to go above 90 characters per line for readability.


screen shot 2018-05-30 at 10 36 12 am
msurguy commented 6 years ago

@gohai I've addressed some of the issues you raised in https://github.com/processing/processing-pi-website/pull/8 and in https://github.com/processing/processing-pi-website/pull/7

The video elements lacked bottom margin which reduced the spacing between the header elements so I added the bottom margin to video elements.

If you feel like other elements need more room, please let me know!

gohai commented 6 years ago

Believe this would still want more breathing room vertically...

Attaching two examples below - perhaps a CSS selector for headings that are not the first child, which pushes them down? Or just more space before and after paragraphs in general?

Notice how the "Tar-balls" heading is closer to the line of code above, than the line of code is to the previous paragraph it belongs to? The block "A first Processing sketch" is almost equally tucked between those two image blocks, whereas only image further down relates to it.

screen shot 2018-06-14 at 4 28 49 pm screen shot 2018-06-14 at 4 29 11 pm
msurguy commented 5 years ago

These issues have been addressed in previous PRs, closing