According to Yiota from Ola Digital
Here at YO&O we’re not just about making the design look hella awesome, we’re also about making sure that it communicates. This goes hand in hand with the way your website is built and how it functions, we mean hell, it could be 1 rad looking site but if it doesn’t work the way the user expects it to BYYYYE.
So, we called up (we didn’t call, who calls these days, we emailed) the legendary Yiota from Ola Digital and got her to talk shop about website functionality. Take it away Yiota!
OK, so picture this:
You’ve just been served the same ad promoting those shoes you were looking at during work last Tuesday on Facebook, Google, Instagram and somehow also in your fridge. You succumb to the ad because #treatyourself and click the ‘buy now’ link on your mobile device. The link takes you to a landing page so poorly laid out, with text falling off the screen, an image so tiny you have to pinch and zoom to double check you’re buying the right thing and to top it all off, the drop-down menu to select your size is unresponsive. BLEH! See ya shoes, see ya never. What a hassle.
Now that my friends is the essence of why the functionality of a website is just as important as design.
Sure, you may have a stunning website on a large desktop screen and a great marketing strategy surrounding paid ads, but if you don’t nail the functionality of your final landing pages on ALL sizes of screens just before that sale or final touch point is met – you are setting yourself up for failure.
When it comes to website design, there are so many factors to consider to make the user experience the very best it can be.
Colours, fonts, readability, image choice, layout, navigation, copy, prompts – the list goes on. For today, I’ve decided to focus on responsiveness and optimisation. Essentially: does your website work seamlessly across all sizes of screens? If you’ve read this far and have a slightly elevated heart rate thinking about your own website, never fear! It’s time for me to let you in on a few industry secrets to get that website looking spick and span. Please note that the below steps will work for most website platforms (such as WordPress, Shopify and Squarespace) however, I can’t guarantee will be the answer if you’re using an obscure and janky DIY builder that you found for free in a back alley of the internet somewhere.
So, you’ve just designed your own website or received a first look back from your web designer.
Awesome, you are officially in the testing phase. While you are testing all the buttons, forms, links and image quality – make sure to pick up your mobile too. View the website on your mobile device in portrait, then turn your phone to landscape. Can you still click those buttons? Does any text fall of the screen? Does any strange whitespace pop up? Now grab the closest notebook and note down any discrepancies on the website when your phone is portrait or landscape and save those bad boys for later.
Now we’ve checked for your mobile screen size, but how about other types of devices?
I’m willing to bet your next question is ‘how do I check an iPad or tablet size screen if I don’t own one myself?’ Simple! Head to your desktop or laptop and hit up a trusted web browser. My favourite is Google Chrome, but that is a story for another day. Open your browser and fire up that website of yours. Now! Here come’s the good part (eyeballs at the ready). On the top right-hand corner of your browser (usually) there is the little ‘Restore Down’ button next to the ‘Close’ button. Clicking on the ‘Restore Down’ button will make your browser window smaller and from here, you can click and drag the sides of the window to mimic ANY size of screen. Yes ladies and gentlemen, you have just unlocked a new web designer secret and can now advance to level 2 of the arbitrary Ola Digital ranking system.
What’s the next step? Yep you guessed it – test test test away!
Write down where there may be issues on different screen sizes and either send that list to your web designer or, make the changes via your website platform yourself. At the end of the day, the most important thing about your website is that it achieves your business goals. Product sales, information, service details, acting as a lead magnet – whatever it is THAT must come first. Yes fonts are pretty, fancy animations are fun and full screen imagery is appealing but without keeping functionality in the forefront of your mind during the design process, your website will be nothing more than a pretty space on the internet for people to look at, get frustrated at and leave.
A great way of testing out if people are getting frustrated and leaving your website is a) ask friends to test the website too and to give you their honest opinions and b) make sure to have Google Analytics installed and check out your bounce rate.
What’s a bounce rate and why should I care about it? Excellent question dear reader.
According to our friend Google, a bounce rate is ‘the percentage of visitors to a particular website who navigate away from the site after viewing only one page’. In Yiota-language, this means you have lost the attention of your website user and they didn’t stick around long enough to convert a single thing. Boo!
The Google Analytics console is a WEALTH of knowledge for any website owner, and one of the best places to figure out where your website functionality may be letting you down. However, I am going to be one of those annoying guest blog post writers and leave it at that for now. If you’d like more Google Analytics chats, I am sure if you ask Tara nicely enough I may just be back for more.
Happy web designing friends!