When a website ages it can quite quickly look offputting and not up-to-date with the latest design trends, even to the untrained eye. Modernizing a website is a practice that all web designers go through for a lot of businesses just getting around to updating their online presents.
Some websites are just too outdated to modernize. But for some, all they need are some touch-ups to make it look modern again.
Some of the ways to modernize a website can be on a case-by-case basis for each different kind of website design, but there are also some design rules and trends that are here to stay that can be applied to any website.
Here’s a list of 20 different ways you can modernize a website to make it look more current:
- Make website full width instead of a static size
- Make it fully responsive
- Update your logo
- Update your content
- Replace old stock photos with real images
- Make content more SEO and search friendly
- Make your footer actually useful
- Add more blog content
- Add call to actions that lead to a phone number or contact form
- Add stat tracking
- No more gradients, bevels, stipes, and old design trends
- Add an Instagram feed
- Update the typography
- Use solid colors, not textures
- Remove useless search bars
- Add a favicon
- Space elements out more
- Add videos and interactive media
- Get a new WordPress theme, or get WordPress
- Just rebuild the website
Make your website full width instead of a static size
This one is very important because it’s one of the fastest ways you can if a website looks out of date or not. When your website is static, the entire contents of the website are inside a box that’s centred in the middle of the screen. When your website is full width it spans the entire width of the screen no matter how wide.
Due to the influence of smartphones, tablets, and laptops, the idea of responsive web design has killed the old static website size in favour of the adaptive full-width size. Now the full-width size gives a better sense of completeness and scalability that the static size doesn’t anymore.
When doing the full-width size you make the background color of your sections full-width and the content remaining in the wrapper. The wrapper is commonly set to a size of around 1000 pixels to 1200 pixels to contain the content in the box to make it more readable.
Make it fully responsive
Depending on how outdated your website design is, this could be the most important change to modernize your website.
52% of visitors visiting your website are on a mobile device. Because that’s over half your traffic, it’s important your website looks good on smaller screen sizes.
To make an old website responsive would require a lot of work. Most likely there would be some HTML and CSS coding work needing to be re-done.
Update your logo
This one can be troublesome to do, but it will have a big impact on modernizing not only your website but your entire brand.
A logo should be updated every 5 years or so, otherwise, the business will seem out of touch with the best modern design practises. Not updating your logo periodically hurts your brand’s reputation and makes your entire business seem outdated.
Not sure how to modernize your logo? Read about 5 ways to spruce up a logo.
Update your content
You should always be keeping your website up-to-date and aligned with your current business’s team members, services, voice, brand, visions, and values.
Having more content related to your services also gives your customers or visitors more trust in your brand and authority in whatever topic you’re talking about.
If you are thinking about updating your content, the About page is the best place to start.
Replace old stock photos with real images
Real photos of you and your employees are 100x more interesting and valuable to the user than some random photoshopped blond in a suit. It humanizes your brand.
Stock photos still have their place, but a website with real self-taken photos will always be more authentic and trustworthy than a stock-photo’d website.
Because smartphones have such great camera quality nowadays, entry to photography is at an all-time low. Anyone can point and click some simple pictures that can do a lot more for your website.
Make content more SEO and search friendly
After you’ve updated your content and photos, its a good idea to go back to make your content more SEO friendly.
SEO, or Search Engine Optimization, is the practice of making changes to your website so that it ranks higher in Google and other less popular search engines.
With higher rankings in the Google results, the more traffic your website gets. And with that traffic, comes more business.
SEO is a huge topic, and there are many changes you can make to your website that will positively affect it. You can start by going through an article about 34 ways to improve SEO rankings.
Make your footer actually useful
With outdated websites, it’s common to see footers that are either non-existent or serve little help to the user.
Footers, like headers, are a standard in web design and are common enough that they are expected on all webpages.
Footers can be so much more than copyright information. With a 4 column layout, a good footer can include:
Footer Column 1: A logo and a quick blurb about what the business/website is about
Footer Column 2: Links to pages that aren’t fit to be in the main navigation
Footer Column 3: Services or other important pages
Footer Column 4: Contact Information
Add more blog content
Yes, visitors notice when your last blog post was from 3 years ago. An inactive or dead blog looks worse than no blog at all. It can make users think your business or website is no longer in service anymore, or that web presents isn’t a priority at all.
Most blogs on business websites are updates about the company. “We got in the local Newspaper”, “Jane, our secretary is pregnant” are both blog-post-worthy topics found on a typical business website blog that only takes 5 minutes to type up and publish.
With well-targeted topics, a blog can also serve as a generator of website visitors that otherwise wouldn’t have stumbled upon your website. Like this post, How to modernize a website, is a topic being searched that’s worth writing about as it will bring viewers to my website.
Add call-to-actions that lead to a phone number or contact form
You already have one call-to-action at the bottom of the page? That’s cute. Add more.
No matter what your definition of “conversion” is for your particular website, promoting and enforcing that conversion should be done on all if not most of the primary pages on your website.
The most common form of CTAs are buttons and banners that link to the desired conversion. Even adding something as simple as a button in a certain place, with a certain color, in a certain size, can have an impact on your conversions for the better.
Add some CTAs and watch the analytics to see if they’re being clicked. You can also take it further by doing A/B testing, but one step at a time.
Add stat tracking
With all those changes you’re making with your website, it would be a good idea to add some stat tracking. This of course should be done about a month or two before you make all your changes so you can compare the difference in conversions and website visitors.
Tracking your stats can be both really fun and beneficial to you as a website owner. Seeing an increase in conversions after you made a change tells you what works and doesn’t. Repeating this process over and over again optimizes your conversions sometimes 2-4 times.
If you have a WordPress website, there are plugins you can download to start tracking states directly within your website.
If you really want to step your stat tracking game up you can set up Google Analytics on your website. Getting it would mean you would have to sign up for a Google account (which you already probably have) and to add a code snippet to your website.
No more gradients, bevels, stipes, and old design trends
Some design trends come in, and some go. Gradients (in some instances they are okay, but not on elements), bevels, stripes, skeuomorphism are all design trends of the past. Now, a website designed with those trends looks outdated and offputting to most users.
Heres some more honorable mentions:
- Image buttons
- Sounds/Audio
- Autoplay video
- Multiple bright solid colors
- Twitter and Facebook feeds
Check out the web design Museum for examples of what not to do.
Add an Instagram feed
Twitter and Facebook feeds are out, but Instagram feeds can actually add value to your website. A lot of businesses use their Instagram page to really connect with their customers.
FedEx is an excellent example of a company that uses their Instagram feed to really connect with their audience. They started doing “FedEx In The Wild” where their fans would be the storytellers and take and submit pictures of FedEx branding seen in everyday life.
We didn’t want to be just another big brand on Instagram trying to be cool. We wanted our new Instagram strategy to be intentional, fun, authentic and true to the platform.
If you had an instgram feed like theirs, adding that feed on your website would take it that much further.
Update the typography
Updating to a font like Open Sans, Roboto, Lato can make your website’s audience feel modern once again.
Font size is important too. Websites are now using bigger, and more impactful typography. Not only in websites too, but also in magazines.
Typography has a much more different approach than getting the text on the screen. Typography is seen as art now, and where if used correctly can convey a brand or even emotion.
Use solid colors, not textures
Textures can be used beautifully in web design, but I’m referring to body background textures. A modernized website uses solid colors, solid white 99% of the time. Background textures are often distracting when a simple solid color puts more visual weight and attention on the content itself – which is the most important part of a website.
Try to avoid background textures unless used sparingly or only in certain areas. Stick to true white (#FFFFFF) as the background color to make it easier for visitors to consume your content.
Why do you think this page has a white background?
Remove useless search bars
This is totally a WordPress thing. All the time search bars are placed in sidebars, footers, and headers almost for fun in a lot of WordPress sites. The search bars often get very little use or attention, while unnecessarily taking up space.
Remove them. No one will even notice their gone, and you’ll be one step closer to a better website.
Add a favicon
This is the little icon that goes in the tab when you’re viewing a page in your web browser. A lot of old websites don’t have one set, which is really easy to do – in WordPress particularly.
The favicon will also be seen in the Google Search Results, in the favourites of your browser, as the icon when you save a link to a webpage, and in the quick websites launcher that Google Chromes dashboard shows you on startup.
When modernizing your favicon, try to pull something recognizable from your logo like a symbol or icon – something that signifies your brand.
Space elements out more
Let your content breathe! Proximity is one of the four design principles after all. Older web design often seems scared of whitespace and so a lot of the elements seem too desperate to fill in empty spaces inside the websites wrapper.
Studies were done that showed that the effective use of white space can increase readability by 20%. And all this can be done by simply adding some margin and padding around elements.
Learn how to use white space effectively to structure and unclutter your website content. It will make your users happy, and on the page consuming your content.
Add videos and interactive media
People love videos. It’s a much better way of consuming content for a lot of people, especially for visual learners like me.
The great thing about the video is that it can be used in many different ways than you think. Sure, you could embed a youtube video right on your website and your users will appreciate it – but there many different ways to incorporate video into your website like video backgrounds, storytelling, and to show off products.
A video can bring your content to life as apposed to something text-based. Try to look for areas where instead of explaining something to the user, show them with a video!
Get a new WordPress theme, or get WordPress
If everything in this list seems too difficult to do, you could just use a new WordPress theme. Of course, this would require WordPress, but the odds your website is WordPress are 59.4% so the odds are in my favour.
If you got a new theme, half this checklist would be done for you already like:
- Spacing out elements
- Making your website full width
- Making your footer useful
- Updating typography
- Old web design trends would most likely be gone
If you already have a WordPress website and theme already set up, changing the theme would mean you are essentially re-making your entire website which isn’t ideal for most. You might have to learn how to use a new website builder for building out your pages, but a lot of the work outside your theme would be done already to save time.
Just rebuild the website
Depending on how old your website is, rebuilding your website is hands-down the best way to modernize it. I would personally recommend rebuilding it every 5 years or so to keep with web design standards and expectations.
Being The Website Architect, I’m passionate about building great websites and this is something I would love to help you with. If you are interested, you can contact me to discuss your project!
