It’s 2019 around here and if you are doing your business online, you probably have or want to create a website. It doesn’t matter if you are using a free website maker tool or having a web developer doing it for you, here are some tips that are going to make your page look more professional and attractive to your visitors.
By the way, I think it is not a good idea to use a website builder tool unless you are on budget and don’t have money to spend. It can be a good start, but once you grow your business, you definitely want to make sure that your web page is made by professionals. I will probably elaborate on that in another article
1. Good typography
It all starts with good typography. Having the right set of fonts is essential to making your content readable and presentable to your visitors. Good news is that often you don’t have to spend money to buy them because they are available at Google Fonts page.
Here are a few things you want to consider when picking one:
- If your logo has some written word on it, then you would likely want to use the same font on your page. This applies to most cases unless this font is some kind of handwriting font or any other kind that is unreadable. Just test it on your own — write a couple of sentences with this font and see if it’s easy to read. If not, then move on.
- When searching for a font, you want to make sure that your language subset is included. Luckily, Google Fonts allows excluding the ones that don’t have your language.
- Let Google help you. You can sort fonts by trending or popular. Another good piece of advice would be to use font combinations that Google shows you when you go to a font page. Here is a classic example — Lato for the headings + Open Sans for the text.
2. Professional images
Images probably play the biggest role in making the good first impression. Good ones can instantly attract users and make them curious.
The best pictures are obviously the ones that were taken by a professional photographer and then prepared by your graphics designer for your needs.
However, not anyone can afford that. In fact, most can’t.
Therefore, you need to find free alternatives online.
There are a lot of good pictures online that you can use. A good tip would be to pick a photo that immediately catches your sight.
This is really helpful when you want to repost your blog article to a social media like Facebook, Instagram, LinkedIn or Twitter because it will make your post stand out in a messy and endless news feed that those services have.
Here are some of the most popular stock image services:
1. Adobe Stock
Stock photos, royalty-free images, graphics, vectors & videos
Search Adobe Stock for millions of royalty-free stock images, photos, graphics, vectors, video footage, illustrations…
Zdjęcia stockowe, obrazy, grafika wektorowa, filmy
Przeglądaj miliony zdjęć stockowych, obrazów, filmów HD, grafiki wektorowej na licencji typu royalty-free i w śmiesznie…
Stock Photos, Pictures & Royalty Free Videos | Shutterstock
Search millions of royalty free stock photos, pictures, and videos. Get inspired by ten thousand new, high-resolution…
Beautiful Free Images & Pictures | Unsplash
Beautiful, free images and photos that you can download and use for any project. Better than any royalty free or stock…
Free stock photos · Pexels
Free stock photos you can use everywhere. ✓ Free for commercial use ✓ No attribution required
Stunning Free Images · Pixabay
Discover the best source for free images and videos. Free for commercial use ✓ No attribution required ✓
Icons are a very important part of web design because help people get a better visual comprehension of your content even without reading it. The important thing to remember about icons is that they have to fit your website looks. So, if you have square buttons and shapes, it’s likely that you won’t use curvy icons because they simply stand out in a bad way.
Another important thing to remember is that your icons have to have the same style. So, for instance, let’s say that you want to have a twitter, facebook and instagram icons. You want to make sure that they have the same style line, meaning they have the same colors, the thickness of lines, curvature, etc.
Here are two examples of well and poorly selected icons.
Here are 2 resources that we often use. Make sure to read the license carefully, since some icons might have a license that requires you to buy or credit the author. But on both of these websites, you can find amazing icons that will improve your web page look a lot.
- The Noun Project
2,500,000+ free and premium vector icons. SVG, PNG, AI, CSH and PNG format.
Iconfinder is the leading search engine and market place for vector icons in SVG, PNG, CSH and AI format.
Almost every website you open has animations these days. The problem is that, not all animations are good. You see, this happens often with new features — whenever they become available, everyone wants to hop on this trends train and use them without even mastering first. And the common opinion is that the more the better.
Well, as someone who is very sensitive to user experience, I can assure you that this is not the case. In fact, many websites would be much better off if they didn’t use any of animations.
That being said, animations are definitely a powerful tool to impress your visitors and make them stay longer on your page.
Key points that you should keep in mind when using animations:
- They should be optimized, which means that it’s really bad if there are too many or really “heavy” animations since they can slow down the computer of your visitor. And if this happens, they’re a lot more likely to leave your website altogether. IMMEDIATELY!
So be very mindful here.
- They should improve user experience, not otherwise. If you are using animations to present your content, then it should be easily readable and visible. Animations can help you point user’s attention towards it, but can’t distract user from actually reading it. Here you can see an example of an animation that is aimed towards focusing user’s attention on the text content.
3. They should engage with your users. Good animations to make users want to play with them and stay on your website longer. Some good examples of this are buttons:
These small details play huge role in how your visitors feel and make them want to come back to your website or even tell others about it.
No one likes to wait, especially nowadays when everything is about speed and instant feedback. The same thing applies to your users. If your website has many images and files that are being used, the first meaningful view might not appear until 10–15 seconds and sometimes even longer. And I am not even talking about devices that use 3G or 4G internet connections.
A beautiful preloader will keep your users engaged while they are waiting for your content to load.
Here is an example of a good preloader made with a logo that might inspire you.
And you can find many of them on the internet, but please don’t use the very basic ones cause they’ve been around forever and no one likes them anymore.
Thanks everyone for reading. I hope you found this article helpful.
If you like it, please share it with your friends on social media so they can also benefit from it.
Also, if you like my work please follow me and my company on Instagram, Twitter and Facebook.
More articles coming soon.