Skip to Main Content
Sustainable Web Design Logo
  • Home
  • Guidelines
  • Emissions
  • Ratings
  • Contact

◂ UX Design guidelines

2.10 Use Recognized Design Patterns

UX Design

Visitors can identify patterns fairly easily, and they like browsing websites and apps and feeling as if they know what they are dealing with. As such, focusing your efforts on producing a product or service that is clean and has key components in easy-to-recognize locations (and visuals) will allow faster user-experiences and fewer emissions.

Criteria

  • Design Patterns: Provide only essential components visible at the time they are needed. Where appropriate, interfaces should deploy visual styles (patterns) that are easily recognized and used.

Impact

Medium

Effort

Low

Benefits

  • Environmental:
    Using easily recognized design components will reduce the amount of time visitors spend browsing between pages, trying to identify the information they came to your resource to locate. As such, the less time visitors spend on your site, the greater the efficiency savings in terms of emissions.
  • Accessibility:
    Recognizable design patterns can help people with cognitive disabilities easily understand how to perform a task. Similarly, simple layouts often improve access to information as well.
  • Performance:
    Using recognized patterns that appear where visitors expect, and only when they require them may increase the perceived speed of the website or application as navigation from point to point will increase due to the ease of use.

GRI

  • materials: Medium
  • energy: Low
  • water: Medium
  • emissions: Low

Example

  • Clean, simple, honest website layout examples.

Resources

  • Choose a design that is simple, clear and tailored to the web
  • Dark mode can save battery, but only if your device has an OLED screen
  • Dark Mode Can Improve Text Readability — But Not for Everyone
  • Design patterns
  • GreenIT (French) 005 – Favoriser un design simple, épuré, adapté au web
  • [GPFEDS] 4.14 – UX and UI (Dark Patterns) (PDF)
  • [GR491] 5-3029 – Visual Soberness
  • Google: Here’s why dark mode massively extends your OLED phone’s battery life
  • How UX design can help tackle climate change
  • Laws Of UX
  • Patterns
  • Patterns.dev
  • The dark side of green web design

View the Guideline

Tags

UIPatternsUsabilityAssetsCSS

Share

More ux design guidelines

2.1 Undertake Systemic Impacts Mapping

UX Design

2.2 Assess and Research Visitor Needs

UX Design

2.3 Research Non-Visitor’s Needs

UX Design

Learn about W3C’s Sustainable Web Interest Group:

A global community advancing sustainability on the web.

Explore the group

This site is brought to you by

Mightybytes Wholegrain Digital
Website Carbon

This page loaded in 0.25 seconds and emitted just 0.5g of CO2

Visit Website Carbon
Ecograder

How green is your website?

Visit Ecograder
© Copyright Sustainable Web Design 2025. Privacy Policy.