Design
Typography is doing more work than you think
Most sites get fonts wrong in the same three ways. Spacing, weight and hierarchy explained without the jargon.

Most people pick a font and think they are done.
Most people choose a font they like and move on. They pick something that looks good in the specimen, drop it on the page and wonder why the site still does not feel quite right.
The font is rarely the problem. How it is used almost always is.
Typography is not just about which typeface you choose. It is about size, weight, spacing, line height, contrast and hierarchy working together. Get any one of those wrong and the whole thing feels off even if you cannot articulate why.
The hierarchy problem
The most common typography mistake is everything being roughly the same size.
When headings, subheadings, body text and labels are all within a few pixels of each other, the eye has no clear path through the page. Everything competes for attention. Nothing wins. The reader works harder than they should and usually gives up.
Good typographic hierarchy gives the eye a clear sequence. This is the most important thing. This is the supporting detail. This is the fine print. The size jumps between levels should be confident, not cautious.
A heading at 48px and body text at 16px creates a clear hierarchy. A heading at 22px and body text at 16px creates visual noise. The difference of six pixels makes almost no difference. The ratio is what matters.
The line length problem
Long lines of text are harder to read than short ones. Not because of any stylistic preference but because of how eyes track across a page and return to the start of the next line.
The comfortable reading range for body text is roughly 60 to 75 characters per line. Below 45 and the eye is making too many jumps. Above 90 and it starts losing its place on the return.
Most websites set text in containers that are too wide. The content stretches edge to edge on a 1440px screen and nobody can read it comfortably.
The fix is simple. Set a max-width on your text containers. Something between 580px and 680px for body text works well in most cases. The white space on either side is not wasted space. It is making the content readable.
The line height problem
Line height is the vertical space between lines of text. Too tight and the text feels claustrophobic. Too loose and it stops reading as a connected block of content.
The default line height in most browsers is around 1.2. For body text that is almost always too tight. A line height of 1.5 to 1.7 makes body text significantly more readable with no other changes.
Headings behave differently. A large heading at 1.5 line height looks wrong because the space between lines becomes visually dominant. Headings generally work better at 1.0 to 1.15 depending on the size and weight.
The weight problem
Using the same weight for everything is like speaking in a monotone. Technically fine. Hard to follow.
Most good type systems use two or three weights deliberately. A heavy weight for headings and key callouts. A regular weight for body text. A light weight for supporting labels and captions.
What does not work is using bold randomly as emphasis without a system. Bolding three sentences in a paragraph because they feel important makes nothing feel important. It just makes the paragraph harder to scan.
If you bold something, it should mean something specific. Use it sparingly enough that it retains that meaning.
The contrast problem
Light grey text on a white background is a design choice that communicates sophistication and ends up being unreadable to a significant portion of your audience.
Contrast is not just an accessibility concern, though it is that too. It is a readability concern. Text that requires effort to read gets skipped. It does not matter how well it is written.
Body text should have a contrast ratio of at least 4.5:1 against its background. Most contrast checking tools are free and take thirty seconds to use. There is no good reason to ship text that fails basic contrast.
Typography is the thing most people think they can handle intuitively and the thing that most reliably reveals whether a site was designed carefully or assembled quickly. Getting it right does not require expensive fonts or complex systems. It requires paying attention to the details that most people skip.
