Striving for timeless yet trendy: Nonprofit web design best practices for 2018
Simply reading up on “web design trends for 2018” won’t cut it; your nonprofit is unique in what it does and what time and budget you have to work with. You need to prioritize timeless design so you’re not starting over again in a year. But you also need to stand out, catching the attention of donors and volunteers, showing your nonprofit itself is a standout.
To help you strike this balance, we sifted through several studies and articles written for a general audience and applied it to specific nonprofit needs.
Below are the top nonprofit web design best practices for 2018 and beyond. Find three to nix and three to be sure to implement as well as additional resources for achieving each.
Web Design Trends to NIX
1. Ultra-Flat Design
Many designers still cling to 2D flat design – it’s the icons are fairly simple to design and quickly achieve a clean look. But ultra-flat design does not do much to help users understand your site. In fact, according to Nielson Normal Group’s study in 2017, “users took 22% longer to navigate through an ultra-flat design” (Econsultancy).
Designers have brought the drop shadow and gradient back to help users navigate a site.
If your designer has relied heavily on flat icons (no shadows or variations in color to show dimension), ask that they implement more variety to help guide the user and motivate actions.
2. Dull or Traditional Color Choices
Why prioritize color? “People make a subconscious judgment about a person, environment, or product within 90 seconds of initial viewing and between 62% and 90% of that assessment is based on color alone” (Wired Impact).
Though color is so vital, many nonprofits don’t push it much when it comes to web design. To establish a consistent brand, they believe they must stick to the two colors they chose previously. However, “Bright color, bold accents and hues that are anything but neutral are the norm for today’s website designs” (Weebly).
You can maintain your strong brand and still include vibrant colors in your imagery, accent colors and other subtle elements like buttons and text. Your brand can remain timeless and your website can still pop.
3. A Slow Mobile Experience
You may have turned a blind eye to Accelerated Mobile Pages, thinking it was just another buzzword, but now it’s time to pay attention. According to Digital Marketing Institute, AMP is an open-source coding standard that allows your site to load more quickly on mobile – it consolidates the code, hosts media files off your site and runs scripts in tandem.
A fast load time for mobile is one of the most important considerations of your website. Find a developer that has the chops to build your mobile site with this in mind and make sure to factor this into your budget. Find more resources on AMP at www.ampproject.org.
Web Design Trends to Implement Stat
1. Mobile-First Design
“In 2016, 43.6 percent of all website traffic worldwide was generated through mobile phones, up from 35.1 percent in the previous year.” – Statista (source)
Again, mobile!! We’ve been saying this for years, but now the design of your mobile site is more vital than ever. As pointed out by Digital Marketing Institute, “in the first half of 2018, Google will be rolling out its new Mobile First Index, placing more importance on the mobile version of your website by making it the first to be seen in the search results.”
This means that if you want your nonprofit to appear in a search for “where can I donate to help fight the water crisis?” or whatever it is you’re working for each day, you need a mobile site pronto.
This doesn’t just mean to have a mobile version of your site, second to your desktop version. It means hiring a designer that designs specifically for the mobile experience and knows the ins and outs of what makes that unique. Here are some key features to consider when designing for mobile. Also fun: Mobile navigation menus and what options they afford you.
2. Sticky Navigation
It’s not a new trend, but it’s one that should “stick.” A sticky nav is a tactic that allows you to keep your page simple as it doesn’t need to be as filled with calls to action. You can keep your “donate” and “learn more” CTAs along the top and keep your pages nice and clean as your user scrolls down.
Instead of worrying what’s “above the fold,” consider what you want your user to be able to access, even as they move down or around your site.
3. Sophisticated Typography
To a non-designer, typography seems easy and not super important. However, designers know this is where the real power lies.
Typography establishes hierarchy, or rather, what your donor or volunteer should look at first. It also establishes dynamism, especially through contrasting pairs. Finally, sophisticated type choices will show your audience your nonprofit is on top of their game, as they will instantly recognize (whether they know it or not) your fonts as with the times, or dated. “Each style of typography, despite what the words are actually saying, have the ability to transport your mind to specific associations, even subconsciously” (Theedesign).
A quote from TheeDesign summarizess this power, “[w]hile website layouts will be clean and simple, you can expect to see web designers unleash their creativity on typography.” Typography can take your nonprofit site from one that blends with other nonprofits to one that is classy, bold and exciting – leading your viewers to see your nonprofit is, too.
Before choosing a web designer, look over their case studies and assess their type choices specifically. Do they look dated to you? Do they look so trendy that they will soon be dated? You want to be right in the middle – trendy but timeless.
If you aren’t approaching a redesign, considering swapping out your fonts. This could be done in less than a day if you find the right agency.
Now, don’t go design a website around the hottest trends of 2018. It won’t last you and you’ll be wanting a new site in a year again. As a nonprofit, stick to the trends that are a little more timeless and will help you in the long run – good user experience (especially on mobile), easy navigation and sophisticated typography. Then if you have the time, add in a few pops of color and bolder fonts that are easier to update that will help you stand out amongst the crowd.