The Style Guide should be the first consideration when you’re going to redo a website. Even if you’re not redoing a website and you’re starting from scratch, you should create a Style Guide. This takes into consideration all the elements that will give you the effect you wish to have for the website. There is no perfect style, there’s only the style based on preference. As you start the process you’ll be able to figure out what you like and what you don’t like.

Which Style is Best?

There isn’t one that is better than another. Styles come and go. What doesn’t change is the way the style should not interfere with the content. In the Design section of every module in the Divi Theme there are options to create good styles. It’s a matter of balance when it comes to styles. If there’s too much style it’s a distraction. With all the design elements built into the Divi Theme, and other Themes, you can overdo styling. 

Colors have meaning and when they’re combined with other colors they either clash or match. Colors also bring an emotional response. Think about how some colors are soothing and other colors provoke action.

Interesting Fact:

“Research reveals people make a subconscious judgment about a person, environment, or product within 90 seconds of initial viewing and that between 62% and 90% of that assessment is based on color alone. “Source: CCICOLOR – Institute for Color Research

Color communicates and is an important element throughout the style of the website. If there is an existing color incorporate the same logo colors. Unless you want to redesign the logo. Depending on how well your company is known by it’s logo will help you make this decision. If you do decide to change the brand colors and logo it will be an opportunity to email to your existing clients the new changes in a logo and a website.

Color helps to focus our attention as does being able to easily read the content. The color of something can make it look pleasant or unpleasant. There is no perfect color that will be good for everything. Using only one color is uninteresting and the content will be ignored.

The Color Wheel

Most useful tool to use when making sure you get just the right kind of color tone and hue. The software used for this process is Affinity Designer. All of the softwares have the color wheel tool.

What I like about the color wheel is when you can drag the small circle and you will see the color change in the selected image or shape.

As you do this you’ll get the color that resonates with the color scheme you have in mind. 

The Divi Theme comes with the ability to change the Default Color Palette and is located in the Theme Options area. Here you can set the colors. When you set this Color Palette those colors will be used throughout the site. 

All colors come with a specific RGB, or CYMK, or #and a number setting. You can put your curser anywhere in the square and the color setting will change giving you the number of that color. 

Expriment with the Color Palette. There is no right way to do this. But what you’re looking for is a uniform color for your website.

Which font is the right font? Again, there isn’t one. There are six-hundred Google Fonts to choose from so how do you know which one you should use. Fonts are tricky. They need to be readable. Sounds obvious, but when you look at the many styles of Fonts available you find some are much easier to read than others. For a website, you want to chose an easy to read Font. You do not want to give the person visiting your website eye fatigue.

You want to be sure you have clean open spaces and readable content. We do so much more reading than we used to do.Have you noticed how many people wear eye glasses, myself included. It’s not confined to older people it’s a phenomenon of using the eyes constantly to read text on different sized screens.

Here’s a very good website that you can see an example of font pairing with the colors. The Ultimate Collection of Google Font Pairing. You do not have to use those exact font pairings. The choice of fonts is a matter of preference. You will find some fonts appeal to you and others don’t.

Your website must be accessible to someone with a disability. We don’t always remember that there are people in the world that are color blind, or handicapped in some way. Their online interaction is going to be different and it’s necessary to take into consideration accessibility. In the blog post Quickly Build a Website in Divi that I wrote on RealTime Paradigm Blog. I show an example of how using a flip module is a great effect, but it’s not obvious that you need to mouse over the text to see the other side.

This could be faulted as being inaccessible. You do want to watch for that kind of use. Animation and moving parts on a web page is now the “in style.” Just because you think it looks cool doesn’t mean you should use these effects. The best practice on this one is to use it very sparingly. You want to eliminate any barriers to prevent interaction. The World Wide Web Consortium has an Introduction to Web Accessibility article for further reading.

One common error is an overly complicated navigation system with too many items in a menu that folds out into a sub menu. This can cause confusion as to where you are in the website. People have visual disabilities, this is why you should always make sure your text size is not too small. It’s the perfect way to get someone off your website if they can’t read the text.

The whole purpose of a website has to be functional, accessible, operable, and this takes thinking through how you are going to redo the website. You don’t have to have the website done by a designer. In fact, the best person to design a website is you. Of course you might need some help to do this as website software is now more sophisticated. The Divi Theme is a robust theme with all the options available.