Redoing A Website With Divi

Redoing A Website With Divi

Website Redo

Build a Style Guide
Change the color scheme
Set the color palette
Chose the font pairing
Deal with Accessibility

Style Guide

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. 

Color Scheme

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 Implications of Color

Green: Wealth, Health, Balance, Relaxing, Easy-going Environment

Yellow: Creative, Friendly

Blue: Loyalty, Coolness, Trust, Security

Purple: Soothing, Calming, Luxury, Truth

Orange: Aggressive, Excitement, Fun

Red: Energy, Urgency, Courage, Warmth

Pink: Romantic, Tranquility, Sexuality, Feminine

Color Palette

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.

Font Pairing

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 the font pairing with colors introduced as well. The Ultimate Collection of Google Font Pairing. You do not have to use the font pairings, it is a matter of preference. You will find though that some fonts resontate with you and other’s don’t. That’s how you will eventually come to decide which fonts you should use for your website.

 

Accessibility

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. 

k

Follow These Steps

Build a Style Guide

Change the Color Scheme

Set the Color Palette

Choose the Font Pairing

Deal with Accessibility

All of these steps will take you on a journey to redo your website. The context of a website is complex but when you approach it from this angle you’ll get the results you want when you redo a website in Divi.

Write in Real Time with the Divi Visual Builder

Write in Real Time with the Divi Visual Builder

Write directly onto a web page in real time?

See your words flow onto the page as you type them into the module? Style the module with a different color and shape? You see it as you style it.

Unheard of. Impossible… until now. Enter the Visual Builder experience built into the Divi Theme.

The Buit-in Divi Visual Builder

Writing is a chore and not everyone likes to do it. But today you need to write and create content regularly. We’re doing it all the time, in emails, texts, tweets, commenting on blog posts, on social media, but we still need to create content for the website and the blog. In some cases you’re able to hire a freelance Copywriter to do the writing for you, but this can get expensive, and you can do it yourself. A common complaint about writing content is; there’s no time to write the list of topics you’re going to write.

Technology to the rescue, you now have a tool to help you write in real time directly onto the web page. Remember that blog post or landing page idea you had for your website? The content is still languishing in the document where you created it… if only you could remember where you created the document. What happened to the goal you made; to write and publish more posts?

The Blog Post Publishing Solution

Use the built-in Visual Builder that comes with the Divi Theme. The Visual Builder is an on-page visual editor where you type into the specific module and see your edits alongside the module as you enter the content.

Traditionally you would write the content in a separate document and then copy and paste it onto the web page or blog post. After you copy and paste the content you have to format headings and subheadings. You may want to use an image, but you have this long block of text to deal with. Where do you add the image? Using the Visual Builder you can access the page layout. Seeing the visual element of the page layout guides the content.

The content is shaped by the amount of space available in context to an image or column width. This helps the writing to be precise and on point. Not only is it clear where you want to put the content, but it’s clear how you want to arrange the content.

A Different Experience

Writing content directly onto the page and editing as you write, is an entirely different experience.  You can immediately tell if the content is relevant and on point. Instead of writing and returning to edit, you edit as you write. This method is efficient, it not only saves time, but it will improve your writing, and help you formulate the sentence structure.

Everyone has a different way of writing and there’s no right way to write.

Creating content regularly is necessary. The content is the ‘voice’ of the business. People are searching for information about what you do. If your website doesn’t have an active blog with current information, people will move onto the blog that does have current and upcoming information.

Engaging Content

Create engaging content is something you think about. But how do you do this in real time? Using images combined with content is attractive to the reader. Images engage attention immediately, even before text is read. Some people will scroll up and down the page reading only the headings and subheadings and then look at the pictures before they read the informaton in the article.

The image also needs to be on subject otherwise the viewer’s attention is absorbed into the image. Their minds are off vacationing by the water with the scenic picture of a waterfront.

Connecting With The Content

When you write content using the Divi Visual Builder, you’re not only connecting with your audience, but you’re connecting with the content itself.  Even if you don’t like to write, you’ll find you will read the text you just wrote and writing content will take on a new form. It will actually inspire you and before you realize it you’re creating content instead of talking about it.

If you’re a writer, you’ll be delighted with the Visual Builder. All writers enjoy writing. No one says they are a writer and doesn’t like writing. When you write and read your own writing, you’re looking into a mirror. This is reflected through the content and because you connect with the content you’re writing you’ll reach the intended audience.

Since using the Visual Builder my content creation has increased one hundred percent. I can press the publish button the same day as the post is written. I’ll return to the just published post the next day to refine the content. I have completely departed from writing the blog post out in a word document and then copying and pasting it into the blog post. My blog posts don’t wait long to be written.

The Divi Difference – Using the Visual Builder

The Divi Builder

One of the major disappointments with WordPress was the difficulty to put content into the page or blog post. It requried knowing short codes and some HTML.

The Developers of WordPress Themes built a Page Builder specifically to help you add content to the page or post without needing code. If it hadn’t been for the Page Builder, WordPress might not have become such a widely used software for a website. 

The Divi Visual Builder

Adding content to the page and seeing the edits as you add them is an advanced innovation of technology.

This could be the end of long meetings and discussions over wireframe drawings of the website layout that don’t match the content. It’s always been a problem for content creators and designers. No one quite knows what to do with the text and how to arrange it on the page or blog post.

Divi Visual Builder

The Divi Theme Builder

The value in building your own theme is priceless. No other website will have the same style.

Design and Content Creation Teams can now work together and build a complete website with an active blog. The image shows the Theme Building area where you start to build the theme and add templates.

To use the Divi Theme Builder it’s necessary to have foundational knowledge of the basic elements. You can learn more about Divi here.

Divi Theme Builder

Your Theme

Now it’s possible. You can create a specific design from scratch. Even if you don’t know how to use code. It’s not necessary. Of course this isn’t recommended if you have not every used the Divi Framework. After you have used the Divi Framework and understand howDivi works you will be able to build your own theme. 

This is the future and it gives the user a new role. You don’t have to be asking someone to change something in your website. You can change it yourself. The Visual Builder has forever changed the way a website is created.

More About Building a Website with the Divi Theme

GDPR and Your Website

GDPR and Your Website

GDPR and Your Website

The European Union General Data Protection Act is in effect May 25, 2018. The Information provided is a courtesy and is not legal advice.

websites must be in compliance

The user now has complete control over their data and has a say in how it may be used.

As a website owner you must explain to the user why you need the data, and what it is for. The user has to agree that you can use their data for the purpose you describe.

There are plugins and software that track people’s movement on a website. You will have to disclose the method you use to collect data.

The fact that software can document the use of a website by a visitor is unsettling for the visitor. This does not promote trust and people are more likely not to do business with companies that disclose information about their activity on a website.

WordPress

Official Support of GDPR

Automattic

Automatic is the owner of WordPress used by 30% of websites worldwide. WordPress will add features necessary to comply with the GDPR regulations.

The law reqires site owners to be transparent and explain how a business collects, stores, or processes personal data of residents in the European Union.

Solution

When you sign up for WordPress.com only limited information is needed to set up an account. Only your email and username is needed.

You have control of your content. The privacy settings give you choices to make your site public, private or hidden from search engines.

Personal Information

Details: email addresses, names IP addresses are considered personal data. Depending on the service you provide you must disclose how this information is used.

Use of Information

The website must disclose how the information is used, allowing the user to take into consideration whether to use that service or not.

Third Party Selling

When your information is shared, a website can share or sell it to third-party services. A user has a right to know what happens to their information.

GDPR Legal Obligation

With the passing of this law a website owner has a legal obligation to comply. This law is not yet effective in the US, but similar legislation might be passed soon.
Information Resources

Elegant Themes provides more detailed information.

WordPress outlines Automattic’s compliance with GDPR.

Official GDPR Information.

Wikipedia General Data Protection

Your Privacy

Take it Seriously

Anyone who uses the Internet, and that’s everyone, has a right to private information treated with respect.

It is not acceptable to just want to profit from someone’s use of a website or a sign up for a service.

The Web is now complex

The web is an information space, where we come together and share information. This information is susceptible and there have been too many personal data breaches.

Security and Confidence

We use the web everyday. As we do we are being tracked and documented. Even though there is a general data protection act, we have seen the violation of privacy continue.

The web is under threat

“if we spend a certain amount of time using the intenet we have to spend a litle proportion of that time defending it, worrying about it, loking out for it… Do me a favor, fight for it for me.” Sir Tim Berners-Lee. The Case for the Web Report.

Every Action You Take

It is time to revise how we interact on the Internet. Read carefully the Privacy and Terms of Service. Just exactly what does this company do with your information?

The Divi Theme is GDPR compliant.

Never Take The Web For Granted

It’s time for regulation and standards to be implemented. The use of the Internet is a right, and this right shouldn’t be violated by anyone. A Contract for the Web outlines the rights and responsibilities for all who use the web.

Sample Contact Form

With optional opt-in buttons

Please indicate your consent:

Privacy

Information you provide is confidential and is only used to contact you.

You must reveal tracking methods used. Articulate the method in the privacy page. Inform the user how you use their information.

General Data Protection 

The implimentation of the General Data Protection Act (GDPR) is not yet in effect in the United States. It is only a matter of time before it will be. There is a definite threat to the web, and if we want it to continue then it is necessary to implement standards. The GDPR is a step forward. The World Wide Web was given to us by a man with an idea to connect information systems to promote knowledge, bring people together, and make knowledge freely available.

Everyone who uses the web can protect the open web as a basic right. No one should be denied access and neither should anyone have their privacy violated.

From the Blog in Real Time

Build Your Website Right The First Time

Build Your Website Right The First Time

Why don't we do it right the first time? Because we don't have the right information. The right information only comes from someone who has made the mistakes themselves and is willing to share their experience so you can do it right the first time.The First Mistake -...

read more
Can You Build Your Own Theme?

Can You Build Your Own Theme?

Yes! How so? The Divi Theme Builder will come out October 17, 2019.  Something we always associated with a designer or a developer is now going to be available for us users. The long awaited Divi 4.0 is about to launch. It will change the way you think about websites....

read more
How To Use Images In A Website

How To Use Images In A Website

The images used in a website are far more important than how easy it is to upload them. One of the biggest problems with websites is the images. The web is a great place to view awesome pictures. How do you get awesome images? Everyone thinks all you do is upload the...

read more