Welcome to part 1 of our mini series “Effective Divi Web Design Principles” where we’re exploring effective design practices to help empower new web designers and those who identify as someone without an “eye for design.”
In today’s visual age, design is more important than ever. Good design can make or break your business when it comes to converting potential clients to customers. It can be the difference between making a sale or having a potential customer click off your website looking for a more professional service or product. And while new web designers and developers often claim to have an “eye for design,” there are some basic design principles that everyone can apply to help become better at the “design” part of web design!
Series preface:
- The strategies, practices and tactics we’ll cover in this series are applicable to web design in general and are not Divi specific but this series will be based around my experience as a Divi Web Designer. Many of references, layouts and starting points mentioned will be involving Divi specifically.
- This series is largely meant for folks who are either new at web design or are of the developer mindset who feel they don’t have a natural eye for design. But hopefully many of these concepts will serve as inspiration or a refresher to already established designers as well.
- Great web design principles have been mentioned here on the blog before so we will be linking back to some previous posts and resources throughout the series. This is primarily a guideline to some of the most important principles in good design that I apply as a successful Divi web designer that you can apply as well!
- Finally, when it comes to good design, there is no right or wrong. In fact, it’s really a matter of balancing popular opinion, your personal creative opinion and the client’s wishes. We’ve all had that client who thought something looked great that we knew looked awful, right? Not everyone will agree to these design basics but it’s safe to say that these principles are universally shared by professional Divi designers and the web design community at large.
Here’s an outline of the mini series as we look ahead:
- Part 1 – 3 Ways to Learn How to Have a Better Eye for Design
- Part 2 – 3 Effective Web Design Principles for the Non-Designer
- Part 3 – 3 Important Areas of Design to Focus on for Every Website Build
Before we dive in, I must say that while I understand some people are more gifted in creativity than others, I strongly contend that YOU CAN learn good basic design principles. You may not become the Michelangelo of Divi, but by golly you can still learn some good design practices to apply to your web design endeavors. I’ll spare the embarrassment of posting some of my first web designs but I’ll just say that my “eye for design” is ever-evolving and is maturing more everyday. By no means did I start out where I am today. And frankly, design is important in more than just web design. It plays a big part in organizing content, writing emails, taking good pictures with your phone and more. So it’s very important to know a few basic principles to apply to other aspects of your life too.
So, if you’ve ever caught yourself saying any of the following;
- “I just don’t have an eye for design.”
- “I don’t have a creative bone in my body.”
- “I can code but I can’t design.”
Then this series is for you! Let’s get into it.
3 Ways to Prepare and Learn How to Have a Better Eye for Design
In the world of web design, people tend to identify with one of two groups:
Web Designer – A web designer, aka (front-end designer) will likely be drawn to the design, colors, layout and aesthetics of web design. They will likely come from a graphic design background or perhaps a more visual medium like photography or other creative arts. If you’re more interested with how things look and feel as opposed to how fast it loads, how clean the code might be or what customizations went into the php and css files, then you’re more than likely in this boat 
Web Developer – A web developer, aka (back-end developer) will likely be more interested in mathematics, numbers and in the web design realm, the code, functionality and backend of websites. Whereas a “designer” might see shapes, colors, look, feel, etc, a more developer minded person might see something similar to the matrix – code, functionality, usability and things that lay beneath the surface of a website.
Both are key to a successful website design and in my opinion, a successful web designer needs to have a healthy mix of knowledge in both worlds. Personally, while I’m now well versed in design and development, I’m still drawn to the design side of things. I need to work ever-harder to consider load times, clean code and functionality instead of a constant focus on design, layout, look and feel. But for those opposite of me, it’s equally as important to focus on eye-pleasing design as opposed to a terrible looking website that loads quickly with clean code.
What we’re really talking about here is a mix of the left and right brain. This is probably no secret to most at this point, but there are numerous studies that the left side of the brain is analytical, mathematical, sequential, logical, etc. The right side of the brain is artistic, creative, insightful, imaginative, etc. This is key to understanding WHY you may be drawn to being a designer or developer.
In short,
Developer = Left Brain Thinker
Designer = Right Brain Thinker
An understanding of that leads us to the first main point.
1) Preparing Your Mindset
If you’re more of a creative, you’re more than likely going to have to either work harder at coding and the more logistical side of web design and vise versa, if your tendencies lean toward the left side of the brain, you’re going to have to work a little harder to develop a good eye for design. As mentioned above, I’m more of a right brain thinker and a creative. While I love CSS and can now get dangerous with PHP without sweating too much, I did not start off that way. I had to work very hard at the areas of web design that I was not good at.
But it started with my mindset. I knew what areas I was strong at and which one’s needed work. I want to encourage you on that point again, YOU CAN learn good design principles and YOU CAN develop an eye for design if you’re new or if you’re a developer without a creative bone in your body.
At this point, you’re probably saying “This is all great, but what can I do to prepare my mindset to learn good design techniques?” While we all learn differently, I’ll tell you what has worked for me and what I know has worked for many other Divi designers around the community.
2) How To Learn and Develop and Eye for Good Design
Learn by replicating good website designs – Yep I said it. If you see a good design, try recreating it, copying their colors, typefaces, spacing, layouts, etc. I’m not saying rip a site off in order to sell it as a child theme or as your work but from an educational standpoint, one of the BEST ways to get better at design is to replicate an already beautifully designed site. You’ll be amazed at how much you’ll learn and how empowered you’ll feel by replicating a beautiful design that you can mimic.
For Divi related inspiration, you can find some good examples of designs frequently here on the ET blog via the monthly site showcases like this one, through Divi Theme Examples or by following your favorite Divi designers and seeing what they come up with!
Learn by examining designs everywhere – While printed designs and other advertisements may not be ideal learning for web design trends, you can still pick up valuable design principles. For example, perhaps you see an ad with a strong image with the text designed in a modern, sleek way, you can very well take that same idea and apply it as a strong design on your site! I don’t dread a trip to the mall with my wife and walking into makeup stores now because I use that as “Josh’s trendy design take in time.” Time previously spent staring down at a phone is now often productively spent checking out new design ideas and concepts that I can apply to my web design projects!
Learn by building off of the Divi Library– One of the most magical things about designing a site with Divi is that it comes with a full library of proven, effective layouts and designs that you can build off of. If you’re new to design and Divi or are feeling stuck looking at a blank canvas, you can load one of the premade layouts from the library, change colors, replace images and get a jump start! Watch how reworking an already professional design will begin to train your brain for your next project.
Learn by downloading and building off of a free weekly Divi Layout Pack – If you’re a new Elegant Themes member or are not already aware, there are professionally designed Divi layout packs dropping weekly here on the blog that are FREE for download. Not only are these a great source of learning and inspiration if you’re interested in getting better at design, but like the library items mentioned above, these are great starting points if you’re new to design!
3) Get Feedback and Constructive Criticism on Your Work
Finally, one of the best ways to improve your design chops is to get feedback from others. Often, when you’re embedded in a project, it’s easy to lose your bearings on what looks good and what looks bad. Getting feedback and constructive criticism on your work is key to becoming better at design.
Now I get it, this is easier said than done. And you probably want to avoid getting destroyed or demoralized especially if you’re still learning, but if you’re using Divi, you automatically have access to the most engaged, supportive and helpful community online. There are numerous outlets to connect with Divi nation but my personal preference are Divi Facebook groups. I intentionally created the Divi Web Designers Facebook group with the primary purpose of being able to post work to get professional, helpful criticism and feedback to help us all become better Divi Web Designers. If you have any trusted family, friends or perhaps fellow web design colleagues with a good eye for design I also highly recommend getting their thoughts if you don’t want to get feedback online.
I find it very useful to get feedback because it’ll often point out either bad design that is overlooked, areas of improvement or more. For example, an area that I don’t have a great natural gift in and need to work hard at is typography. Not long ago, I worked on a site that I thought looked awesome from head to toe and when getting feedback, was told that the type I used didn’t seem to fit the “feel” of the site. After brushing off some initial designer pride, I realized that they could not have been more right. The type indeed did not correspond with the feel of the site. Since then, I’ve learned to be extra conscious of the typefaces that I choose in an effort to make them match the right look and feel of the site rather than sticking with my “go to’s.”
So if you’re feeling brave enough to get some constructive criticism, you’re welcome to come to do so in our Divi Web Designers Facebook group or any other Online Divi Communities if it adheres to the group’s guidelines. And as a side note, if you’re someone giving the feedback, I want to encourage you to be extra careful with your words and how you give constructive criticism. When giving feedback, remember to try and build up the person up, not tear them down.
In Closing
I hope this introduction to Effective Divi Web Design Principles has you inspired and pumped up for the rest of the series! Again, this first post was more of an introduction and preparation as to what’s ahead but is nonetheless important because before you can get better at design, it starts with your mindset preparation to learn.
Do you have any other thoughts or practices on how to learn better web design techniques? Let us know in the comments below!
Tomorrow: 3 Effective Web Design Principles for the Non-Designer
Now that we’ve covered preparing and learning how to have a better eye for design, it’s time to get into some actionable, practical design principles that’ll help take your design game to the next level! Till then!
Be sure to subscribe to our email newsletter and YouTube channel so that you never miss a big announcement, useful tip, or Divi freebie!
The post 3 Ways to Learn How to Have a Better Eye for Design appeared first on Elegant Themes Blog.
