Not enough space before Headings

The current typographic styles for H1 etc have always niggled me because they don’t have enough leading or spacing before them. To create easily readable documents, I find myself having to insert a clear paragraph before each heading.
This also makes the space after H1 etc seem too big (hence the need to balance with a whole para beforehand)
I know this is a tiny thing, but it was literally the first thing that popped at me while I was using coda, and it’s been bugging me ever since.

4 Likes

H2/H3 spaces feels really tight too. I too need to manually add line breaks to get sufficient visual separation.

Hi @Jeremy_Yuille and @Donovan_Keith, I’m the designer that worked on the type. Good callout, headings definitely need a generous amount of breathing room above. When designing the type ramp, we thought it looked best with a bit more than a line height of padding above for H1s, H2s, and H3s. We were undecided on whether to make that breathing room a “real” newline, like we do between paragraphs, or padding baked in to the heading, like you’d use when designing a website.

I was anticipating that people would naturally leave a newline themselves before each heading, like they do between paragraphs (in the same way you need to writing markdown, for example). This seemed more flexible, and makes it easier to insert a new paragraph above the heading— you aren’t clicking on padding.

But I’m not sure that was very clear, and I definitely understand that it can feel like extra work to manage, so keeping my eye on it. Does it make sense knowing that the newline above is by design, or still frustrating?

2 Likes

Hi @EvanBrooks - Knowing that the need for a new-line is by design is at least somewhat helpful as that helps to recalibrate my expectations. With markdown, I typically find myself writing something like:

This is some text.
# This is My Heading
This is the text in my paragraph.

But I’m always grateful when Prettier reformats that into:

This is some text.

# This is My Heading

This is the text in my paragraph.

As a compromise, perhaps Coda could auto-add the extra space when you add a Heading, and then allow you to delete it if you so choose?

But really, I think my preference would be for the spacing to sort itself out automatically w/ as little extra typing on my part as possible. I know I care about typesetting/spacing, but most docs users don’t. So it’s pretty common for them to not add the requisite new lines. Which means I’m forever adding them and most docs are uglier than they need to be much of the time.

— edit —

Actually, I think what’s confusing to me is that you automatically get sensible spacing below… but that same thing doesn’t happen above.
image

I think the workflow as you’ve designed it makes sense if you are typing things out and using markdown shortcuts to create headings. But it’s a lot more “clicky” if you are selecting and reformatting lines using the GUI.

2 Likes

I also struggle with the spacing in Coda, and often get the feeling that it looks clunky. For that reason, I continue to use Google docs for writing documents.

In particular:

  • There is more space above a H1 than a H2, which is what I would expect. However, there is actually less space above a H2 than a H3, which is counter-intuitive and looks off.
  • It’s a bit cumbersome to have to manually add space before headings.
  • If you write a doc with a mix of continuous prose and bullets, it looks strange as the bullets have more line-spacing than the prose.
  • If you end a section with bullets and then start a new section with a heading, there is more space than when you end a section with continuous prose.