Website trends
of 2023
Everything you need to know to have
an amazing website in 2023.
Websites change often with some trends sticking around for a while (think Hero images) and others being a bit more fly by night. Each year brings its own website trends. Here’s how the website trends are looking for 2023.
You’re going to read lots of other reports about these design elements:
They’re great trends in themselves but unless you’re in a creative industry which needs to show you have your finger on the pulse of cutting edge design then it’s not going to be relevant to you.
Here are the website trends and must haves in 2023
Accessibility
Remember 2017 when every website had to have a GDPR statement? 2023 is all about Accessibility. Think:
These are all vital components to help the disabled community access websites. Whilst we can’t cater for every single tool these communities will use to access a website, we can ensure the main frame, design and build is completely accessible so potential websites users aren’t alienated.
You can make sure your website meets accessibility requirements without spending additional money or buying software, with these simple processes:
Text Size
Your body text should be a minimum of 17px and where possible use a flexible measurement like em so the text automatically adjusts according to the screen size/any tools working with it.
High Contrast
Subtleties in colour can be a beautiful aspect of website design, however if it means users can’t easily read it, then you’ve alienated rather than drawn in your audience. Bold designs with a high colour contrast not only look great, they’re fully inclusive for all audiences.
Alt Text
This is the text that describes an image. It’s used as a fall back if the image doesn’t display. It’s also used by screen readers when a website is being read out to the consumer. Alongside being an accessibility requirement it is a big part of SEO so if you fill in your alt text when you upload your images you’ll be boosting your website up the Google rankings at the same time.
Focus Indicators
These pop a box or a highlight around text which has links or popovers connected to them. It shows people where to click/where there’s additional information without them having to hunt for it.
Text to speech
There can be a whole lot of reasons someone may choose to have a website read to them rather than read it themselves. There are a host of Text to Speech plugins you can use for your website. Some have free versions, others are paid-for plugins. You can find out more through this article.
Not sure where to start?
A simple, free thing to start with is a voice search plugin. Simply install the free plugin to your website, activate it and your search bar will have a microphone on it which you can use for voice searching.
If you have the budget to use additional plugins which help with accessibility that’s great, however do your research before buying as not all of them are compliant with accessibility regulations.
Want to know more about accessibility?
Visit the We Are Purple website.
Scrollytelling
Every website tells a story. It’s told through the images and text. In 2023 it’s also told through the scroll of the website. Whether that’s using animation to appear as the user scrolls, or swiping side to side, bouncing around, scrollytelling is big for 2023. So when you’re planning your website build or refresh, as well as planning the text and imagery of the website, plan how it will appear to users, too.
Interactivity
The more interactive your website is, the more you’re engaging your potential customers and the more likely they are to buy from you, rather than your competitors.
There are many ways you can give your visitors the opportunity to interact with your website. Quizzes are a great way to pique their interest, have them interact with you and capture their email address in the process. You can also look at using scorecards, popups, notifications, Live Chat. Anything that encourages your visitors to interact with your website.
Instant Availability
When people have a question they want the answer straight away. Off they go to Google who brings up search results to match the questions. If customers then land on your website and want to ask you a question, being able to answer in real time is a great way to win customer loyalty and make sales.
The easiest way to do this is to have a Live Chat plugin or one that allows people to WhatsApp you. If you have an active Facebook page you can add some code to your website which puts the Messenger plugin onto your website, where you can receive and answer messages through the Messenger app.
Micro Interactions
These are fun ways people can interact with your website – think of a button shaking when you hover over it or an icon changing colour. A popover which brings up more information when you hover over text. Quick ways to engage your visitors and encourage them to explore more of the website.
Thumb Friendly Navigation
Mobiles are fast becoming the main source of viewing for websites. Website design is always created for desktops first, particularly if it’s for a service led industry but desktop design must always have mobile users in mind.
There are a lot of ways to make websites friendly for mobile view:
To name a few. What’s particularly useful is to make sure your website is ‘thumb friendly’ meaning that your navigation and Calls to Action aren’t at points which are hard to reach. If in doubt, make sure they’re centred on mobile view.
Text only hero images
There are some fantastic reasons to go for a text only hero header. First, let’s break down the words:
Hero = full screen
Header = top of the page.
Alongside the logo and navigation you’d usually see an image or video alongside some sort of tagline or statement about the company here.
A trend that’s starting to catch on is using big, bold text on a contrasting colour background in this space.
I’ve made the top image of this post a text only hero image so you can see it for yourself.
Pros
You know exactly what the company is/does.
Speedy loading for desktop and mobile – no images slowing it down.
A striking visual without having to organise a photoshoot or use stock images.
Cons
Can feel a bit ‘off brand’
Can be viewed as basic – not so good for high value industries.
Can be tricky to get the text responsive on all mobile devices.
It’s super easy to do and works well for search engines because the text is ‘above the fold’ which means it’s within the first screen that loads on a mobile meaning you get the double whammy of a good SEO score because the text says exactly what you do, it’s using the right hierarchy of H1 tags and it’s not loading additional resources.
Negative Space
The best way to highlight an image or section is to put a space around it. The more space, the more focus on the section you’re highlighting (within reason!) This space is known as negative space. Negative because the space isn’t being filled with anything. To test this method add margins between elements and padding to existing elements.
Negative space can also work in reverse….. want to have an image cross 2 different columns – align the image to one side and set a negative margin (meaning you put a – in front of the margin number) and watch the image appear across both sections.
Pro tip: As we’re designing websites to be responsive on all devices set the negative space in percentages rather than pixels to ensure it looks as you want it to on different screen sizes.
Dark Mode
Dark mode adds a layer to websites which can feel intriguing and sleek. This can be fabulous for high trend websites but not so good for websites where you’re hoping to appeal to more regular customers. Whilst dark mode can feel sleek it can also feel intimidating for some. For high ticket agencies it may be a good way to go but for the more regular Joe, I’d stick to light themed websites.
Integration with CRM
People are busier than ever and a good CRM will help connect a website with the other processes used to run a business. This can be an entire database of information or Mail Software. Let your website do the heavy lifting for you and use a CRM connected to your website for your processes.
Conclusion
Website trends are just that: trends. Whether you decide to embrace a lot of what’s on this list or keep with the website design that feels the most aligned to you, the choice is yours. If you’d like to embrace some of the themes above, a good starting point is to look at accessibility. Some of the changes to make your website accessible will be simple to implement and will make a huge difference to those who need extra support when using websites.
If you’d like to discuss how we can work together on your website build or existing project, book a free, no-obligation call with me using the button below and I’ll look forward to meeting you on Zoom.
Leave A Comment