Slide
As a Senior Designer at designough, a huge chunk of my work is to design beautiful but functional websites for our clients.
Designing for web can sometimes seem daunting, but it really doesn’t have to be. There’s so much more to it than ‘looking good’ but that’s what makes it interesting. Rather than think of it as designing online pages, you have to think of it as building an experience for someone on the other end of a screen.
It’s got to be intuitive, hassle-free, and look good. And as long as every tick box is checked, presenting clients with their new website is a super rewarding part of my job as a designer.
So let’s jump straight into it. Here are the main things I consider when designing for web.
Why and Who
The first thing I consider is the purpose of the site – why does it exist? What is it trying to accomplish? There are so many reasons a business might need a website, and it’s important that I understand its main purpose so that I can design with that in mind.
I then align the purpose with the user, and consider Who the website is targeting, aka the target audience. It’s impossible to cater to everyone on the planet at once, so honing in on specific personas helps me design a website that caters directly to the type of people who are most likely to engage and convert into regular users.
Once these questions have been answered, I can start to build a bigger picture which will, in turn, influence how the design will take form and how the content will be shaped.
Content Management System
Depending on the purpose of the site, it’s a good idea to do some investigation as to what content management system (CMS) will work best for the job.
If a client’s site is based more around content and information, we build using WordPress (there are other options, but this is our favourite). However, if a client needs an e-commerce site, we’d be better off using Shopify.
Keeping the CMS in mind can help with making choices at the design stage, because each system has their pros and cons.
I always have a chat with one of our web developers before progressing onto the design too, and find it useful to keep in touch as I move through the project to ensure everything I have in mind can be implemented.
Device
Around half of global website traffic comes from mobile devices, so needless to say, I always consider desktop AND mobile when designing for web.
Designing both versions side by side is an essential part of the process – and not just because you want your website to look good on all devices. Google actually doesn’t like it when your site isn’t mobile friendly and will end up pushing you down in search results.
Competition
It kind of goes without saying, but taking a look at the competition and trying to map out the industry to see who’s doing what is a really useful step. Sometimes I come across design decisions that really don’t work and I know to avoid.
On the other hand, I’m able to identify successful elements that can be adapted for our client. I completely recommend knowing the competition, and using this knowledge to inform how you shape design in a new and fresh way that works.
Accessibility
Web has come a long way since it started. More and more we are seeing standards put in place that allows designers and developers to build an experience that ALL users can use and enjoy. Often people lose sight of this, but the user is a web designers top priority, so designing for accessibility is a big must.
We all know that if you can’t find what you’re looking for, it only takes a second to feel discouraged and click off whatever website you’re on.
Some things to consider here:
- Be consistent with elements. It builds a good rapport with users so that they become familiar with the layout of the website and have an easy experience as they journey through.
- This includes consistency with fonts, colour and design components from page to page.
- If you’re working to specific brand guidelines that you didn’t create, familiarise yourself with them. Check that the fonts are easily readable and that the colour palette is creating enough contrast
- Reduce clutter and trip out any superfluous features which don’t add anything to the overall experience.
Basically, it’s not just about ensuring you have an option to change the font size. Accessibility goes much further than that and you have to cover all bases. Issues with contrast and typography can cause major problems for users, ultimately ruining their experience and deterring them from visiting your site in future.
The way I look at it, this is a classic case of form follows function.
Be different
With that being said, don’t be afraid to do something different from what has already been done. As of 2020, there are almost 2 billion websites out there (although not all are active!) – if you can be functional, accessible and find a way to stand out – that’s the dream.
Consistency & Intuitiveness
I’ve said it already, but again – consistency is key. I always ensure that features such as buttons are consistent throughout, this includes colour and animations which helps users navigate the site.
This helps create an intuitive experience. For example, if something is loading on the site, we are able to tell the user that the website is working in the background by using an animated icon.
A tool I find useful in designing intuitive websites is Google’s Material Design. This has given me some great insight into improving the overall experience for the user. Originally, material design was created as a standard for mobile apps, but has since been used more broadly to influence website design.
“Unlike real paper, our digital material can expand and reform intelligently. Material has physical surfaces and edges. Seams and shadows provide meaning about what you can touch.”
Matías Duarte – Vice President, Google
User journey
However a client measures success online, whether it’s having a user land on a specific page, buy a product, or sign up to a mailing list, my job is to make sure that user knows how to get there.
I take great consideration when ordering information. Hierarchy plays a big part in how the user will interact with and flow down the page. Along this is designing in a way that shows clear actions and steps to take – the user should feel able to get places fast, but also explore at their own enjoyment.
Taking things back to basics should not be undervalued either; using white space, clean lines and well defined sections will aid in helping the user travel through the site.
Design for the long haul
A successful website will constantly be evolving. New content is added, blog posts are updated, brands refresh, new products are made available. These all play a part in firing up new discussions and encouraging a constant stream of new and returning users.
A website is never finished and forgotten, so I always remember to design for the long haul. A good website has longevity and can stand the test of time.
Inspiration
To finish, here’s a few places I tend to turn to for inspiration when designing for web:
dribbble.com
behance.com
awwwards.com
siteinspire.com
material.io/design
muz.li – This is a great add-on for chrome which gives you daily inspiration for general design and web design. You can also set it as your homepage, so as soon as you jump online you are already seeing some really cool stuff.
xd.adobe.com – Another great resource which gives you insights into the process, principles and perspectives of web design.
Last week, our Web Developer, Michael answered questions on Building a Website, asked by our social media followers. Click here to check it out.