Skip to content

Instantly share code, notes, and snippets.

@bnb
Last active August 26, 2016 20:52
Show Gist options
  • Save bnb/ea2b315c44ff83c14c30a39682f238a3 to your computer and use it in GitHub Desktop.
Save bnb/ea2b315c44ff83c14c30a39682f238a3 to your computer and use it in GitHub Desktop.
Response to @Trott on fixing the Node.js blog / Weekly Updates that goes outside the scope of the issue that was being discussed.

From a design perspective, one of the major problems with that currently is that it's all sans-serif - that's a major readability problem. Another is that the font sizes are so close that it's hard to differentiate. Yet another is that the color is the same. Even further, the line-length is far too long to be highly readable. All these factors provide no visual separation between normal text and headings.

That's a bare-bones analysis of the design issues. How do you fix them?

p, article.ul {
    font-family: serif;
} 

h3 {
    font-size: 1.4em;
}

article {
    max-width: 800px;
    margin: 0 auto;
}

That dramatically improves the updates, as well as other blog posts most likely.

@Trott
Copy link

Trott commented Aug 26, 2016

Yes, that's an improvement. I'd throw in:

  • Add a bit more space or other separation above headers so that sections are more distinct.
  • Be consistent about bulleted list/description formatting. Sometimes we start the descriptive text on the same line following the item, and sometimes we start it below as a separate paragraph. I would do the former all the time. That would have the benefit of forcing concision on items, as you could not have more than one paragraph of text to describe any item.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment