5 Website Design Tips for Beginners Designers

Here we talk about 5 hints, 5 hacks or five tips to make your website look like we designed by a professional even if you really don't have any design skills at all. It took was go ahead and jump right into it. And my first tip hint number one is to create a color palette and if you're like me colors might not exactly be your thing. I'm going to tell me to come up with a color combination probably come up with something. Like I don't know why black and gray and maybe a little bit of white really not good with colors. But if you want to make your website looks great using great color combinations to be a great way to do that. So how do you come up with a great color combination? Even if you are not good with toddlers that I found it extremely helpful for this. Is it tool called paladins? Let's go ahead and check it out. Okay. So this here is the Peloton tool. It's really simple and easy to use tool. Basically, All you do is you pick up base colors right now. We've had this base red color here, and then you can just choose from either.

Jason colors or color scheme and Christy the color scheme right here on the right is Triad color scheme just pulling colors from different sides of the color wheel. And in this tetrad, we're pulling colors from across the color wheel here and if you want to make adjustments here, you can adjust the distance that it's pulling it from such a great way of making the quickly making a great-looking color palette and then what I like to do and I just like to click on this tables and Export button here and then click on as HTML and I just print this page right? I just save this page as a PDF and I save it into a folder that I can use to reference whenever I need colors for my website and then if you don't know what the colors of a logo already and you want to use the color of the skin that logo as the starting point for a color palette, it's really easy to do if you’re on a Mac in the show you how to do that. So history on a Mac just go up here to the search and then just type in Digital Color meter and not going to pop up right there.

And then under the settings for this will make sure our colors are displayed at hexadecimal. So we just going to click on view and then display values and then make sure hexadecimal is check. I've already checked it on here, but by default is set to talk to send text decimal. Okay, and then we can use it to find the color of just about anything. So just pull up the Digital Color meter hover over what you want to find the color of and then you can see right over here that we've got the hexadecimal color, which is the color is it when using our website so it's easier 09 900 is what it is this example and then you can just take that and you can just type it into the Peloton power pallet here and then select which color palette we think looks the best based on that and you're off and running. Okay hits number two is used great-looking images can be challenging for me. I like taking pictures. I really enjoy photography if you don't enjoy photography or if you're not so good at taking pictures. How do you get white pictures for your website?

What were two ways of doing it one way of doing it is to hire a Website Design agency. If you can afford it having custom images for website is a great way to make a website stand out and also have the images be extremely relevant to you and your business. Now what if you don't have any money to hire photographer and you still want to use and you should use great-looking images on your website, what should you do when there's some great resources where you can find either paid stock images like istockphoto or Shutterstock and then there's also some free resources that you can use like unsplash and pixabay photos. And actually I've shared some of the photos that I taken on unsplash that anybody can use and it's a great resource for designers. And anyone who needs to use great-looking images now be sure you check out with the rules are when you're using these images or examples some images of people that have recognizable faces. We can recognize the face of the person may have some restrictions on them and then even inside the images or maybe some restriction. Example, if it has an image of a Coca-Cola logo orbit.

Image of an iPhone or a Mac or some other recognizable piece of design, you may need to get additional rights for that thing. Just want to look into that and see what the rules are for that so unsplash. Pixabay istockphoto and Shutterstock are some great resources to that is one that actually I struggle with all the time. I forget it's just I don't know. Sometimes it seems really hard to implement this it hint and that is space just adding a little bit of extra space around all of the elements that you put on your website. This goes especially for text. Do you want to have space around your headings based on the body of your text and one of the new trends in website design and I think it's actually a really good one is when you're making a point in text. So if you're being a writing something is it make your paragraphs really short? I mean a paragraph or the spacing between lines might actually just be one line and they didn't have spaces between those and with that allows your viewers to do when they're looking down your web.

Is quickly scanned the information that they were looking for so adding extra space around all of the elementary website not only the text but the images in the graphics to allow your users to see what they are scan them and have that space around them to draw their eyes with a really good technique and it's one that I struggle with but it's something that everyone should try to implement on their website and their website design. Okay, and then hit number for is about being decisive and for me that means getting rid of using sliders and articles down below and talk about why you shouldn't use Fighters why they're bad for SEO and what they don't actually drive more interaction on your website. I feel it whenever I've wanted in a past to use a slider the reason why I want to do it. I just couldn't decide with the most important thing to put at the top of my website. I'll just put a bunch of different things. I'll just put a spider and let people decide for they with the most important thing are the problem with that.

If people don't sit around and wait for your slider to cycle through what they do is their Proactive on an interactive website, so they just start scanning down your page and looking for what it is. They're looking for now. What I recommend doing is putting the most important thing you have at the top of your website and then the subsequent things that you think are less important than even make them look basically like Sly and put those down as the next thing. So let your viewers scan down the page to see what they want to know one problem you might have is it you just don't know what the most important thing is what the thing is that you should put at the top of your website cuz you're not sure what's the most important thing for your audience best thing to do is to test and if you're using a theme like the Divi theme, which is one of the teams that I recommend using they have a function for a b split testing right inside the theme about anything but specifically you can test the header section and see which variation of the header section performs the best for your audience become up.

A couple of different variations and then you set a Target baby lower down on the page baby is having them stroll all the way down to the page and beats having them click on a button whatever the target is whatever the actions you're trying to get them to do you figure out which of your test subjects got them to take that interaction the best and that's probably one of the best ways of finding out what should be at the top of the website paint number five is to remember your mobile and when you're building your website's you're doing it on a desktop computer is really easy to forget the people might be viewing your website on tablets and on mobile devices and Google has made it abundantly clear that people use mobile devices a lot for viewing website. If you want to make sure that your website looks great on mobile. And so what that means is taking just a little bit of extra time and tweaking your designs so that you're sure that they look good on any kind of device any size screen that your viewers might be coming to Wordpress themes out there like a disney-themed beaver Builder and elements were all allow you to talk.

You're designed specifically for mobile devices that something you want to do to take a little bit of extra time. When you after design your pages making sure everything looks good on mobile devices phones and tablets and then one last tip one bonus tip. Here is Aunt Combination. And I think it's something just good to decide right when you start training. Your website is font combinations lot of the things out there to leave the Divi theme and most things out there will let you decide what you want your default fonts to be and so deciding that ahead of time can be a great way of distinguishing your website from other websites and giving it a good characteristic No Agenda loaded some resources for some font combinations that you might want to use on your website. Not sure where to start check out my little free mini course on YouTube and on my website for guide you through step-by-step exactly the steps that need to take to build a WordPress website. And if you're already following along with that do tutorial series, the next tutorial is how to install a WordPress theme would have been looking at

How to install the Divi theme and then after that we'll learn how to build web pages to go ahead.