Category Archives: Trends

Building a Green Website

An Earth Day consideration of UX.

Today is Earth Day and a perfect time to publish this last in a series of posts about designing your next website with a focus on User Experience (UX 2022). 

Environmental impact being a critical issue for everyone and every endeavor, it’s good to consider ways to mitigate any negative impact caused by our design choices. 

Digital’s Huge Aggregate Impact

Computers don’t have exhaust pipes. So, sustainability isn’t the first thing that comes to mind when building a website. Yet, the collective impact of communication technology is substantial.

While the aggregate footprint of all computers is huge, an individual organization’s share is likely miniscule. So ignoring the problem may be tempting. Which would be a missed opportunity to be part of the solution and/or raise awareness and engagement on behalf of the environment. 

Tiny and Incremental Steps

It’s true that your individual website generates a tiny negative footprint and any design choices you make will only help on the tiniest of margins. The reverse also is true. The impact of individual web design choices can add up to a substantially positive aggregated impact. 

As a general design principle, eliminating “interaction friction” means fewer steps, smoother transitions and less computation, all leading to using less energy and generating less heat/friction. 

The following are some choices you can make to reduce interaction friction:

Be a Solution Minded Organization

From a cost perspective, building a new, greener website, or replacing the functionality in your current site just to make it more efficient will not save money. Typically, organizations rebuild a site every five years or so.  If cost-saving is the objective, the next scheduled rebuild will be the best time to incorporate more Earth friendly design choices. 

Beyond the material benefits, however, there is goodwill value in a greener website. Your Earth friendly design choices tell customers, employees and other stakeholders that your organization is both aware and part of the solution. 

Just like tiny energy savings add up to a real impact, tiny individual efforts on behalf of the environment can add up to entire communities and societies that value the environment–when everyone does their part.

UX 2022 Series 

In 2022, a good UX has become the standard for good website design. In this series, we’ve looked closely at important UX features, how they work, and how they can improve a website. All articles in this series can be accessed via the links below.

UX 2022 (An introduction.)

Core Web Vitals: Googles three essentials to user experience. 

Thumbs Up! The ergonomics of great mobile UX.

Speed: Slow websites are quickly abandoned.

More Ideas

Speed

Slow websites are quickly abandoned.

The User Experience must be fast.

As we detailed in a previous article, Google has changed the ranking metrics for websites to optimize UX (user experience.) Google’s Cores Web Vitals influence a website’s Google search rankings and how well it works on the popular Chrome browser. Google’s outsized influence on the web makes their Core Web Vitals the de facto standard for good web design.

Two of these metrics focus on the speed of your website­­—how fast it loads and how fast it responds to inputs. Slow loading and reaction speeds feel excruciating to users, causing them to abandon a site prematurely out of frustration. Optimizing speed is not only good practice, it’s essential. 

The key to speed

Achieving faster website speeds is somewhat technical. Yet the underlying concept is relatively simple––don’t present users with content until they need it.   

Three key to speed is to quickly load a stable framework and then optimally position your content for speedy, on-demand access. This will make your site smaller, less cluttered, and faster.

These three principles can help guide your planning:

  • Use a framework that allows you to manage content flow.
  • Strategically map your pages and your content flow to keep your site uncluttered both visually and on the backend.
  • “Outsource” content to larger, faster, more geographically strategic, networks, so it can load faster without affecting your page. 

Speed checklist

When working with your developer, you’ll want to use technologies and techniques that streamline your pages. This checklist is a great starting point:  

  • Choose VPS* not shared hosting
  • Maximize browser caching 
  • Make images Internet friendly (smaller files)
  • Don’t overuse “plugins” and CMS* features 
  • Host your content on a CDN*, not on your page
  • Only load content for a page that’s currently open
  • Have content load as your scroll

* See below:

VPS—virtual private server. Instead of being on a single dedicated server or a shared plan, content is distributed across the Internet on large server farms. This speeds up website loading based on geography and real-time Internet traffic. 

CMS—content management system. The framework behind most modern websites, CMS keeps them very stable and makes updating content easy. Examples: WordPress, Shopify and Squarespace. 

CDN—is content delivery network. This brings features similar to VPS to your content. Broad distribution allows much faster loading.  Examples: Amazon’s AWS, Google Cloud and Cloudflare.

UX 2022 Series 

In 2022, good UX has become the standard for good website design. In this series we look more closely at important UX features, learn how they work and how they can improve a website.

Here are other articles in this series:

UX 2022 (An introduction.)

Core Web Vitals: Googles three essentials to user experience.

Thumbs Up! The ergonomics of great mobile UX.

Building a Green Website

More Ideas

Passage in Purple

Pantone’s transitional choice for Color of the Year.

Pantone was very sensitive to the global crisis when they chose 2021’s dual Colors of the Year. The combination of a bleak Ultimate Gray and a bright Illuminating yellow both acknowledged the dread of the pandemic and pointed toward a brighter tomorrow.   

Pantone’s choice for 2022’s Color of the Year is also pandemic-inspired. In Very Peri, Pantone subtly presents 2022 as a year of emergence from struggle toward renewal and hope.

“We are living in transformative times. Very Peri is a symbol of the global zeitgeist of the moment and the transition we are going through. As we emerge from an intense period of isolation, our notions and standards are changing, and our physical and digital lives have merged in new ways.”

Pantone Color Institute 

Half-mourning 

It’s not an accident that Pantone turned to the traditional half-mourning color. Elaborate Victorian grieving conventions adopted the use of shades of purple to signal the passage from grief to a resumption of life. Purples were worn after a dark period of pain and isolation­­––not as dire and stark as black, yet not back to full radiance. As the mourning period progresses, purple could shade from deep noir eggplant to light and airy lavender. 

Life goes on.
The ladies of Downton Abby wear shades of purple
while simultaneously mourning Lady Sybil’s death 
embracing the new life of her child.

Transition is key here. As we continue working ourselves out of the deep shock of a global pandemic, it’s fitting to remember all that’s been lost. Survival depends on an element of memory. Yet, survival is wasted if we do not get on with living. 

In a year where not just living, but thriving, will require us to make the transition from remembering to renewing, Pantone’s Very Peri seems very timely.

More Ideas

Thumbs Up!

The ergonomics of great mobile UX.

It’s the holiday shopping season––snow is falling, bells are ringing, and people are all headed downtown to the department stores to help Santa with his list. 

No. No, they aren’t.

If they’re like me, they’re thumb scrolling their way across various shopping sites looking for that perfect French bulldog tumbler or rustic garden trowel. In fact, almost 1/3 of all retail sales are transacted on a mobile device, and that number is only growing. 

Santa is mobile now. With all the gifts he has to get, Santa needs websites designed to be easy, efficient, fast and comfortable to use with only one hand. (The other is busy  with reindeer, chimneys, cookies and the like.)

As we continue our series on UX (User Experience) web design, let’s take a closer look at the physicality of web design. Let’s focus on our thumbs. 

Swipe left. Swipe right.

Ten years ago, websites were being upgraded to include responsive design. Now more than half of all web traffic goes over mobile devices. Mobile apps and mobile versions of a website should anticipate the way people interact with a phone to facilitate easy and fast navigation. 

A great example is Tinder’s “swipe left, swipe right” search method. It’s a super easy and economical movement that has become a cultural touchstone synonymous with Tinder’s brand. Tinder’s content display was built to facilitate ergonomically efficient touchscreen interactions. Some designers call this “thumb friendly.” 

Thumb Friendly

There are three elements to the principle of “thumb friendly” design:

Understand the role of the thumb. When holding a phone in your hand, you can most easily activate the touch screen by using either your free hand or the thumb on the hand holding the device. Assuming that people are often multitasking while looking at their screen, incorporating movements for the thumb make sense. On a right-handed person, the thumb pivots and swivels from the right bottom corner of the screen. 

Design to natural thumb movements. The thumb can easily move up and down. It can tap the phone and it can swipe left or right. Designers build devices to facilitate natural movements such as tilt, pinch, zoom, tap, double tap, swipe, scroll and more. 

Because these movements can be done with the thumb on the same hand holding the phone, as much as possible, UX web design should make navigation and important content choices accessible by locating them within the “thumb zone.”

Use the thumb zone as your guide. When designing mobile pages, keep the images below in mind. They are a good template for creating  thumb-friendly web design because they’re focused on optimizing ideal ergonomic movements. 

Left Thumb Map
Right Thumb Map

UX 2022 Series 

In 2022, good UX has become the standard for good website design. In this series we look more closely at important UX features, learn how they work and how they can improve a website.

Here are other articles in this series:

UX 2022 (An introduction.)

Core Web Vitals: Google’s Three Essentials to User Experience.

Speed: Slow websites are quickly abandoned.

Building a Green Website


More Ideas