Loading content to a website and making it look nice at the same time can be a bit daunting. Especially when one has no previous experience in creating websites, and no education about design principles. No worries though, I’m here to save your day.
Below are four tips that you can use to improve your website design.
1. Use Images
What is it everyone always says? Oh yeah–a picture is worth a thousand words. Most modern website designs use an image based approach because it’s cleaner and more user friendly. When a person comes to your website, they don’t want to spend minutes (whole minutes!) sifting through paragraphs of text to find what they are looking for. Not only do images make the information finding process faster, but they also make your website more interesting and beautiful.
Moral of the story: Less text >> More Images
Some of my favorite free stock photo websites for your viewing pleasure: StockSnap, Unsplash, picjumbo
2. Stick to One or Two Typefaces (Fonts)
Yes, I know how fun typography is to play with. However, I promise that less is more when it comes to designing with type. Chances are, the designer chose to use the fonts on your website for a reason, so don’t be afraid to use them too! All fonts have a personality and a purpose, so when too many fonts are used they often clash with each other. Using one or two contrasting fonts will keep your website looking professional and simple.
Moral of the story: Don’t get carried away >> No more than two contrasting fonts
3. Visual Hierarchy
Hierarchy in web design is about prioritizing content. Think about it this way: you are a tour guide helping your clients eyes to navigate through the website. What can you do to make it easier for them? What is your call to action, and how can you highlight it? What do you want the eye to see first? Use scale–make big things bigger and small things smaller. Elements on the page should not have to compete for attention, they should flow together seamlessly.
Another thing: Did you know you should be using headings? Instead of bolding text, use the headings option. Usually headings (coding terms: h1, h2, h3, etc) are styled differently than the normal body copy, so they will be bigger/bolder and will use a different font or style to contrast and draw attention. See example of how to use headings here.
This article utilizes hierarchy by using multiple headings, font styles, font sizes, images, and spacing.
Moral of the story: Be a good tour guide >> Use hierarchy when adding content
For more on hierarchy check out this article.
4. Keep it Simple
In the end it’s really about keeping things simple. Less is more. Simple designs are just easier to use, and they tend to be more aesthetically pleasing (win win). As you add content ask yourself what is essential, and then remove the rest. Avoid clutter at all costs. Keep your website pages clean.
Moral of the story: “Perfection is achieved not when there is nothing more to add, but when there is nothing more to take away.” –Antoine de Saint Exupery
Check this out for a more in depth presentation on simplicity.
Now that you have some tools, it’s time to improve your website design.
Ready… Set… Go