how to choose colors for your website

what colors are best for your website?

“Color directly influences the soul.
Color is the keyboard, the eyes are the hammers, the soul is the piano with many strings.

The artist is the hand that plays, touching one key or another purposively, to cause vibrations in the soul.”

Wassily Kandinsky, Concerning the Spiritual in Art

Color signifies life. The Earth is filled with colors that delight the eyes as well as heal and awaken the mind.

It is difficult to imagine a world without color, yet we sometimes walk through our day without seeing all of the shades and hues of color in a “brown” Autumn field.

We have millions of colors at our fingertips and our decisions to paint a wall or sign or color a website can be as casual as, “let’s paint it blue”.  Yet color  matters so much, not only visually, but also in a subliminal way.

There are broader messaging patterns to be found in color perceptions. For instance, colors play a fairly substantial role in purchases and branding.

In an appropriately titled study called Impact of Color in Marketing, researchers found that up to 90% of snap judgments made about products can be based on color alone (depending on the product).

Your choice of website colors is one of the most important decisions you will make in designing and building your website, apart from your words and content of course.

The Internet is primarily a visual medium and color is the easiest and most advantageous way to get your message across to your visitors.

Browse a successful website, and you’ll see different colors that communicate the brand’s message, convey the website’s structure, improve brand recognition, and provide loads of other benefits.

Picking the right colors is important for achieving visual consistency in website UI Design. For instance, using light colors for the navigation menu, and using bright colors for the background can make it difficult for a visitor to read menu items. Also, colors with low value contrast can make it challenging for color blind people to make out the images and words on your website.

A study by UserTesting found that males and females prefer sites with bright or dark colors, and sites that had a white/minimal interface received the lowest ratings.

Women see more colors than men, generally. They are more aware of slight color differences within a color range. (most likely from being “the Gatherer”)

Color Scheme Matters

Color combinations or schemes refer to how two or more colors complement each other. Color schemes or palettes are often defined by where they are situated on the color wheel. Color schemes have different purposes and are used to create different feelings and effects within creative design. The four most common color schemes are known as Complementary, Analogous, Split Complementary and Triadic colors.

Using High And Low Contrast

Generally, high contrast is the best choice for important content, because it is most easily seen. Dark on light or light on dark–it’s the easiest to read. It might not be exciting, but it is readable.

One word of caution, though: If everything is high contrast, nothing stands out and it’s tiring on the eye after a while. The eye needs to rest while taking in information.

Designers often prefer low contrast techniques. They like to make things look beautiful, but beautiful isn’t always the best for readability. Tone-on-tone similar colored combinations are very popular and while they are attractive, they are also difficult for people to read.
Pro Tip: Try to find the balance between beautiful color schemes, and legibility for optimal clarity in your visuals.

In order to use similar colors, while getting the contrast you desire, create a color scheme with both complementary and analogous colors.

Choosing Color Combinations

The color wheel can help you choose great color combinations for your buttons, your infographics, and your call-to-actions.

Keeping your color combinations simple will help you in the long run.

A study from the University of Toronto showed on how people using Adobe Kuler revealed most people preferred simple color combinations that relied on only 2 to 3 favorite colors.

People like simplicity; it makes your content easier to understand if they don’t have to interpret it through many colors. And remember, color has meaning so each color adds or takes away from your message.

Too many colors make for a confusing message. So how do you choose those 2 or 3 colors? The color wheel can help.

Using Complementary (Opposite) Colors

Complementary color combinations make things stand out.

Complementary colors are “opposite” colors. They are opposite of each other on the color wheel, meaning the one color they lack is that one opposite of them.

You might even notice that some of your favorite sport teams use complementary colors. Complimentary colors are also used in most childrens’ products, to catch the eye and create “demanding!”.

Split Complementary Colors Header

If you want to use three colors instead of just two, using split complementary color schemes is a way to capitalize on the power of complementary colors but add a third color to your palette. To use it, you’ll choose one color as your base color, and then the two colors adjacent to its opposite.

A split complementary color scheme doesn’t have quite the same level of tension that a complementary color scheme does, but it’s still visually exciting for your eye. It also adds a level of variety to your color scheme that can be used in a very dynamic, meaningful way.

Using Analogous Colors

Analogous colors sit next to each other on the color wheel. They are “related”, a kind of family of colors that creates pleasing and relaxed visuals. They also don’t stand out from one another. Analogous colors can create subtle and beautiful content, but you may need to add a complementary color to get a particular item to stand out. Overall, I find analogous to be most effective to keep the mind calm while on the frenetic interent.

Using Monochromatic Colors

Monochromatic colors are a single color, with its tints, shades, and tones. They are even more soft and subtle than analogous colors since it’s a color palette based on one single color. Monochromatic colors work great when paired with a single complementary color.

On portfolio websites, where the artists’ images are center, monochromatic is best. Either find a repeating color theme in the artists’ work – or, rule of galleries; white, gray or black.

Most designers—when using complementary colors—pair a rich collection of monochromatic colors with a single complementary color.

Using Triangle, Rectangle And Square Colors

It isn’t difficult to create color combinations that stretch the boundaries of the easy power of complementary opposites and the related analogous and monochromatic palettes. All you need is a triangle, rectangle, and a square.

… coming soon: Psychology of Color

Somewhere an artist’s pixels are crying …

… you study design and art all of your life.
You go to art school and learn about 
     color theory
                  font matching
     the need for the eye to rest on white space
             contrast  ….

And you take all of that expertise into your work and design a kick-ass website, only to hand it over and watch all of the fine details you nurtured and brought to life slowly disappear in the CMS website that anyone can log into and change once you have finished your build.

Respect your website designer

Improve your website with this feedback

  1. 48% of people cited a website’s design as the number one factor in deciding the credibility of a business
  2. 94% of people cited a website’s design, if poorly planned or designed, as the reason they mistrusted or rejected a website
  3. 72% of people entrusted online reviews just as much as personal recommendations
  4. 40% of people ventured away from a website if it loaded for more than 3 seconds
  5. 44% of mobile users reported that navigating a web page was difficult and 6% complained of difficulties interacting with it
  6. 62% of companies which designed their website(s) for mobile platforms increased their sales and 64% of companies that designed their website for tablets increased sales.
  7. Colors increased web recognition by 80%. Sites with dark color schemes increased growth by 2% whereas sites with lighter color schemes experienced 1.3% growth
  8. 70% of people looked at lists with bullet points. 55% looked at lists without bullet points
  9. 67% of shoppers were more likely to buy from a website that is compatible with mobile devices
  10. 27% of sites use HTML5. Those sites account for 49% of page views

Why is Google forcing SSL certificates?

What is an SSL Certificate?

Have you ever noticed how sometimes websites start with “http://” and then sometimes they start with “https://” and have a green padlock nearby? If you have, you’ve seen the end result of an SSL certificate. But what you haven’t seen is what goes on behind the scenes.

SSL stands for Secure Sockets Layer. Essentially, SSL establishes an encrypted link between your web server and your visitor’s web browser. This ensures that all data passed between the two remains private and secure.

With an unsecured HTTP connection, third-parties can snoop on any traffic passing between your reader’s browser and your web server. Obviously, this is a huge issue if you’re passing sensitive information like credit card numbers.

But now, many entities, including Google, are pushing to use secure HTTPS connections for all traffic, even things you might think are plain and simple websites.

Why Do You Need an SSL Certificate?

In the past, the only time an average webmaster needed to care about SSL was eCommerce. But that all changed in late 2014 when Google announced SSL was going to be rolled out as a ranking factor.

That’s right, sites that use SSL certificates get a boost in the SERPs. It might not be a huge boost, but I think you’ll agree that any boost in search rankings is a good one.

But now Google is going even further. Starting back in January 2017, Google began to mark “HTTP pages that collect passwords or credit cards as non-secure.” That means your website page will be marked as non-secure if you’re not using HTTPS.

Today, in 2018, credit card or not, password or not, Google will mark your website as “not secure” if you fail to have an SSL certificate.

So, in addition to offering a benefit to your readers by securing their connection, you also have both a Google-provided motivator to use an SSL certificate for your WordPress site.

Some hosting companies offer the SSL certificate for free and others charge a yearly call. Contact Lois Reed Designs today if you want help securing your website with SSL.

Interested In Working With Lois Reed Designs?

“New” Website, rebuilt for ever changing technologies

Colleen Hintz is a force of creativity!

I immediately  fell in love with her work, and knew that I wanted to create sliding banners for each page, as well as use her vestments as a background for the body.

The Fruit of the Vine website was originally built in static HTML/CSS with Flash galleries.  I recently customized a wordpress theme for her, to match her old site, but work on touch tecnology and responsive screens. Enter and enjoy!
Each piece is an amazing work of art!

Pin It on Pinterest