The digital world is forever moving on. So it’s never a good idea to get left behind.

And this also includes your website design and its Homepage.

Search engine algorithms force modifications on how we create and use websites, and people’s tastes also change with fashions and social expectations. So if your website design is still languishing in the last decade (and even before that!), it may be necessary rather than desirable to update it.

What are the main features of modern web design?

Being responsive

It is so important for your website to have an updated homepage that is readable on a small screen. This is even if you don’t think your website users are likely to be viewing your website on their tablets or smartphones.

Your website needs to be responsive because of changes within the search engines. Failure to comply means the algorithms threaten to penalise the indexing of websites which don’t use a responsive theme, or one that has been adapted for responsiveness.

White backgrounds

Thank goodness the trend for dark coloured backgrounds and pale text seems to be waning. It is very difficult to read a reversed design – there is a reason why books have black text on white pages, it maximises readability and legibility.

Make sure your website and its Updated Homepage has a white background. Colours and shapes show up much better on a plain white background too.

More white space

An uncluttered website design with plenty of white space makes it much easier to direct the user’s eye to where you want them to go. This also includes line and paragraph spacing, and more spacial fonts that are clearer to read.

An updated homepage sporting a design that allows it to breathe will create it a much better user experience for the viewer.

Flatter designs

Apparently this trend was started by Apple. Gone are the days when it was necessary to place a shadow behind a graphic to make it appear to be more 3-D and therefore spring out of the page.

Buttons are much more likely to be clicked on if they contain a compelling call to action combined with an incentivised background colour. Your updated homepage design should definitely include call to actions, especially as navigation bars have less prominence now.

Changing sidebars

Because websites have to be responsive, some designs have abandoned sidebars on their main pages, because these and their contents are pushed to the bottom on a small screen.

You can still have sidebars next to your blog posts. These contain call to action features that are more fluid and transitional, and can even contain different content on each page.

Taking you on a journey

In modern websites, the length of a modern, updated homepage (or any webpage) isn’t confined within a strict space. It contains content that flows down almost indefinitely.

Therefore strategic placing of content needs to be placed above the fold for suitable capture, instruction and education. The viewer needs to be coerced or encouraged to scroll down to see what’s next. And the process should be exciting, compelling and intensely relevant in order to succeed.

The bigger the better

Important elements aren’t squirrelled away within web design, they are encouraged to come out with all guns firing. Product images, testimonials, call to action features, videos, even blog post visual links are made as prominent as possible so the user can’t fail to notice them.

Website design should be all about encouraging the viewer to do something you want them to do, and this is particularly apt for an updated homepage.

How to adapt a website design

Sometimes it’s all about reeducating the website’s owner as much as changing the design. I don’t like being pushy, as this will turn them off and they will end up running for the hills.

However, with a bit of cajoling and plenty of reasonable explanation, a compromise that is infinitely an improvement is a good result. I am very much aware of how difficult it is to change perceptions when you’ve been used to an old idea for so long.

I would like to introduce you to a website I have been working on recently. This is what it originally looked like:

What was wrong

First, it was not responsive, so everything was squashed onto the screen making it very tiny and totally unreadable. And when I looked at it on my phone I was directed to the About page, and not the homepage.

Further internal investigation revealed that the homepage had been coded separately within the theme, and was not created on a separate page. I have come across this feature on old-style themes before, and it infuriates me. No wonder this page was invisible on a mobile device.

It also means the owner cannot edit or update the homepage contents without going into the CSS. No way could the owner, who was reasonably familiar with WordPress, cope with this. This website drastically needed an updated homepage, and fast.

Also the design was incredibly outdated and the digital marketing elements were very poorly placed, meaning they had less of a chance of doing their job properly.

My main tasks

This website definitely needed a new theme. Any WordPress theme would do, as this would be much better than the customised one it had before. But I like to use a theme I can easily manipulate, with very little coding, so I can produce a design with an updated homepage that appeals to the website’s owner.

I knew I needed to keep to a similar design to the original, but with a more modern twist. This was not an occasion of introducing an infinite flowing design with thoroughly modern features, it would have blown her mind! It was important to retain a sense of familiarity but with increased modern functionality.

And the updated homepage needed to be independent from the theme, so it could be easily edited like the other pages. And also shown properly on a small screen again!

Also the marketing elements needed to be made more prominent. The video was obviously an additional after-thought, and the newsletter sign up form was way below the fold. The navigation needed to be made editable, and the boxy-feel with rounded edges surrounded by a black background definitely dragged it into the last century.

And the result?

To cut a long story short, I recreated a bright, airy, readable design with a suitably updated homepage, with a few little extra unseen twists that only someone who really understands how WordPress works can do.

What is different?

Gone is the grey background and the boxes feel part of the design rather than ‘stuck on’ as before. The boxes are images to make them neater (my next project is to code them in properly, which would make them editable by the owner). We’ve focused on the colour blue rather than bamboozling viewers with many colours.

Within the updated homepage, I made the banner and navigation flow nicely down to the main body. The navigation is a bit small, as is the contact details in the banner, but that is what the owner wanted. The navigation is also editable and now properly shows any new pages.

The video needed to be brought to the fore. A lot of work had gone into its creation, so hiding it away was not encouraging viewers to listen to it. People respond well to visual impact marketing and more can be said and understood through a video than words on the page.

I placed the newsletter sign-up higher up on the sidebar, so it was showing above the fold. Ideally this would benefit from offering an incentive, such as an e-book or report, but that is a project for another time.

Oh, and the updated homepage is now fully responsive and can be seen most satisfactorily on a small screen. Yay!

What do you think?

Let me know what you think about this website redesign and its updated homepage. Remember I needed to respect the wishes of the owner and not drift away too far from the original. Share your thoughts in the comments below.

And if you have a website that needs an overhaul or an updated homepage, why not check out my web design services? I look forward to hearing from you.

The post [Case Study] The benefits of modern web design and an updated homepage appeared first on Fairy Blog Mother.