Contributors
@paul-boag
Business Benefits
Make your copy more effective and persuasive.
Position the copy to follow the F Pattern by locating important information in the upper left corner.
Give important copy bigger fonts to align the visual hierarchy with your copy.
The most important piece of copy should be the most noticeable. For example, your main headline should be bigger than less important subheadings.
Eliminate content and elements that don’t support the page goal.
The more stimuli you give the user, the more time they need to make a decision. For example, the image on the left has too many elements.
Use bigger and higher-contrast fonts for better readability.
Guidelines for readable body copy:
- At least 16px font size.
- At least 1.5 line-height.
- Text paragraph max width 900 pixels - usually less.
- Use no more than 3-4 lines per paragraph.
- Avoid light font styles - thin characters are hard to see.
- Maximize legibility with maximum contrast.
Break up a wall of text with subheadings, images, and lists to make it easier to navigate and skim.
- Organize copy in chunks.
- Add subheadings.
- Use a ragged right text alignment.
- Switch up the alignment of copy chunks.
- Include relevant images & icons.
- Convert paragraphs to checklists, bullet lists, or ordered lists.
Use conversion-friendly directional cues like arrows or humans pointing to guide the readers’ attention to important copy and elements.
Add contrast to make the copy stand out from the background.
Reserve high-color contrast for CTA buttons and other page goals. Use dark overlays on images to ensure the copy on top is readable.
Last edited by @hesh_fekry 2023-11-14T11:15:38Z