Pattern: Design Principle No. 5

Look at your outfit. Chances are you’re wearing some sort of pattern right now. Am I right?

In web design, pattern creates consistency through the repetition of certain elements. Today I’m continuing the series, Applying the 7 Principles of Design to WordPress, by sharing some examples of WordPress websites that are using pattern in an inspiring way.

Example: Traveling Vineyard

traveling-vineyard

Traveling Vineyard uses the repetition of circles throughout the site (logo, hero, icons, key, reviews, background, social media icons and loading graphic) to achieve consistency in the overall user experience.

Example: The New Yorker

new-yorker

The New Yorker website incorporates elements from the iconic, printed publication (typefaces, illustration, layout) and brings these patterns to life online.

Tips to create pattern

  • Capture the essence of the logo and brand in the visual elements used in the design
  • For example, if a logo has circles, use circles throughout the site—icons, patterns, graphics
  • Look at existing print collateral to create a complementary design

Know any sites that are using pattern in a way you like? Please post ’em in the comments. Next up—Design Principle No. 6: Rhythm.

About Jill Anderson

Hi, I’m Jill, a WordPress web designer/developer who partners with talented designers, copywriters, and agencies on their websites, and their client’s sites. I’m passionate about crafting beautiful and innovative WordPress websites focused on clear positioning and positive user experiences.

Get new blog postsGET NEW BLOG POSTSIN YOUR INBOX

Like this? Get new posts via email.

No spam, no worries. Just my bimonthly(ish) blog posts straight to your inbox.

Leave a Reply

Your email address will not be published.