All posts by Rick Cole

About Rick Cole

Rick is a Social Media Strategist and Senior Consultant at Smith. Contact the author directly

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

Worth 1000 Words?

Sometimes a heart is a heart.

There is no Valentine’s Day without roses, candy and, especially, hearts. The symbolism is overwhelming and leaves little room for misinterpretation. If you see a heart during the first two weeks of February you know what to think.

What the Heart Wants

Swimming against this rushing romantic river is the American Heart Association who, along with the U.S. government, has designated February as American Heart Month.  When the AHA shows a heart in February they’re being a bit more literal. Carving out visual space for the actual organ this month is a Herculean task.

Maybe the thinking is, “if you can’t beat them, join them.” Or, maybe the heart lobby is being ironic. More likely, American Heart Month has been swallowed up by the marketing frenzy that now surrounds every modern holiday. American Heart Month was first proclaimed 1963. A lot has changed in public relations, marketing and advertising in those 55 years, not the least being a proliferation of heart-related images afforded by ubiquitous media.

The efforts of the American Heart Association are laudable and illustrative. They point to a challenging aspect of communication—the use of images in shifting contexts.

Two Weeks Makes a Difference

There is no universal visual literacy. Unlike written language and mathematics, we don’t learn strict grammatical formulations about images. Romance =♥. The heart shape almost universally stands for love in our culture. The shape of that love, the emotion involved, is not so clear. Hearts can be puzzled, incomplete, committed or caged.

There doesn’t need to be a romantic connotation at all. Do the hearts below express affection, whimsy or health? Or, do they point to reading, nature and cooking?

Designer and architect George Nelson identified “social context” as a necessary ingredient to understanding an image or design:

“In visual reading, like verbal reading, the completeness of the reading relates directly to the quality of the reader’s stored information…it uses a code or language which has to be intelligible to the receiver.”

How to See p. 17

An image doesn’t communicate on its own. Without formal grammar, images depend on context to inform their meaning. Context is derived from a myriad of sources. Accompanying words, common uses, cultural symbology, literary references, technology, fashion and more all inform how we “read” an image.

Timing is another element that affects context. An image of a pumpkin signals something different around Halloween than it does around Thanksgiving. Just as the image of the heart means romance in the weeks leading up to St. Valentine’s Day.

Choosing the right image infuses our communication with near instantaneous emotion, identification, interest and other connections that are increasingly difficult to achieve with words. If we want maximum impact, we must keep an eye on the ever-shifting social contexts that inform the images we use.

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