Design

While we understand not every reviewer is comfortable giving design feedback, we encourage you to look through this list of design recommendations while reviewing themes. Using the theme unit test data will also help identify issue with basic design elements.

Typography #

Is the type large enough to comfortably read?

Body text should generally be 14px (or comparable size in ems/rems) or larger on desktop, unless using a font with a generous x-height.

Do paragraphs have enough line-height?

If you squint your eyes, you should still be able to see some space between lines.

Is there enough difference between headers and paragraphs to distinguish them from each other?

A good rule of thumb is 1.3-1.4 on headers and 1.4-1.6 on body text. Ex: line-height: 1.4;

Is the line length of the text comfortable, or does it stretch too far across the page?

Line length on larger screens or wider layouts should generally be between 45-75 characters per line.

Color #

Is the color contrast high enough?

Check if the type is readable against its background. You can use a color contrast analyzer tool [ref] to check if a color and its background have sufficient color contrast.

Could someone with color blindness still view the site and be able to distinguish between sections and read the text?

Color should not be the only way of conveying important information. [ref]

For many people with color blindness, reds and greens look the same. Theme authors should avoid putting the two colors on top of each other. Ex: don’t put green text on a red background.

Design details #

Can you tell if the theme has an intended audience?

“General” or “multipurpose” themes are often hard for new user to set up easily. Consider designing niche themes.

Is the design responsive?

Do the details (drop shadows, gradients, etc.) distract at all from the content?

Are any icons included in the theme vector?

Use svgs with appropriate fallbacks, or an icon font.

Is animation used appropriately?

Animation should be used only to call attention to the most important elements on a page, or to show change.Animation should not be used purely for decoration.

References #

For more information on design, please watch the following presentations on WordCamp.tv:

You can also read these articles: