Last Updated on March 3, 2023
You probably did not even try to revamp your website because of time, money, resources, limitations, procrastination or whatever. And now you decided ‘it’s time!’, but complete redesign is not an option because it may be costly and time-consuming. Don’t worry, you still have lots of chances to save the situation.
Before we dive in, decide what your website is doing well and don’t spoil it. As for ‘wrong’ things, this is what we are going to cover. A lot of design elements of your website look really dated, right? The photos are low quality and small. Too narrow pages are filled up with tones of text in various colors, so it takes forever to read it scrolling down the page. And the fonts are so much sophisticated (the only point was creativity?), so the site visitors sometimes get lost. This is not what people want to see even if your products and services solve real customers’ needs.
Where will you begin a dramatic and successful website transformation?
Start with top-level points you should try to achieve while updating the website:
- Pleasing the eye. Of course! So many good services or authors cannot convert casual visitors into constant ones simply because the website is a boring or absolute mess.
- High usability. Everything in its place, the content elements are presented in strict hierarchy, so the site visitors don’t have to think forever where to click. Content elements are connected and the site visitors automatically feel guided and happy.
- Personalization and cool concept. Try to create any standout so the site visitors are more likely to say ‘wow’, smile happily or even feel provocation. It shows you are competitive, unique, and memorable.
Do not worry about SEO as it can be notably destroyed only if you fully redesign your site. In fact, smart website updates can even make your rankings stronger.
Adjust the width of your site
What is the best option? Google already has the answer for you, which is more human than robotic: get a design for a satisfying user experience across multiple devices. It’ll actually ensure a happy UX (user experience) and high search rankings at the same time. If your website has a fixed width (the width of the pages doesn’t change no matter what screen size the visitors use), it may be not only impractical, but also unattractive.
Responsive design usually eliminates the problems with the site width on mobiles and tablets, but probably this is your desktop version that leaves much to be desired. If it’s a one-column layout, try to ‘widen’ your website. Today, full width of the website is very popular. It can be applied to contrast some design elements (wide and narrow), place more information, present the images in their best quality, etc.
Standard two or three-column blogs/layouts are usually wide enough and require some (usually white or light) space from the left and right. The most important point here, set more strict borders between content elements and leave a lot of white space.
This is an example of the already existing website:
And this is Emmet, one the latest professional free business designs on the WordPress.org repository:
Which layout would you choose to duplicate on your website?
Size content objects correctly and create visual contrasts
A crucial point in the website-visitor visual communication. Differences in scale among content object must be balanced. Bigger content element suggest that it is closer to us than another or that one is more dominant than the other. You can enlarge one in the aligned row if you want to somehow highlight it (remember a pricing table, where any ‘best option’, ‘time-limited offer’ or any other label is usually accompanied with enlarging its particular table-block). Otherwise, the best practice is to keep strict alignment of the content elements. Don’t give very massive blocks of information, especially if this content is not divided into paragraphs paginated text.
A good example of the blocks with different size:
And not that good…
Color scheme psychology
Be a good color therapist, remember that matching and ‘calm’ colors positively connect to people’s feelings and also increase the whole website usability. Effective color scheme usually combines 2 or 3 main complementary colors. As for contrasts, it’s always better to choose light color for the background and dark for the text to provide the readers with the high readability. Variations in color among content elements might suggest that one element holds more unique personality and is setted apart from the other object.
Don’t look for a clear-cut answer which color scheme will make your website really successful. Instead, strive to become unique keeping in mind the main rule that there are complementary and non-complementary colors. The sidebar, header and footer that are very often used for advertising should still be clutter-free. Various banners with matching color scheme and size still make look very harmonic. Remember that too much vivid popping banners may be very distracting for the site visitors. Maybe it’s time to choose a better color scheme?
Pale-green, grey and white colors look extra elegant:
I know that website owners are great at art, but not at web design yet..:
Font doesn’t simply matter, in many cases it’s considered as the main design concept
The wrong (too sophisticated, nonmatching, unreadable) font can spoil a good design and the right one can do a very big part of the job. There is also one trendy strategy of pairing fonts on the site, but you should be very careful combining several ones. You may try use popular Fontpair.co service, which helps to pair Google fonts together, or search for any other trusted font pair selector.
There are a lot of free fonts that literally helped some big brands to get remembered: Avenir font used by Toyota, Impact T font used by IMDb, Garamond font used by Apple, or more sophisticated but still very creative ones like National font used by Last FM, Cheap Motel font used by Mapquest, Black Rose font used by Vimeo, etc.
So many rounded things..:
…versus simple, clean and readable:
Fresh photos
No matter big or small. Maintain a good quality (hi-res images will always be trendy) of the pictures. The best option here is to get some real images, which represent your business, brand, idea, or team. Free (or premium) stock images are still fine, but if you really want to show your authentic self, do it with your own photos of a team, own business case or your real projects. At least, make sure your blog is not chock full of stock images only. Blog is something that represents the history of your true reality.
Customize your social icons
Get creative social media icons that would fit the design of your site and locate theme in footer and header to make immediately noticeable. The icons will fuse with the main color scheme and will add more personalization to your site.
I found a lot of free social icons on Vecteeze website:
There are still plenty of different ones.
For example, Noupe’s icons are designed to reflect the colors of the logo and main website colors:
Create calls-to-action
Practice proven marketing techniques and at the same time refresh your website by adding a couple of simple calls-to-action. It will definitely help you show that your business is in tune with customers’ needs. Use some funny or intriguing texts to make the site visitors even more curious. Add some interactive feature if the site niche allows it: FAQ, review section, or just a simple poll.
Educate your visitors and communicate with them, they should be in the spotlight. It will definitely help you generate more interest of your visitors and remain up-to-date. Share current success stories or update your offerings and case studies. People always seek for crowd experience and wisdom and the real stories are always something they want to see and believe.
Not just ‘subscribe’:
Setting up custom 404 page
Another splendid point. I look at it from the dual perspective: this is a real plus to your successful SEO ranking and of course for the site visitors, who still stay on your website and probably continue surfing around and looking for the needed information.
One more good chance to make the visitors smile with a creative 404 page. Try to make it as much relative to the website brand as possible. For example, a world famous toys provider Lego made their 404 page maximum personalized and recognizable. Don’t you agree?
Choose a visual (drag-and-drop solution) content editor to update the site
It’ll help you eliminate all the possible technical problems and build balanced layouts with rich functionality with minimum efforts. Such editors can provide you with a great foundation for adding or updating your content. Non-tech users across the web highly rate SP Page Builder for Joomla (this editor can help you add and publish different sorts of content easily using Joomla CMS), MotoPress Content Editor for WordPress (visual drag-and-drop frontend builder with a lot of layout variants and useful functionality), MageWord Layout Editor for Magento (user-friendly toolkit of settings for configuring any kind of content). You may google for any more appropriate one to suit your needs.
Don’t let your website to load forever
It’s rather a SEO matter, but still very important for an overall design as well. People should get a chance to see your cool fresh design. There are a lot of ways to increase the website’s load speed, but the main ones you can follow are: enable browser caching, optimize images and videos, enable compression (namely, zip large pages), reduce the number of plugins, etc. It’s not actually a zero-prep activity, so you may want to spend more time and resources for improving the loading speed.
Hopefully, at least one solution deserved your genuine attention and, of course, action.
Good design is not everything, of course, but it makes life easier. It gives you more independence and can naturally represent who you are and what you do. Make it more holistic right away!
