- Independent Schools
What makes an award-winning school website? The common thread between Finalsite’s 2018 award winners is a giveaway! Award-winning websites deliver a school’s marketing and communication goals using excellent design features and user experience.
There are many emerging creative trends that are shaping the landscape of school website design but before we dig into some of those I’d like to share this quote by Neville Brody.
“Digital design is like painting, except the paint never dries”. Brody, a prominent British graphic designer and typographer, cleverly illustrates the constantly evolving nature of digital design. Web design is changing so quickly, that trends and new developments provide further opportunities and structure to expand the creative process.
What is a web design trend?
Before exploring some of the UK’s 2018 award-winning websites, it’s worth understanding what a trend actually is. Trends are emerging creative approaches or techniques that help designers structure and present key messages online. They can be either visual communications or those concerned with the user experience (UX). Trends are compelling, as all web designers strive to be at the forefront of design, so they can stand out from their competitors. Being aware of and utilising trends can help companies achieve outstanding results for their clients – but trends are not fads.
Fads are easily confused with trends; however, there is one key difference. Fads are new ideas which tend to be short-lived. Trends tend to stick around. Why? Because a trend delivers added value to users over time, and they change the online landscape for the better. Delivering design excellence requires a thorough understanding of design trends, and the ability to shape them to convey our clients’ messages, so they can maximise the opportunity to engage their audiences. There is so much opportunity to be creative, as new developments in web design are emerging faster than ever before.
What drives new design trends?
There are a number of factors which are driving trends forward; firstly, advances in technology. Technology development is accelerating; it is constantly evolving with new tools being released which allows designers to explore new features and push beyond their limits, leading to newer technologies; which in turn creates new features, and so the cycle of development continues. There are so many features which were not considered possible five years ago, due to technical constraints or being too slow to load, which are now becoming mainstream.
Changes in user behaviour and the collective taste of clients is another driver in design trends. Due to technological developments, the expectations of visitors are being influenced by their experiences on other websites and in other media, such as TV, film, music, gaming or art. These all have an impact, and over time these shape the audience experience and expectations of the web – what excites and impresses them as well as what feels natural and intuitive. This is why it is so vital that marketers think about their audiences and their needs when reviewing trends, and decide upon which to adopt, as they don’t all suit every school.
Ease of use is one of the most dominant factors in driving web trends. Across the online landscape, and particularly on school websites, trends that become embedded are those that enhance the user experience. Schools have broad audiences, and they don’t all have the same level of digital literacy. Many schools also have users from across the globe, with different languages, expectations and experiences. That is why an intuitive user journey is just as important as creating the ‘wow’ factor to engage stakeholders. It is vital to consider how audiences will use the site, and make sure that it delivers a first class experience.
Trend 1 - Varied Layouts
So let’s get into identifying some of the new advances in web design. Distinctive layouts are a key new trend, and one school which has adopted this successfully is Dauntsey’s School, a co-educational boarding and day school in Wiltshire. Dauntsey’s website won gold in the 2018 dotComm awards.
Many responsive designs used to feel quite similar; when this feature first became available, it meant many web companies followed the same key standards in ensuring that designs viewed correctly on a range of devices. This lack of differentiation within website design resulted in sites that lacked personality, leading to lower levels of audience engagement.
Thankfully, advances in coding and creative expectation have now led to a wider range of options within responsive sites. Many features that were solely the preserve of the film and print industries are now available on the web. This has resulted in websites that capture the brand experience more accurately.
Open and asymmetric layouts provide a creative placement of key features and white space which points visitors towards key areas of the page and help to establish a clear visual hierarchy. Bespoke fonts, graphics and photography are on the rise, supported by illustrations that are more personal to the school, and therefore feel more authentic to the end user. These help to develop a school’s story (Link to the Open Day blog about storytelling?) which drives both engagement and helps the institution define its personality, which supports it in becoming more memorable, and to stand out from its rivals.
The semi-flat design adopted at Dauntsey’s adds a subtle addition of depth and texture which further helps to add personality to the site, without losing the benefits of a well-optimised page with clear UX. There is also an increased use of micro-interactions, these are features which focus on smaller visual details, interactions and animations that build upon the school’s personality, and help make every part of the experience feel interactive and immersive.
Trend 2 – Mobile First
As touched upon earlier, responsive design is no longer a trend; it’s a standard requirement. Websites must be fully responsive, particularly as Google search rankings have been influenced by mobile friendliness since 2015. In November 2016, mobile usage surpassed desktop for the first time. Royal Hospital School, a co-educational boarding and day school in Suffolk, is a school website which demonstrates effective mobile focus. The school won an Award of Excellence in the 2018 Communicator Awards.
Our stats across hundreds of client schools show that mobile usage accounts for an average of 40% of traffic, with many more approaching 50%; additionally, mobile users tend to stay on responsive sites for longer. So if this is now a standard requirement, is it no longer a trend? It certainly is, and it continues to inspire and involve Finalisite’s approach to web design. The design of mobile and desktop is considered together, to ensure a unified experience is created, tailored to the needs of each device. Whilst each device may work differently, the user experience should always be consistent. The same user journeys should be created, which evoke the same emotions; regardless of how users choose to access the site.
Best practices from mobile websites are making their way onto the desktop. When designing for mobile, additional considerations need to be made, such as catering for limited space, slower performance and more complex interactions because of the touch interface. This has led to the design of sites with more streamlined messaging, less text, optimised images and bolder calls to action. All of these features support an engaging and intuitive UX on the desktop too, so Finalsite has adopted these principles across all resolutions.
It’s called “mobile first”, but ultimately, it’s a fundamental principle of design. This mobile-focused approach is summed up perfectly by the writer Antoine de Saint-Exupery: “Perfection is attained, not when there is nothing left to add, but when there is nothing left to take away.”
Trend 3 – Moving Beyond the Hero Slideshow
Next up in our 5 Award Winning Designs is GEMS World Academy, Switzerland. An international day school and part of the renowned GEMS education group, it won an Award of Distinction in the 2018 Communicator Awards. The trend this school embraces so effectively is moving beyond the hero slideshow.
First things first: it’s vital to make a strong first impression to visitors on your website. Typically, the home page is the visitors’ first entry point, so schools need to make an immediate, engaging response with their audience. The website needs to capture the essence and personality of the school, which is why many establishments use pupil-centric slideshows at the top of their home pages, an area known as the hero – the centrepiece of the website.
There is nothing wrong in that – slideshows are a fantastic visual way to convey the schools’ key messages, but as many schools are now using them, they are beginning to stand out less in the market. Often, most visitors only spend a matter of seconds watching the slideshow before they move on, so having six or seven images means many are unlikely to be viewed. With this in mind, many websites are trying different approaches. Over recent years, video montages have been used, and these do pack an emotional punch; but once again, visitors are unlikely to look at them for long.
More websites are now making use of their entire homepage to capture who they are, whilst also including other touch points within the visitor's overall journey to maintain the emotional engagement throughout the experience. GEMS World Academy has adopted this effectively within its mission and value page and also when explaining their value proposition on ‘Why Choose GEMS?’ to their visitors.
Trend 4 – Creative Storytelling
The use of storytelling techniques are being used more and more by schools to express what their value proposition is, make their messages stand out and increase customer engagement. Chadwick, an independent day school in Los Angeles, fully embraces this trend. It was awarded Gold in the 2018 Marcom Awards. Effective storytelling is vital for schools, as for its prospects, choosing a school is a highly emotional decision. Schools, therefore, need to provide reassurance and engagement to their visitors, to ensure that they are selecting the right for school for them or their child. Storytelling is also important to the current school community, both parents and pupils alike have a sense of pride in their school, which they want to feel when they visit, and which they wish to share with the wider world.
Building storytelling techniques into the design stage ensures that the website makes the end user feel something more than just seeing a collection of images and information. It makes the site more personal, relatable and relevant to the visitor, ensuring that they feel engaged enough to want to find out more about the school. It also helps to break down the complex offerings schools provide into clear, memorable messages. This is particularly important for schools that have a variety of offerings to a diverse range of audiences.
Storytelling is being used in many ways throughout the website journey, not just in big set pieces, but with greater use of authentic, candid content. Rather than just explain the key messages, schools can demonstrate them through honest, candid case studies and testimonials. This increased focus on small details is what brings texture to school life online, and makes a lasting impression on visitors.
Trend 5 – Purposeful Motion
The final award winner we’re exploring is Tonbridge School, based in Kent; it is a boarding and day school, and its website won a Platinum award in last year’s Marcom Awards. A key trend -- motion -- demonstrated so perfectly in Tonbridge’s website, is what provides life to modern web design.
Motion brings an additional layer of depth and meaning to the visitor experience that helps express Tonbridge School’s personality, whilst also improving the user experience by guiding visitors through key features. It’s also a useful tool to improve conversions by drawing more attention to call to actions and can be used to entice the visitor to keep scrolling while immersing them within the movement of the site.
Creative uses of motion include video footage, which can be used beyond the hero image on the home page. Video is processed over 60,000 times faster by the brain than text, so it is a dynamic and emotionally engaging way of delivering your messages.
Scroll and hover-based animations can be used to subtly improve usability without distracting visitors, whilst animations that react to your interaction help increase immersion.
The best use of motion is when it is truly purposeful, with effects that complement a school’s message, personality and support the user journey. Be wary though of too much of a good thing – sites heavy on animation can confuse visitors, creating a negative user experience. Motion should be used wisely; only when it is in line with site objectives, and to support key messages and user experience.
So should your school follow trends?
If schools want to stand out from their competitors, is following trends the right thing to do? Well, it depends on whether they work or not.
Trends work when:
They bring a fresh and exciting feel to your design (look beyond school websites to see what other industries are doing)
Visitors like to experience what is new, and what they have seen on other websites and media
They are familiar and improve ease of use
They help your school achieve a specific goal (online application process, online checkouts)
Trends to avoid:
Those that date quite quickly – these are just fads
Those that are not right for your school brand, story or audience
Jumping from trend to trend can make a brand feel inconsistent
It is always better to give precedence to UX than a trendy new gimmick
The bottom line is that award-winning websites embrace trends that support their brand, goals, messages and target audiences; they do not slave to them. Taking creative risks is a great way to stand out, but the design should always be led by understanding what the school wishes to achieve from its website. It’s important to stay fresh and up to date, but organisations should always be led by what is most effective and relevant to their audiences.
Remember, as the great Oscar Wilde said: “Be yourself; everyone else is already taken.”
About the Author
As UK Production Manager at Finalsite, Kealan oversees the designers and developers in our UK office to deliver innovative and engaging websites to clients across the globe. He has a strong passion for audience-driven web design and has been working closely with schools since 2009 to understand their needs and lead the creative direction of their projects
- Web Design