[string]

As an actual person employed as a designer and developer, I find articles listing arbitrary design rules very strange indeed. This is like someone enforcing you to use a coding style before you've even learnt the basics of programming.

All these rules will do is ensure you create a website that looks mostly like one designed by the person who has written the article. If you want to create a landing page for genericstarup.io, then maybe that's fine, but it's kind of like building a website by exclusively copy pasting tutorial snippets that you don't understand.

I also disagree quite strongly with the rules laid out in this particular article, but that's another issue...

[lokelow]

As a back end developer that’s been slowly getting into web development, I find the article helpful because it informs me of some design decisions I should be thinking about. By no means do I expect the author’s opinion to always be correct, especially since the design should always be driven by the content and intended audience. But it helps to know I should think about serif vs sans serif, etc. and how it may impact the final product.

[neivin]

As someone with no design background whatsoever, what rules do you disagree with and why?

[string]

I've totally mixed the order (in a rush, about to leave the office) but for example...

> Sans-serif fonts are used for body text

Serifs are most commonly used for body (perhaps this is a mistake on the authors part?), but all manner of typefaces can be used for body text dependent on their design and legibility.

> The line-height is 1.5-2.0

I've been building websites, designing books and drawing type for a number of years. I've never used leading/line-height that large.

> body text isn't pure black on white

This is a huge myth imo.

> (backgrounds) Use a pattern or simple image

99% of the time use neither.

> A text shadow is used to make headings readable

I'd recommend this as a last resort generally, adjust the background first.

> Blocks of text are un-justified

Justified text can be fine in many circumstances.

> body text is 16-18px and is scalable

Totally dependent on the design of the rest of the page.

> There's padding between paragraphs

From a pure CSS standpoint, this should really be margins, not padding.

[httpsterio]

Sans serif fonts are more used on body fonts, because they're more legible on screens. On paper, it's the opposite. Text size plays an important part here, because the serifs in serif fonts makes the letters stand out better on a smaller font size and the serifs "guide" you to the next words, making the paragraphs flow better together.

With HD screens and proper font rendering, sans serif fonts are generally faster and easier to read. These are just some of my observations when doing A/B testing on a few products of ours and there's definitely also a cultural effect at play here. But the poster above isn't definitely in the wrong.

[string]

That's strange to hear, in my experience serif fonts are most definitely used more for body text (referring to paragraphs of text) on sites where legibility is a primary concern. Look at the websites of almost any well designed news outlet (Bloomberg, NYT, Guardian, Reuters, etc). I say this as someone who previously worked for a type foundry that has worked with major organisations on corporate type projects and now works as a web (and occasional book) designer/developer.

[vosper]

> Look at the websites of almost any well designed news outlet

Is it possible that some of this is news-site-specific, due to their heritage as print media, and an online design aesthetic that references (or harkens back to) that?

[string]

Yes definitely, this is what I understood by the cultural effect httpsterio was referring to. I still stand by my statement though, I've had far too many meetings discussing this exact topic.

[Benjammer]

>padding between

I feel like this is a pretty terrible basic mistake to make in a web design article... Thinking of padding as something _between_ elements, as opposed to the space between an element's content and it's border seems like a really basic design 101 mistake.